@nixxie-cms/auth 1.0.1

package/src/components/Navigation.tsx

@@ -0,0 +1,182 @@
+import { useEffect, useMemo } from 'react'
+
+import { Divider } from '@keystar/ui/layout'
+import { css } from '@keystar/ui/style'
+
+import {
+  useQuery,
+  useMutation,
+  gql,
+  type TypedDocumentNode,
+} from '@nixxie-cms/core/admin-ui/apollo'
+import {
+  DeveloperResourcesMenu,
+  NavList,
+  NavContainer,
+  NavFooter,
+  NavItem,
+  getHrefFromList,
+} from '@nixxie-cms/core/admin-ui/components'
+import type { NavigationProps } from '@nixxie-cms/core/admin-ui/components'
+import { useRouter } from '@nixxie-cms/core/admin-ui/router'
+
+export default ({ labelField }: { labelField: string }) =>
+  (props: NavigationProps) => <Navigation labelField={labelField} {...props} />
+
+function Navigation({
+  labelField,
+  lists,
+}: {
+  labelField: string
+} & NavigationProps) {
+  const { data } = useQuery<{
+    authenticatedItem: null | {
+      label: string
+    }
+  }>(
+    useMemo(
+      () => gql`
+    query NxAuthFetchSession {
+      authenticatedItem {
+        label: ${labelField}
+      }
+    }
+  `,
+      [labelField]
+    )
+  )
+
+  return (
+    <NavContainer>
+      <NavList>
+        <NavItem href="/">Dashboard</NavItem>
+        <Divider />
+        {lists.map(list => (
+          <NavItem key={list.key} href={getHrefFromList(list)}>
+            {list.label}
+          </NavItem>
+        ))}
+      </NavList>
+
+      <NavFooter>
+        {data?.authenticatedItem && (
+          <UserFooter authItemLabel={data.authenticatedItem.label} />
+        )}
+        <DeveloperResourcesMenu />
+      </NavFooter>
+    </NavContainer>
+  )
+}
+
+const END_SESSION = gql`
+  mutation NxAuthEndSession {
+    endSession
+  }
+` as TypedDocumentNode<{ endSession: boolean }>
+
+function UserFooter({ authItemLabel }: { authItemLabel: string }) {
+  const router = useRouter()
+  const [endSession, { data }] = useMutation(END_SESSION)
+
+  useEffect(() => {
+    if (data?.endSession) {
+      router.push('/signin')
+    }
+  }, [data])
+
+  const initials = authItemLabel
+    .split(' ')
+    .slice(0, 2)
+    .map(s => s.charAt(0).toUpperCase())
+    .join('')
+
+  return (
+    <div
+      className={css({
+        display: 'flex',
+        alignItems: 'center',
+        gap: 8,
+        paddingInline: '4px',
+        paddingBlock: '2px',
+      })}
+    >
+      {/* Avatar */}
+      <span
+        className={css({
+          display: 'inline-flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          width: 28,
+          height: 28,
+          borderRadius: '50%',
+          backgroundColor: '#0a0a0a',
+          color: '#ffffff',
+          fontSize: 10.5,
+          fontWeight: 600,
+          letterSpacing: '0.02em',
+          flexShrink: 0,
+          fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, sans-serif",
+        })}
+      >
+        {initials}
+      </span>
+
+      {/* Name */}
+      <span
+        className={css({
+          flex: 1,
+          fontSize: 12.5,
+          fontWeight: 500,
+          color: '#2a2a2a',
+          overflow: 'hidden',
+          textOverflow: 'ellipsis',
+          whiteSpace: 'nowrap',
+          lineHeight: 1.2,
+        })}
+      >
+        {authItemLabel}
+      </span>
+
+      {/* Sign out icon button */}
+      <button
+        onClick={() => endSession()}
+        title="Sign out"
+        aria-label="Sign out"
+        className={css({
+          display: 'inline-flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          width: 26,
+          height: 26,
+          border: '1px solid #ebebeb',
+          borderRadius: 6,
+          background: 'transparent',
+          cursor: 'pointer',
+          color: '#a3a3a3',
+          flexShrink: 0,
+          transition: 'color 130ms, border-color 130ms, background 130ms',
+          '&:hover': {
+            color: '#0a0a0a',
+            borderColor: '#c8c8c8',
+            background: '#f5f5f5',
+          },
+          '&:focus-visible': {
+            outline: '2px solid #000',
+            outlineOffset: 2,
+          },
+        })}
+      >
+        {/* Arrow-right-from-bracket (sign out) */}
+        <svg width="12" height="12" viewBox="0 0 12 12" fill="none">
+          <path
+            d="M4.5 2H2.5C2.22386 2 2 2.22386 2 2.5V9.5C2 9.77614 2.22386 10 2.5 10H4.5M8 4L10 6L8 8M10 6H4.5"
+            stroke="currentColor"
+            strokeWidth="1.25"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </svg>
+      </button>
+    </div>
+  )
+}

