@stackframe/stack 2.5.17 → 2.5.19

package/dist/esm/components-page/stack-handler.js

@@ -1,16 +1,19 @@
 // src/components-page/stack-handler.tsx
+import { getRelativePart } from "@stackframe/stack-shared/dist/utils/urls";
 import { RedirectType, notFound, redirect } from "next/navigation";
-import { EmailVerification } from "./email-verification";
 import { AuthPage } from "..";
 import { MessageCard } from "../components/message-cards/message-card";
-import { SignOut } from "./sign-out";
-import { ForgotPassword } from "./forgot-password";
-import { OAuthCallback } from "./oauth-callback";
 import { AccountSettings } from "./account-settings";
-import { MagicLinkCallback } from "./magic-link-callback";
+import { EmailVerification } from "./email-verification";
 import { ErrorPage } from "./error-page";
+import { ForgotPassword } from "./forgot-password";
+import { MagicLinkCallback } from "./magic-link-callback";
+import { OAuthCallback } from "./oauth-callback";
 import { PasswordReset } from "./password-reset";
-import { getRelativePart } from "@stackframe/stack-shared/dist/utils/urls";
+import { SignOut } from "./sign-out";
+import { TeamInvitation } from "./team-invitation";
+import { TeamSettings } from "./team-settings";
+import { TeamCreation } from "./team-creation";
 import { jsx } from "react/jsx-runtime";
 async function StackHandler({
   app,
@@ -44,9 +47,20 @@ async function StackHandler({
     oauthCallback: "oauth-callback",
     accountSettings: "account-settings",
     magicLinkCallback: "magic-link-callback",
+    teamInvitation: "team-invitation",
+    teamCreation: "team-creation",
     error: "error"
   };
   const path = stack.join("/");
+  if (/team-settings\/[a-zA-Z0-9-]+/.test(path)) {
+    const teamId = path.split("/")[1];
+    const user = await app.getUser();
+    const team = await user?.getTeam(teamId);
+    if (!team) {
+      return notFound();
+    }
+    return /* @__PURE__ */ jsx(TeamSettings, { fullPage, teamId });
+  }
   switch (path) {
     case availablePaths.signIn: {
       redirectIfNotHandler("signIn");
@@ -84,6 +98,18 @@ async function StackHandler({
       redirectIfNotHandler("magicLinkCallback");
       return /* @__PURE__ */ jsx(MagicLinkCallback, { searchParams, fullPage });
     }
+    case availablePaths.teamInvitation: {
+      redirectIfNotHandler("teamInvitation");
+      return /* @__PURE__ */ jsx(TeamInvitation, { searchParams, fullPage });
+    }
+    case availablePaths.teamCreation: {
+      const project = await app.getProject();
+      if (!project.config.clientTeamCreationEnabled) {
+        return notFound();
+      }
+      redirectIfNotHandler("teamCreation");
+      return /* @__PURE__ */ jsx(TeamCreation, { fullPage });
+    }
     case availablePaths.error: {
       return /* @__PURE__ */ jsx(ErrorPage, { searchParams, fullPage });
     }

package/dist/esm/components-page/stack-handler.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components-page/stack-handler.tsx"],"sourcesContent":["import { SignUp } from \"./sign-up\";\nimport { SignIn } from \"./sign-in\";\nimport { RedirectType, notFound, redirect } from 'next/navigation';\nimport { EmailVerification } from \"./email-verification\";\nimport { AuthPage, StackServerApp } from \"..\";\nimport { MessageCard } from \"../components/message-cards/message-card\";\nimport { HandlerUrls } from \"../lib/stack-app\";\nimport { SignOut } from \"./sign-out\";\nimport { ForgotPassword } from \"./forgot-password\";\nimport { OAuthCallback } from \"./oauth-callback\";\nimport { AccountSettings } from \"./account-settings\";\nimport { MagicLinkCallback } from \"./magic-link-callback\";\nimport { ErrorPage } from \"./error-page\";\nimport { PasswordReset } from \"./password-reset\";\nimport { getRelativePart } from \"@stackframe/stack-shared/dist/utils/urls\";\n\nexport default async function StackHandler<HasTokenStore extends boolean>({\n  app,\n  params: { stack } = {},\n  searchParams = {},\n  fullPage = false,\n}: {\n  app: StackServerApp<HasTokenStore>,\n  params?: { stack?: string[] },\n  searchParams?: Record<string, string>,\n  fullPage?: boolean,\n}) {\n  if (!stack) {\n    return (\n      <MessageCard title=\"Invalid Stack Handler Setup\" fullPage={fullPage}>\n        <p>Can't use Stack handler at this location. Make sure that the file is in a folder called [...stack].</p>\n      </MessageCard>\n    );\n  }\n\n  function redirectIfNotHandler(name: keyof HandlerUrls) {\n    const url = app.urls[name];\n    const handlerUrl = app.urls.handler;\n\n    if (url !== handlerUrl && url.startsWith(handlerUrl + \"/\")) {\n      // don't redirect if the url is a handler url\n      return;\n    }\n\n    const urlObj = new URL(url, \"http://example.com\");\n    for (const [key, value] of Object.entries(searchParams)) {\n      urlObj.searchParams.set(key, value);\n    }\n\n    redirect(getRelativePart(urlObj), RedirectType.replace);\n  };\n\n  const availablePaths = {\n    signIn: 'sign-in',\n    signUp: 'sign-up',\n    emailVerification: 'email-verification',\n    passwordReset: 'password-reset',\n    forgotPassword: 'forgot-password',\n    signOut: 'sign-out',\n    oauthCallback: 'oauth-callback',\n    accountSettings: 'account-settings',\n    magicLinkCallback: 'magic-link-callback',\n    error: 'error',\n  };\n\n  const path = stack.join('/');\n  switch (path) {\n    case availablePaths.signIn: {\n      redirectIfNotHandler('signIn');\n      return <AuthPage fullPage={fullPage} type='sign-in' automaticRedirect />;\n    }\n    case availablePaths.signUp: {\n      redirectIfNotHandler('signUp');\n      return <AuthPage fullPage={fullPage} type='sign-up' automaticRedirect />;\n    }\n    case availablePaths.emailVerification: {\n      redirectIfNotHandler('emailVerification');\n      return <EmailVerification searchParams={searchParams} fullPage={fullPage} />;\n    }\n    case availablePaths.passwordReset: {\n      redirectIfNotHandler('passwordReset');\n      return <PasswordReset searchParams={searchParams} fullPage={fullPage} />;\n    }\n    case availablePaths.forgotPassword: {\n      redirectIfNotHandler('forgotPassword');\n      return <ForgotPassword fullPage={fullPage} />;\n    }\n    case availablePaths.signOut: {\n      redirectIfNotHandler('signOut');\n      return <SignOut fullPage={fullPage} />;\n    }\n    case availablePaths.oauthCallback: {\n      redirectIfNotHandler('oauthCallback');\n      return <OAuthCallback fullPage={fullPage} />;\n    }\n    case availablePaths.accountSettings: {\n      redirectIfNotHandler('accountSettings');\n      return <AccountSettings fullPage={fullPage} />;\n    }\n    case availablePaths.magicLinkCallback: {\n      redirectIfNotHandler('magicLinkCallback');\n      return <MagicLinkCallback searchParams={searchParams} fullPage={fullPage} />;\n    }\n    case availablePaths.error: {\n      return <ErrorPage searchParams={searchParams} fullPage={fullPage} />;\n    }\n    default: {\n      for (const [key, value] of Object.entries(availablePaths)) {\n        if (path === value.replaceAll('-', '')) {\n          redirect(`${app.urls.handler}/${value}`, RedirectType.replace);\n        }\n      }\n      return notFound();\n    }\n  }\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components-page/stack-handler.tsx"],"sourcesContent":["import { getRelativePart } from \"@stackframe/stack-shared/dist/utils/urls\";\nimport { RedirectType, notFound, redirect } from 'next/navigation';\nimport { AuthPage, StackServerApp } from \"..\";\nimport { MessageCard } from \"../components/message-cards/message-card\";\nimport { HandlerUrls } from \"../lib/stack-app\";\nimport { AccountSettings } from \"./account-settings\";\nimport { EmailVerification } from \"./email-verification\";\nimport { ErrorPage } from \"./error-page\";\nimport { ForgotPassword } from \"./forgot-password\";\nimport { MagicLinkCallback } from \"./magic-link-callback\";\nimport { OAuthCallback } from \"./oauth-callback\";\nimport { PasswordReset } from \"./password-reset\";\nimport { SignOut } from \"./sign-out\";\nimport { TeamInvitation } from \"./team-invitation\";\nimport { TeamSettings } from \"./team-settings\";\nimport { TeamCreation } from \"./team-creation\";\n\nexport default async function StackHandler<HasTokenStore extends boolean>({\n  app,\n  params: { stack } = {},\n  searchParams = {},\n  fullPage = false,\n}: {\n  app: StackServerApp<HasTokenStore>,\n  params?: { stack?: string[] },\n  searchParams?: Record<string, string>,\n  fullPage?: boolean,\n}) {\n  if (!stack) {\n    return (\n      <MessageCard title=\"Invalid Stack Handler Setup\" fullPage={fullPage}>\n        <p>Can't use Stack handler at this location. Make sure that the file is in a folder called [...stack].</p>\n      </MessageCard>\n    );\n  }\n\n  function redirectIfNotHandler(name: keyof HandlerUrls) {\n    const url = app.urls[name];\n    const handlerUrl = app.urls.handler;\n\n    if (url !== handlerUrl && url.startsWith(handlerUrl + \"/\")) {\n      // don't redirect if the url is a handler url\n      return;\n    }\n\n    const urlObj = new URL(url, \"http://example.com\");\n    for (const [key, value] of Object.entries(searchParams)) {\n      urlObj.searchParams.set(key, value);\n    }\n\n    redirect(getRelativePart(urlObj), RedirectType.replace);\n  };\n\n  const availablePaths = {\n    signIn: 'sign-in',\n    signUp: 'sign-up',\n    emailVerification: 'email-verification',\n    passwordReset: 'password-reset',\n    forgotPassword: 'forgot-password',\n    signOut: 'sign-out',\n    oauthCallback: 'oauth-callback',\n    accountSettings: 'account-settings',\n    magicLinkCallback: 'magic-link-callback',\n    teamInvitation: 'team-invitation',\n    teamCreation: 'team-creation',\n    error: 'error',\n  };\n\n  const path = stack.join('/');\n\n  if (/team-settings\\/[a-zA-Z0-9-]+/.test(path)) {\n    const teamId = path.split('/')[1];\n    const user = await app.getUser();\n    const team = await user?.getTeam(teamId);\n\n    if (!team) {\n      return notFound();\n    }\n\n    return <TeamSettings fullPage={fullPage} teamId={teamId} />;\n  }\n\n\n  switch (path) {\n    case availablePaths.signIn: {\n      redirectIfNotHandler('signIn');\n      return <AuthPage fullPage={fullPage} type='sign-in' automaticRedirect />;\n    }\n    case availablePaths.signUp: {\n      redirectIfNotHandler('signUp');\n      return <AuthPage fullPage={fullPage} type='sign-up' automaticRedirect />;\n    }\n    case availablePaths.emailVerification: {\n      redirectIfNotHandler('emailVerification');\n      return <EmailVerification searchParams={searchParams} fullPage={fullPage} />;\n    }\n    case availablePaths.passwordReset: {\n      redirectIfNotHandler('passwordReset');\n      return <PasswordReset searchParams={searchParams} fullPage={fullPage} />;\n    }\n    case availablePaths.forgotPassword: {\n      redirectIfNotHandler('forgotPassword');\n      return <ForgotPassword fullPage={fullPage} />;\n    }\n    case availablePaths.signOut: {\n      redirectIfNotHandler('signOut');\n      return <SignOut fullPage={fullPage} />;\n    }\n    case availablePaths.oauthCallback: {\n      redirectIfNotHandler('oauthCallback');\n      return <OAuthCallback fullPage={fullPage} />;\n    }\n    case availablePaths.accountSettings: {\n      redirectIfNotHandler('accountSettings');\n      return <AccountSettings fullPage={fullPage} />;\n    }\n    case availablePaths.magicLinkCallback: {\n      redirectIfNotHandler('magicLinkCallback');\n      return <MagicLinkCallback searchParams={searchParams} fullPage={fullPage} />;\n    }\n    case availablePaths.teamInvitation: {\n      redirectIfNotHandler('teamInvitation');\n      return <TeamInvitation searchParams={searchParams} fullPage={fullPage} />;\n    }\n    case availablePaths.teamCreation: {\n      const project = await app.getProject();\n      if (!project.config.clientTeamCreationEnabled) {\n        return notFound();\n      }\n\n      redirectIfNotHandler('teamCreation');\n      return <TeamCreation fullPage={fullPage} />;\n    }\n    case availablePaths.error: {\n      return <ErrorPage searchParams={searchParams} fullPage={fullPage} />;\n    }\n    default: {\n      for (const [key, value] of Object.entries(availablePaths)) {\n        if (path === value.replaceAll('-', '')) {\n          redirect(`${app.urls.handler}/${value}`, RedirectType.replace);\n        }\n      }\n      return notFound();\n    }\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/esm/components-page/team-creation.js

@@ -0,0 +1,68 @@
+"use client";
+"use client";
+
+// src/components-page/team-creation.tsx
+import { yupResolver } from "@hookform/resolvers/yup";
+import { yupObject, yupString } from "@stackframe/stack-shared/dist/schema-fields";
+import { runAsynchronously } from "@stackframe/stack-shared/dist/utils/promises";
+import { Button, Input, Label, Typography } from "@stackframe/stack-ui";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { MessageCard, useStackApp, useUser } from "..";
+import { FormWarningText } from "../components/elements/form-warning";
+import { MaybeFullPage } from "../components/elements/maybe-full-page";
+import { useRouter } from "next/navigation";
+import { jsx, jsxs } from "react/jsx-runtime";
+var schema = yupObject({
+  displayName: yupString().required("Please enter a team name")
+});
+function TeamCreation(props) {
+  const { register, handleSubmit, formState: { errors } } = useForm({
+    resolver: yupResolver(schema)
+  });
+  const app = useStackApp();
+  const project = app.useProject();
+  const user = useUser({ or: "redirect" });
+  const [loading, setLoading] = useState(false);
+  const router = useRouter();
+  if (!project.config.clientTeamCreationEnabled) {
+    return /* @__PURE__ */ jsx(MessageCard, { title: "Team creation is not enabled" });
+  }
+  const onSubmit = async (data) => {
+    setLoading(true);
+    try {
+      const team = await user.createTeam({ displayName: data.displayName });
+      router.push(`${app.urls.handler}/team-settings/${team.id}`);
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsx(MaybeFullPage, { fullPage: props.fullPage, children: /* @__PURE__ */ jsxs("div", { className: "stack-scope flex flex-col items-stretch", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-center mb-6", children: /* @__PURE__ */ jsx(Typography, { type: "h2", children: "Create a Team" }) }),
+    /* @__PURE__ */ jsxs(
+      "form",
+      {
+        className: "flex flex-col items-stretch stack-scope",
+        onSubmit: (e) => runAsynchronously(handleSubmit(onSubmit)(e)),
+        noValidate: true,
+        children: [
+          /* @__PURE__ */ jsx(Label, { htmlFor: "email", className: "mb-1", children: "Display name" }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "email",
+              type: "email",
+              ...register("displayName")
+            }
+          ),
+          /* @__PURE__ */ jsx(FormWarningText, { text: errors.displayName?.message?.toString() }),
+          /* @__PURE__ */ jsx(Button, { type: "submit", className: "mt-6", loading, children: "Create" })
+        ]
+      }
+    )
+  ] }) });
+}
+export {
+  TeamCreation
+};
+//# sourceMappingURL=team-creation.js.map

package/dist/esm/components-page/team-creation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components-page/team-creation.tsx"],"sourcesContent":["'use client';\n\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport { yupObject, yupString } from \"@stackframe/stack-shared/dist/schema-fields\";\nimport { runAsynchronously } from \"@stackframe/stack-shared/dist/utils/promises\";\nimport { Button, Input, Label, Typography } from \"@stackframe/stack-ui\";\nimport { useState } from \"react\";\nimport { useForm } from \"react-hook-form\";\nimport * as yup from \"yup\";\nimport { MessageCard, useStackApp, useUser } from \"..\";\nimport { FormWarningText } from \"../components/elements/form-warning\";\nimport { MaybeFullPage } from \"../components/elements/maybe-full-page\";\nimport { useRouter } from \"next/navigation\";\n\nconst schema = yupObject({\n  displayName: yupString().required('Please enter a team name'),\n});\n\nexport function TeamCreation(props: { fullPage?: boolean }) {\n  const { register, handleSubmit, formState: { errors } } = useForm({\n    resolver: yupResolver(schema)\n  });\n  const app = useStackApp();\n  const project = app.useProject();\n  const user = useUser({ or: 'redirect' });\n  const [loading, setLoading] = useState(false);\n  const router = useRouter();\n\n  if (!project.config.clientTeamCreationEnabled) {\n    return <MessageCard title='Team creation is not enabled' />;\n  }\n\n  const onSubmit = async (data: yup.InferType<typeof schema>) => {\n    setLoading(true);\n\n    try {\n      const team = await user.createTeam({ displayName: data.displayName });\n      router.push(`${app.urls.handler}/team-settings/${team.id}`);\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    <MaybeFullPage fullPage={props.fullPage}>\n      <div className='stack-scope flex flex-col items-stretch'>\n        <div className=\"text-center mb-6\">\n          <Typography type='h2'>\n            Create a Team\n          </Typography>\n        </div>\n        <form\n          className=\"flex flex-col items-stretch stack-scope\"\n          onSubmit={e => runAsynchronously(handleSubmit(onSubmit)(e))}\n          noValidate\n        >\n          <Label htmlFor=\"email\" className=\"mb-1\">Display name</Label>\n          <Input\n            id=\"email\"\n            type=\"email\"\n            {...register('displayName')}\n          />\n          <FormWarningText text={errors.displayName?.message?.toString()} />\n\n          <Button type=\"submit\" className=\"mt-6\" loading={loading}>\n            Create\n          </Button>\n        </form>\n      </div>\n    </MaybeFullPage>\n  );\n}"],"mappings":";;;AAEA,SAAS,mBAAmB;AAC5B,SAAS,WAAW,iBAAiB;AACrC,SAAS,yBAAyB;AAClC,SAAS,QAAQ,OAAO,OAAO,kBAAkB;AACjD,SAAS,gBAAgB;AACzB,SAAS,eAAe;AAExB,SAAS,aAAa,aAAa,eAAe;AAClD,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAiBf,cAsBH,YAtBG;AAfX,IAAM,SAAS,UAAU;AAAA,EACvB,aAAa,UAAU,EAAE,SAAS,0BAA0B;AAC9D,CAAC;AAEM,SAAS,aAAa,OAA+B;AAC1D,QAAM,EAAE,UAAU,cAAc,WAAW,EAAE,OAAO,EAAE,IAAI,QAAQ;AAAA,IAChE,UAAU,YAAY,MAAM;AAAA,EAC9B,CAAC;AACD,QAAM,MAAM,YAAY;AACxB,QAAM,UAAU,IAAI,WAAW;AAC/B,QAAM,OAAO,QAAQ,EAAE,IAAI,WAAW,CAAC;AACvC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,SAAS,UAAU;AAEzB,MAAI,CAAC,QAAQ,OAAO,2BAA2B;AAC7C,WAAO,oBAAC,eAAY,OAAM,gCAA+B;AAAA,EAC3D;AAEA,QAAM,WAAW,OAAO,SAAuC;AAC7D,eAAW,IAAI;AAEf,QAAI;AACF,YAAM,OAAO,MAAM,KAAK,WAAW,EAAE,aAAa,KAAK,YAAY,CAAC;AACpE,aAAO,KAAK,GAAG,IAAI,KAAK,OAAO,kBAAkB,KAAK,EAAE,EAAE;AAAA,IAC5D,UAAE;AACA,iBAAW,KAAK;AAAA,IAClB;AAAA,EACF;AAEA,SACE,oBAAC,iBAAc,UAAU,MAAM,UAC7B,+BAAC,SAAI,WAAU,2CACb;AAAA,wBAAC,SAAI,WAAU,oBACb,8BAAC,cAAW,MAAK,MAAK,2BAEtB,GACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,UAAU,OAAK,kBAAkB,aAAa,QAAQ,EAAE,CAAC,CAAC;AAAA,QAC1D,YAAU;AAAA,QAEV;AAAA,8BAAC,SAAM,SAAQ,SAAQ,WAAU,QAAO,0BAAY;AAAA,UACpD;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,MAAK;AAAA,cACJ,GAAG,SAAS,aAAa;AAAA;AAAA,UAC5B;AAAA,UACA,oBAAC,mBAAgB,MAAM,OAAO,aAAa,SAAS,SAAS,GAAG;AAAA,UAEhE,oBAAC,UAAO,MAAK,UAAS,WAAU,QAAO,SAAkB,oBAEzD;AAAA;AAAA;AAAA,IACF;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/esm/components-page/team-invitation.js

@@ -0,0 +1,107 @@
+"use client";
+"use client";
+
+// src/components-page/team-invitation.tsx
+import { KnownErrors } from "@stackframe/stack-shared";
+import { cacheFunction } from "@stackframe/stack-shared/dist/utils/caches";
+import { runAsynchronouslyWithAlert } from "@stackframe/stack-shared/dist/utils/promises";
+import { Typography } from "@stackframe/stack-ui";
+import React from "react";
+import { MessageCard, useStackApp, useUser } from "..";
+import { PredefinedMessageCard } from "../components/message-cards/predefined-message-card";
+import { jsx, jsxs } from "react/jsx-runtime";
+var cachedVerifyInvitation = cacheFunction(async (stackApp, code) => {
+  return await stackApp.verifyTeamInvitationCode(code);
+});
+var cachedGetInvitationDetails = cacheFunction(async (stackApp, code) => {
+  return await stackApp.getTeamInvitationDetails(code);
+});
+function TeamInvitationInner(props) {
+  const stackApp = useStackApp();
+  const [success, setSuccess] = React.useState(false);
+  const [errorMessage, setErrorMessage] = React.useState(null);
+  const details = React.use(cachedGetInvitationDetails(stackApp, props.searchParams.code || ""));
+  if (errorMessage || details.status === "error") {
+    return /* @__PURE__ */ jsx(PredefinedMessageCard, { type: "unknownError", fullPage: props.fullPage });
+  }
+  if (success) {
+    return /* @__PURE__ */ jsx(
+      MessageCard,
+      {
+        title: "Team invitation",
+        fullPage: props.fullPage,
+        primaryButtonText: "Go to home",
+        primaryAction: () => stackApp.redirectToHome(),
+        children: /* @__PURE__ */ jsxs(Typography, { children: [
+          "You have successfully joined ",
+          details.data.teamDisplayName
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    MessageCard,
+    {
+      title: "Team invitation",
+      fullPage: props.fullPage,
+      primaryButtonText: "Join",
+      primaryAction: () => runAsynchronouslyWithAlert(async () => {
+        const result = await stackApp.acceptTeamInvitation(props.searchParams.code || "");
+        if (result.status === "error") {
+          setErrorMessage(result.error.message);
+        } else {
+          setSuccess(true);
+        }
+      }),
+      secondaryButtonText: "Ignore",
+      secondaryAction: () => stackApp.redirectToHome(),
+      children: /* @__PURE__ */ jsxs(Typography, { children: [
+        "You are invited to join ",
+        details.data.teamDisplayName
+      ] })
+    }
+  );
+}
+function TeamInvitation({ fullPage = false, searchParams }) {
+  const user = useUser();
+  const stackApp = useStackApp();
+  const invalidJsx = /* @__PURE__ */ jsx(MessageCard, { title: "Invalid Team Invitation Link", fullPage, children: /* @__PURE__ */ jsx(Typography, { children: "Please double check if you have the correct team invitation link." }) });
+  const expiredJsx = /* @__PURE__ */ jsx(MessageCard, { title: "Expired Team Invitation Link", fullPage, children: /* @__PURE__ */ jsx(Typography, { children: "Your team invitation link has expired. Please request a new team invitation link " }) });
+  const usedJsx = /* @__PURE__ */ jsx(MessageCard, { title: "Used Team Invitation Link", fullPage, children: /* @__PURE__ */ jsx(Typography, { children: "This team invitation link has already been used." }) });
+  const code = searchParams.code;
+  if (!code) {
+    return invalidJsx;
+  }
+  if (!user) {
+    return /* @__PURE__ */ jsx(
+      MessageCard,
+      {
+        title: "Team invitation",
+        fullPage,
+        primaryButtonText: "Go to sign in",
+        primaryAction: () => stackApp.redirectToSignIn(),
+        secondaryButtonText: "Cancel",
+        secondaryAction: () => stackApp.redirectToHome(),
+        children: /* @__PURE__ */ jsx(Typography, { children: "Sign in or create an account to join the team." })
+      }
+    );
+  }
+  const verificationResult = React.use(cachedVerifyInvitation(stackApp, searchParams.code || ""));
+  if (verificationResult.status === "error") {
+    const error = verificationResult.error;
+    if (error instanceof KnownErrors.VerificationCodeNotFound) {
+      return invalidJsx;
+    } else if (error instanceof KnownErrors.VerificationCodeExpired) {
+      return expiredJsx;
+    } else if (error instanceof KnownErrors.VerificationCodeAlreadyUsed) {
+      return usedJsx;
+    } else {
+      throw error;
+    }
+  }
+  return /* @__PURE__ */ jsx(TeamInvitationInner, { fullPage, searchParams });
+}
+export {
+  TeamInvitation
+};
+//# sourceMappingURL=team-invitation.js.map

package/dist/esm/components-page/team-invitation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components-page/team-invitation.tsx"],"sourcesContent":["'use client';\n\nimport { KnownErrors } from \"@stackframe/stack-shared\";\nimport { cacheFunction } from \"@stackframe/stack-shared/dist/utils/caches\";\nimport { runAsynchronouslyWithAlert } from \"@stackframe/stack-shared/dist/utils/promises\";\nimport { Typography } from \"@stackframe/stack-ui\";\nimport React from \"react\";\nimport { MessageCard, StackClientApp, useStackApp, useUser } from \"..\";\nimport { PredefinedMessageCard } from \"../components/message-cards/predefined-message-card\";\n\nconst cachedVerifyInvitation = cacheFunction(async (stackApp: StackClientApp<true>, code: string) => {\n  return await stackApp.verifyTeamInvitationCode(code);\n});\n\nconst cachedGetInvitationDetails = cacheFunction(async (stackApp: StackClientApp<true>, code: string) => {\n  return await stackApp.getTeamInvitationDetails(code);\n});\n\nfunction TeamInvitationInner(props: { fullPage?: boolean, searchParams: Record<string, string> }) {\n  const stackApp = useStackApp();\n  const [success, setSuccess] = React.useState(false);\n  const [errorMessage, setErrorMessage] = React.useState<string | null>(null);\n  const details = React.use(cachedGetInvitationDetails(stackApp, props.searchParams.code || ''));\n\n  if (errorMessage || details.status === 'error') {\n    return (\n      <PredefinedMessageCard type=\"unknownError\" fullPage={props.fullPage} />\n    );\n  }\n\n  if (success) {\n    return (\n      <MessageCard\n        title=\"Team invitation\"\n        fullPage={props.fullPage}\n        primaryButtonText=\"Go to home\"\n        primaryAction={() => stackApp.redirectToHome()}\n      >\n        <Typography>You have successfully joined {details.data.teamDisplayName}</Typography>\n      </MessageCard>\n    );\n  }\n\n\n  return (\n    <MessageCard\n      title=\"Team invitation\"\n      fullPage={props.fullPage}\n      primaryButtonText=\"Join\"\n      primaryAction={() => runAsynchronouslyWithAlert(async () => {\n        const result = await stackApp.acceptTeamInvitation(props.searchParams.code || '');\n        if (result.status === 'error') {\n        setErrorMessage(result.error.message);\n        } else {\n        setSuccess(true);\n        }\n      })}\n      secondaryButtonText=\"Ignore\"\n      secondaryAction={() => stackApp.redirectToHome()}\n    >\n      <Typography>You are invited to join {details.data.teamDisplayName}</Typography>\n    </MessageCard>\n  );\n}\n\nexport function TeamInvitation({ fullPage=false, searchParams }: { fullPage?: boolean, searchParams: Record<string, string> }) {\n  const user = useUser();\n  const stackApp = useStackApp();\n\n  const invalidJsx = (\n    <MessageCard title=\"Invalid Team Invitation Link\" fullPage={fullPage}>\n      <Typography>Please double check if you have the correct team invitation link.</Typography>\n    </MessageCard>\n  );\n\n  const expiredJsx = (\n    <MessageCard title=\"Expired Team Invitation Link\" fullPage={fullPage}>\n      <Typography>Your team invitation link has expired. Please request a new team invitation link </Typography>\n    </MessageCard>\n  );\n\n  const usedJsx = (\n    <MessageCard title=\"Used Team Invitation Link\" fullPage={fullPage}>\n      <Typography>This team invitation link has already been used.</Typography>\n    </MessageCard>\n  );\n\n  const code = searchParams.code;\n  if (!code) {\n    return invalidJsx;\n  }\n\n  if (!user) {\n    return (\n      <MessageCard\n        title=\"Team invitation\"\n        fullPage={fullPage}\n        primaryButtonText=\"Go to sign in\"\n        primaryAction={() => stackApp.redirectToSignIn()}\n        secondaryButtonText=\"Cancel\"\n        secondaryAction={() => stackApp.redirectToHome()}\n      >\n        <Typography>Sign in or create an account to join the team.</Typography>\n      </MessageCard>\n    );\n  }\n\n  const verificationResult = React.use(cachedVerifyInvitation(stackApp, searchParams.code || ''));\n\n  if (verificationResult.status === 'error') {\n    const error = verificationResult.error;\n    if (error instanceof KnownErrors.VerificationCodeNotFound) {\n      return invalidJsx;\n    } else if (error instanceof KnownErrors.VerificationCodeExpired) {\n      return expiredJsx;\n    } else if (error instanceof KnownErrors.VerificationCodeAlreadyUsed) {\n      return usedJsx;\n    } else {\n      throw error;\n    }\n  }\n\n  return <TeamInvitationInner fullPage={fullPage} searchParams={searchParams} />;\n};\n"],"mappings":"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","names":[]}

package/dist/esm/components-page/team-settings.js

@@ -0,0 +1,115 @@
+"use client";
+"use client";
+
+// src/components-page/team-settings.tsx
+import { ActionDialog, Button, Container, EditableText, Input, Label, SimpleTooltip, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Typography } from "@stackframe/stack-ui";
+import { Contact, Info, Users } from "lucide-react";
+import { useEffect, useState } from "react";
+import { MessageCard, useStackApp, useUser } from "..";
+import { SidebarLayout } from "../components/elements/sidebar-layout";
+import { UserAvatar } from "../components/elements/user-avatar";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function TeamSettings(props) {
+  const user = useUser({ or: "redirect" });
+  const team = user.useTeam(props.teamId);
+  if (!team) {
+    return /* @__PURE__ */ jsx(MessageCard, { title: "Team not found" });
+  }
+  const inner = /* @__PURE__ */ jsx(
+    SidebarLayout,
+    {
+      items: [
+        { title: "My Profile", content: profileSettings({ team }), icon: Contact, description: `Your profile in the team "${team.displayName}"` },
+        { title: "Members", content: membersSettings({ team }), icon: Users },
+        { title: "Team Info", content: managementSettings({ team }), icon: Info }
+        // { title: 'Settings', content: userSettings({ team }), icon: Settings },
+      ].filter(({ content }) => content),
+      title: "Team Settings"
+    }
+  );
+  if (props.fullPage) {
+    return /* @__PURE__ */ jsx(Container, { size: 800, className: "stack-scope", children: inner });
+  } else {
+    return inner;
+  }
+}
+function managementSettings(props) {
+  const user = useUser({ or: "redirect" });
+  const updateTeamPermission = user.usePermission(props.team, "$update_team");
+  if (!updateTeamPermission) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(Label, { children: "Team display name" }),
+    /* @__PURE__ */ jsx(EditableText, { value: props.team.displayName, onSave: () => {
+    } })
+  ] }) });
+}
+function profileSettings(props) {
+  const user = useUser({ or: "redirect" });
+  const profile = user.useTeamProfile(props.team);
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxs(Label, { className: "flex gap-2", children: [
+      "Display name ",
+      /* @__PURE__ */ jsx(SimpleTooltip, { tooltip: "This overwrites your user display name in the account setting", type: "info" })
+    ] }),
+    /* @__PURE__ */ jsx(
+      EditableText,
+      {
+        value: profile.displayName || "",
+        onSave: async (newDisplayName) => {
+          await profile.update({ displayName: newDisplayName });
+        }
+      }
+    )
+  ] }) });
+}
+function membersSettings(props) {
+  const [removeModalOpen, setRemoveModalOpen] = useState(false);
+  const user = useUser({ or: "redirect" });
+  const removeMemberPermission = user.usePermission(props.team, "$remove_members");
+  const readMemberPermission = user.usePermission(props.team, "$read_members");
+  const inviteMemberPermission = user.usePermission(props.team, "$invite_members");
+  const [email, setEmail] = useState("");
+  const [invited, setInvited] = useState(false);
+  if (!readMemberPermission && !inviteMemberPermission) {
+    return null;
+  }
+  const users = props.team.useUsers();
+  useEffect(() => {
+    if (invited && email) {
+      setInvited(false);
+    }
+  }, [email]);
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-8", children: [
+    inviteMemberPermission && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(Label, { children: "Invite a user to team" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 md:flex-row", children: [
+        /* @__PURE__ */ jsx(Input, { placeholder: "Email", value: email, onChange: (e) => setEmail(e.target.value) }),
+        /* @__PURE__ */ jsx(Button, { onClick: async () => {
+          await props.team.inviteUser({ email });
+          setEmail("");
+          setInvited(true);
+        }, children: "Invite" })
+      ] }),
+      invited && /* @__PURE__ */ jsx(Typography, { type: "label", variant: "secondary", children: "User invited." })
+    ] }),
+    readMemberPermission && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(Label, { children: "Members" }),
+      /* @__PURE__ */ jsxs(Table, { children: [
+        /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
+          /* @__PURE__ */ jsx(TableHead, { className: "w-[100px]", children: "User" }),
+          /* @__PURE__ */ jsx(TableHead, { className: "w-[200px]", children: "Name" })
+        ] }) }),
+        /* @__PURE__ */ jsx(TableBody, { children: users.map(({ id, teamProfile }, i) => /* @__PURE__ */ jsxs(TableRow, { children: [
+          /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(UserAvatar, { user: teamProfile }) }),
+          /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Typography, { children: teamProfile.displayName }) })
+        ] }, id)) })
+      ] })
+    ] })
+  ] }) });
+}
+export {
+  TeamSettings
+};
+//# sourceMappingURL=team-settings.js.map

