Skip to content

Commit 37458c1

Browse files
steven-teysteven-tey
committed
improve efficiency by reducing concurrent API calls
1 parent 9ff89f8 commit 37458c1

10 files changed

Lines changed: 74 additions & 43 deletions

File tree

‎apps/web/app/api/embed/referrals/earnings/route.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { withReferralsEmbedToken } from "@/lib/embed/referrals/auth";
2-
import { SALES_PAGE_SIZE } from "@/lib/partners/constants";
2+
import { REFERRALS_EMBED_EARNINGS_LIMIT } from "@/lib/partners/constants";
33
import z from "@/lib/zod";
44
import { PartnerEarningsSchema } from "@/lib/zod/schemas/partner-profile";
55
import { prisma } from "@dub/prisma";
@@ -45,8 +45,8 @@ export const GET = withReferralsEmbedToken(
4545
},
4646
},
4747
},
48-
take: SALES_PAGE_SIZE,
49-
skip: (page - 1) * SALES_PAGE_SIZE,
48+
take: REFERRALS_EMBED_EARNINGS_LIMIT,
49+
skip: (page - 1) * REFERRALS_EMBED_EARNINGS_LIMIT,
5050
orderBy: {
5151
createdAt: "desc",
5252
},

‎apps/web/app/app.dub.co/(dashboard)/[slug]/customers/[customerId]/page-client.tsx‎

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
"use client";
22