package/src/gql/getBaseAuthSchema.ts

@@ -0,0 +1,129 @@
+import type { BaseItem, NixxieContext } from '@nixxie-cms/core/types'
+import { g } from '@nixxie-cms/core'
+import { getPasswordFieldKDF } from '@nixxie-cms/core/fields/types/password'
+import type { AuthGqlNames } from '../types'
+import type { BaseSchemaMeta } from '@nixxie-cms/core/graphql-ts'
+
+const AUTHENTICATION_FAILURE = {
+  code: 'FAILURE',
+  message: 'Authentication failed.',
+} as const
+
+export function getBaseAuthSchema<I extends string, S extends string>({
+  authGqlNames,
+  listKey,
+  identityField,
+  secretField,
+  base,
+}: {
+  authGqlNames: AuthGqlNames
+  listKey: string
+  identityField: I
+  secretField: S
+  base: BaseSchemaMeta
+}) {
+  const kdf = getPasswordFieldKDF(base.schema, listKey, secretField)
+  if (!kdf) {
+    throw new Error(`${listKey}.${secretField} is not a valid password field.`)
+  }
+
+  const ItemAuthenticationWithPasswordSuccess = g.object<{
+    sessionToken: string
+    item: BaseItem
+  }>()({
+    name: authGqlNames.ItemAuthenticationWithPasswordSuccess,
+    fields: {
+      sessionToken: g.field({ type: g.nonNull(g.String) }),
+      item: g.field({ type: g.nonNull(base.object(listKey)) }),
+    },
+  })
+  const ItemAuthenticationWithPasswordFailure = g.object<{ message: string }>()({
+    name: authGqlNames.ItemAuthenticationWithPasswordFailure,
+    fields: {
+      message: g.field({ type: g.nonNull(g.String) }),
+    },
+  })
+  const AuthenticationResult = g.union({
+    name: authGqlNames.ItemAuthenticationWithPasswordResult,
+    types: [ItemAuthenticationWithPasswordSuccess, ItemAuthenticationWithPasswordFailure],
+    resolveType(val) {
+      if ('sessionToken' in val) return authGqlNames.ItemAuthenticationWithPasswordSuccess
+      return authGqlNames.ItemAuthenticationWithPasswordFailure
+    },
+  })
+
+  const extension = {
+    query: {
+      authenticatedItem: g.field({
+        type: base.object(listKey),
+        resolve(rootVal, args, context: NixxieContext) {
+          const { session } = context
+          if (!session?.itemId) return null
+
+          return context.db[listKey].findOne({
+            where: {
+              id: session.itemId,
+            },
+          })
+        },
+      }),
+    },
+    mutation: {
+      endSession: g.field({
+        type: g.nonNull(g.Boolean),
+        async resolve(rootVal, args, context) {
+          await context.sessionStrategy?.end({ context })
+          return true
+        },
+      }),
+      [authGqlNames.authenticateItemWithPassword]: g.field({
+        type: AuthenticationResult,
+        args: {
+          [identityField]: g.arg({ type: g.nonNull(g.String) }),
+          [secretField]: g.arg({ type: g.nonNull(g.String) }),
+        },
+        async resolve(
+          rootVal,
+          { [identityField]: identity, [secretField]: secret },
+          context: NixxieContext
+        ) {
+          if (!context.sessionStrategy) throw new Error('No session strategy on context')
+
+          const item = await context.sudo().db[listKey].findOne({
+            where: { [identityField]: identity },
+          })
+
+          if (typeof item?.[secretField] !== 'string') {
+            await kdf.hash('simulated-password-to-counter-timing-attack')
+            return AUTHENTICATION_FAILURE
+          }
+
+          const equal = await kdf.compare(secret, item[secretField])
+          if (!equal) return AUTHENTICATION_FAILURE
+
+          const sessionToken = await context.sessionStrategy.start({
+            data: {
+              listKey,
+              itemId: item.id,
+            },
+            context,
+          })
+
+          if (typeof sessionToken !== 'string' || sessionToken.length === 0) {
+            return AUTHENTICATION_FAILURE
+          }
+
+          return {
+            sessionToken,
+            item,
+          }
+        },
+      }),
+    },
+  }
+
+  return {
+    extension,
+    ItemAuthenticationWithPasswordSuccess,
+  }
+}

