@snokam/auth 3.3.9 → 3.3.11

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.3.11](https://github.com/snokam/components/compare/@snokam/auth@3.3.10...@snokam/auth@3.3.11) (2026-10-05)
+
+### Bug Fixes
+
+- no employee auto-provisioning at login + explain how to get access ([#2675](https://github.com/snokam/components/issues/2675)) ([b30d34a](https://github.com/snokam/components/commit/b30d34abce4bcfabe6326a7dc5876312e603efdc))
+
+## [3.3.10](https://github.com/snokam/components/compare/@snokam/auth@3.3.9...@snokam/auth@3.3.10) (2026-10-05)
+
+**Note:** Version bump only for package @snokam/auth
+
 ## [3.3.9](https://github.com/snokam/components/compare/@snokam/auth@3.3.8...@snokam/auth@3.3.9) (2026-10-05)
 
 ### Bug Fixes

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@snokam/auth",
   "description": "Snøkam auth components",
-  "version": "3.3.9",
+  "version": "3.3.11",
   "main": "src/index.ts",
   "types": "src/index.ts",
   "files": [
@@ -26,10 +26,11 @@
     "next-auth": "4.24.15",
     "path-to-regexp": "^8.4.2",
     "@snokam/identity": "1.1.0",
-    "@snokam/platform-client": "3.5.0",
     "@snokam/react-query": "1.1.0",
-    "@snokam/ui": "4.0.0",
-    "@snokam/tenant": "2.1.11"
+    "@snokam/platform-client": "3.5.1",
+    "@snokam/tenant": "2.1.12",
+    "@snokam/sanity-page-content": "4.4.1",
+    "@snokam/ui": "4.0.0"
   },
   "peerDependencies": {
     "next": "16.3.3",

package/src/app-router/index.tsx

@@ -12,6 +12,7 @@ export { Unauthenticated } from "../components/Unauthenticated";
 export { Authenticated } from "../components/Authenticated";
 export { useAuth } from "../hooks";
 export { useSession } from "../session/useSession";
+export { retryUnlessMissing } from "../employee-query/retry";
 export { EmployeeThemeSync } from "../theme/employee-theme-sync";
 export { ScopesProvider, useScopes, useHasScope } from "../scopes";
 export {

package/src/components/EmployeeGate/index.tsx

@@ -8,6 +8,7 @@ import { NotProvisioned } from "../NotProvisioned";
 import { InactiveEmployee } from "../InactiveEmployee";
 
 interface Props {
+  appKey: string;
   employee: unknown;
   isLoading: boolean;
   allowAnonymous?: boolean;
@@ -15,6 +16,7 @@ interface Props {
 }
 
 export const EmployeeGate = ({
+  appKey,
   employee,
   isLoading,
   allowAnonymous = false,
@@ -42,7 +44,7 @@ export const EmployeeGate = ({
   }
 
   if (isAuthenticated && !employee) {
-    return <NotProvisioned />;
+    return <NotProvisioned appKey={appKey} />;
   }
 
   if (isAuthenticated && (employee as { active?: boolean }).active === false) {

package/src/components/NotProvisioned/AccessHelp.tsx

@@ -0,0 +1,51 @@
+"use client";
+
+import { usePageContent } from "@snokam/sanity-page-content";
+import { PersonOffOutlined } from "@snokam/ui/icons";
+import { SystemPage, SystemPageAction } from "@snokam/ui/system-page";
+import { useAuth } from "../../hooks";
+import Styled from "./styles";
+
+const SIGN_IN_AGAIN_URL = "/auth/login?callbackUrl=/&prompt=select_account";
+
+export const AccessHelp = () => {
+  const { getText } = usePageContent();
+  const { session, signOut } = useAuth();
+  const email = session?.user?.email ?? "";
+
+  return (
+    <SystemPage>
+      <Styled.Content>
+        <Styled.IconBadge>
+          <PersonOffOutlined />
+        </Styled.IconBadge>
+        <Styled.Title>{getText("accessGateTitle")}</Styled.Title>
+        <Styled.SignedInAs>
+          {getText("accessGateSignedInAs", { email })}
+        </Styled.SignedInAs>
+        <Styled.Message>{getText("accessGateMessage")}</Styled.Message>
+
+        <Styled.Steps>
+          <Styled.StepsTitle>
+            {getText("accessGateStepsTitle")}
+          </Styled.StepsTitle>
+          <Styled.StepList>
+            <li>{getText("accessGateStepAskAdmin")}</li>
+            <li>{getText("accessGateStepEmail", { email })}</li>
+            <li>{getText("accessGateStepSignInAgain")}</li>
+          </Styled.StepList>
+        </Styled.Steps>
+
+        <Styled.Hint>{getText("accessGateWrongAccount")}</Styled.Hint>
+        <SystemPageAction.PrimaryButton
+          type="button"
+          onClick={() => signOut({ callbackUrl: SIGN_IN_AGAIN_URL })}
+        >
+          {getText("accessGateSignOut")}
+        </SystemPageAction.PrimaryButton>
+      </Styled.Content>
+    </SystemPage>
+  );
+};
+
+export default AccessHelp;

package/src/components/NotProvisioned/index.tsx

@@ -1,19 +1,40 @@
 "use client";
 
-import { Error } from "../Error";
+import { useQuery } from "@snokam/react-query";
+import { PageLoader } from "@snokam/ui";
+import { loadAppContent } from "@snokam/sanity-page-content/app-router/actions";
+import {
+  AppContentProvider,
+  PageContentProvider,
+} from "@snokam/sanity-page-content/app-router/providers";
+import { AccessHelp } from "./AccessHelp";
 
-export const NotProvisioned = () => (
-  <Error
-    heading="Mangler tilgang"
-    message={
-      <>
-        Du er logget inn, men brukeren din er ikke registrert som ansatt her
-        ennå.
-        <br />
-        Ta kontakt med administratoren din dersom dette ikke stemmer.
-      </>
-    }
-  />
-);
+const ACCESS_GATE_PAGE_KEY = "access-gate";
+
+interface Props {
+  appKey: string;
+}
+
+export const NotProvisioned = ({ appKey }: Props) => {
+  const { data, isPending } = useQuery({
+    queryKey: ["access-gate-content", appKey],
+    queryFn: () => loadAppContent(appKey),
+  });
+
+  if (isPending) {
+    return <PageLoader />;
+  }
+
+  return (
+    <AppContentProvider appKey={appKey} initialContent={data ?? null}>
+      <PageContentProvider
+        pageKey={ACCESS_GATE_PAGE_KEY}
+        initialPageContent={null}
+      >
+        <AccessHelp />
+      </PageContentProvider>
+    </AppContentProvider>
+  );
+};
 
 export default NotProvisioned;

package/src/components/NotProvisioned/styles.tsx

@@ -0,0 +1,97 @@
+import styled from "@emotion/styled";
+
+const Content = styled.div`
+  width: 100%;
+  max-width: 36rem;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  color: var(--color-light-blue);
+`;
+
+const IconBadge = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 5rem;
+  height: 5rem;
+  margin-bottom: 1.5rem;
+  border-radius: 50%;
+  border: 1px solid rgba(225, 248, 255, 0.25);
+  background: rgba(225, 248, 255, 0.06);
+  color: var(--color-blue);
+
+  svg {
+    width: 2.25rem;
+    height: 2.25rem;
+  }
+`;
+
+const Title = styled.h1`
+  margin: 0;
+  font-family: Cocogoose-Light;
+  font-size: clamp(1.75rem, 5vw, 2.5rem);
+  color: inherit;
+`;
+
+const SignedInAs = styled.p`
+  max-width: 100%;
+  margin: 1rem 0 0;
+  padding: 0.3rem 0.9rem;
+  border-radius: 999px;
+  background: rgba(225, 248, 255, 0.08);
+  font-size: 0.9rem;
+  overflow-wrap: anywhere;
+`;
+
+const Message = styled.p`
+  margin: 1.25rem 0 0;
+  font-size: 1.05rem;
+  line-height: 1.6;
+  color: rgba(225, 248, 255, 0.8);
+`;
+
+const Steps = styled.section`
+  width: 100%;
+  margin-top: 2rem;
+  padding: 1.25rem 1.5rem;
+  border-radius: 1rem;
+  border: 1px solid rgba(225, 248, 255, 0.18);
+  background: rgba(225, 248, 255, 0.05);
+  text-align: left;
+`;
+
+const StepsTitle = styled.h2`
+  margin: 0 0 0.75rem;
+  font-size: 1rem;
+  font-weight: 600;
+  color: var(--color-blue);
+`;
+
+const StepList = styled.ol`
+  margin: 0;
+  padding-left: 1.25rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.6rem;
+  line-height: 1.5;
+`;
+
+const Hint = styled.p`
+  margin: 1.5rem 0 1rem;
+  font-size: 0.9rem;
+  color: rgba(225, 248, 255, 0.65);
+`;
+
+export default {
+  Content,
+  IconBadge,
+  Title,
+  SignedInAs,
+  Message,
+  Steps,
+  StepsTitle,
+  StepList,
+  Hint,
+};

package/src/employee-query/retry.ts

@@ -0,0 +1,9 @@
+const MAX_RETRIES = 3;
+
+function responseStatus(error: unknown): number | undefined {
+  return (error as { response?: { status?: number } } | null)?.response?.status;
+}
+
+export function retryUnlessMissing(failureCount: number, error: unknown) {
+  return responseStatus(error) !== 404 && failureCount < MAX_RETRIES;
+}

package/src/index.ts

@@ -3,6 +3,7 @@ export * from "./scopes";
 
 export { useAuth, clearAuthTokenCache } from "./hooks";
 export { useSession } from "./session/useSession";
+export { retryUnlessMissing } from "./employee-query/retry";
 
 export { buildAdminConsentUrl } from "./consent";
 export type { AdminConsentParams } from "./consent";

package/src/theme/employee-theme-sync.tsx

@@ -7,6 +7,7 @@ import { useClientQuery } from "@snokam/react-query";
 import { useAdminTheme } from "@snokam/ui/theme/admin";
 import type { ColorSchemeMode } from "@snokam/ui/theme/admin";
 import { useAuth } from "../hooks";
+import { retryUnlessMissing } from "../employee-query/retry";
 
 const MODES: ColorSchemeMode[] = ["system", "light", "dark"];
 
@@ -41,7 +42,13 @@ export function EmployeeThemeSync() {
   const { data } = useClientQuery({
     name: "Employees",
     client,
-  }).useGetMeProtectedQuery({}, { enabled: isAuthenticated && !!basePath });
+  }).useGetMeProtectedQuery(
+    {},
+    {
+      enabled: isAuthenticated && !!basePath,
+      retry: retryUnlessMissing,
+    }
+  );
 
   const saved = data?.settings?.colorScheme;