@plone-collective/volto-identity 1.0.0-alpha.1

package/src/helpers/token.test.ts

@@ -0,0 +1,62 @@
+import { describe, expect, it } from 'vitest';
+
+import { useridFromToken } from './token';
+
+/**
+ * Build a JWT-shaped string around a payload.
+ *
+ * Only the middle segment is ever read, so the other two are noise on
+ * purpose: anything that started depending on them would be a bug.
+ */
+function tokenFor(payload: unknown): string {
+  const body = Buffer.from(JSON.stringify(payload))
+    .toString('base64')
+    .replace(/\+/g, '-')
+    .replace(/\//g, '_')
+    .replace(/=+$/, '');
+  return `header.${body}.signature`;
+}
+
+describe('useridFromToken', () => {
+  it('reads the subject', () => {
+    expect(useridFromToken(tokenFor({ sub: 'alice', exp: 1 }))).toBe('alice');
+  });
+
+  it('handles a payload whose base64 needs padding', () => {
+    // A JWT drops the `=` padding, so a payload whose length is not a
+    // multiple of four is the normal case rather than an edge one.
+    const userid = 'a'.repeat(7);
+
+    expect(useridFromToken(tokenFor({ sub: userid }))).toBe(userid);
+  });
+
+  it('handles base64url characters', () => {
+    // `-` and `_` stand in for `+` and `/`; decoding without translating
+    // them back yields mojibake rather than an error, which is the kind of
+    // bug that only shows up for some users.
+    const userid = 'ürico?andrei>plone';
+
+    expect(useridFromToken(tokenFor({ sub: userid }))).toBe(userid);
+  });
+
+  it('answers nobody when there is no token', () => {
+    expect(useridFromToken(undefined)).toBe('');
+    expect(useridFromToken(null)).toBe('');
+    expect(useridFromToken('')).toBe('');
+  });
+
+  it('answers nobody for something that is not a JWT', () => {
+    // This runs inside a component rendered on every page, so a malformed
+    // token has to be an empty answer rather than an exception.
+    expect(useridFromToken('not-a-jwt')).toBe('');
+    expect(useridFromToken('a.b.c')).toBe('');
+  });
+
+  it('answers nobody when the payload carries no subject', () => {
+    expect(useridFromToken(tokenFor({ exp: 1 }))).toBe('');
+  });
+
+  it('answers nobody when the subject is not a string', () => {
+    expect(useridFromToken(tokenFor({ sub: 42 }))).toBe('');
+  });
+});

package/src/helpers/token.ts

@@ -0,0 +1,71 @@
+/**
+ * Read the caller's userid out of the session token.
+ *
+ * Volto keeps the JWT in `state.userSession.token` and nothing else in the
+ * store names the current user until something has fetched them, so the
+ * token is where a userid comes from before the first request.
+ *
+ * This does **not** verify the token, and must never be used as if it did.
+ * The signature is the backend's business: every request carrying this token
+ * is checked there, and a forged one buys nothing but a userid this frontend
+ * will then ask the server about and be refused.
+ * @module helpers/token
+ */
+
+/**
+ * Decode one base64url segment of a JWT.
+ *
+ * @param segment The segment, base64url encoded and unpadded.
+ * @returns The decoded text, or an empty string when it is not decodable.
+ */
+function decodeSegment(segment: string): string {
+  const base64 = segment.replace(/-/g, '+').replace(/_/g, '/');
+  const padded = base64.padEnd(
+    base64.length + ((4 - (base64.length % 4)) % 4),
+    '=',
+  );
+  if (typeof atob !== 'function') {
+    // Both halves of Volto have it -- the browser always, and Node since 16,
+    // which is well below what Volto supports. Deliberately not falling back
+    // to `Buffer`: naming it here makes webpack pull a polyfill for the whole
+    // module into the client bundle, and the build then fails on a missing
+    // dependency rather than on anything to do with tokens.
+    return '';
+  }
+  try {
+    // `atob` answers one character per *byte*, latin-1 -- so a userid with
+    // anything outside ASCII in it arrives as mojibake unless the bytes are
+    // decoded as the UTF-8 they are. A userid can hold one: `userid_source`
+    // may make it the provider's username or an email address.
+    const binary = atob(padded);
+    const bytes = Uint8Array.from(binary, (char) => char.charCodeAt(0));
+    return new TextDecoder().decode(bytes);
+  } catch {
+    return '';
+  }
+}
+
+/**
+ * Return the userid a session token was issued for.
+ *
+ * @param token The JWT from `state.userSession.token`, if there is one.
+ * @returns The `sub` claim, or an empty string when there is no usable token.
+ */
+export function useridFromToken(token: string | undefined | null): string {
+  const segment = (token ?? '').split('.')[1];
+  if (!segment) {
+    return '';
+  }
+  const decoded = decodeSegment(segment);
+  if (!decoded) {
+    return '';
+  }
+  try {
+    const claims = JSON.parse(decoded);
+    return typeof claims?.sub === 'string' ? claims.sub : '';
+  } catch {
+    // A token that is not a JWT at all. Answering "nobody" is right: the
+    // alternative is throwing inside a component that renders on every page.
+    return '';
+  }
+}

package/src/index.ts

@@ -0,0 +1,22 @@
+import type { ConfigType } from '@plone/registry';
+import installReducers from './config/reducers';
+import installRoutes from './config/routes';
+import installSettings from './config/settings';
+import installMenu from './config/menu';
+import installViews from './config/views';
+import installWidgets from './config/widgets';
+
+import './styles.css';
+
+function applyConfig(config: ConfigType) {
+  installSettings(config);
+  installReducers(config);
+  installRoutes(config);
+  installMenu(config);
+  installViews(config);
+  installWidgets(config);
+
+  return config;
+}
+
+export default applyConfig;

package/src/reducers/index.ts

@@ -0,0 +1,369 @@
+/**
+ * Reducers for the identity login flows.
+ *
+ * One factory rather than five near-identical reducers: they all track the
+ * same request lifecycle and differ only in what they keep from the answer.
+ * @module reducers
+ */
+
+import {
+  COMPLETE_CALLBACK,
+  CONFIRM_MAGIC_LINK,
+  CREATE_CLIENT,
+  CREATE_PROVIDER,
+  DELETE_CLIENT,
+  DELETE_PROVIDER,
+  GET_CONSENT_REQUEST,
+  GET_MY_PROFILE,
+  SET_PREFERRED_EMAIL,
+  GET_USER_ACCOUNT,
+  LIST_GRANTS,
+  LIST_GROUP_MEMBERS,
+  WITHDRAW_GRANT,
+  LIST_CLIENTS,
+  LIST_DRIVERS,
+  LIST_KEYS,
+  GET_USER_PROFILE,
+  LIST_IDENTITIES,
+  LIST_LOGIN_PROVIDERS,
+  LIST_PROVIDERS,
+  ROTATE_CLIENT_SECRET,
+  ROTATE_KEY,
+  SEND_MAGIC_LINK,
+  START_LINKING,
+  START_PROVIDER_LOGIN,
+  TEST_PROVIDER,
+  UNLINK_IDENTITY,
+  UPDATE_CLIENT,
+  UPDATE_PROVIDER,
+} from '../constants/ActionTypes';
+import type {
+  AuthorizeRedirect,
+  ConfiguredProvider,
+  ConsentRequest,
+  ConnectionCheck,
+  Driver,
+  GroupMembers,
+  Identity,
+  LoginProvider,
+  MyProfile,
+  UserAccount,
+  UserProfile,
+  OAuthClient,
+  OAuthGrants,
+  RequestState,
+  SigningKeyRing,
+  TokenResponse,
+} from '../types';
+
+type Action = { type: string; result?: unknown; error?: unknown };
+
+const initial: RequestState = { loading: false, loaded: false, error: null };
+
+/**
+ * Build a reducer tracking one request.
+ *
+ * @param actionType The base action type.
+ * @param extract What to keep out of a successful result.
+ * @param empty The value of that key before anything has loaded.
+ */
+function requestReducer<T>(
+  actionType: string,
+  extract: (result: any) => T,
+  empty: T,
+  alsoFrom?: { actionType: string; extract: (result: any) => T | undefined },
+) {
+  const initialState = { ...initial, data: empty };
+  return function reducer(state = initialState, action: Action = { type: '' }) {
+    // A second action may carry this same data as an expanded component. It
+    // only ever *fills*: the request it belongs to is somebody else's, so its
+    // pending and failure states say nothing about this one, and a response
+    // that did not carry the component must leave what is here alone.
+    if (alsoFrom && action.type === `${alsoFrom.actionType}_SUCCESS`) {
+      const carried = alsoFrom.extract(action.result);
+      return carried === undefined
+        ? state
+        : {
+            ...state,
+            loading: false,
+            loaded: true,
+            error: null,
+            data: carried,
+          };
+    }
+    switch (action.type) {
+      case `${actionType}_PENDING`:
+        // The previous answer is cleared here as well as on success: leaving
+        // it in place makes a second attempt look like it has already
+        // succeeded, which for a redirect action means navigating away with
+        // last time's URL.
+        return { ...initialState, loading: true };
+      case `${actionType}_SUCCESS`:
+        return {
+          ...state,
+          loading: false,
+          loaded: true,
+          error: null,
+          data: extract(action.result),
+        };
+      case `${actionType}_FAIL`:
+        return { ...initialState, error: action.error ?? true };
+      default:
+        return state;
+    }
+  };
+}
+
+export const loginProviders = requestReducer<LoginProvider[]>(
+  LIST_LOGIN_PROVIDERS,
+  (result) => result?.items ?? [],
+  [],
+  {
+    // The identities listing can carry the same providers as an expanded
+    // component, which is how the identities page loads in one request.
+    actionType: LIST_IDENTITIES,
+    extract: (result) => result?.['@components']?.['login-providers']?.items,
+  },
+);
+
+export const providerLogin = requestReducer<AuthorizeRedirect | null>(
+  START_PROVIDER_LOGIN,
+  (result) => result ?? null,
+  null,
+);
+
+export const identityCallback = requestReducer<TokenResponse | null>(
+  COMPLETE_CALLBACK,
+  (result) => result ?? null,
+  null,
+);
+
+export const magicLinkSend = requestReducer<boolean>(
+  SEND_MAGIC_LINK,
+  (result) => Boolean(result?.sent),
+  false,
+);
+
+export const magicLinkConfirm = requestReducer<TokenResponse | null>(
+  CONFIRM_MAGIC_LINK,
+  (result) => result ?? null,
+  null,
+);
+
+export const userProfile = requestReducer<UserProfile | null>(
+  GET_USER_PROFILE,
+  (result) => result ?? null,
+  null,
+);
+
+export const identities = requestReducer<Identity[]>(
+  LIST_IDENTITIES,
+  (result) => result?.items ?? [],
+  [],
+);
+
+/**
+ * What the caller could still attach to their account.
+ *
+ * The backend's own answer rather than a filter applied here, and a different
+ * question from `loginProviders`: that one is what the login screen offers,
+ * this one is every *enabled* provider the caller has not linked. A provider
+ * an operator has taken off the login page is still one an existing user may
+ * attach, which is exactly what the two settings exist to distinguish.
+ */
+export const linkableProviders = requestReducer<LoginProvider[]>(
+  LIST_IDENTITIES,
+  (result) => result?.available ?? [],
+  [],
+);
+
+export const groupMembers = requestReducer<GroupMembers | null>(
+  LIST_GROUP_MEMBERS,
+  (result) => result ?? null,
+  null,
+);
+
+export const userAccount = requestReducer<UserAccount | null>(
+  GET_USER_ACCOUNT,
+  (result) => result ?? null,
+  null,
+);
+
+export const identityLinking = requestReducer<AuthorizeRedirect | null>(
+  START_LINKING,
+  (result) => result ?? null,
+  null,
+);
+
+export const identityUnlink = requestReducer<boolean>(
+  UNLINK_IDENTITY,
+  () => true,
+  false,
+);
+
+export const identityDrivers = requestReducer<Driver[]>(
+  LIST_DRIVERS,
+  (result) => result?.items ?? [],
+  [],
+);
+
+export const configuredProviders = requestReducer<ConfiguredProvider[]>(
+  LIST_PROVIDERS,
+  (result) => result?.items ?? [],
+  [],
+);
+
+// The provider form's own schema, served beside the listing. Its own slice
+// rather than a field on `configuredProviders`, because the panel asks for it
+// on mount and Volto's `Form` reads `schema.fieldsets` on the first render --
+// a listing that arrived without one would crash rather than render empty.
+export const providerFormSchema = requestReducer<Record<string, any> | null>(
+  LIST_PROVIDERS,
+  (result) => result?.schema ?? null,
+  null,
+);
+
+export const clientFormSchema = requestReducer<Record<string, any> | null>(
+  LIST_CLIENTS,
+  (result) => result?.schema ?? null,
+  null,
+);
+
+export const providerCreate = requestReducer<ConfiguredProvider | null>(
+  CREATE_PROVIDER,
+  (result) => result ?? null,
+  null,
+);
+
+export const providerUpdate = requestReducer<boolean>(
+  UPDATE_PROVIDER,
+  () => true,
+  false,
+);
+
+export const providerDelete = requestReducer<boolean>(
+  DELETE_PROVIDER,
+  () => true,
+  false,
+);
+
+export const providerTest = requestReducer<ConnectionCheck | null>(
+  TEST_PROVIDER,
+  (result) => result ?? null,
+  null,
+);
+
+export const myProfile = requestReducer<MyProfile | null>(
+  GET_MY_PROFILE,
+  (result) => result ?? null,
+  null,
+);
+
+// A `PATCH` on content answers 204 with no body, so there is nothing to keep:
+// this reducer exists for `loading` and `error`, and the new order is read back
+// through `@my-profile` once the write lands.
+export const preferredEmail = requestReducer<null>(
+  SET_PREFERRED_EMAIL,
+  () => null,
+  null,
+);
+
+export const oauthClients = requestReducer<OAuthClient[]>(
+  LIST_CLIENTS,
+  (result) => result?.items ?? [],
+  [],
+);
+
+// The create and rotate results keep the *whole* client rather than a list
+// entry, because they are the only place the secret ever appears and the
+// panel has to render it from somewhere.
+export const clientCreate = requestReducer<OAuthClient | null>(
+  CREATE_CLIENT,
+  (result) => result ?? null,
+  null,
+);
+
+export const clientSecretRotate = requestReducer<OAuthClient | null>(
+  ROTATE_CLIENT_SECRET,
+  (result) => result ?? null,
+  null,
+);
+
+export const clientUpdate = requestReducer<OAuthClient | null>(
+  UPDATE_CLIENT,
+  (result) => result ?? null,
+  null,
+);
+
+export const clientDelete = requestReducer<boolean>(
+  DELETE_CLIENT,
+  () => true,
+  false,
+);
+
+export const oauthGrants = requestReducer<OAuthGrants | null>(
+  LIST_GRANTS,
+  (result) => result ?? null,
+  null,
+);
+
+export const grantWithdraw = requestReducer<Record<string, unknown> | null>(
+  WITHDRAW_GRANT,
+  (result) => result ?? null,
+  null,
+);
+
+export const consentRequest = requestReducer<ConsentRequest | null>(
+  GET_CONSENT_REQUEST,
+  (result) => result ?? null,
+  null,
+);
+
+export const signingKeys = requestReducer<SigningKeyRing | null>(
+  LIST_KEYS,
+  (result) => result ?? null,
+  null,
+);
+
+export const keyRotate = requestReducer<SigningKeyRing | null>(
+  ROTATE_KEY,
+  (result) => result ?? null,
+  null,
+);
+
+const reducers = {
+  loginProviders,
+  providerLogin,
+  identityCallback,
+  magicLinkSend,
+  magicLinkConfirm,
+  identities,
+  linkableProviders,
+  groupMembers,
+  userAccount,
+  identityLinking,
+  identityUnlink,
+  identityDrivers,
+  configuredProviders,
+  providerFormSchema,
+  clientFormSchema,
+  providerCreate,
+  providerUpdate,
+  providerDelete,
+  providerTest,
+  myProfile,
+  preferredEmail,
+  userProfile,
+  oauthClients,
+  clientCreate,
+  clientUpdate,
+  clientDelete,
+  clientSecretRotate,
+  signingKeys,
+  keyRotate,
+  consentRequest,
+  oauthGrants,
+  grantWithdraw,
+};
+
+export default reducers;