From 43e808734e716d3dc4df9958762fdb1a7d72ea8d Mon Sep 17 00:00:00 2001 From: paanSinghCoder Date: Tue, 10 Feb 2026 14:53:57 +0530 Subject: [PATCH 1/4] feat(plans): move plans page to lib and use in apps --- web/apps/admin/src/pages/plans/PlansPage.tsx | 14 +++++ web/apps/admin/src/routes.tsx | 8 ++- web/lib/admin/index.ts | 1 + .../admin/views/plans}/columns.tsx | 2 +- .../admin/views/plans}/details.tsx | 7 ++- .../admin/views/plans}/header.tsx | 2 +- .../admin/views/plans}/index.tsx | 53 +++++++------------ .../admin/views/plans}/plans.module.css | 0 8 files changed, 43 insertions(+), 44 deletions(-) create mode 100644 web/apps/admin/src/pages/plans/PlansPage.tsx rename web/{apps/admin/src/containers/billingplans.list => lib/admin/views/plans}/columns.tsx (93%) rename web/{apps/admin/src/containers/billingplans.list => lib/admin/views/plans}/details.tsx (82%) rename web/{apps/admin/src/containers/billingplans.list => lib/admin/views/plans}/header.tsx (86%) rename web/{apps/admin/src/containers/billingplans.list => lib/admin/views/plans}/index.tsx (71%) rename web/{apps/admin/src/containers/billingplans.list => lib/admin/views/plans}/plans.module.css (100%) diff --git a/web/apps/admin/src/pages/plans/PlansPage.tsx b/web/apps/admin/src/pages/plans/PlansPage.tsx new file mode 100644 index 000000000..9097921d0 --- /dev/null +++ b/web/apps/admin/src/pages/plans/PlansPage.tsx @@ -0,0 +1,14 @@ +import { PlansView } from "@raystack/frontier/admin"; +import { useNavigate, useParams } from "react-router-dom"; + +export function PlansPage() { + const { planId } = useParams(); + const navigate = useNavigate(); + + return ( + navigate("/plans")} + /> + ); +} diff --git a/web/apps/admin/src/routes.tsx b/web/apps/admin/src/routes.tsx index 136e19d30..973c16e8f 100644 --- a/web/apps/admin/src/routes.tsx +++ b/web/apps/admin/src/routes.tsx @@ -7,8 +7,7 @@ import LoadingState from "./components/states/Loading"; import UnauthorizedState from "./components/states/Unauthorized"; import App from "./App"; -import PlanList from "./containers/billingplans.list"; -import PlanDetails from "./containers/billingplans.list/details"; +import { PlansPage } from "./pages/plans/PlansPage"; import Login from "./containers/login"; import MagicLink from "./containers/magiclink"; @@ -84,9 +83,8 @@ export default memo(function AppRoutes() { } /> - }> - } /> - + } /> + } /> } /> } /> diff --git a/web/lib/admin/index.ts b/web/lib/admin/index.ts index fa967fecb..d48a2197e 100644 --- a/web/lib/admin/index.ts +++ b/web/lib/admin/index.ts @@ -6,6 +6,7 @@ export { default as InvoicesView } from "./views/invoices"; export { ProductsView, ProductPricesView } from "./views/products/exports"; export { default as AuditLogsView } from "./views/audit-logs"; export { default as AdminsView } from "./views/admins"; +export { default as PlansView } from "./views/plans"; // utils exports export { diff --git a/web/apps/admin/src/containers/billingplans.list/columns.tsx b/web/lib/admin/views/plans/columns.tsx similarity index 93% rename from web/apps/admin/src/containers/billingplans.list/columns.tsx rename to web/lib/admin/views/plans/columns.tsx index 7bed1996a..85e6c440e 100644 --- a/web/apps/admin/src/containers/billingplans.list/columns.tsx +++ b/web/lib/admin/views/plans/columns.tsx @@ -1,7 +1,7 @@ import { Link } from "react-router-dom"; import { type DataTableColumnDef } from "@raystack/apsara"; import type { Plan } from "@raystack/proton/frontier"; -import { timestampToDate, TimeStamp } from "~/utils/connect-timestamp"; +import { timestampToDate, type TimeStamp } from "../../utils/connect-timestamp"; export const getColumns: () => DataTableColumnDef< Plan, diff --git a/web/apps/admin/src/containers/billingplans.list/details.tsx b/web/lib/admin/views/plans/details.tsx similarity index 82% rename from web/apps/admin/src/containers/billingplans.list/details.tsx rename to web/lib/admin/views/plans/details.tsx index 96bdd5a13..b41f7c985 100644 --- a/web/apps/admin/src/containers/billingplans.list/details.tsx +++ b/web/lib/admin/views/plans/details.tsx @@ -1,9 +1,8 @@ import { Flex, Text, Grid } from "@raystack/apsara"; -import { usePlan } from "."; -import { timestampToDate } from "~/utils/connect-timestamp"; +import type { Plan } from "@raystack/proton/frontier"; +import { timestampToDate } from "../../utils/connect-timestamp"; -export default function PlanDetails() { - const { plan } = usePlan(); +export default function PlanDetails({ plan }: { plan: Plan | null }) { return ( diff --git a/web/apps/admin/src/containers/billingplans.list/header.tsx b/web/lib/admin/views/plans/header.tsx similarity index 86% rename from web/apps/admin/src/containers/billingplans.list/header.tsx rename to web/lib/admin/views/plans/header.tsx index d78a00bf4..713ce3f6b 100644 --- a/web/apps/admin/src/containers/billingplans.list/header.tsx +++ b/web/lib/admin/views/plans/header.tsx @@ -1,5 +1,5 @@ import { DataTable } from "@raystack/apsara"; -import PageHeader from "~/components/page-header"; +import { PageHeader } from "../../components/PageHeader"; import styles from "./plans.module.css"; export const PlanHeader = ({ header }: any) => { diff --git a/web/apps/admin/src/containers/billingplans.list/index.tsx b/web/lib/admin/views/plans/index.tsx similarity index 71% rename from web/apps/admin/src/containers/billingplans.list/index.tsx rename to web/lib/admin/views/plans/index.tsx index c53362f84..0e1dfc3c6 100644 --- a/web/apps/admin/src/containers/billingplans.list/index.tsx +++ b/web/lib/admin/views/plans/index.tsx @@ -1,29 +1,32 @@ import { EmptyState, Flex, DataTable, Sheet } from "@raystack/apsara"; -import { - Outlet, - useNavigate, - useOutletContext, - useParams, -} from "react-router-dom"; - import type { Plan } from "@raystack/proton/frontier"; -import { reduceByKey } from "~/utils/helper"; +import { reduceByKey } from "../../utils/helper"; import { getColumns } from "./columns"; import { PlanHeader } from "./header"; import { ExclamationTriangleIcon } from "@radix-ui/react-icons"; import styles from "./plans.module.css"; -import PageTitle from "~/components/page-title"; -import { SheetHeader } from "~/components/sheet/header"; +import { PageTitle } from "../../components/PageTitle"; +import { SheetHeader } from "../../components/SheetHeader"; import { useQuery } from "@connectrpc/connect-query"; import { FrontierServiceQueries } from "@raystack/proton/frontier"; +import PlanDetails from "./details"; const pageHeader = { title: "Plans", breadcrumb: [], }; -type ContextType = { plan: Plan | null }; -export default function PlanList() { +export type PlansViewProps = { + selectedPlanId?: string; + onCloseDetail?: () => void; + appName?: string; +}; + +export default function PlansView({ + selectedPlanId, + onCloseDetail, + appName, +}: PlansViewProps = {}) { const { data: plansResponse, isLoading: isPlansLoading, @@ -34,19 +37,9 @@ export default function PlanList() { }); const plans = plansResponse?.plans || []; - - let { planId } = useParams(); - const planMapById = reduceByKey(plans ?? [], "id"); - const columns = getColumns(); - const navigate = useNavigate(); - - function onClose() { - navigate("/plans"); - } - if (isError) { console.error("ConnectRPC Error:", error); return ( @@ -70,21 +63,19 @@ export default function PlanList() { defaultSort={{ name: "title", order: "asc" }} > - + - + - + {})} /> - @@ -93,10 +84,6 @@ export default function PlanList() { ); } -export function usePlan() { - return useOutletContext(); -} - export const noDataChildren = ( } heading="0 plan created" /> ); diff --git a/web/apps/admin/src/containers/billingplans.list/plans.module.css b/web/lib/admin/views/plans/plans.module.css similarity index 100% rename from web/apps/admin/src/containers/billingplans.list/plans.module.css rename to web/lib/admin/views/plans/plans.module.css From 85ad219f59f727bb0d7983f28447e6dbd8dcdc0f Mon Sep 17 00:00:00 2001 From: paanSinghCoder Date: Wed, 11 Feb 2026 14:54:41 +0530 Subject: [PATCH 2/4] refactor(plans): nest planId route under plans for improved routing structure --- web/apps/admin/src/routes.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/web/apps/admin/src/routes.tsx b/web/apps/admin/src/routes.tsx index 973c16e8f..58e4f8472 100644 --- a/web/apps/admin/src/routes.tsx +++ b/web/apps/admin/src/routes.tsx @@ -83,8 +83,9 @@ export default memo(function AppRoutes() { } /> - } /> - } /> + }> + } /> + } /> } /> From ac89384d2eb8abb06dae4dbc5b128a28be229949 Mon Sep 17 00:00:00 2001 From: paanSinghCoder Date: Wed, 11 Feb 2026 15:09:18 +0530 Subject: [PATCH 3/4] refactor(admin-app): update build process to use pnpm and turbo for improved performance --- Makefile | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Makefile b/Makefile index ea13c3248..0fa15299a 100644 --- a/Makefile +++ b/Makefile @@ -8,7 +8,7 @@ PROTON_COMMIT := "e806c3a6f5ae280a23d02480becddc2818661715" admin-app: @echo " > generating admin build" - @cd web/apps/admin && $(MAKE) build + @cd web && pnpm install && pnpm exec turbo run build --filter=admin install: @echo "Clean up imports..." From e0f5ec5df52403b1974d2b8489ae9e13ac8a3f63 Mon Sep 17 00:00:00 2001 From: paanSinghCoder Date: Wed, 11 Feb 2026 15:24:34 +0530 Subject: [PATCH 4/4] refactor(build): create separate Makefile for web with dedicated build targets --- Makefile | 2 +- web/{apps/admin => }/Makefile | 3 +++ 2 files changed, 4 insertions(+), 1 deletion(-) rename web/{apps/admin => }/Makefile (58%) diff --git a/Makefile b/Makefile index 0fa15299a..2f45f2a43 100644 --- a/Makefile +++ b/Makefile @@ -8,7 +8,7 @@ PROTON_COMMIT := "e806c3a6f5ae280a23d02480becddc2818661715" admin-app: @echo " > generating admin build" - @cd web && pnpm install && pnpm exec turbo run build --filter=admin + @cd web && $(MAKE) build-admin install: @echo "Clean up imports..." diff --git a/web/apps/admin/Makefile b/web/Makefile similarity index 58% rename from web/apps/admin/Makefile rename to web/Makefile index 10fdf5c11..3795c659f 100644 --- a/web/apps/admin/Makefile +++ b/web/Makefile @@ -2,6 +2,9 @@ build: dep dist +build-admin: + @pnpm install && pnpm exec turbo run build --filter=admin + dist: @pnpm run build