fix: person loading skeleton

This commit is contained in:
Dhruwang
2024-09-19 22:00:29 +05:30
parent 6b64367d99
commit f5e349a91f
2 changed files with 27 additions and 25 deletions

View File

@@ -44,34 +44,37 @@ export const PersonDataView = ({ environment, personCount, itemsPerPage }: Perso
};
fetchData();
}, [pageNumber]);
}, [pageNumber, personCount, itemsPerPage, environment.id]);
// Fetch additional person attributes and update table data
useEffect(() => {
const fetchAttributes = async () => {
const updatedPersonTableData = await Promise.all(
persons.map(async (person) => {
const attributes = await getPersonAttributesAction({
environmentId: environment.id,
personId: person.id,
});
return {
createdAt: person.createdAt,
personId: person.id,
userId: person.userId,
email: attributes?.data?.email ?? "",
attributes: attributes?.data ?? {},
};
})
);
setPersonTableData(updatedPersonTableData);
setIsDataLoaded(true);
try {
const updatedPersonTableData = await Promise.all(
persons.map(async (person) => {
const attributes = await getPersonAttributesAction({
environmentId: environment.id,
personId: person.id,
});
return {
createdAt: person.createdAt,
personId: person.id,
userId: person.userId,
email: attributes?.data?.email ?? "",
attributes: attributes?.data ?? {},
};
})
);
setPersonTableData(updatedPersonTableData);
} catch (error) {
console.error("Error fetching person attributes:", error);
} finally {
setIsDataLoaded(true);
}
};
if (persons.length > 0) {
fetchAttributes();
}
}, [persons]);
fetchAttributes();
}, [persons, environment.id]);
const fetchNextPage = async () => {
if (hasMore && !loadingNextPage) {
@@ -91,7 +94,7 @@ export const PersonDataView = ({ environment, personCount, itemsPerPage }: Perso
};
const deletePersons = (personIds: string[]) => {
setPersons(persons.filter((p) => !personIds.includes(p.id)));
setPersons((prevPersons) => prevPersons.filter((p) => !personIds.includes(p.id)));
};
return (

View File

@@ -1,7 +1,6 @@
import { PersonDataView } from "@/app/(app)/environments/[environmentId]/(people)/people/components/PersonDataView";
import { PersonSecondaryNavigation } from "@/app/(app)/environments/[environmentId]/(people)/people/components/PersonSecondaryNavigation";
import { CircleHelpIcon } from "lucide-react";
import { ITEMS_PER_PAGE } from "@formbricks/lib/constants";
import { getEnvironment } from "@formbricks/lib/environment/service";
import { getPersonCount } from "@formbricks/lib/person/service";
import { Button } from "@formbricks/ui/Button";
@@ -32,7 +31,7 @@ const Page = async ({ params }: { params: { environmentId: string } }) => {
<PageHeader pageTitle="People" cta={HowToAddPeopleButton}>
<PersonSecondaryNavigation activeId="people" environmentId={params.environmentId} />
</PageHeader>
<PersonDataView environment={environment} personCount={personCount} itemsPerPage={ITEMS_PER_PAGE} />
<PersonDataView environment={environment} personCount={personCount} itemsPerPage={25} />
</PageContentWrapper>
);
};