Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2026-07-26 09:54:51 +10:00
Code Issues Packages Projects Releases Wiki Activity

fix: keep previous table data during pagination to avoid skeleton flash

Browse Source
This commit is contained in:
ephraimduncan
2026-07-07 09:07:43 +00:00
parent 50f272be87
commit 5eab99e8d4
11 changed files with 103 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/remix/app/components/tables/admin-claims-table.tsx
+10 -5
View File
@@ -38,11 +38,16 @@ export const AdminClaimsTable = ({ licenseFlags }: AdminClaimsTableProps) => {
const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? [])); const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
const { data, isLoading, isLoadingError } = trpc.admin.claims.find.useQuery({ const { data, isLoading, isLoadingError } = trpc.admin.claims.find.useQuery(
query: parsedSearchParams.query, {
page: parsedSearchParams.page, query: parsedSearchParams.query,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
}); perPage: parsedSearchParams.perPage,
},
{
placeholderData: (previousData) => previousData,
},
);
const onPaginationChange = (page: number, perPage: number) => { const onPaginationChange = (page: number, perPage: number) => {
updateSearchParams({ updateSearchParams({
apps/remix/app/components/tables/admin-document-jobs-table.tsx
+10 -5
View File
@@ -19,11 +19,16 @@ export const AdminDocumentJobsTable = ({ envelopeId }: { envelopeId: string }) =
const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? [])); const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
const { data, isLoading, isLoadingError, refetch, isFetching } = trpc.admin.document.findJobs.useQuery({ const { data, isLoading, isLoadingError, refetch, isFetching } = trpc.admin.document.findJobs.useQuery(
envelopeId: envelopeId, {
page: parsedSearchParams.page, envelopeId: envelopeId,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
}); perPage: parsedSearchParams.perPage,
},
{
placeholderData: (previousData) => previousData,
},
);
const onPaginationChange = (page: number, perPage: number) => { const onPaginationChange = (page: number, perPage: number) => {
updateSearchParams({ updateSearchParams({
apps/remix/app/components/tables/admin-email-transports-table.tsx
+10 -5
View File
@@ -30,11 +30,16 @@ export const AdminEmailTransportsTable = () => {
const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? [])); const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
const { data, isLoading, isLoadingError } = trpc.admin.emailTransport.find.useQuery({ const { data, isLoading, isLoadingError } = trpc.admin.emailTransport.find.useQuery(
query: parsedSearchParams.query, {
page: parsedSearchParams.page, query: parsedSearchParams.query,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
}); perPage: parsedSearchParams.perPage,
},
{
placeholderData: (previousData) => previousData,
},
);
const onPaginationChange = (page: number, perPage: number) => { const onPaginationChange = (page: number, perPage: number) => {
updateSearchParams({ updateSearchParams({
apps/remix/app/components/tables/admin-organisation-stats-table.tsx
+14 -9
View File
@@ -77,15 +77,20 @@ export const AdminOrganisationStatsTable = ({ displayMode = 'usage' }: AdminOrga
const orderByColumn = parseOrderByColumn(searchParams?.get('orderByColumn') ?? undefined); const orderByColumn = parseOrderByColumn(searchParams?.get('orderByColumn') ?? undefined);
const orderByDirection = parseOrderByDirection(searchParams?.get('orderByDirection') ?? undefined); const orderByDirection = parseOrderByDirection(searchParams?.get('orderByDirection') ?? undefined);
const { data, isLoading, isLoadingError } = trpc.admin.organisation.stats.find.useQuery({ const { data, isLoading, isLoadingError } = trpc.admin.organisation.stats.find.useQuery(
query: parsedSearchParams.query, {
page: parsedSearchParams.page, query: parsedSearchParams.query,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
period, perPage: parsedSearchParams.perPage,
claimId, period,
orderByColumn, claimId,
orderByDirection, orderByColumn,
}); orderByDirection,
},
{
placeholderData: (previousData) => previousData,
},
);
const onPaginationChange = (page: number, perPage: number) => { const onPaginationChange = (page: number, perPage: number) => {
updateSearchParams({ updateSearchParams({
apps/remix/app/components/tables/admin-organisations-table.tsx
+12 -7
View File
@@ -55,13 +55,18 @@ export const AdminOrganisationsTable = ({
const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? [])); const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
const { data, isLoading, isLoadingError } = trpc.admin.organisation.find.useQuery({ const { data, isLoading, isLoadingError } = trpc.admin.organisation.find.useQuery(
query: parsedSearchParams.query, {
page: parsedSearchParams.page, query: parsedSearchParams.query,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
ownerUserId, perPage: parsedSearchParams.perPage,
memberUserId, ownerUserId,
}); memberUserId,
},
{
placeholderData: (previousData) => previousData,
},
);
const onPaginationChange = (page: number, perPage: number) => { const onPaginationChange = (page: number, perPage: number) => {
updateSearchParams({ updateSearchParams({
apps/remix/app/components/tables/admin-user-teams-table.tsx
+11 -6
View File
@@ -28,12 +28,17 @@ export const AdminUserTeamsTable = ({ userId }: AdminUserTeamsTableProps) => {
const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? [])); const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
const { data, isLoading, isLoadingError } = trpc.admin.user.findTeams.useQuery({ const { data, isLoading, isLoadingError } = trpc.admin.user.findTeams.useQuery(
userId, {
query: parsedSearchParams.query, userId,
page: parsedSearchParams.page, query: parsedSearchParams.query,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
}); perPage: parsedSearchParams.perPage,
},
{
placeholderData: (previousData) => previousData,
},
);
const onPaginationChange = (page: number, perPage: number) => { const onPaginationChange = (page: number, perPage: number) => {
updateSearchParams({ updateSearchParams({
apps/remix/app/components/tables/inbox-table.tsx
+9 -4
View File
@@ -46,10 +46,15 @@ export const InboxTable = () => {
const page = searchParams?.get?.('page') ? Number(searchParams.get('page')) : undefined; const page = searchParams?.get?.('page') ? Number(searchParams.get('page')) : undefined;
const perPage = searchParams?.get?.('perPage') ? Number(searchParams.get('perPage')) : undefined; const perPage = searchParams?.get?.('perPage') ? Number(searchParams.get('perPage')) : undefined;
const { data, isLoading, isLoadingError } = trpc.document.inbox.find.useQuery({ const { data, isLoading, isLoadingError } = trpc.document.inbox.find.useQuery(
page: page || 1, {
perPage: perPage || 10, page: page || 1,
}); perPage: perPage || 10,
},
{
placeholderData: (previousData) => previousData,
},
);
const columns = useMemo(() => { const columns = useMemo(() => {
return [ return [
apps/remix/app/components/tables/organisation-teams-table.tsx
+11 -6
View File
@@ -28,12 +28,17 @@ export const OrganisationTeamsTable = () => {
const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? [])); const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
const { data, isLoading, isLoadingError } = trpc.team.find.useQuery({ const { data, isLoading, isLoadingError } = trpc.team.find.useQuery(
organisationId: organisation.id, {
query: parsedSearchParams.query, organisationId: organisation.id,
page: parsedSearchParams.page, query: parsedSearchParams.query,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
}); perPage: parsedSearchParams.perPage,
},
{
placeholderData: (previousData) => previousData,
},
);
const onPaginationChange = (page: number, perPage: number) => { const onPaginationChange = (page: number, perPage: number) => {
updateSearchParams({ updateSearchParams({
apps/remix/app/routes/_authenticated+/t.$teamUrl+/documents._index.tsx
+1
View File
@@ -91,6 +91,7 @@ export default function DocumentsPage() {
folderId, folderId,
}, },
{ {
placeholderData: (previousData) => previousData,
...SKIP_QUERY_BATCH_META, ...SKIP_QUERY_BATCH_META,
}, },
); );
apps/remix/app/routes/_authenticated+/t.$teamUrl+/settings.webhooks.$id._index.tsx
+13 -8
View File
@@ -72,14 +72,19 @@ export default function WebhookPage({ params }: Route.ComponentProps) {
data, data,
isLoading: isLogsLoading, isLoading: isLogsLoading,
isLoadingError: isLogsLoadingError, isLoadingError: isLogsLoadingError,
} = trpc.webhook.calls.find.useQuery({ } = trpc.webhook.calls.find.useQuery(
webhookId: params.id, {
page: parsedSearchParams.page, webhookId: params.id,
perPage: parsedSearchParams.perPage, page: parsedSearchParams.page,
status: parsedSearchParams.status, perPage: parsedSearchParams.perPage,
events: parsedSearchParams.events, status: parsedSearchParams.status,
query: parsedSearchParams.query, events: parsedSearchParams.events,
}); query: parsedSearchParams.query,
},
{
placeholderData: (previousData) => previousData,
},
);
/** /**
* Handle debouncing the search query. * Handle debouncing the search query.
apps/remix/app/routes/_authenticated+/t.$teamUrl+/templates._index.tsx
+2
View File
@@ -66,6 +66,7 @@ export default function TemplatesPage() {
}, },
{ {
enabled: !isOrgView, enabled: !isOrgView,
placeholderData: (previousData) => previousData,
}, },
); );
@@ -76,6 +77,7 @@ export default function TemplatesPage() {
}, },
{ {
enabled: isOrgView, enabled: isOrgView,
placeholderData: (previousData) => previousData,
}, },
); );