package/src/gql/getInitFirstItemSchema.ts

@@ -0,0 +1,87 @@
+import type { BaseItem, NixxieContext } from '@nixxie-cms/core/types'
+import { g } from '@nixxie-cms/core'
+import { assertInputObjectType, GraphQLInputObjectType, type GraphQLSchema } from 'graphql'
+import { type AuthGqlNames, type InitFirstItemConfig } from '../types'
+import type { Extension } from '@nixxie-cms/core/graphql-ts'
+
+const AUTHENTICATION_FAILURE = 'Authentication failed.' as const
+
+export function getInitFirstItemSchema({
+  authGqlNames,
+  listKey,
+  fields,
+  defaultItemData,
+  graphQLSchema,
+  ItemAuthenticationWithPasswordSuccess,
+}: {
+  authGqlNames: AuthGqlNames
+  listKey: string
+  fields: InitFirstItemConfig<any>['fields']
+  defaultItemData: InitFirstItemConfig<any>['itemData']
+  graphQLSchema: GraphQLSchema
+  ItemAuthenticationWithPasswordSuccess: g<
+    typeof g.object<{
+      item: BaseItem
+      sessionToken: string
+    }>
+  >
+  // TODO: return type required by pnpm :(
+}): Extension {
+  const createInputConfig = assertInputObjectType(
+    graphQLSchema.getType(`${listKey}CreateInput`)
+  ).toConfig()
+  const fieldsSet = new Set(fields)
+  const initialCreateInput = new GraphQLInputObjectType({
+    ...createInputConfig,
+    fields: Object.fromEntries(
+      Object.entries(createInputConfig.fields).filter(([fieldKey]) => fieldsSet.has(fieldKey))
+    ),
+    name: authGqlNames.CreateInitialInput,
+  })
+
+  return {
+    mutation: {
+      [authGqlNames.createInitialItem]: g.field({
+        type: g.nonNull(ItemAuthenticationWithPasswordSuccess),
+        args: { data: g.arg({ type: g.nonNull(initialCreateInput) }) },
+        async resolve(rootVal, { data }, context: NixxieContext) {
+          if (!context.sessionStrategy) throw new Error('No session strategy on context')
+
+          const sudoContext = context.sudo()
+
+          // should approximate hasInitFirstItemConditions
+          const count = await sudoContext.db[listKey].count()
+          if (count !== 0) throw AUTHENTICATION_FAILURE
+
+          // Update system state
+          // this is strictly speaking incorrect. the db API will do GraphQL coercion on a value which has already been coerced
+          // (this is also mostly fine, the chance that people are using things where
+          // the input value can't round-trip like the Upload scalar here is quite low)
+          const item = await sudoContext.db[listKey].createOne({
+            data: {
+              ...defaultItemData,
+              ...data,
+            },
+          })
+
+          const sessionToken = await context.sessionStrategy.start({
+            data: {
+              listKey,
+              itemId: item.id,
+            },
+            context,
+          })
+
+          if (typeof sessionToken !== 'string' || sessionToken.length === 0) {
+            throw AUTHENTICATION_FAILURE
+          }
+
+          return {
+            sessionToken,
+            item,
+          }
+        },
+      }),
+    },
+  }
+}

package/src/index.ts

@@ -0,0 +1,291 @@
+import type {
+  AdminFileToWrite,
+  BaseListTypeInfo,
+  NixxieContext,
+  SessionStrategy,
+  BaseNixxieTypeInfo,
+  NixxieConfig,
+} from '@nixxie-cms/core/types'
+import type { AuthConfig, AuthGqlNames } from './types'
+
+import { getSchemaExtension } from './schema'
+import configTemplate from './templates/config'
+import signinTemplate from './templates/signin'
+import initTemplate from './templates/init'
+
+export type AuthSession = {
+  itemId: string | number // TODO: use ListTypeInfo
+  data: unknown // TODO: use ListTypeInfo
+}
+
+function getAuthGqlNames(singular: string): AuthGqlNames {
+  const lowerSingularName = singular.charAt(0).toLowerCase() + singular.slice(1)
+  return {
+    itemQueryName: lowerSingularName,
+    whereUniqueInputName: `${singular}WhereUniqueInput`,
+
+    authenticateItemWithPassword: `authenticate${singular}WithPassword`,
+    ItemAuthenticationWithPasswordResult: `${singular}AuthenticationWithPasswordResult`,
+    ItemAuthenticationWithPasswordSuccess: `${singular}AuthenticationWithPasswordSuccess`,
+    ItemAuthenticationWithPasswordFailure: `${singular}AuthenticationWithPasswordFailure`,
+
+    CreateInitialInput: `CreateInitial${singular}Input`,
+    createInitialItem: `createInitial${singular}`,
+  } as const
+}
+
+// TODO: use TypeInfo and listKey for types
+/**
+ * createAuth function
+ *
+ * Generates config for Nixxie to implement standard auth features.
+ */
+export function createAuth<ListTypeInfo extends BaseListTypeInfo>({
+  listKey,
+  secretField,
+  initFirstItem,
+  identityField,
+  sessionData = 'id',
+}: AuthConfig<ListTypeInfo>) {
+  /**
+   * getAdditionalFiles
+   *
+   * This function adds files to be generated into the Admin UI build. Must be added to the
+   * ui.getAdditionalFiles config.
+   *
+   * The signin page is always included, and the init page is included when initFirstItem is set
+   */
+  const authGetAdditionalFiles = (config: NixxieConfig) => {
+    // TODO: FIXME: this is a duplication of initialise-lists:747
+    const listConfig = config.lists[listKey]
+    const labelField =
+      listConfig.ui?.labelField ??
+      (listConfig.fields.label
+        ? 'label'
+        : listConfig.fields.name
+          ? 'name'
+          : listConfig.fields.title
+            ? 'title'
+            : 'id')
+
+    const authGqlNames = getAuthGqlNames(listConfig.graphql?.singular ?? listKey)
+    const filesToWrite: AdminFileToWrite[] = [
+      {
+        mode: 'write',
+        src: signinTemplate({ authGqlNames, identityField, secretField }),
+        outputPath: 'pages/signin.js',
+      },
+      {
+        mode: 'write',
+        src: configTemplate({ labelField }),
+        outputPath: 'config.ts',
+      },
+    ]
+    if (initFirstItem) {
+      filesToWrite.push({
+        mode: 'write',
+        src: initTemplate({ authGqlNames, listKey, initFirstItem }),
+        outputPath: 'pages/init.js',
+      })
+    }
+    return filesToWrite
+  }
+
+  function throwIfInvalidConfig<TypeInfo extends BaseNixxieTypeInfo>(
+    config: NixxieConfig<TypeInfo>
+  ) {
+    if (!(listKey in config.lists)) {
+      throw new Error(`withAuth cannot find the list "${listKey}"`)
+    }
+
+    // TODO: verify that the identity field is unique
+    // TODO: verify that the field is required
+    const list = config.lists[listKey]
+    if (!(identityField in list.fields)) {
+      throw new Error(`withAuth cannot find the identity field "${listKey}.${identityField}"`)
+    }
+
+    if (!(secretField in list.fields)) {
+      throw new Error(`withAuth cannot find the secret field "${listKey}.${secretField}"`)
+    }
+
+    for (const fieldKey of initFirstItem?.fields || []) {
+      if (fieldKey in list.fields) continue
+
+      throw new Error(`initFirstItem.fields has unknown field "${listKey}.${fieldKey}"`)
+    }
+  }
+
+  // this strategy wraps the existing session strategy,
+  //   and injects the requested session.data before returning
+  function authSessionStrategy<Session extends AuthSession>(
+    _sessionStrategy: SessionStrategy<Session>
+  ): SessionStrategy<Session> {
+    const { get, ...sessionStrategy } = _sessionStrategy
+    return {
+      ...sessionStrategy,
+      get: async ({ context }) => {
+        const session = await get({ context })
+        const sudoContext = context.sudo()
+        if (!session?.itemId) return
+
+        // TODO: replace with SessionSecret: HMAC({ listKey, identityField, secretField }, SessionSecretVar)
+        // if (session.listKey !== listKey) return null
+
+        try {
+          const data = await sudoContext.query[listKey].findOne({
+            where: { id: session.itemId },
+            query: sessionData,
+          })
+          if (!data) return
+
+          return {
+            ...session,
+            itemId: session.itemId,
+            data,
+          }
+        } catch (e) {
+          console.error(e)
+          // WARNING: this is probably an invalid configuration
+          return
+        }
+      },
+    }
+  }
+
+  async function hasInitFirstItemConditions<TypeInfo extends BaseNixxieTypeInfo>(
+    context: NixxieContext<TypeInfo>
+  ) {
+    // do nothing if they aren't using this feature
+    if (!initFirstItem) return false
+
+    // if they have a session, there is no initialisation necessary
+    if (context.session) return false
+
+    const count = await context.sudo().db[listKey].count({})
+    return count === 0
+  }
+
+  async function authMiddleware<TypeInfo extends BaseNixxieTypeInfo>({
+    context,
+    wasAccessAllowed,
+    basePath,
+  }: {
+    context: NixxieContext<TypeInfo>
+    wasAccessAllowed: boolean
+    basePath: string
+  }): Promise<{ kind: 'redirect'; to: string } | void> {
+    const { req } = context
+    const { pathname } = new URL(req!.url!, 'http://_')
+
+    // redirect to init if initFirstItem conditions are met
+    if (pathname !== `${basePath}/init` && (await hasInitFirstItemConditions(context))) {
+      return { kind: 'redirect', to: `${basePath}/init` }
+    }
+
+    // redirect to / if attempting to /init and initFirstItem conditions are not met
+    if (pathname === `${basePath}/init` && !(await hasInitFirstItemConditions(context))) {
+      return { kind: 'redirect', to: basePath }
+    }
+
+    // don't redirect if we have access
+    if (wasAccessAllowed) return
+
+    // otherwise, redirect to signin
+    return { kind: 'redirect', to: `${basePath}/signin` }
+  }
+
+  function defaultIsAccessAllowed({ session }: NixxieContext) {
+    return session !== undefined
+  }
+
+  function defaultExtendGraphqlSchema<T>(schema: T) {
+    return schema
+  }
+
+  /**
+   * withAuth
+   *
+   * Automatically extends your configuration with a prescriptive implementation.
+   */
+  function withAuth<TypeInfo extends BaseNixxieTypeInfo>(
+    config: NixxieConfig<TypeInfo>
+  ): NixxieConfig<TypeInfo> {
+    throwIfInvalidConfig(config)
+    let { ui } = config
+    if (!ui?.isDisabled) {
+      const {
+        getAdditionalFiles = () => [],
+        isAccessAllowed = defaultIsAccessAllowed,
+        pageMiddleware,
+        publicPages = [],
+      } = ui || {}
+      const authPublicPages = [`${ui?.basePath ?? ''}/signin`]
+      ui = {
+        ...ui,
+        publicPages: [...publicPages, ...authPublicPages],
+        getAdditionalFiles: async () => [
+          ...(await getAdditionalFiles()),
+          ...authGetAdditionalFiles(config),
+        ],
+
+        isAccessAllowed: async (context: NixxieContext) => {
+          if (await hasInitFirstItemConditions(context)) return true
+          return isAccessAllowed(context)
+        },
+
+        pageMiddleware: async args => {
+          const shouldRedirect = await authMiddleware(args)
+          if (shouldRedirect) return shouldRedirect
+          return pageMiddleware?.(args)
+        },
+      }
+    }
+
+    if (!config.session) throw new TypeError('Missing .session configuration')
+
+    const { graphql } = config
+    const { extendGraphqlSchema = defaultExtendGraphqlSchema } = graphql ?? {}
+    const listConfig = config.lists[listKey]
+
+    /**
+     * extendGraphqlSchema
+     *
+     * Must be added to the extendGraphqlSchema config. Can be composed.
+     */
+    const authGqlNames = getAuthGqlNames(listConfig.graphql?.singular ?? listKey)
+    const authExtendGraphqlSchema = getSchemaExtension({
+      authGqlNames,
+      listKey,
+      identityField,
+      secretField,
+      initFirstItem,
+      sessionData,
+    })
+
+    return {
+      ...config,
+      graphql: {
+        ...config.graphql,
+        extendGraphqlSchema: schema => {
+          return extendGraphqlSchema(authExtendGraphqlSchema(schema))
+        },
+      },
+      ui,
+      session: authSessionStrategy(config.session),
+      lists: {
+        ...config.lists,
+        [listKey]: {
+          ...listConfig,
+          fields: {
+            ...listConfig.fields,
+          },
+        },
+      },
+    }
+  }
+
+  return {
+    withAuth,
+  }
+}

package/src/lib/useFromRedirect.ts

@@ -0,0 +1,23 @@
+import { useMemo } from 'react'
+import { useRouter } from '@nixxie-cms/core/admin-ui/router'
+
+/**
+ * Returns a safe, site-relative path to redirect to after authentication.
+ *
+ * Reads the `from` query parameter and only honours it when it is a
+ * site-relative path (starts with a single `/`). Absolute URLs and
+ * protocol-relative URLs (`//evil.com`) are rejected to prevent open
+ * redirects; in those cases it falls back to `/`.
+ */
+export function useRedirect() {
+  const router = useRouter()
+  const raw = router.query.from
+  const from = Array.isArray(raw) ? raw[0] : raw
+
+  return useMemo(() => {
+    if (typeof from === 'string' && from.startsWith('/') && !from.startsWith('//')) {
+      return from
+    }
+    return '/'
+  }, [from])
+}