Adds ability for developers to authenticate users in the local environment

.env.defaults

@@ -39,3 +39,6 @@ DD_RUM_SESSION_REPLAY_SAMPLE_RATE=20
 DD_RUM_TRACK_USER_INTERACTIONS=true
 DD_RUM_TRACK_RESOURCES=true
 DD_RUM_TRACK_LONG_TASKS=true
+
+# Auth provider environment variables
+AUTH_PROVIDER=local

api/src/lib/auth.ts

@@ -6,6 +6,8 @@ import {
 import { Decoded } from '@redwoodjs/api'
 import { AuthenticationError, ForbiddenError } from '@redwoodjs/graphql-server'
 
+import { db } from 'src/lib/db'
+
 /**
  * Represents the user attributes returned by the decoding the
  * Authentication provider's JWT together with an optional list of roles.
@@ -35,9 +37,17 @@ type RedwoodUser = Record<string, unknown> & { roles?: string[] }
  * @returns RedwoodUser
  */
 export const getCurrentUser = async (
-  decoded: Decoded
+  decoded: Decoded,
+  { token }: { token: string }
 ): Promise<RedwoodUser | null> => {
-  console.log(decoded)
+  // Verify that the request is coming from the local development environment
+  // and is only being processed within the local environment
+  if (process.env.AUTH_PROVIDER === 'local') {
+    const user = await db.user.findFirst({
+      where: { email: token },
+    })
+    return user
+  }
   return {
     id: 1,
     organizationId: 1,
@@ -73,8 +83,7 @@ export const hasRole = (roles: AllowedRoles): boolean => {
   if (!isAuthenticated()) {
     return false
   }
-
-  const currentUserRoles = context.currentUser?.roles
+  const currentUserRoles = context.currentUser?.role
 
   if (typeof roles === 'string') {
     if (typeof currentUserRoles === 'string') {

scripts/seed.ts

@@ -8,45 +8,45 @@
     // Seeds automatically with `yarn rw prisma migrate dev` and `yarn rw prisma migrate reset`
     //
 
-    const organization: Prisma.OrganizationCreateArgs['data'] =
-      await db.organization.create({
-        data: {
-          name: 'Example Organization',
-        },
-      })
-
-    const agency: Prisma.AgencyCreateArgs['data'] = await db.agency.create({
-      data: {
-        name: 'Example Agency',
-        code: 'EA',
-        organizationId: organization.id,
-      },
+    const organization: Prisma.OrganizationCreateArgs['data'] = {
+      name: 'US Digital Response',
+    }
+    const organizationRecord = await db.organization.create({
+      data: organization,
     })
 
-    const users: Prisma.UserCreateManyInput[] = [
+    const mainAgency: Prisma.AgencyCreateArgs['data'] = {
+      name: 'Main Agency',
+      abbreviation: 'MAUSDR',
+      code: 'MAUSDR',
+      organizationId: organizationRecord.id,
+    }
+    const mainAgencyRecord = await db.agency.create({ data: mainAgency })
+
+    const users: Prisma.UserCreateArgs['data'][] = [
       {
-        email: '[email protected]',
-        name: 'Organization Staff',
-        role: 'ORGANIZATION_STAFF',
-        agencyId: agency.id,
+        email: '[email protected]',
+        name: 'USDR Admin',
+        agencyId: mainAgencyRecord.id,
+        organizationId: organizationRecord.id,
+        role: 'USDR_ADMIN',
       },
       {
-        email: '[email protected]',
+        email: '[email protected]',
         name: 'Organization Admin',
+        agencyId: mainAgencyRecord.id,
+        organizationId: organizationRecord.id,
         role: 'ORGANIZATION_ADMIN',
-        agencyId: agency.id,
       },
       {
-        email: '[email protected]',
-        name: 'USDR Admin',
-        role: 'USDR_ADMIN',
-        agencyId: agency.id,
+        email: '[email protected]',
+        name: 'Organization Staff',
+        agencyId: mainAgencyRecord.id,
+        organizationId: organizationRecord.id,
+        role: 'ORGANIZATION_STAFF',
       },
     ]
-
-    await db.user.createMany({
-      data: users,
-    })
+    const userRecord = await db.user.create({ data: users[0] })
 
     const inputTemplates: Prisma.InputTemplateCreateArgs['data'][] = [
       {
@@ -66,6 +66,13 @@
 
     // Note: if using PostgreSQL, using `createMany` to insert multiple records is much faster
     // @see: https://www.prisma.io/docs/reference/api-reference/prisma-client-reference#createmany
+    await Promise.all(
+      users.map(async (data: Prisma.UserCreateArgs['data']) => {
+        const record = await db.user.create({ data })
+        console.log(record)
+      })
+    )
+
     await Promise.all(
       //
       // Change to match your data model and seeding needs

web/package.json

@@ -28,6 +28,7 @@
   },
   "devDependencies": {
     "@redwoodjs/vite": "6.4.2",
+    "@testing-library/react": "^14.2.1",
     "@types/node": "^20.10.4",
     "@types/react": "18.2.39",
     "@types/react-dom": "18.2.17",

web/src/auth.ts

@@ -1,5 +1,10 @@
 import { createAuthentication } from '@redwoodjs/auth'
 
+import {
+  createLocalAuthImplementation,
+  localAuthClient,
+} from 'src/auth/localAuth'
+
 // If you're integrating with an auth service provider you should delete this interface.
 // Instead you should import the type from their auth client sdk.
 export interface AuthClient {
@@ -53,11 +58,15 @@ const client = {
 }
 
 function createAuth() {
-  const authImplementation = createAuthImplementation(client)
-
-  // You can pass custom provider hooks here if you need to as a second
-  // argument. See the Redwood framework source code for how that's used
-  return createAuthentication(authImplementation)
+  if (process.env.AUTH_PROVIDER == 'local') {
+    const authImplementation = createLocalAuthImplementation(localAuthClient)
+    return createAuthentication(authImplementation)
+  } else {
+    const authImplementation = createAuthImplementation(client)
+    // You can pass custom provider hooks here if you need to as a second
+    // argument. See the Redwood framework source code for how that's used
+    return createAuthentication(authImplementation)
+  }
 }
 
 // This is where most of the integration work will take place. You should keep

web/src/auth/localAuth.ts

@@ -0,0 +1,82 @@
+import { SubmitHandler } from '@redwoodjs/forms'
+
+import { users } from 'src/lib/seeds'
+
+// If you're integrating with an auth service provider you should delete this interface.
+// Instead you should import the type from their auth client sdk.
+export interface AuthClient {
+  login: () => User
+  logout: () => void
+  signup: () => User
+  getToken: () => string
+  getUserMetadata: () => User | null
+}
+
+export interface LoginEventInterface {
+  email: string
+}
+
+export interface LocalAuthClient {
+  login: (event: SubmitHandler<LoginEventInterface>) => void
+  logout: () => Promise<void>
+  signup: () => null
+  getToken: () => Promise<string>
+  getUserMetadata: () => Promise<User | null>
+}
+
+interface User {
+  name: string
+  email: string
+  role: string
+  agencyId: number
+  organizationId: number
+  createdAt: string
+  updatedAt: string
+}
+
+export const localAuthClient = {
+  logout: async () => {
+    localStorage.removeItem('local_auth_token')
+    window.location.href = '/login'
+  },
+  getToken: async () => {
+    return localStorage.getItem('local_auth_token')
+  },
+  getUserMetadata: async () => {
+    if (!localStorage.getItem('local_auth_token')) {
+      return null
+    }
+
+    const user: User | null = users.find(
+      (u) => u.email === localStorage.getItem('local_auth_token')
+    )
+
+    return user
+  },
+  login: async (event) => {
+    let token
+    if (event.user === 'manual') {
+      token = event.email
+    } else {
+      token = event.user
+    }
+    localStorage.setItem('local_auth_token', token)
+    window.location.href = '/'
+  },
+  signup: () => {
+    console.log('implemented via GraphQL directly from the user creation page')
+    return null
+  },
+}
+
+export function createLocalAuthImplementation(client: LocalAuthClient) {
+  return {
+    type: 'local',
+    client,
+    login: async (e: SubmitHandler<LoginEventInterface>) => client.login(e),
+    logout: async () => client.logout(),
+    signup: async () => client.signup(),
+    getToken: async () => client.getToken(),
+    getUserMetadata: async () => client.getUserMetadata(),
+  }
+}

web/src/lib/seeds.ts

@@ -0,0 +1,47 @@
+export const users = [
+  {
+    email: '[email protected]',
+    name: 'USDR Admin',
+    role: 'USDR_ADMIN',
+    agency: {
+      name: 'Main Agency',
+      abbreviation: 'MAUSDR',
+      code: 'MAUSDR',
+      organizationId: 1,
+    },
+    agencyId: 1, // TO_DEPRECATE
+    organizationId: 1, // TO_DEPRECATE
+    createdAt: new Date().toISOString(),
+    updatedAt: new Date().toISOString(),
+  },
+  {
+    email: '[email protected]',
+    name: 'Organization Admin',
+    role: 'ORGANIZATION_ADMIN',
+    agency: {
+      name: 'Main Agency',
+      abbreviation: 'MAUSDR',
+      code: 'MAUSDR',
+      organizationId: 1,
+    },
+    agencyId: 1, // TO_DEPRECATE
+    organizationId: 1, // TO_DEPRECATE
+    createdAt: new Date().toISOString(),
+    updatedAt: new Date().toISOString(),
+  },
+  {
+    email: '[email protected]',
+    name: 'Organization Staff',
+    role: 'ORGANIZATION_STAFF',
+    agency: {
+      name: 'Main Agency',
+      abbreviation: 'MAUSDR',
+      code: 'MAUSDR',
+      organizationId: 1,
+    },
+    agencyId: 1, // TO_DEPRECATE
+    organizationId: 1, // TO_DEPRECATE
+    createdAt: new Date().toISOString(),
+    updatedAt: new Date().toISOString(),
+  },
+]

web/src/pages/LoginPage/LoginPage.test.tsx

@@ -1,3 +1,5 @@
+import { screen } from '@testing-library/react'
+
 import { render } from '@redwoodjs/testing/web'
 
 import LoginPage from './LoginPage'
@@ -6,9 +8,19 @@ import LoginPage from './LoginPage'
 //   https://redwoodjs.com/docs/testing#testing-pages-layouts
 
 describe('LoginPage', () => {
-  it('renders successfully', () => {
+  it('renders successfully for local auth', () => {
     expect(() => {
       render(<LoginPage />)
     }).not.toThrow()
   })
+  it('renders a login button for local auth', () => {
+    render(<LoginPage />)
+    expect(screen.getByRole('button', { name: 'Login' })).toBeInTheDocument()
+  })
+  it('renders an empty page when valid auth provider is missing', () => {
+    process.env.AUTH_PROVIDER = 'no-auth'
+    render(<LoginPage />)
+    const submitButton = screen.queryByText('submit')
+    expect(submitButton).not.toBeInTheDocument()
+  })
 })