@replicated/portal-components 0.0.2 → 0.0.4

package/dist/esm/user-settings.js

@@ -0,0 +1,368 @@
+"use client";
+import { useState, useMemo } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+/**
+ * Enterprise Portal Components
+ * This file is generated by tsup. Do not edit manually.
+ */
+
+var NOTIFICATION_DESCRIPTIONS = {
+  "new-version": "New version available"
+};
+var EmailNotificationsSection = ({
+  teamName,
+  notifications,
+  isLoading,
+  onToggle
+}) => {
+  const allNotificationTypes = Object.keys(NOTIFICATION_DESCRIPTIONS);
+  const mergedNotifications = allNotificationTypes.map((type) => {
+    const existing = notifications.find((n) => n.type === type);
+    return {
+      type,
+      enabled: existing ? existing.enabled : type === "new-version"
+      // Default new-version to true
+    };
+  });
+  if (isLoading) {
+    return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-gray-200 bg-white p-6 shadow-sm", children: [
+      /* @__PURE__ */ jsxs("h2", { className: "text-lg font-semibold text-gray-900", children: [
+        "Email Notifications for ",
+        teamName
+      ] }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: "Choose which email notifications you want to receive for this team." }),
+      /* @__PURE__ */ jsx("div", { className: "mt-6 flex justify-center py-8", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: "Loading notifications..." }) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-gray-200 bg-white p-6 shadow-sm", children: [
+    /* @__PURE__ */ jsxs("h2", { className: "text-lg font-semibold text-gray-900", children: [
+      "Email Notifications for ",
+      teamName
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: "Choose which email notifications you want to receive for this team." }),
+    /* @__PURE__ */ jsxs("div", { className: "mt-6 overflow-hidden rounded-lg border border-gray-200", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between bg-gray-50 px-4 py-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium uppercase text-gray-600", children: "Description" }),
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium uppercase text-gray-600", children: "Enabled" })
+      ] }),
+      mergedNotifications.map((notification) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "flex items-center justify-between border-t border-gray-200 px-4 py-3",
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-900", children: NOTIFICATION_DESCRIPTIONS[notification.type] }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "checkbox",
+                checked: notification.enabled,
+                onChange: () => onToggle?.(notification.type, !notification.enabled),
+                className: "portal-checkbox"
+              }
+            )
+          ]
+        },
+        notification.type
+      ))
+    ] }),
+    /* @__PURE__ */ jsxs("p", { className: "mt-3 text-xs text-gray-500", children: [
+      "These notification preferences are specific to the ",
+      teamName,
+      " team. Switch teams to manage notifications for other teams."
+    ] })
+  ] });
+};
+var TeamsSection = ({
+  teams,
+  currentCustomer,
+  isLoading,
+  onTeamSwitch,
+  primaryColor
+}) => {
+  const groupedTeams = useMemo(() => {
+    const groups = /* @__PURE__ */ new Map();
+    for (const team of teams) {
+      const existing = groups.get(team.appId);
+      if (existing) {
+        existing.teams.push(team);
+      } else {
+        groups.set(team.appId, {
+          appName: team.appName,
+          teams: [team]
+        });
+      }
+    }
+    return groups;
+  }, [teams]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-gray-200 bg-white p-6 shadow-sm", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900", children: "Teams" }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: "Teams associate your email address with any additional licenses your account has access to." }),
+      /* @__PURE__ */ jsx("div", { className: "mt-6", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: "Loading teams..." }) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-gray-200 bg-white p-6 shadow-sm", children: [
+    /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900", children: "Teams" }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: "Teams associate your email address with any additional licenses your account has access to." }),
+    /* @__PURE__ */ jsx("div", { className: "mt-6 space-y-6", children: Array.from(groupedTeams.values()).map((appGroup) => /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx("h3", { className: "text-base font-medium text-gray-900", children: appGroup.appName }),
+      /* @__PURE__ */ jsx("div", { className: "space-y-2", children: appGroup.teams.map((team) => {
+        const isCurrentTeam = currentCustomer?.id === team.id;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => !isCurrentTeam && onTeamSwitch?.(team),
+            disabled: isCurrentTeam,
+            className: `flex w-full items-center justify-between rounded-lg border p-4 text-left transition ${isCurrentTeam ? "cursor-default border-gray-300 bg-gray-50" : "cursor-pointer border-gray-200 hover:border-indigo-500"}`,
+            style: !isCurrentTeam && primaryColor ? { "--hover-border": primaryColor } : void 0,
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ jsx(
+                  "svg",
+                  {
+                    className: "h-4 w-4",
+                    style: { color: primaryColor || "#6366f1" },
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    strokeWidth: 2,
+                    children: /* @__PURE__ */ jsx(
+                      "path",
+                      {
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round",
+                        d: "M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { children: [
+                  /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-900", children: team.name }),
+                  isCurrentTeam && /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500", children: "Current Team" })
+                ] })
+              ] }),
+              !isCurrentTeam && /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  className: "h-4 w-4",
+                  style: { color: primaryColor || "#6366f1" },
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  stroke: "currentColor",
+                  strokeWidth: 2,
+                  children: /* @__PURE__ */ jsx(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M9 5l7 7-7 7"
+                    }
+                  )
+                }
+              )
+            ]
+          },
+          team.id
+        );
+      }) })
+    ] }, appGroup.appName)) })
+  ] });
+};
+var ProfileSection = ({
+  user,
+  isLoading,
+  isUpdating,
+  error,
+  updateError,
+  onSave,
+  primaryColor
+}) => {
+  const [isEditing, setIsEditing] = useState(false);
+  const [firstName, setFirstName] = useState(user?.firstName || "");
+  const [lastName, setLastName] = useState(user?.lastName || "");
+  const [inputError, setInputError] = useState(null);
+  const resetForm = () => {
+    setFirstName(user?.firstName || "");
+    setLastName(user?.lastName || "");
+    setInputError(null);
+  };
+  const handleSave = async () => {
+    if (!firstName && !lastName) {
+      setInputError("Please enter a first name or last name");
+      return;
+    }
+    if (firstName === user?.firstName && lastName === user?.lastName) {
+      setIsEditing(false);
+      return;
+    }
+    try {
+      await onSave?.({ firstName, lastName });
+      setIsEditing(false);
+    } catch (err) {
+      console.error("Error updating user information:", err);
+    }
+  };
+  const handleCancel = () => {
+    setIsEditing(false);
+    resetForm();
+  };
+  const handleEdit = () => {
+    resetForm();
+    setIsEditing(true);
+  };
+  const buttonStyle = primaryColor ? { backgroundColor: primaryColor, borderColor: primaryColor } : void 0;
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-gray-200 bg-white p-6 shadow-sm", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900", children: "Profile Information" }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: "Your account information." }),
+        (error || updateError) && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-red-600", children: error?.message || updateError?.message || "Failed to update profile" }),
+        inputError && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-red-600", children: inputError })
+      ] }),
+      isEditing ? /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleCancel,
+            disabled: isUpdating,
+            className: "inline-flex items-center rounded-md border border-gray-300 bg-white px-3 py-1.5 text-sm font-medium text-gray-700 shadow-sm transition hover:bg-gray-50 disabled:opacity-50",
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleSave,
+            disabled: isUpdating,
+            style: buttonStyle,
+            className: "inline-flex items-center rounded-md bg-indigo-500 px-3 py-1.5 text-sm font-medium text-white shadow-sm transition hover:bg-indigo-600 disabled:opacity-50",
+            children: isUpdating ? "Saving..." : "Save"
+          }
+        )
+      ] }) : /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: handleEdit,
+          style: buttonStyle,
+          className: "inline-flex items-center rounded-md bg-indigo-500 px-3 py-1.5 text-sm font-medium text-white shadow-sm transition hover:bg-indigo-600",
+          children: "Edit"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "mt-6 flex gap-8", children: [
+      isEditing ? /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-600", children: "First Name" }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "text",
+              value: firstName,
+              onChange: (e) => {
+                setInputError(null);
+                setFirstName(e.target.value);
+              },
+              disabled: isUpdating,
+              placeholder: "First Name",
+              className: "portal-input mt-1 block w-48"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-600", children: "Last Name" }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "text",
+              value: lastName,
+              onChange: (e) => {
+                setInputError(null);
+                setLastName(e.target.value);
+              },
+              disabled: isUpdating,
+              placeholder: "Last Name",
+              className: "portal-input mt-1 block w-48"
+            }
+          )
+        ] })
+      ] }) : /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+        /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-600", children: "Full Name (optional)" }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-900", children: user?.firstName || user?.lastName ? `${user.firstName || ""} ${user.lastName || ""}`.trim() : "\u2014" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+        /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-600", children: "Email" }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: isLoading ? "Loading..." : user?.emailAddress || "" })
+      ] })
+    ] })
+  ] });
+};
+var UserSettings = ({
+  user,
+  isUserLoading = false,
+  userError,
+  isUpdating = false,
+  updateError,
+  onUpdateUser,
+  teams = [],
+  currentCustomer,
+  isTeamsLoading = false,
+  onTeamSwitch,
+  notifications = [],
+  isNotificationsLoading = false,
+  onToggleNotification,
+  primaryColor
+}) => {
+  if (userError) {
+    return /* @__PURE__ */ jsx("div", { className: "p-8", children: /* @__PURE__ */ jsxs("div", { className: "text-red-600", children: [
+      "Failed to load user settings. ",
+      userError?.message,
+      " Please try again later."
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "w-full space-y-6", children: [
+    /* @__PURE__ */ jsx("header", { children: /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold text-gray-900", children: "User Settings" }) }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsx(
+        ProfileSection,
+        {
+          user,
+          isLoading: isUserLoading,
+          isUpdating,
+          error: userError,
+          updateError,
+          onSave: onUpdateUser,
+          primaryColor
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        TeamsSection,
+        {
+          teams,
+          currentCustomer,
+          isLoading: isTeamsLoading,
+          onTeamSwitch,
+          primaryColor
+        }
+      ),
+      currentCustomer && /* @__PURE__ */ jsx(
+        EmailNotificationsSection,
+        {
+          teamName: currentCustomer.name,
+          notifications,
+          isLoading: isNotificationsLoading,
+          onToggle: onToggleNotification
+        }
+      )
+    ] })
+  ] });
+};
+UserSettings.displayName = "UserSettings";
+
+export { UserSettings };
+//# sourceMappingURL=user-settings.js.map
+//# sourceMappingURL=user-settings.js.map

package/dist/esm/user-settings.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/user-settings.tsx"],"names":[],"mappings":"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","file":"user-settings.js","sourcesContent":["\"use client\";\n\nimport { useState, useMemo } from \"react\";\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface UserSettingsUser {\n  emailAddress: string;\n  firstName?: string;\n  lastName?: string;\n}\n\nexport interface UserSettingsTeam {\n  id: string;\n  name: string;\n  appId: string;\n  appName: string;\n  appSlug: string;\n}\n\nexport interface UserSettingsCustomer {\n  id: string;\n  name: string;\n}\n\nexport interface UserSettingsNotification {\n  type: string;\n  enabled: boolean;\n}\n\nexport interface UserSettingsProps {\n  // User profile\n  user?: UserSettingsUser;\n  isUserLoading?: boolean;\n  userError?: Error | null;\n  \n  // Profile editing\n  isUpdating?: boolean;\n  updateError?: Error | null;\n  onUpdateUser?: (data: { firstName?: string; lastName?: string }) => Promise<void>;\n  \n  // Teams\n  teams?: UserSettingsTeam[];\n  currentCustomer?: UserSettingsCustomer;\n  isTeamsLoading?: boolean;\n  onTeamSwitch?: (team: UserSettingsTeam) => Promise<void>;\n  \n  // Notifications\n  notifications?: UserSettingsNotification[];\n  isNotificationsLoading?: boolean;\n  onToggleNotification?: (notificationType: string, enabled: boolean) => Promise<void>;\n  \n  // Optional branding\n  primaryColor?: string;\n}\n\n// =============================================================================\n// Notification descriptions\n// =============================================================================\n\nconst NOTIFICATION_DESCRIPTIONS: Record<string, string> = {\n  \"new-version\": \"New version available\",\n};\n\n// =============================================================================\n// Email Notifications Section\n// =============================================================================\n\ninterface EmailNotificationsSectionProps {\n  teamName: string;\n  notifications: UserSettingsNotification[];\n  isLoading: boolean;\n  onToggle?: (type: string, enabled: boolean) => Promise<void>;\n}\n\nconst EmailNotificationsSection = ({\n  teamName,\n  notifications,\n  isLoading,\n  onToggle,\n}: EmailNotificationsSectionProps) => {\n  // Merge API data with all notification types to ensure all options are always shown\n  const allNotificationTypes = Object.keys(NOTIFICATION_DESCRIPTIONS);\n  const mergedNotifications = allNotificationTypes.map((type) => {\n    const existing = notifications.find((n) => n.type === type);\n    return {\n      type,\n      enabled: existing ? existing.enabled : type === \"new-version\", // Default new-version to true\n    };\n  });\n\n  if (isLoading) {\n    return (\n      <div className=\"rounded-2xl border border-gray-200 bg-white p-6 shadow-sm\">\n        <h2 className=\"text-lg font-semibold text-gray-900\">\n          Email Notifications for {teamName}\n        </h2>\n        <p className=\"mt-1 text-sm text-gray-500\">\n          Choose which email notifications you want to receive for this team.\n        </p>\n        <div className=\"mt-6 flex justify-center py-8\">\n          <p className=\"text-sm text-gray-500\">Loading notifications...</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"rounded-2xl border border-gray-200 bg-white p-6 shadow-sm\">\n      <h2 className=\"text-lg font-semibold text-gray-900\">\n        Email Notifications for {teamName}\n      </h2>\n      <p className=\"mt-1 text-sm text-gray-500\">\n        Choose which email notifications you want to receive for this team.\n      </p>\n\n      <div className=\"mt-6 overflow-hidden rounded-lg border border-gray-200\">\n        <div className=\"flex items-center justify-between bg-gray-50 px-4 py-2\">\n          <span className=\"text-xs font-medium uppercase text-gray-600\">\n            Description\n          </span>\n          <span className=\"text-xs font-medium uppercase text-gray-600\">\n            Enabled\n          </span>\n        </div>\n        {mergedNotifications.map((notification) => (\n          <div\n            key={notification.type}\n            className=\"flex items-center justify-between border-t border-gray-200 px-4 py-3\"\n          >\n            <span className=\"text-sm text-gray-900\">\n              {NOTIFICATION_DESCRIPTIONS[notification.type]}\n            </span>\n            <input\n              type=\"checkbox\"\n              checked={notification.enabled}\n              onChange={() => onToggle?.(notification.type, !notification.enabled)}\n              className=\"portal-checkbox\"\n            />\n          </div>\n        ))}\n      </div>\n      <p className=\"mt-3 text-xs text-gray-500\">\n        These notification preferences are specific to the {teamName} team.\n        Switch teams to manage notifications for other teams.\n      </p>\n    </div>\n  );\n};\n\n// =============================================================================\n// Teams Section\n// =============================================================================\n\ninterface TeamsSectionProps {\n  teams: UserSettingsTeam[];\n  currentCustomer?: UserSettingsCustomer;\n  isLoading: boolean;\n  onTeamSwitch?: (team: UserSettingsTeam) => Promise<void>;\n  primaryColor?: string;\n}\n\nconst TeamsSection = ({\n  teams,\n  currentCustomer,\n  isLoading,\n  onTeamSwitch,\n  primaryColor,\n}: TeamsSectionProps) => {\n  // Group teams by app\n  const groupedTeams = useMemo(() => {\n    const groups = new Map<string, { appName: string; teams: UserSettingsTeam[] }>();\n    \n    for (const team of teams) {\n      const existing = groups.get(team.appId);\n      if (existing) {\n        existing.teams.push(team);\n      } else {\n        groups.set(team.appId, {\n          appName: team.appName,\n          teams: [team],\n        });\n      }\n    }\n    \n    return groups;\n  }, [teams]);\n\n  if (isLoading) {\n    return (\n      <div className=\"rounded-2xl border border-gray-200 bg-white p-6 shadow-sm\">\n        <h2 className=\"text-lg font-semibold text-gray-900\">Teams</h2>\n        <p className=\"mt-1 text-sm text-gray-500\">\n          Teams associate your email address with any additional licenses your\n          account has access to.\n        </p>\n        <div className=\"mt-6\">\n          <p className=\"text-sm text-gray-500\">Loading teams...</p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"rounded-2xl border border-gray-200 bg-white p-6 shadow-sm\">\n      <h2 className=\"text-lg font-semibold text-gray-900\">Teams</h2>\n      <p className=\"mt-1 text-sm text-gray-500\">\n        Teams associate your email address with any additional licenses your\n        account has access to.\n      </p>\n\n      <div className=\"mt-6 space-y-6\">\n        {Array.from(groupedTeams.values()).map((appGroup) => (\n          <div key={appGroup.appName} className=\"space-y-3\">\n            <h3 className=\"text-base font-medium text-gray-900\">\n              {appGroup.appName}\n            </h3>\n            <div className=\"space-y-2\">\n              {appGroup.teams.map((team) => {\n                const isCurrentTeam = currentCustomer?.id === team.id;\n                return (\n                  <button\n                    key={team.id}\n                    type=\"button\"\n                    onClick={() => !isCurrentTeam && onTeamSwitch?.(team)}\n                    disabled={isCurrentTeam}\n                    className={`flex w-full items-center justify-between rounded-lg border p-4 text-left transition ${\n                      isCurrentTeam\n                        ? \"cursor-default border-gray-300 bg-gray-50\"\n                        : \"cursor-pointer border-gray-200 hover:border-indigo-500\"\n                    }`}\n                    style={\n                      !isCurrentTeam && primaryColor\n                        ? { \"--hover-border\": primaryColor } as React.CSSProperties\n                        : undefined\n                    }\n                  >\n                    <div className=\"flex items-center gap-3\">\n                      <svg\n                        className=\"h-4 w-4\"\n                        style={{ color: primaryColor || \"#6366f1\" }}\n                        fill=\"none\"\n                        viewBox=\"0 0 24 24\"\n                        stroke=\"currentColor\"\n                        strokeWidth={2}\n                      >\n                        <path\n                          strokeLinecap=\"round\"\n                          strokeLinejoin=\"round\"\n                          d=\"M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z\"\n                        />\n                      </svg>\n                      <div>\n                        <p className=\"text-sm font-medium text-gray-900\">\n                          {team.name}\n                        </p>\n                        {isCurrentTeam && (\n                          <p className=\"text-xs text-gray-500\">Current Team</p>\n                        )}\n                      </div>\n                    </div>\n                    {!isCurrentTeam && (\n                      <svg\n                        className=\"h-4 w-4\"\n                        style={{ color: primaryColor || \"#6366f1\" }}\n                        fill=\"none\"\n                        viewBox=\"0 0 24 24\"\n                        stroke=\"currentColor\"\n                        strokeWidth={2}\n                      >\n                        <path\n                          strokeLinecap=\"round\"\n                          strokeLinejoin=\"round\"\n                          d=\"M9 5l7 7-7 7\"\n                        />\n                      </svg>\n                    )}\n                  </button>\n                );\n              })}\n            </div>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\n// =============================================================================\n// Profile Section\n// =============================================================================\n\ninterface ProfileSectionProps {\n  user?: UserSettingsUser;\n  isLoading: boolean;\n  isUpdating: boolean;\n  error?: Error | null;\n  updateError?: Error | null;\n  onSave?: (data: { firstName?: string; lastName?: string }) => Promise<void>;\n  primaryColor?: string;\n}\n\nconst ProfileSection = ({\n  user,\n  isLoading,\n  isUpdating,\n  error,\n  updateError,\n  onSave,\n  primaryColor,\n}: ProfileSectionProps) => {\n  const [isEditing, setIsEditing] = useState(false);\n  const [firstName, setFirstName] = useState(user?.firstName || \"\");\n  const [lastName, setLastName] = useState(user?.lastName || \"\");\n  const [inputError, setInputError] = useState<string | null>(null);\n\n  // Reset form when user changes\n  const resetForm = () => {\n    setFirstName(user?.firstName || \"\");\n    setLastName(user?.lastName || \"\");\n    setInputError(null);\n  };\n\n  const handleSave = async () => {\n    if (!firstName && !lastName) {\n      setInputError(\"Please enter a first name or last name\");\n      return;\n    }\n\n    if (firstName === user?.firstName && lastName === user?.lastName) {\n      setIsEditing(false);\n      return;\n    }\n\n    try {\n      await onSave?.({ firstName, lastName });\n      setIsEditing(false);\n    } catch (err) {\n      console.error(\"Error updating user information:\", err);\n    }\n  };\n\n  const handleCancel = () => {\n    setIsEditing(false);\n    resetForm();\n  };\n\n  const handleEdit = () => {\n    resetForm();\n    setIsEditing(true);\n  };\n\n  const buttonStyle = primaryColor\n    ? { backgroundColor: primaryColor, borderColor: primaryColor }\n    : undefined;\n\n  return (\n    <div className=\"rounded-2xl border border-gray-200 bg-white p-6 shadow-sm\">\n      <div className=\"flex items-start justify-between gap-4\">\n        <div>\n          <h2 className=\"text-lg font-semibold text-gray-900\">\n            Profile Information\n          </h2>\n          <p className=\"mt-1 text-sm text-gray-500\">Your account information.</p>\n          {(error || updateError) && (\n            <p className=\"mt-2 text-sm text-red-600\">\n              {error?.message || updateError?.message || \"Failed to update profile\"}\n            </p>\n          )}\n          {inputError && (\n            <p className=\"mt-2 text-sm text-red-600\">{inputError}</p>\n          )}\n        </div>\n        {isEditing ? (\n          <div className=\"flex gap-2\">\n            <button\n              type=\"button\"\n              onClick={handleCancel}\n              disabled={isUpdating}\n              className=\"inline-flex items-center rounded-md border border-gray-300 bg-white px-3 py-1.5 text-sm font-medium text-gray-700 shadow-sm transition hover:bg-gray-50 disabled:opacity-50\"\n            >\n              Cancel\n            </button>\n            <button\n              type=\"button\"\n              onClick={handleSave}\n              disabled={isUpdating}\n              style={buttonStyle}\n              className=\"inline-flex items-center rounded-md bg-indigo-500 px-3 py-1.5 text-sm font-medium text-white shadow-sm transition hover:bg-indigo-600 disabled:opacity-50\"\n            >\n              {isUpdating ? \"Saving...\" : \"Save\"}\n            </button>\n          </div>\n        ) : (\n          <button\n            type=\"button\"\n            onClick={handleEdit}\n            style={buttonStyle}\n            className=\"inline-flex items-center rounded-md bg-indigo-500 px-3 py-1.5 text-sm font-medium text-white shadow-sm transition hover:bg-indigo-600\"\n          >\n            Edit\n          </button>\n        )}\n      </div>\n\n      <div className=\"mt-6 flex gap-8\">\n        {isEditing ? (\n          <div className=\"flex gap-4\">\n            <div>\n              <label className=\"block text-sm font-medium text-gray-600\">\n                First Name\n              </label>\n              <input\n                type=\"text\"\n                value={firstName}\n                onChange={(e) => {\n                  setInputError(null);\n                  setFirstName(e.target.value);\n                }}\n                disabled={isUpdating}\n                placeholder=\"First Name\"\n                className=\"portal-input mt-1 block w-48\"\n              />\n            </div>\n            <div>\n              <label className=\"block text-sm font-medium text-gray-600\">\n                Last Name\n              </label>\n              <input\n                type=\"text\"\n                value={lastName}\n                onChange={(e) => {\n                  setInputError(null);\n                  setLastName(e.target.value);\n                }}\n                disabled={isUpdating}\n                placeholder=\"Last Name\"\n                className=\"portal-input mt-1 block w-48\"\n              />\n            </div>\n          </div>\n        ) : (\n          <div className=\"flex-1\">\n            <label className=\"block text-sm font-medium text-gray-600\">\n              Full Name (optional)\n            </label>\n            <p className=\"mt-1 text-sm text-gray-900\">\n              {user?.firstName || user?.lastName\n                ? `${user.firstName || \"\"} ${user.lastName || \"\"}`.trim()\n                : \"—\"}\n            </p>\n          </div>\n        )}\n        <div className=\"flex-1\">\n          <label className=\"block text-sm font-medium text-gray-600\">Email</label>\n          <p className=\"mt-1 text-sm text-gray-500\">\n            {isLoading ? \"Loading...\" : user?.emailAddress || \"\"}\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n\n// =============================================================================\n// Main Component\n// =============================================================================\n\nexport const UserSettings = ({\n  user,\n  isUserLoading = false,\n  userError,\n  isUpdating = false,\n  updateError,\n  onUpdateUser,\n  teams = [],\n  currentCustomer,\n  isTeamsLoading = false,\n  onTeamSwitch,\n  notifications = [],\n  isNotificationsLoading = false,\n  onToggleNotification,\n  primaryColor,\n}: UserSettingsProps) => {\n  if (userError) {\n    return (\n      <div className=\"p-8\">\n        <div className=\"text-red-600\">\n          Failed to load user settings. {userError?.message} Please try again later.\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"w-full space-y-6\">\n      <header>\n        <h1 className=\"text-2xl font-semibold text-gray-900\">User Settings</h1>\n      </header>\n\n      <div className=\"space-y-6\">\n        <ProfileSection\n          user={user}\n          isLoading={isUserLoading}\n          isUpdating={isUpdating}\n          error={userError}\n          updateError={updateError}\n          onSave={onUpdateUser}\n          primaryColor={primaryColor}\n        />\n\n        <TeamsSection\n          teams={teams}\n          currentCustomer={currentCustomer}\n          isLoading={isTeamsLoading}\n          onTeamSwitch={onTeamSwitch}\n          primaryColor={primaryColor}\n        />\n\n        {currentCustomer && (\n          <EmailNotificationsSection\n            teamName={currentCustomer.name}\n            notifications={notifications}\n            isLoading={isNotificationsLoading}\n            onToggle={onToggleNotification}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n\nUserSettings.displayName = \"UserSettings\";\n"]}

package/dist/esm/utils/index.js

@@ -0,0 +1,170 @@
+import { Buffer } from 'buffer';
+import { cache } from 'react';
+
+/**
+ * Enterprise Portal Components
+ * This file is generated by tsup. Do not edit manually.
+ */
+
+// src/utils/api-client.ts
+var UnauthorizedError = class extends Error {
+  constructor(message = "Unauthorized") {
+    super(message);
+    this.name = "UnauthorizedError";
+  }
+};
+function isRedirectError(error) {
+  return typeof error === "object" && error !== null && "digest" in error && typeof error.digest === "string" && error.digest.startsWith("NEXT_REDIRECT");
+}
+async function authenticatedFetch(url, options = {}) {
+  const { token, ...fetchOptions } = options;
+  const headers = new Headers(fetchOptions.headers);
+  if (token) {
+    headers.set("authorization", `Bearer ${token}`);
+  }
+  const response = await fetch(url, {
+    ...fetchOptions,
+    headers
+  });
+  if (response.status === 401) {
+    await handle401();
+  }
+  if (response.status === 502 || response.status === 503 || response.status === 504) {
+    await handleServerError(response.status);
+  }
+  return response;
+}
+async function handle401() {
+  const { redirect } = await import('next/navigation');
+  return redirect("/?expired=1");
+}
+async function handleServerError(statusCode) {
+  const { redirect } = await import('next/navigation');
+  let sourceUrl;
+  try {
+    const { headers } = await import('next/headers');
+    const headersList = await headers();
+    const referer = headersList.get("referer");
+    const host = headersList.get("host");
+    const pathname = headersList.get("x-invoke-path") || headersList.get("x-forwarded-path");
+    if (referer) {
+      sourceUrl = referer;
+    } else if (host && pathname) {
+      const protocol = headersList.get("x-forwarded-proto") || "https";
+      sourceUrl = `${protocol}://${host}${pathname}`;
+    }
+  } catch (error) {
+    console.debug("[portal-components] Could not determine source URL", error);
+  }
+  const params = new URLSearchParams({ code: String(statusCode) });
+  if (sourceUrl) {
+    params.set("source", sourceUrl);
+  }
+  return redirect(`/error?${params.toString()}`);
+}
+var normalizeColor = (color) => {
+  if (!color || typeof color !== "string") {
+    return void 0;
+  }
+  const trimmed = color.trim();
+  if (/^#?[0-9a-fA-F]{3}([0-9a-fA-F]{3})?$/.test(trimmed)) {
+    return trimmed.startsWith("#") ? trimmed : `#${trimmed}`;
+  }
+  return trimmed;
+};
+var decodeBranding = ({ brandingData }) => {
+  if (!brandingData || typeof brandingData !== "string") {
+    return {};
+  }
+  try {
+    const decoded = Buffer.from(brandingData, "base64").toString("utf-8");
+    const parsed = JSON.parse(decoded);
+    const logo = typeof parsed.logo === "string" ? parsed.logo : void 0;
+    const titleRaw = typeof parsed.title === "string" ? parsed.title.trim() : "";
+    const title = titleRaw ? titleRaw : void 0;
+    const customColor1 = normalizeColor(parsed.customColor1);
+    const customColor2 = normalizeColor(parsed.customColor2);
+    return {
+      logo,
+      title,
+      customColor1,
+      customColor2
+    };
+  } catch (error) {
+    console.debug("[portal-components] unable to parse branding JSON", error);
+    return {};
+  }
+};
+var getApiOrigin = () => {
+  return (process.env.REPLICATED_APP_ORIGIN || "https://replicated.app").replace(/\/+$/, "");
+};
+var fetchCustomBrandingImpl = async () => {
+  const appSlug = process.env.PORTAL_APP_SLUG;
+  if (!appSlug) {
+    throw new Error("PORTAL_APP_SLUG is not configured");
+  }
+  const url = `${getApiOrigin()}/v3/custom-branding?app_slug=${encodeURIComponent(
+    appSlug
+  )}`;
+  if (process.env.NODE_ENV !== "production") {
+    console.debug(
+      "[portal-components] fetching custom branding via %s",
+      url
+    );
+  }
+  const response = await fetch(url, {
+    headers: {
+      accept: "application/json"
+    }
+  });
+  if (!response.ok) {
+    throw new Error(
+      `Custom branding request failed (${response.status} ${response.statusText})`
+    );
+  }
+  const payload = await response.json();
+  const brandingData = payload?.branding_data;
+  if (typeof brandingData !== "string") {
+    throw new Error("Custom branding response missing branding_data string");
+  }
+  return {
+    brandingData,
+    documentation: payload?.documentation ?? null
+  };
+};
+cache(fetchCustomBrandingImpl);
+
+// src/utils/session.ts
+async function validateSession(token) {
+  if (!token || typeof token !== "string" || !token.trim()) {
+    return false;
+  }
+  try {
+    const endpoint = `${getApiOrigin()}/v3/license`;
+    const response = await fetch(endpoint, {
+      method: "HEAD",
+      // Use HEAD to avoid downloading response body
+      headers: {
+        authorization: `Bearer ${token}`
+      },
+      // Short timeout for validation
+      signal: AbortSignal.timeout(5e3)
+    });
+    if (response.status === 401) {
+      return false;
+    }
+    return response.ok;
+  } catch (error) {
+    console.warn("[portal-components] session validation error:", error);
+    return true;
+  }
+}
+async function deleteSessionCookie() {
+  const { cookies } = await import('next/headers');
+  const cookieStore = await cookies();
+  cookieStore.delete("portal_session");
+}
+
+export { UnauthorizedError, authenticatedFetch, decodeBranding, deleteSessionCookie, isRedirectError, validateSession };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map