@fluid-app/portal-sdk 0.1.29 → 0.1.30

package/dist/index.cjs

@@ -2734,6 +2734,7 @@ function getThemeModeAttribute(mode) {
 //#region ../core/src/navigation/system-navigation-items.ts
 const SYSTEM_NAVIGATION_SLUGS = [
 	"contacts",
+	"account",
 	"messages",
 	"my-site",
 	"orders",
@@ -2776,6 +2777,12 @@ const SYSTEM_NAVIGATION_ITEMS = {
 		icon: "user",
 		section: "User"
 	},
+	account: {
+		slug: "profile",
+		label: "Account",
+		icon: "user",
+		section: "User"
+	},
 	"share/media": {
 		slug: "share/media",
 		label: "Media",
@@ -2826,7 +2833,10 @@ function isSystemNavigationItem(slug) {
 */
 function getSystemNavigationBySection() {
 	const sections = {};
+	const seenSlugs = /* @__PURE__ */ new Set();
 	for (const item of Object.values(SYSTEM_NAVIGATION_ITEMS)) {
+		if (item.slug && seenSlugs.has(item.slug)) continue;
+		if (item.slug) seenSlugs.add(item.slug);
 		const section = item.section || "Other";
 		if (!sections[section]) sections[section] = [];
 		sections[section].push(item);
@@ -3501,6 +3511,65 @@ function BuilderScreenViewImpl({ screen, className }) {
 }
 const BuilderScreenView = (0, react.memo)(BuilderScreenViewImpl);
 //#endregion
+//#region src/account/account-management-layout.tsx
+const NAV_ITEMS = [
+	{
+		key: "profile",
+		label: "Profile",
+		slug: "profile",
+		icon: lucide_react.User
+	},
+	{
+		key: "orders",
+		label: "Orders",
+		slug: "orders",
+		icon: lucide_react.PackageOpen
+	},
+	{
+		key: "subscriptions",
+		label: "Subscriptions",
+		slug: "subscriptions",
+		icon: lucide_react.Repeat
+	}
+];
+function getActiveTab(slug) {
+	const root = slug.split("/")[0];
+	if (root === "orders") return "orders";
+	if (root === "subscriptions") return "subscriptions";
+	return "profile";
+}
+function AccountManageLayout({ children }) {
+	const { currentSlug, navigate } = require_AppNavigationContext.useAppNavigation();
+	const activeTab = getActiveTab(currentSlug);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col md:flex-row",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("nav", {
+				className: "flex gap-1 overflow-x-auto border-b px-4 py-2 md:hidden",
+				children: NAV_ITEMS.map(({ key, slug, label, icon: Icon }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					onClick: () => navigate(slug),
+					className: `flex items-center gap-2 rounded-md px-3 py-2 text-sm font-medium whitespace-nowrap ${activeTab === key ? "bg-sidebar-primary text-sidebar-primary-foreground" : "hover:bg-sidebar-primary hover:text-sidebar-primary-foreground"}`,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "h-4 w-4" }), label]
+				}, key))
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("nav", {
+				className: "hidden w-48 shrink-0 flex-col gap-1 p-4 md:flex",
+				children: NAV_ITEMS.map(({ key, slug, label, icon: Icon }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					onClick: () => navigate(slug),
+					className: `flex items-center gap-2 rounded-md px-3 py-2 text-left text-sm font-medium ${activeTab === key ? "bg-sidebar-primary text-sidebar-primary-foreground" : "hover:bg-sidebar-primary hover:text-sidebar-primary-foreground"}`,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "h-4 w-4" }), label]
+				}, key))
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "min-w-0 flex-1",
+				children
+			})
+		]
+	});
+}
+//#endregion
 //#region src/shell/PageRouter.tsx
 const ProfileScreen$1 = (0, react.lazy)(() => Promise.resolve().then(() => require("./ProfileScreen-CH3B-IQz.cjs")).then((m) => ({ default: m.ProfileScreen })));
 const OrdersScreen$1 = (0, react.lazy)(() => Promise.resolve().then(() => require("./OrdersScreen-TSXDDHZe.cjs")).then((m) => ({ default: m.OrdersScreen })));
@@ -3527,6 +3596,11 @@ const SYSTEM_SLUG_SCREEN_MAP = {
 	"share/playlist": ShareablesScreen$1,
 	"share/files": ShareablesScreen$1
 };
+const ACCOUNT_SLUGS = new Set([
+	"profile",
+	"orders",
+	"subscriptions"
+]);
 /** Pre-sorted keys for greedy prefix matching (longest first). */
 const SORTED_SCREEN_KEYS = Object.keys(SYSTEM_SLUG_SCREEN_MAP).sort((a, b) => b.length - a.length);
 /** Prefix-match a slug against screen map keys, longest match first. */
@@ -3568,13 +3642,17 @@ function PageRouter({ currentSlug, currentNavItem, customPages, screens, baseSlu
 		});
 	}
 	const SystemScreen = SYSTEM_SLUG_SCREEN_MAP[baseSlug] ?? findScreenByPrefix(currentSlug, SYSTEM_SLUG_SCREEN_MAP);
-	if (SystemScreen) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Suspense, {
-		fallback: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "flex h-full items-center justify-center",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "border-primary h-8 w-8 animate-spin rounded-full border-2 border-t-transparent" })
-		}),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SystemScreen, {})
-	});
+	if (SystemScreen) {
+		const content = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Suspense, {
+			fallback: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex h-full items-center justify-center",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "border-primary h-8 w-8 animate-spin rounded-full border-2 border-t-transparent" })
+			}),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SystemScreen, {})
+		});
+		if (ACCOUNT_SLUGS.has(baseSlug)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccountManageLayout, { children: content });
+		return content;
+	}
 	if (isSystemNavigationItem(baseSlug)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_CoreScreenPlaceholder.CoreScreenPlaceholder, { name: currentNavItem?.label ?? baseSlug });
 	if (builderScreen) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BuilderScreenView, { screen: builderScreen });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_CoreScreenPlaceholder.CoreScreenPlaceholder, { name: currentNavItem?.label ?? currentSlug });