@contember/react-client 1.1.0 → 1.2.0-alpha.1

package/src/ContemberClient.tsx

@@ -1,5 +1,5 @@
-import { memo, useCallback, useEffect, useState } from 'react'
-import { SessionTokenContext, SetSessionTokenContext } from './auth'
+import { memo, useCallback, useMemo, useState } from 'react'
+import { SessionTokenContext, SessionTokenContextValue, SetSessionTokenContext } from './auth'
 import { ApiBaseUrlContext, LoginTokenContext } from './config'
 import { ProjectSlugContext, StageSlugContext } from './project'
 
@@ -13,6 +13,9 @@ export interface ContemberClientProps {
 
 const sessionTokenKey = 'contember_session_token'
 
+/**
+ * @group Entrypoints
+ */
 export const ContemberClient = memo<ContemberClientProps & { children: React.ReactNode }>(function ContemberClient({
 	apiBaseUrl,
 	children,
@@ -21,22 +24,19 @@ export const ContemberClient = memo<ContemberClientProps & { children: React.Rea
 	sessionToken,
 	stage,
 }) {
-	const [sessionTokenInner, setSessionTokenInner] = useState(() => localStorage.getItem(sessionTokenKey) ?? sessionToken  ?? undefined)
+	const [localStorageSessionToken, setLocalStorageSessionToken] = useLocalStorageSessionToken()
 
-	const setSessionToken = useCallback((token: string | undefined) => {
-		if (token !== undefined) {
-			localStorage.setItem(sessionTokenKey, token)
-		} else {
-			localStorage.removeItem(sessionTokenKey)
-		}
-		setSessionTokenInner(token)
-	}, [])
+	const sessionTokenContextValue = useMemo((): SessionTokenContextValue => ({
+		propsToken: sessionToken,
+		token: localStorageSessionToken ?? sessionToken,
+		source: localStorageSessionToken ? 'localstorage' : (sessionToken ? 'props' : undefined),
+	}), [localStorageSessionToken, sessionToken])
 
 	return (
 		<ApiBaseUrlContext.Provider value={apiBaseUrl}>
 			<LoginTokenContext.Provider value={loginToken}>
-				<SetSessionTokenContext.Provider value={setSessionToken}>
-					<SessionTokenContext.Provider value={sessionTokenInner}>
+				<SetSessionTokenContext.Provider value={setLocalStorageSessionToken}>
+					<SessionTokenContext.Provider value={sessionTokenContextValue}>
 						<ProjectSlugContext.Provider value={project}>
 							<StageSlugContext.Provider value={stage}>{children}</StageSlugContext.Provider>
 						</ProjectSlugContext.Provider>
@@ -46,3 +46,18 @@ export const ContemberClient = memo<ContemberClientProps & { children: React.Rea
 		</ApiBaseUrlContext.Provider>
 	)
 })
+
+const useLocalStorageSessionToken = (): [value: string | undefined, set: (token: string | undefined) => void] => {
+	const [sessionTokenInner, setSessionTokenInner] = useState(() => localStorage.getItem(sessionTokenKey) ?? undefined)
+
+	const setSessionToken = useCallback((token: string | undefined) => {
+		if (token !== undefined) {
+			localStorage.setItem(sessionTokenKey, token)
+		} else {
+			localStorage.removeItem(sessionTokenKey)
+		}
+		setSessionTokenInner(token)
+	}, [])
+
+	return [sessionTokenInner, setSessionToken]
+}

package/src/auth/SessionTokenContext.ts

@@ -1,3 +1,13 @@
 import { createContext } from 'react'
 
-export const SessionTokenContext = createContext<string | undefined>(undefined)
+export interface SessionTokenContextValue {
+	propsToken: string | undefined
+	source: 'props' | 'localstorage' | undefined
+	token: string | undefined
+}
+
+export const SessionTokenContext = createContext<SessionTokenContextValue>({
+	propsToken: undefined,
+	source: undefined,
+	token: undefined,
+})

package/src/auth/useSessionToken.ts

@@ -1,4 +1,5 @@
 import { useContext } from 'react'
 import { SessionTokenContext } from './SessionTokenContext'
 
-export const useSessionToken = () => useContext(SessionTokenContext)
+export const useSessionToken = () => useContext(SessionTokenContext).token
+export const useSessionTokenWithMeta = () => useContext(SessionTokenContext)

package/src/components/RichTextRenderer/RichTextRenderer.tsx

@@ -39,6 +39,9 @@ export type RichTextRendererProps<
 	renderBlock?: ComponentType<{ block: unknown, children?: ReactNode }>
 } & (RichTextRendererFieldProps | RichTextRendererBlockProps<CustomElements, CustomLeaves>)
 
+/**
+ * @group Content rendering
+ */
 export const RichTextRenderer = memo(function RichTextRenderer<
 	CustomElements extends RichTextElement = never,
 	CustomLeaves extends RichTextLeaf = never,

package/src/ambient.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />