@burdenoff/microfe-devportal 2026.623.5 → 2026.623.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/devportal/DevportalRoutes.js +101 -94
- package/dist/devportal/DevportalRoutes.js.map +1 -1
- package/dist/devportal/components/SectionNav.js +71 -5
- package/dist/devportal/components/SectionNav.js.map +1 -0
- package/dist/devportal/components/index.js +1 -1
- package/dist/devportal/hooks/useGraphQL.js +1 -1
- package/dist/devportal/pages/AdminReviewPage.js +39 -39
- package/dist/devportal/pages/AnalyticsDashboardPage.js +54 -54
- package/dist/devportal/pages/AnalyticsDashboardPage.js.map +1 -1
- package/dist/devportal/pages/ApiKeysPage.js +53 -53
- package/dist/devportal/pages/ApiKeysPage.js.map +1 -1
- package/dist/devportal/pages/AppLogsPage.js +9 -9
- package/dist/devportal/pages/ApplicationDetailPage.js +462 -462
- package/dist/devportal/pages/ApplicationDetailPage.js.map +1 -1
- package/dist/devportal/pages/ApplicationVersionsPage.js +120 -120
- package/dist/devportal/pages/ApplicationVersionsPage.js.map +1 -1
- package/dist/devportal/pages/ApplicationsPage.js +73 -73
- package/dist/devportal/pages/ApplicationsPage.js.map +1 -1
- package/dist/devportal/pages/CreateApiKeyPage.js +20 -20
- package/dist/devportal/pages/CreateApplicationPage.js +32 -32
- package/dist/devportal/pages/CreateOAuthClientPage.js +18 -18
- package/dist/devportal/pages/CreateOrganizationPage.js +12 -12
- package/dist/devportal/pages/CreateWebhookPage.js +23 -23
- package/dist/devportal/pages/DashboardPage.js +23 -23
- package/dist/devportal/pages/DelegationsPage.js +22 -22
- package/dist/devportal/pages/EditApplicationPage.js +283 -283
- package/dist/devportal/pages/EditApplicationPage.js.map +1 -1
- package/dist/devportal/pages/ListingPreviewPage.js +9 -9
- package/dist/devportal/pages/OAuthClientDetailPage.js +15 -15
- package/dist/devportal/pages/OAuthClientsPage.js +14 -14
- package/dist/devportal/pages/OrganizationDetailPage.js +84 -84
- package/dist/devportal/pages/OrganizationMembersPage.js +260 -260
- package/dist/devportal/pages/OrganizationMembersPage.js.map +1 -1
- package/dist/devportal/pages/OrganizationsPage.js +16 -16
- package/dist/devportal/pages/PublishPage.js +16 -16
- package/dist/devportal/pages/PublisherProfilePage.js +18 -18
- package/dist/devportal/pages/RevenueDashboardPage.js +29 -29
- package/dist/devportal/pages/SettingsPage.js +17 -17
- package/dist/devportal/pages/SetupPage.js +99 -99
- package/dist/devportal/pages/SetupPage.js.map +1 -1
- package/dist/devportal/pages/WebhookDetailPage.js +143 -143
- package/dist/devportal/pages/WebhookDetailPage.js.map +1 -1
- package/dist/devportal/pages/WebhooksPage.js +133 -133
- package/dist/devportal/pages/WebhooksPage.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { useDevportal as e } from "../providers/DevportalProvider.js";
|
|
2
2
|
import { cn as t } from "../utils/cn.js";
|
|
3
3
|
import { EmptyState as n } from "../components/EmptyState.js";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
4
|
+
import { useCreateBillingAccountMutation as ee, useGetBillingAccountsByOrgQuery as te, useGetMyOrganizationsQuery as ne, useGetRevenueDashboardDataQuery as re, useLinkDevOrgBillingAccountMutation as ie } from "../../generated/global-operations.js";
|
|
5
|
+
import { getErrorMessage as r } from "../hooks/useGraphQL.js";
|
|
6
|
+
import { PageLayout as i, PageSection as a } from "../components/PageLayout.js";
|
|
7
|
+
import { StatCard as o, StatCardGrid as ae } from "../components/StatCard.js";
|
|
8
|
+
import { StatusBadge as s } from "../components/StatusBadge.js";
|
|
9
|
+
import { DataTable as c } from "../components/DataTable.js";
|
|
10
10
|
import "../hooks/index.js";
|
|
11
11
|
import { Tooltip as l } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/component/Tooltip.js";
|
|
12
12
|
import { ResponsiveContainer as u } from "../../node_modules/.bun/recharts@2.15.4_21ccd8898788a04d/node_modules/recharts/es6/component/ResponsiveContainer.js";
|
|
@@ -32,13 +32,13 @@ var D = {
|
|
|
32
32
|
"90d": 90,
|
|
33
33
|
"12m": 365
|
|
34
34
|
}, O = () => {
|
|
35
|
-
let O = le(), { activeOrgId: k, currentUser: he } = e(), [A, ge] = g("90d"), [j, M] = g(!1), [N, P] = g(null), [_e] =
|
|
35
|
+
let O = le(), { activeOrgId: k, currentUser: he } = e(), [A, ge] = g("90d"), [j, M] = g(!1), [N, P] = g(null), [_e] = ee(), [F] = ie(), [I, L] = g(!1), [R, z] = g(null), [ve] = fe(), B = h(() => /* @__PURE__ */ new Date(), []), { data: ye, loading: V } = te({
|
|
36
36
|
fetchPolicy: "cache-and-network",
|
|
37
37
|
skip: !k
|
|
38
38
|
}), be = h(() => {
|
|
39
39
|
let e = new Date(B);
|
|
40
40
|
return e.setDate(e.getDate() - me[A]), e.toISOString();
|
|
41
|
-
}, [B, A]), { data: H, loading: xe, error: U } =
|
|
41
|
+
}, [B, A]), { data: H, loading: xe, error: U } = ne({ fetchPolicy: "cache-and-network" }), { data: W, loading: Se, error: G } = re({
|
|
42
42
|
variables: {
|
|
43
43
|
organizationId: k ?? "",
|
|
44
44
|
period: "monthly",
|
|
@@ -102,14 +102,14 @@ var D = {
|
|
|
102
102
|
refunds: e.refunds,
|
|
103
103
|
salesCount: e.salesCount
|
|
104
104
|
}));
|
|
105
|
-
return xe && !H ? /* @__PURE__ */ T(
|
|
105
|
+
return xe && !H ? /* @__PURE__ */ T(i, {
|
|
106
106
|
title: O("devportal.revenue.title", "Revenue"),
|
|
107
107
|
description: O("devportal.revenue.description", "Track real revenue, sales, and payout activity for your developer organizations"),
|
|
108
108
|
children: /* @__PURE__ */ T("div", {
|
|
109
109
|
className: "flex items-center justify-center py-16 text-muted-foreground",
|
|
110
110
|
children: /* @__PURE__ */ T(C, { className: "h-8 w-8 animate-spin" })
|
|
111
111
|
})
|
|
112
|
-
}) : U ? /* @__PURE__ */ T(
|
|
112
|
+
}) : U ? /* @__PURE__ */ T(i, {
|
|
113
113
|
title: O("devportal.revenue.title", "Revenue"),
|
|
114
114
|
description: O("devportal.revenue.description", "Track real revenue, sales, and payout activity for your developer organizations"),
|
|
115
115
|
children: /* @__PURE__ */ T(n, {
|
|
@@ -118,9 +118,9 @@ var D = {
|
|
|
118
118
|
className: "text-status-error-text"
|
|
119
119
|
}),
|
|
120
120
|
title: O("devportal.revenue.errorLoadOrgs", "Unable to load organizations"),
|
|
121
|
-
description:
|
|
121
|
+
description: r(U)
|
|
122
122
|
})
|
|
123
|
-
}) : k ? G ? /* @__PURE__ */ T(
|
|
123
|
+
}) : k ? G ? /* @__PURE__ */ T(i, {
|
|
124
124
|
title: O("devportal.revenue.title", "Revenue"),
|
|
125
125
|
description: O("devportal.revenue.description", "Track real revenue, sales, and payout activity for your developer organizations"),
|
|
126
126
|
children: /* @__PURE__ */ T(n, {
|
|
@@ -129,9 +129,9 @@ var D = {
|
|
|
129
129
|
className: "text-status-error-text"
|
|
130
130
|
}),
|
|
131
131
|
title: O("devportal.revenue.errorLoadData", "Unable to load revenue data"),
|
|
132
|
-
description:
|
|
132
|
+
description: r(G)
|
|
133
133
|
})
|
|
134
|
-
}) : /* @__PURE__ */ E(
|
|
134
|
+
}) : /* @__PURE__ */ E(i, {
|
|
135
135
|
title: O("devportal.revenue.title", "Revenue"),
|
|
136
136
|
description: K ? `${O("devportal.revenue.financialPerformanceFor", "Financial performance for")} ${K.name}` : O("devportal.revenue.shortDescription", "Track revenue, sales, and payouts"),
|
|
137
137
|
actions: /* @__PURE__ */ T("div", {
|
|
@@ -366,26 +366,26 @@ var D = {
|
|
|
366
366
|
className: "flex items-center justify-center py-16 text-muted-foreground",
|
|
367
367
|
children: /* @__PURE__ */ T(C, { className: "h-8 w-8 animate-spin" })
|
|
368
368
|
}) : Q ? /* @__PURE__ */ E(pe, { children: [
|
|
369
|
-
/* @__PURE__ */ E(
|
|
369
|
+
/* @__PURE__ */ E(ae, {
|
|
370
370
|
columns: 4,
|
|
371
371
|
children: [
|
|
372
|
-
/* @__PURE__ */ T(
|
|
372
|
+
/* @__PURE__ */ T(o, {
|
|
373
373
|
title: O("devportal.revenue.grossRevenue", "Gross Revenue"),
|
|
374
374
|
value: `$${Q.totalGrossRevenue.toLocaleString()}`,
|
|
375
375
|
icon: /* @__PURE__ */ T(x, { size: 20 })
|
|
376
376
|
}),
|
|
377
|
-
/* @__PURE__ */ T(
|
|
377
|
+
/* @__PURE__ */ T(o, {
|
|
378
378
|
title: O("devportal.revenue.netRevenue", "Net Revenue"),
|
|
379
379
|
value: `$${Q.totalNetRevenue.toLocaleString()}`,
|
|
380
380
|
icon: /* @__PURE__ */ T(de, { size: 20 })
|
|
381
381
|
}),
|
|
382
|
-
/* @__PURE__ */ T(
|
|
382
|
+
/* @__PURE__ */ T(o, {
|
|
383
383
|
title: O("devportal.revenue.pendingBalance", "Pending Balance"),
|
|
384
384
|
value: `$${Q.pendingBalance.toLocaleString()}`,
|
|
385
385
|
icon: /* @__PURE__ */ T(b, { size: 20 }),
|
|
386
386
|
description: Q.nextPayoutDate ? `${O("devportal.revenue.nextPayout", "Next payout")} ${new Date(Q.nextPayoutDate).toLocaleDateString()}` : O("devportal.revenue.noPayoutScheduled", "No payout scheduled")
|
|
387
387
|
}),
|
|
388
|
-
/* @__PURE__ */ T(
|
|
388
|
+
/* @__PURE__ */ T(o, {
|
|
389
389
|
title: O("devportal.revenue.platformFees", "Platform Fees"),
|
|
390
390
|
value: `$${Q.totalPlatformFees.toLocaleString()}`,
|
|
391
391
|
icon: /* @__PURE__ */ T(ue, { size: 20 }),
|
|
@@ -395,7 +395,7 @@ var D = {
|
|
|
395
395
|
}),
|
|
396
396
|
/* @__PURE__ */ E("div", {
|
|
397
397
|
className: "grid gap-6 xl:grid-cols-2",
|
|
398
|
-
children: [/* @__PURE__ */ T(
|
|
398
|
+
children: [/* @__PURE__ */ T(a, {
|
|
399
399
|
title: O("devportal.revenue.revenueTrend", "Revenue trend"),
|
|
400
400
|
children: /* @__PURE__ */ T("div", {
|
|
401
401
|
className: "rounded-lg border bg-card p-4",
|
|
@@ -441,7 +441,7 @@ var D = {
|
|
|
441
441
|
})
|
|
442
442
|
})
|
|
443
443
|
})
|
|
444
|
-
}), /* @__PURE__ */ T(
|
|
444
|
+
}), /* @__PURE__ */ T(a, {
|
|
445
445
|
title: O("devportal.revenue.topApps", "Top applications by revenue"),
|
|
446
446
|
children: Q.topApps.length > 0 ? /* @__PURE__ */ T("div", {
|
|
447
447
|
className: "space-y-2",
|
|
@@ -482,7 +482,7 @@ var D = {
|
|
|
482
482
|
})
|
|
483
483
|
})]
|
|
484
484
|
}),
|
|
485
|
-
/* @__PURE__ */ T(
|
|
485
|
+
/* @__PURE__ */ T(a, {
|
|
486
486
|
title: O("devportal.revenue.salesVolume", "Sales volume"),
|
|
487
487
|
children: /* @__PURE__ */ T("div", {
|
|
488
488
|
className: "rounded-lg border bg-card p-4",
|
|
@@ -527,9 +527,9 @@ var D = {
|
|
|
527
527
|
}),
|
|
528
528
|
/* @__PURE__ */ E("div", {
|
|
529
529
|
className: "grid gap-6 xl:grid-cols-2",
|
|
530
|
-
children: [/* @__PURE__ */ T(
|
|
530
|
+
children: [/* @__PURE__ */ T(a, {
|
|
531
531
|
title: O("devportal.revenue.recentSales", "Recent sales"),
|
|
532
|
-
children: /* @__PURE__ */ T(
|
|
532
|
+
children: /* @__PURE__ */ T(c, {
|
|
533
533
|
data: we,
|
|
534
534
|
keyField: "id",
|
|
535
535
|
columns: [
|
|
@@ -551,16 +551,16 @@ var D = {
|
|
|
551
551
|
{
|
|
552
552
|
key: "status",
|
|
553
553
|
header: O("devportal.revenue.status", "Status"),
|
|
554
|
-
render: (e) => /* @__PURE__ */ T(
|
|
554
|
+
render: (e) => /* @__PURE__ */ T(s, {
|
|
555
555
|
status: e.status,
|
|
556
556
|
type: "app"
|
|
557
557
|
})
|
|
558
558
|
}
|
|
559
559
|
]
|
|
560
560
|
})
|
|
561
|
-
}), /* @__PURE__ */ T(
|
|
561
|
+
}), /* @__PURE__ */ T(a, {
|
|
562
562
|
title: O("devportal.revenue.payoutHistory", "Payout history"),
|
|
563
|
-
children: /* @__PURE__ */ T(
|
|
563
|
+
children: /* @__PURE__ */ T(c, {
|
|
564
564
|
data: Te,
|
|
565
565
|
keyField: "id",
|
|
566
566
|
columns: [
|
|
@@ -577,7 +577,7 @@ var D = {
|
|
|
577
577
|
{
|
|
578
578
|
key: "status",
|
|
579
579
|
header: O("devportal.revenue.status", "Status"),
|
|
580
|
-
render: (e) => /* @__PURE__ */ T(
|
|
580
|
+
render: (e) => /* @__PURE__ */ T(s, {
|
|
581
581
|
status: e.status,
|
|
582
582
|
type: "app"
|
|
583
583
|
})
|
|
@@ -592,7 +592,7 @@ var D = {
|
|
|
592
592
|
description: O("devportal.revenue.noDataDescription", "Revenue metrics will appear after this organization starts recording marketplace sales.")
|
|
593
593
|
})
|
|
594
594
|
]
|
|
595
|
-
}) : /* @__PURE__ */ T(
|
|
595
|
+
}) : /* @__PURE__ */ T(i, {
|
|
596
596
|
title: O("devportal.revenue.title", "Revenue"),
|
|
597
597
|
description: O("devportal.revenue.description", "Track real revenue, sales, and payout activity for your developer organizations"),
|
|
598
598
|
children: /* @__PURE__ */ T(n, {
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { useDevportal as e } from "../providers/DevportalProvider.js";
|
|
2
2
|
import { EmptyState as t } from "../components/EmptyState.js";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
3
|
+
import { useGetDeveloperPortalSettingsOverviewQuery as n } from "../../generated/global-operations.js";
|
|
4
|
+
import { getErrorMessage as r } from "../hooks/useGraphQL.js";
|
|
5
|
+
import { PageLayout as i, PageSection as a } from "../components/PageLayout.js";
|
|
6
|
+
import { VerifiedBadge as o } from "../components/StatusBadge.js";
|
|
7
7
|
import "../hooks/index.js";
|
|
8
8
|
import { useTr as s } from "../utils/i18n.js";
|
|
9
9
|
import { AlertCircle as c, Building2 as l, ExternalLink as u, KeyRound as d, Loader2 as f, Mail as p, Settings as m, Shield as h, UserCircle2 as g, Webhook as _, Workflow as v } from "lucide-react";
|
|
@@ -14,10 +14,10 @@ var x = (e, t) => {
|
|
|
14
14
|
let n = new Date(e);
|
|
15
15
|
return Number.isNaN(n.getTime()) ? t : n.toLocaleDateString();
|
|
16
16
|
}, S = () => {
|
|
17
|
-
let { navigate: S, basePath: C } = e(), w = s(), { data: T, loading: E, error: D } =
|
|
17
|
+
let { navigate: S, basePath: C } = e(), w = s(), { data: T, loading: E, error: D } = n({ fetchPolicy: "cache-and-network" }), O = (e) => {
|
|
18
18
|
S?.(`${C}${e}`);
|
|
19
19
|
}, k = w("devportal.settings.never", "Never"), A = w("devportal.settings.title", "Settings"), j = w("devportal.settings.description", "Review your developer portal account, credentials, and support options");
|
|
20
|
-
if (E && !T) return /* @__PURE__ */ y(
|
|
20
|
+
if (E && !T) return /* @__PURE__ */ y(i, {
|
|
21
21
|
title: A,
|
|
22
22
|
description: j,
|
|
23
23
|
children: /* @__PURE__ */ y("div", {
|
|
@@ -28,7 +28,7 @@ var x = (e, t) => {
|
|
|
28
28
|
children: /* @__PURE__ */ y(f, { className: "h-8 w-8 animate-spin" })
|
|
29
29
|
})
|
|
30
30
|
});
|
|
31
|
-
if (D) return /* @__PURE__ */ y(
|
|
31
|
+
if (D) return /* @__PURE__ */ y(i, {
|
|
32
32
|
title: A,
|
|
33
33
|
description: j,
|
|
34
34
|
children: /* @__PURE__ */ y(t, {
|
|
@@ -37,11 +37,11 @@ var x = (e, t) => {
|
|
|
37
37
|
className: "text-status-error-text"
|
|
38
38
|
}),
|
|
39
39
|
title: w("devportal.settings.errorTitle", "Unable to load settings"),
|
|
40
|
-
description:
|
|
40
|
+
description: r(D)
|
|
41
41
|
})
|
|
42
42
|
});
|
|
43
43
|
let M = T?.myDeveloperProfile, N = T?.myDeveloperOrganizations ?? [], P = T?.myApiKeys?.apiKeys ?? [], F = T?.myApiKeys?.totalCount ?? P.length, I = P[0], L = N.reduce((e, t) => e + (t.totalRevenue ?? 0), 0);
|
|
44
|
-
return /* @__PURE__ */ y(
|
|
44
|
+
return /* @__PURE__ */ y(i, {
|
|
45
45
|
title: A,
|
|
46
46
|
description: j,
|
|
47
47
|
children: /* @__PURE__ */ b("div", {
|
|
@@ -49,7 +49,7 @@ var x = (e, t) => {
|
|
|
49
49
|
children: [/* @__PURE__ */ b("div", {
|
|
50
50
|
className: "space-y-6",
|
|
51
51
|
children: [
|
|
52
|
-
/* @__PURE__ */ y(
|
|
52
|
+
/* @__PURE__ */ y(a, {
|
|
53
53
|
title: w("devportal.settings.profile", "Profile"),
|
|
54
54
|
children: /* @__PURE__ */ y("div", {
|
|
55
55
|
className: "rounded-lg border bg-card p-6",
|
|
@@ -69,7 +69,7 @@ var x = (e, t) => {
|
|
|
69
69
|
className: "text-lg font-semibold",
|
|
70
70
|
children: w("devportal.settings.developerProfile", "Developer profile")
|
|
71
71
|
}),
|
|
72
|
-
M?.isVerified && /* @__PURE__ */ y(
|
|
72
|
+
M?.isVerified && /* @__PURE__ */ y(o, { verified: !0 })
|
|
73
73
|
]
|
|
74
74
|
}),
|
|
75
75
|
/* @__PURE__ */ y("p", {
|
|
@@ -124,7 +124,7 @@ var x = (e, t) => {
|
|
|
124
124
|
}),
|
|
125
125
|
/* @__PURE__ */ b("div", {
|
|
126
126
|
className: "grid gap-6 lg:grid-cols-2",
|
|
127
|
-
children: [/* @__PURE__ */ y(
|
|
127
|
+
children: [/* @__PURE__ */ y(a, {
|
|
128
128
|
title: w("devportal.settings.credentials", "Credentials"),
|
|
129
129
|
children: /* @__PURE__ */ y("div", {
|
|
130
130
|
className: "rounded-lg border bg-card p-6",
|
|
@@ -181,7 +181,7 @@ var x = (e, t) => {
|
|
|
181
181
|
})]
|
|
182
182
|
})
|
|
183
183
|
})
|
|
184
|
-
}), /* @__PURE__ */ y(
|
|
184
|
+
}), /* @__PURE__ */ y(a, {
|
|
185
185
|
title: w("devportal.settings.organizations", "Organizations"),
|
|
186
186
|
children: /* @__PURE__ */ b("div", {
|
|
187
187
|
className: "rounded-lg border bg-card p-6",
|
|
@@ -222,7 +222,7 @@ var x = (e, t) => {
|
|
|
222
222
|
})
|
|
223
223
|
})]
|
|
224
224
|
}),
|
|
225
|
-
/* @__PURE__ */ y(
|
|
225
|
+
/* @__PURE__ */ y(a, {
|
|
226
226
|
title: w("devportal.settings.deliveryAutomation", "Delivery & automation"),
|
|
227
227
|
children: /* @__PURE__ */ y("div", {
|
|
228
228
|
className: "rounded-lg border bg-card p-6",
|
|
@@ -256,7 +256,7 @@ var x = (e, t) => {
|
|
|
256
256
|
}), /* @__PURE__ */ b("div", {
|
|
257
257
|
className: "space-y-6",
|
|
258
258
|
children: [
|
|
259
|
-
/* @__PURE__ */ y(
|
|
259
|
+
/* @__PURE__ */ y(a, {
|
|
260
260
|
title: w("devportal.settings.securitySupport", "Security & support"),
|
|
261
261
|
children: /* @__PURE__ */ b("div", {
|
|
262
262
|
className: "rounded-lg border bg-card p-6",
|
|
@@ -288,7 +288,7 @@ var x = (e, t) => {
|
|
|
288
288
|
})]
|
|
289
289
|
})
|
|
290
290
|
}),
|
|
291
|
-
/* @__PURE__ */ y(
|
|
291
|
+
/* @__PURE__ */ y(a, {
|
|
292
292
|
title: w("devportal.settings.recentCredentialActivity", "Recent credential activity"),
|
|
293
293
|
children: /* @__PURE__ */ y("div", {
|
|
294
294
|
className: "rounded-lg border bg-card p-6",
|
|
@@ -330,7 +330,7 @@ var x = (e, t) => {
|
|
|
330
330
|
})
|
|
331
331
|
})
|
|
332
332
|
}),
|
|
333
|
-
/* @__PURE__ */ y(
|
|
333
|
+
/* @__PURE__ */ y(a, {
|
|
334
334
|
title: w("devportal.settings.accountActions", "Account actions"),
|
|
335
335
|
children: /* @__PURE__ */ b("div", {
|
|
336
336
|
className: "rounded-lg border border-status-warning-border bg-status-warning-bg-subtle p-6",
|