package/dist/esm/components-page/team-settings.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components-page/team-settings.tsx"],"sourcesContent":["'use client';\n\nimport { ActionCell, ActionDialog, Button, Container, EditableText, Input, Label, SimpleTooltip, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Typography } from \"@stackframe/stack-ui\";\nimport { Contact, Info, Settings, Users } from \"lucide-react\";\nimport { useEffect, useState } from \"react\";\nimport { MessageCard, Team, useStackApp, useUser } from \"..\";\nimport { SidebarLayout } from \"../components/elements/sidebar-layout\";\nimport { UserAvatar } from \"../components/elements/user-avatar\";\n\nexport function TeamSettings(props: { fullPage?: boolean, teamId: string }) {\n  const user = useUser({ or: 'redirect' });\n  const team = user.useTeam(props.teamId);\n\n  if (!team) {\n    return <MessageCard title='Team not found' />;\n  }\n\n\n  const inner = <SidebarLayout\n    items={[\n      { title: 'My Profile', content: profileSettings({ team }), icon: Contact, description: `Your profile in the team \"${team.displayName}\"` },\n      { title: 'Members', content: membersSettings({ team }), icon: Users },\n      { title: 'Team Info', content: managementSettings({ team }), icon: Info },\n      // { title: 'Settings', content: userSettings({ team }), icon: Settings },\n    ].filter(({ content }) => content as any)}\n    title='Team Settings'\n  />;\n\n  if (props.fullPage) {\n    return (\n      <Container size={800} className='stack-scope'>\n        {inner}\n      </Container>\n    );\n  } else {\n    return inner;\n  }\n}\n\nfunction managementSettings(props: { team: Team }) {\n  const user = useUser({ or: 'redirect' });\n  const updateTeamPermission = user.usePermission(props.team, '$update_team');\n\n  if (!updateTeamPermission) {\n    return null;\n  }\n\n  return (\n    <>\n      <div>\n        <Label>Team display name</Label>\n        <EditableText value={props.team.displayName} onSave={() => {}}/>\n      </div>\n    </>\n  );\n}\n\nfunction profileSettings(props: { team: Team }) {\n  const user = useUser({ or: 'redirect' });\n  const profile = user.useTeamProfile(props.team);\n\n  return (\n    <div className=\"flex flex-col\">\n      <div className=\"flex flex-col\">\n        <Label className=\"flex gap-2\">Display name <SimpleTooltip tooltip=\"This overwrites your user display name in the account setting\" type='info'/></Label>\n        <EditableText\n          value={profile.displayName || ''}\n          onSave={async (newDisplayName) => {\n            await profile.update({ displayName: newDisplayName });\n          }}/>\n      </div>\n    </div>\n  );\n}\n\nfunction userSettings(props: { team: Team }) {\n  const app = useStackApp();\n  const user = useUser({ or: 'redirect' });\n\n  return (\n    <div>\n      <div>\n        <Button\n          variant='secondary'\n          onClick={async () => {\n            await user.leaveTeam(props.team);\n            await app.redirectToHome();\n          }}\n        >\n          Leave team\n        </Button>\n      </div>\n    </div>\n  );\n}\n\nfunction RemoveMemberDialog(props: {\n  open?: boolean,\n  onOpenChange?: (open: boolean) => void,\n}) {\n  return (\n    <ActionDialog\n      open={props.open}\n      onOpenChange={props.onOpenChange}\n      title=\"Delete domain\"\n      danger\n      okButton={{\n        label: \"Delete\",\n        onClick: async () => {\n        }\n      }}\n      cancelButton\n    >\n      <Typography>\n        Do you really want to remove from the team?\n      </Typography>\n    </ActionDialog>\n  );\n}\n\nfunction membersSettings(props: { team: Team }) {\n  const [removeModalOpen, setRemoveModalOpen] = useState(false);\n  const user = useUser({ or: 'redirect' });\n  const removeMemberPermission = user.usePermission(props.team, '$remove_members');\n  const readMemberPermission = user.usePermission(props.team, '$read_members');\n  const inviteMemberPermission = user.usePermission(props.team, '$invite_members');\n  const [email, setEmail] = useState('');\n  const [invited, setInvited] = useState(false);\n\n  if (!readMemberPermission && !inviteMemberPermission) {\n    return null;\n  }\n\n  const users = props.team.useUsers();\n\n  useEffect(() => {\n    if (invited && email) {\n      setInvited(false);\n    }\n  }, [email]);\n\n  return (\n    <>\n      <div className=\"flex flex-col gap-8\">\n        {inviteMemberPermission &&\n          <div>\n            <Label>Invite a user to team</Label>\n            <div className=\"flex flex-col gap-2 md:flex-row\">\n              <Input placeholder=\"Email\" value={email} onChange={e => setEmail(e.target.value)}/>\n              <Button onClick={async () => {\n                await props.team.inviteUser({ email });\n                setEmail('');\n                setInvited(true);\n              }}>Invite</Button>\n            </div>\n            {invited && <Typography type='label' variant='secondary'>User invited.</Typography>}\n          </div>}\n        {readMemberPermission &&\n        <div>\n          <Label>Members</Label>\n          <Table>\n            <TableHeader>\n              <TableRow>\n                <TableHead className=\"w-[100px]\">User</TableHead>\n                <TableHead className=\"w-[200px]\">Name</TableHead>\n                {/* {removeMemberPermission && <TableHead className=\"w-[100px]\">Actions</TableHead>} */}\n              </TableRow>\n            </TableHeader>\n            <TableBody>\n              {users.map(({ id, teamProfile }, i) => (\n                <TableRow key={id}>\n                  <TableCell>\n                    <UserAvatar user={teamProfile}/>\n                  </TableCell>\n                  <TableCell>\n                    <Typography>{teamProfile.displayName}</Typography>\n                  </TableCell>\n                  {/* {removeMemberPermission && <TableCell>\n                    <ActionCell items={[\n                      { item: 'Remove', onClick: () => setRemoveModalOpen(true), danger: true },\n                    ]}/>\n                    <RemoveMemberDialog open={removeModalOpen} onOpenChange={setRemoveModalOpen} />\n                  </TableCell>} */}\n                </TableRow>\n              ))}\n            </TableBody>\n          </Table>\n        </div>}\n      </div>\n    </>\n  );\n}"],"mappings":"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","names":[]}