3+
import { CUSTOMER_PAGE_EVENTS_LIMIT } from "@/lib/partners/constants";
34
import useCustomer from "@/lib/swr/use-customer";
45
import useWorkspace from "@/lib/swr/use-workspace";
56
import {
@@ -165,7 +166,7 @@ const SalesTable = memo(({ customerId }: { customerId: string }) => {
165166
const { id: workspaceId, slug } = useWorkspace();
166167

167168
const { data: salesData, isLoading: isSalesLoading } = useSWR<SaleEvent[]>(
168-
`/api/events?event=sales&interval=all&limit=8&customerId=${customerId}&workspaceId=${workspaceId}`,
169+
`/api/events?event=sales&interval=all&limit=${CUSTOMER_PAGE_EVENTS_LIMIT}&customerId=${customerId}&workspaceId=${workspaceId}`,
169170
fetcher,
170171
{
171172
keepPreviousData: true,
@@ -175,7 +176,9 @@ const SalesTable = memo(({ customerId }: { customerId: string }) => {
175176
const { data: totalSales, isLoading: isTotalSalesLoading } = useSWR<{
176177
sales: number;
177178
}>(
178-
`/api/analytics?event=sales&interval=all&groupBy=count&customerId=${customerId}&workspaceId=${workspaceId}`,
179+
// Only fetch total sales count if the sales data is equal to the limit
180+
salesData?.length === CUSTOMER_PAGE_EVENTS_LIMIT &&
181+
`/api/analytics?event=sales&interval=all&groupBy=count&customerId=${customerId}&workspaceId=${workspaceId}`,
179182
fetcher,
180183
{
181184
keepPreviousData: true,
@@ -185,9 +188,11 @@ const SalesTable = memo(({ customerId }: { customerId: string }) => {
185188
return (
186189
<CustomerSalesTable
187190
sales={salesData}
188-
totalSales={totalSales?.sales}
191+
totalSales={
192+
isTotalSalesLoading ? undefined : totalSales?.sales ?? salesData?.length
193+
}
189194
viewAllHref={`/${slug}/events?event=sales&interval=all&customerId=${customerId}`}
190-
isLoading={isSalesLoading || isTotalSalesLoading}
195+
isLoading={isSalesLoading}
191196
/>
192197
);
193198
});
@@ -199,22 +204,28 @@ const PartnerEarningsTable = memo(
199204
const { data: commissions, isLoading: isComissionsLoading } = useSWR<
200205
CommissionResponse[]
201206
>(
202-
`/api/programs/${programId}/commissions?customerId=${customerId}&workspaceId=${workspaceId}&pageSize=8`,
207+
`/api/programs/${programId}/commissions?customerId=${customerId}&workspaceId=${workspaceId}&pageSize=${CUSTOMER_PAGE_EVENTS_LIMIT}`,
203208
fetcher,
204209
);
205210

206211
const { data: totalCommissions, isLoading: isTotalCommissionsLoading } =
207212
useSWR<{ all: { count: number } }>(
208-
`/api/programs/${programId}/commissions/count?customerId=${customerId}&workspaceId=${workspaceId}`,
213+
// Only fetch total earnings count if the earnings data is equal to the limit
214+
commissions?.length === CUSTOMER_PAGE_EVENTS_LIMIT &&
215+
`/api/programs/${programId}/commissions/count?customerId=${customerId}&workspaceId=${workspaceId}`,
209216
fetcher,
210217
);
211218

212219
return (
213220
<CustomerPartnerEarningsTable
214221
commissions={commissions}
215-
totalCommissions={totalCommissions?.all?.count}
222+
totalCommissions={
223+
isTotalCommissionsLoading
224+
? undefined
225+
: totalCommissions?.all?.count ?? commissions?.length
226+
}
216227
viewAllHref={`/${slug}/programs/${programId}/commissions?customerId=${customerId}`}
217-
isLoading={isComissionsLoading || isTotalCommissionsLoading}
228+
isLoading={isComissionsLoading}
218229
/>
219230
);
220231
},

‎apps/web/app/app.dub.co/embed/referrals/earnings.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { SALES_PAGE_SIZE } from "@/lib/partners/constants";
1+
import { REFERRALS_EMBED_EARNINGS_LIMIT } from "@/lib/partners/constants";
22
import { PartnerEarningsResponse } from "@/lib/types";
33
import { CommissionStatusBadges } from "@/ui/partners/commission-status-badges";
44
import { Gift, StatusBadge, Table, usePagination, useTable } from "@dub/ui";
@@ -13,7 +13,9 @@ import { motion } from "framer-motion";
1313
import useSWR from "swr";
1414

1515
export function ReferralsEmbedEarnings({ salesCount }: { salesCount: number }) {
16-
const { pagination, setPagination } = usePagination(SALES_PAGE_SIZE);
16+
const { pagination, setPagination } = usePagination(
17+
REFERRALS_EMBED_EARNINGS_LIMIT,
18+
);
1719
const { data: earnings, isLoading } = useSWR<PartnerEarningsResponse[]>(
1820
`/api/embed/referrals/earnings?page=${pagination.pageIndex}`,
1921
fetcher,

‎apps/web/app/partners.dub.co/(dashboard)/programs/[programSlug]/(enrolled)/customers/[customerId]/page-client.tsx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
"use client";
22

3+
import { CUSTOMER_PAGE_EVENTS_LIMIT } from "@/lib/partners/constants";
34
import useProgramEnrollment from "@/lib/swr/use-program-enrollment";
45
import {
56
CustomerActivityResponse,
@@ -126,7 +127,7 @@ const EarningsTable = memo(({ customerId }: { customerId: string }) => {
126127
const { data: earningsData, isLoading: isEarningsLoading } = useSWR<
127128
PartnerEarningsResponse[]
128129
>(
129-
`/api/partner-profile/programs/${programSlug}/earnings?interval=all&pageSize=8&customerId=${customerId}`,
130+
`/api/partner-profile/programs/${programSlug}/earnings?interval=all&pageSize=${CUSTOMER_PAGE_EVENTS_LIMIT}&customerId=${customerId}`,
130131
fetcher,
131132
{
132133
keepPreviousData: true,
@@ -136,7 +137,9 @@ const EarningsTable = memo(({ customerId }: { customerId: string }) => {
136137
const { data: totalEarnings, isLoading: isTotalEarningsLoading } = useSWR<{
137138
count: number;
138139
}>(
139-
`/api/partner-profile/programs/${programSlug}/earnings/count?interval=all&customerId=${customerId}`,
140+
// Only fetch total earnings count if the earnings data is equal to the limit
141+
earningsData?.length === CUSTOMER_PAGE_EVENTS_LIMIT &&
142+
`/api/partner-profile/programs/${programSlug}/earnings/count?interval=all&customerId=${customerId}`,
140143
fetcher,
141144
{
142145
keepPreviousData: true,
@@ -146,9 +149,13 @@ const EarningsTable = memo(({ customerId }: { customerId: string }) => {
146149
return (
147150
<CustomerSalesTable
148151
sales={earningsData}
149-
totalSales={totalEarnings?.count}
152+
totalSales={
153+
isTotalEarningsLoading
154+
? undefined
155+
: totalEarnings?.count ?? earningsData?.length
156+
}
150157
viewAllHref={`/programs/${programSlug}/earnings?interval=all&customerId=${customerId}`}
151-
isLoading={isEarningsLoading || isTotalEarningsLoading}
158+
isLoading={isEarningsLoading}
152159
/>
153160
);
154161
});

‎apps/web/app/partners.dub.co/(dashboard)/settings/payouts/payout-details-sheet.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { SHEET_MAX_ITEMS } from "@/lib/partners/constants";
1+
import { PAYOUTS_SHEET_ITEMS_LIMIT } from "@/lib/partners/constants";
22
import usePartnerProfile from "@/lib/swr/use-partner-profile";
33
import { PartnerEarningsResponse, PartnerPayoutResponse } from "@/lib/types";
44
import { CommissionTypeIcon } from "@/ui/partners/comission-type-icon";
@@ -43,7 +43,7 @@ function PayoutDetailsSheetContent({ payout }: PayoutDetailsSheetProps) {
4343
error,
4444
} = useSWR<PartnerEarningsResponse[]>(
4545
partner
46-
? `/api/partner-profile/programs/${payout.program.id}/earnings?payoutId=${payout.id}&interval=all&pageSize=${SHEET_MAX_ITEMS}`
46+
? `/api/partner-profile/programs/${payout.program.id}/earnings?payoutId=${payout.id}&interval=all&pageSize=${PAYOUTS_SHEET_ITEMS_LIMIT}`
4747
: undefined,
4848
fetcher,
4949
);

‎apps/web/lib/partners/constants.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
export const SHEET_MAX_ITEMS = 10;
2-
export const SALES_PAGE_SIZE = 8;
1+
export const PAYOUTS_SHEET_ITEMS_LIMIT = 10;
2+
export const REFERRALS_EMBED_EARNINGS_LIMIT = 8;
3+
export const CUSTOMER_PAGE_EVENTS_LIMIT = 8;
34

45
export const PAYOUT_FEES = {
56
business: {

‎apps/web/ui/customers/customer-partner-earnings-table.tsx‎

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -117,15 +117,20 @@ export function CustomerPartnerEarningsTable({
117117
))}
118118
</tbody>
119119
</table>
120-
{commissions?.length && totalCommissions && viewAllHref && (
121-
<div className="mt-2 px-2 text-sm text-neutral-600">
122-
{commissions.length} of{" "}
123-
<Link
124-
href={viewAllHref}
125-
className="font-medium text-neutral-700 hover:text-neutral-900"
126-
>
127-
{totalCommissions} results
128-
</Link>
120+
{viewAllHref && (
121+
<div className="mt-2 flex items-center gap-1 px-2 text-sm text-neutral-600">
122+
{commissions.length} of
123+
{totalCommissions ? (
124+
<Link
125+
href={viewAllHref}
126+
className="font-medium text-neutral-700 hover:text-neutral-900"
127+
>
128+
{totalCommissions}
129+
</Link>
130+
) : (
131+
<div className="size-3 animate-pulse rounded-md bg-neutral-100" />
132+
)}
133+
results
129134
</div>
130135
)}
131136
</>

‎apps/web/ui/customers/customer-sales-table.tsx‎

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -136,15 +136,20 @@ export function CustomerSalesTable({
136136
))}
137137
</tbody>
138138
</table>
139-
{sales?.length && totalSales && viewAllHref && (
140-
<div className="mt-2 px-2 text-sm text-neutral-600">
141-
{sales.length} of{" "}
142-
<Link
143-
href={viewAllHref}
144-
className="font-medium text-neutral-700 hover:text-neutral-900"
145-
>
146-
{totalSales} results
147-
</Link>
139+
{viewAllHref && (
140+
<div className="mt-2 flex items-center gap-1 px-2 text-sm text-neutral-600">
141+
{sales.length} of
142+
{totalSales ? (
143+
<Link
144+
href={viewAllHref}
145+
className="font-medium text-neutral-700 hover:text-neutral-900"
146+
>
147+
{totalSales}
148+
</Link>
149+
) : (
150+
<div className="size-3 animate-pulse rounded-md bg-neutral-100" />
151+
)}
152+
results
148153
</div>
149154
)}
150155
</>

‎apps/web/ui/partners/partner-details-sheet.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { SHEET_MAX_ITEMS } from "@/lib/partners/constants";
1+
import { PAYOUTS_SHEET_ITEMS_LIMIT } from "@/lib/partners/constants";
22
import usePayouts from "@/lib/swr/use-payouts";
33
import useProgram from "@/lib/swr/use-program";
44
import useWorkspace from "@/lib/swr/use-workspace";
@@ -221,7 +221,7 @@ function PartnerPayouts({ partner }: { partner: EnrolledPartnerProps }) {
221221
error: payoutsError,
222222
loading,
223223
} = usePayouts({
224-
query: { partnerId: partner.id, pageSize: SHEET_MAX_ITEMS },
224+
query: { partnerId: partner.id, pageSize: PAYOUTS_SHEET_ITEMS_LIMIT },
225225
});
226226

227227
const table = useTable({

‎apps/web/ui/partners/payout-details-sheet.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { SHEET_MAX_ITEMS } from "@/lib/partners/constants";
1+
import { PAYOUTS_SHEET_ITEMS_LIMIT } from "@/lib/partners/constants";
22
import useWorkspace from "@/lib/swr/use-workspace";
33
import { CommissionResponse, PayoutResponse } from "@/lib/types";
44
import { X } from "@/ui/shared/icons";
@@ -49,7 +49,7 @@ function PayoutDetailsSheetContent({
4949
isLoading,
5050
error,
5151
} = useSWR<CommissionResponse[]>(
52-
`/api/programs/${programId}/commissions?workspaceId=${workspaceId}&payoutId=${payout.id}&interval=all&pageSize=${SHEET_MAX_ITEMS}`,
52+
`/api/programs/${programId}/commissions?workspaceId=${workspaceId}&payoutId=${payout.id}&interval=all&pageSize=${PAYOUTS_SHEET_ITEMS_LIMIT}`,
5353
fetcher,
5454
);
5555

0 commit comments

Comments
 (0)