From 6dbffadfdac29af8da86c2ab230f43beb9cc38d4 Mon Sep 17 00:00:00 2001
From: Weronika Tomaszewska <veratomaszewska@gmail.com>
Date: Fri, 29 Dec 2023 15:20:16 -0500
Subject: [PATCH] CPF-56 add Forbidden page, code cleanup for New Organization
 and Edit Organization forms

---
 api/src/graphql/organizations.sdl.ts              |  2 +-
 api/src/services/organizations/organizations.ts   |  2 +-
 api/types/graphql.d.ts                            | 14 +++++++-------
 web/src/Routes.tsx                                |  2 ++
 .../EditOrganizationCell/EditOrganizationCell.tsx |  4 ++--
 .../EditOrganizationForm.tsx}                     |  6 +++---
 .../NewOrganization/NewOrganization.tsx           |  4 ++--
 .../NewOrganizationForm/NewOrganizationForm.tsx   | 15 ++++++---------
 .../pages/ForbiddenPage/ForbiddenPage.stories.tsx | 13 +++++++++++++
 .../pages/ForbiddenPage/ForbiddenPage.test.tsx    | 14 ++++++++++++++
 web/src/pages/ForbiddenPage/ForbiddenPage.tsx     | 12 ++++++++++++
 web/types/graphql.d.ts                            | 12 ++++++------
 12 files changed, 69 insertions(+), 31 deletions(-)
 rename web/src/components/Organization/{OrganizationForm/OrganizationForm.tsx => EditOrganizationForm/EditOrganizationForm.tsx} (94%)
 create mode 100644 web/src/pages/ForbiddenPage/ForbiddenPage.stories.tsx
 create mode 100644 web/src/pages/ForbiddenPage/ForbiddenPage.test.tsx
 create mode 100644 web/src/pages/ForbiddenPage/ForbiddenPage.tsx

diff --git a/api/src/graphql/organizations.sdl.ts b/api/src/graphql/organizations.sdl.ts
index d58ecb6f..810e2648 100644
--- a/api/src/graphql/organizations.sdl.ts
+++ b/api/src/graphql/organizations.sdl.ts
@@ -26,7 +26,7 @@ export const schema = gql`
       input: UpdateOrganizationInput!
     ): Organization! @requireAuth
     deleteOrganization(id: Int!): Organization! @requireAuth
-    createOrgAgencyAdmin(
+    createOrganizationAgencyAdmin(
       input: CreateOrgAgencyAdminInput!
     ): CreateOrgAgencyAdminPayload @requireAuth
   }
diff --git a/api/src/services/organizations/organizations.ts b/api/src/services/organizations/organizations.ts
index 7219e5fa..41a85c27 100644
--- a/api/src/services/organizations/organizations.ts
+++ b/api/src/services/organizations/organizations.ts
@@ -24,7 +24,7 @@ export const createOrganization: MutationResolvers['createOrganization'] = ({
   })
 }
 
-export const createOrgAgencyAdmin: MutationResolvers['createOrgAgencyAdmin'] =
+export const createOrganizationAgencyAdmin: MutationResolvers['createOrganizationAgencyAdmin'] =
   async ({ input }) => {
     const {
       organizationName,
diff --git a/api/types/graphql.d.ts b/api/types/graphql.d.ts
index 8e62f5c6..1fe063e9 100644
--- a/api/types/graphql.d.ts
+++ b/api/types/graphql.d.ts
@@ -183,8 +183,8 @@ export type Mutation = {
   createAgency: Agency;
   createExpenditureCategory: ExpenditureCategory;
   createInputTemplate: InputTemplate;
-  createOrgAgencyAdmin?: Maybe<CreateOrgAgencyAdminPayload>;
   createOrganization: Organization;
+  createOrganizationAgencyAdmin?: Maybe<CreateOrgAgencyAdminPayload>;
   createOutputTemplate: OutputTemplate;
   createProject: Project;
   createReportingPeriod: ReportingPeriod;
@@ -235,13 +235,13 @@ export type MutationcreateInputTemplateArgs = {
 };
 
 
-export type MutationcreateOrgAgencyAdminArgs = {
-  input: CreateOrgAgencyAdminInput;
+export type MutationcreateOrganizationArgs = {
+  input: CreateOrganizationInput;
 };
 
 
-export type MutationcreateOrganizationArgs = {
-  input: CreateOrganizationInput;
+export type MutationcreateOrganizationAgencyAdminArgs = {
+  input: CreateOrgAgencyAdminInput;
 };
 
 
@@ -1060,8 +1060,8 @@ export type MutationResolvers<ContextType = RedwoodGraphQLContext, ParentType ex
   createAgency: Resolver<ResolversTypes['Agency'], ParentType, ContextType, RequireFields<MutationcreateAgencyArgs, 'input'>>;
   createExpenditureCategory: Resolver<ResolversTypes['ExpenditureCategory'], ParentType, ContextType, RequireFields<MutationcreateExpenditureCategoryArgs, 'input'>>;
   createInputTemplate: Resolver<ResolversTypes['InputTemplate'], ParentType, ContextType, RequireFields<MutationcreateInputTemplateArgs, 'input'>>;
-  createOrgAgencyAdmin: Resolver<Maybe<ResolversTypes['CreateOrgAgencyAdminPayload']>, ParentType, ContextType, RequireFields<MutationcreateOrgAgencyAdminArgs, 'input'>>;
   createOrganization: Resolver<ResolversTypes['Organization'], ParentType, ContextType, RequireFields<MutationcreateOrganizationArgs, 'input'>>;
+  createOrganizationAgencyAdmin: Resolver<Maybe<ResolversTypes['CreateOrgAgencyAdminPayload']>, ParentType, ContextType, RequireFields<MutationcreateOrganizationAgencyAdminArgs, 'input'>>;
   createOutputTemplate: Resolver<ResolversTypes['OutputTemplate'], ParentType, ContextType, RequireFields<MutationcreateOutputTemplateArgs, 'input'>>;
   createProject: Resolver<ResolversTypes['Project'], ParentType, ContextType, RequireFields<MutationcreateProjectArgs, 'input'>>;
   createReportingPeriod: Resolver<ResolversTypes['ReportingPeriod'], ParentType, ContextType, RequireFields<MutationcreateReportingPeriodArgs, 'input'>>;
@@ -1100,8 +1100,8 @@ export type MutationRelationResolvers<ContextType = RedwoodGraphQLContext, Paren
   createAgency?: RequiredResolverFn<ResolversTypes['Agency'], ParentType, ContextType, RequireFields<MutationcreateAgencyArgs, 'input'>>;
   createExpenditureCategory?: RequiredResolverFn<ResolversTypes['ExpenditureCategory'], ParentType, ContextType, RequireFields<MutationcreateExpenditureCategoryArgs, 'input'>>;
   createInputTemplate?: RequiredResolverFn<ResolversTypes['InputTemplate'], ParentType, ContextType, RequireFields<MutationcreateInputTemplateArgs, 'input'>>;
-  createOrgAgencyAdmin?: RequiredResolverFn<Maybe<ResolversTypes['CreateOrgAgencyAdminPayload']>, ParentType, ContextType, RequireFields<MutationcreateOrgAgencyAdminArgs, 'input'>>;
   createOrganization?: RequiredResolverFn<ResolversTypes['Organization'], ParentType, ContextType, RequireFields<MutationcreateOrganizationArgs, 'input'>>;
+  createOrganizationAgencyAdmin?: RequiredResolverFn<Maybe<ResolversTypes['CreateOrgAgencyAdminPayload']>, ParentType, ContextType, RequireFields<MutationcreateOrganizationAgencyAdminArgs, 'input'>>;
   createOutputTemplate?: RequiredResolverFn<ResolversTypes['OutputTemplate'], ParentType, ContextType, RequireFields<MutationcreateOutputTemplateArgs, 'input'>>;
   createProject?: RequiredResolverFn<ResolversTypes['Project'], ParentType, ContextType, RequireFields<MutationcreateProjectArgs, 'input'>>;
   createReportingPeriod?: RequiredResolverFn<ResolversTypes['ReportingPeriod'], ParentType, ContextType, RequireFields<MutationcreateReportingPeriodArgs, 'input'>>;
diff --git a/web/src/Routes.tsx b/web/src/Routes.tsx
index c02154ce..9191a97b 100644
--- a/web/src/Routes.tsx
+++ b/web/src/Routes.tsx
@@ -41,6 +41,8 @@ const Routes = () => {
           <Route path="/organizations/{id:Int}" page={OrganizationOrganizationPage} name="organization" />
           <Route path="/organizations" page={OrganizationOrganizationsPage} name="organizations" />
         </PrivateSet>
+        {/* Forbidden page */}
+        <Route path="/forbidden" page={ForbiddenPage} name="forbidden" />
       </PrivateSet>
       <Route path="/login" page={LoginPage} name="login" />
       <Route notfound page={NotFoundPage} />
diff --git a/web/src/components/Organization/EditOrganizationCell/EditOrganizationCell.tsx b/web/src/components/Organization/EditOrganizationCell/EditOrganizationCell.tsx
index 48e87cb4..0e5f0490 100644
--- a/web/src/components/Organization/EditOrganizationCell/EditOrganizationCell.tsx
+++ b/web/src/components/Organization/EditOrganizationCell/EditOrganizationCell.tsx
@@ -8,7 +8,7 @@ import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
 import { useMutation } from '@redwoodjs/web'
 import { toast } from '@redwoodjs/web/toast'
 
-import OrganizationForm from 'src/components/Organization/OrganizationForm'
+import EditOrganizationForm from 'src/components/Organization/EditOrganizationForm/EditOrganizationForm'
 
 export const QUERY = gql`
   query EditOrganizationById($id: Int!) {
@@ -67,7 +67,7 @@ export const Success = ({
         </h2>
       </header>
       <div className="rw-segment-main">
-        <OrganizationForm
+        <EditOrganizationForm
           organization={organization}
           onSave={onSave}
           error={error}
diff --git a/web/src/components/Organization/OrganizationForm/OrganizationForm.tsx b/web/src/components/Organization/EditOrganizationForm/EditOrganizationForm.tsx
similarity index 94%
rename from web/src/components/Organization/OrganizationForm/OrganizationForm.tsx
rename to web/src/components/Organization/EditOrganizationForm/EditOrganizationForm.tsx
index 8605d892..63d74b1a 100644
--- a/web/src/components/Organization/OrganizationForm/OrganizationForm.tsx
+++ b/web/src/components/Organization/EditOrganizationForm/EditOrganizationForm.tsx
@@ -17,14 +17,14 @@ import type { RWGqlError } from '@redwoodjs/forms'
 
 type FormOrganization = NonNullable<EditOrganizationById['organization']>
 
-interface OrganizationFormProps {
+interface EditOrganizationFormProps {
   organization?: EditOrganizationById['organization']
   onSave: (data: UpdateOrganizationInput, id?: FormOrganization['id']) => void
   error: RWGqlError
   loading: boolean
 }
 
-const OrganizationForm = (props: OrganizationFormProps) => {
+const EditOrganizationForm = (props: EditOrganizationFormProps) => {
   const { organization, error, loading } = props
   const formMethods: UseFormReturn<FormOrganization> =
     useForm<FormOrganization>()
@@ -98,4 +98,4 @@ const OrganizationForm = (props: OrganizationFormProps) => {
   )
 }
 
-export default OrganizationForm
+export default EditOrganizationForm
diff --git a/web/src/components/Organization/NewOrganization/NewOrganization.tsx b/web/src/components/Organization/NewOrganization/NewOrganization.tsx
index 296d220f..d392c2d0 100644
--- a/web/src/components/Organization/NewOrganization/NewOrganization.tsx
+++ b/web/src/components/Organization/NewOrganization/NewOrganization.tsx
@@ -8,7 +8,7 @@ import NewOrganizationForm from 'src/components/Organization/NewOrganizationForm
 
 const CREATE_ORGANIZATION_AGENCY_ADMIN_MUTATION = gql`
   mutation CreateOrgAgencyAdminMutation($input: CreateOrgAgencyAdminInput!) {
-    createOrgAgencyAdmin(input: $input) {
+    createOrganizationAgencyAdmin(input: $input) {
       organization {
         id
       }
@@ -37,7 +37,7 @@ const NewOrganization = () => {
   return (
     <div className="rw-segment">
       <header className="rw-segment-header">
-        <h2 className="rw-heading rw-heading-secondary">Organization</h2>
+        <h2 className="rw-heading rw-heading-secondary">Add Organization</h2>
       </header>
       <div className="rw-segment-main">
         <NewOrganizationForm onSave={onSave} loading={loading} error={error} />
diff --git a/web/src/components/Organization/NewOrganizationForm/NewOrganizationForm.tsx b/web/src/components/Organization/NewOrganizationForm/NewOrganizationForm.tsx
index fc049127..81abe7cf 100644
--- a/web/src/components/Organization/NewOrganizationForm/NewOrganizationForm.tsx
+++ b/web/src/components/Organization/NewOrganizationForm/NewOrganizationForm.tsx
@@ -1,6 +1,6 @@
 import { Button } from 'react-bootstrap'
 import { useForm, UseFormReturn } from 'react-hook-form'
-import type { EditOrganizationById } from 'types/graphql'
+import type { CreateOrgAgencyAdminInput } from 'types/graphql'
 
 import {
   Form,
@@ -12,20 +12,17 @@ import {
 } from '@redwoodjs/forms'
 import type { RWGqlError } from '@redwoodjs/forms'
 
-type FormOrganization = NonNullable<EditOrganizationById['organization']>
-
-interface AddOrganizationFormProps {
-  organization?: EditOrganizationById['organization']
-  onSave: (data: any, id?: FormOrganization['id']) => void
+interface NewOrganizationFormProps {
+  onSave: (data: CreateOrgAgencyAdminInput) => void
   error: RWGqlError
   loading: boolean
 }
 
 /* 
-  This form creates a new organization, a new agency assigned to that organization, 
-  and a new admin user assigned to that agency.
+  This form creates a new organization, assigns a new agency to that organization, 
+  and assigns a new admin user to both the organization and the agency.
 */
-const NewOrganizationForm = (props: AddOrganizationFormProps) => {
+const NewOrganizationForm = (props: NewOrganizationFormProps) => {
   const { onSave, error, loading } = props
   const formMethods: UseFormReturn = useForm()
   const hasErrors = Object.keys(formMethods.formState.errors).length > 0
diff --git a/web/src/pages/ForbiddenPage/ForbiddenPage.stories.tsx b/web/src/pages/ForbiddenPage/ForbiddenPage.stories.tsx
new file mode 100644
index 00000000..71ea507d
--- /dev/null
+++ b/web/src/pages/ForbiddenPage/ForbiddenPage.stories.tsx
@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react'
+
+import ForbiddenPage from './ForbiddenPage'
+
+const meta: Meta<typeof ForbiddenPage> = {
+  component: ForbiddenPage,
+}
+
+export default meta
+
+type Story = StoryObj<typeof ForbiddenPage>
+
+export const Primary: Story = {}
diff --git a/web/src/pages/ForbiddenPage/ForbiddenPage.test.tsx b/web/src/pages/ForbiddenPage/ForbiddenPage.test.tsx
new file mode 100644
index 00000000..8de25ac8
--- /dev/null
+++ b/web/src/pages/ForbiddenPage/ForbiddenPage.test.tsx
@@ -0,0 +1,14 @@
+import { render } from '@redwoodjs/testing/web'
+
+import ForbiddenPage from './ForbiddenPage'
+
+//   Improve this test with help from the Redwood Testing Doc:
+//   https://redwoodjs.com/docs/testing#testing-pages-layouts
+
+describe('ForbiddenPage', () => {
+  it('renders successfully', () => {
+    expect(() => {
+      render(<ForbiddenPage />)
+    }).not.toThrow()
+  })
+})
diff --git a/web/src/pages/ForbiddenPage/ForbiddenPage.tsx b/web/src/pages/ForbiddenPage/ForbiddenPage.tsx
new file mode 100644
index 00000000..86110985
--- /dev/null
+++ b/web/src/pages/ForbiddenPage/ForbiddenPage.tsx
@@ -0,0 +1,12 @@
+import { MetaTags } from '@redwoodjs/web'
+
+const ForbiddenPage = () => {
+  return (
+    <>
+      <MetaTags title="Forbidden" description="Forbidden page" />
+      <h2>Access to this page is restricted.</h2>
+    </>
+  )
+}
+
+export default ForbiddenPage
diff --git a/web/types/graphql.d.ts b/web/types/graphql.d.ts
index df8dc238..936b6e77 100644
--- a/web/types/graphql.d.ts
+++ b/web/types/graphql.d.ts
@@ -164,8 +164,8 @@ export type Mutation = {
   createAgency: Agency;
   createExpenditureCategory: ExpenditureCategory;
   createInputTemplate: InputTemplate;
-  createOrgAgencyAdmin?: Maybe<CreateOrgAgencyAdminPayload>;
   createOrganization: Organization;
+  createOrganizationAgencyAdmin?: Maybe<CreateOrgAgencyAdminPayload>;
   createOutputTemplate: OutputTemplate;
   createProject: Project;
   createReportingPeriod: ReportingPeriod;
@@ -216,13 +216,13 @@ export type MutationcreateInputTemplateArgs = {
 };
 
 
-export type MutationcreateOrgAgencyAdminArgs = {
-  input: CreateOrgAgencyAdminInput;
+export type MutationcreateOrganizationArgs = {
+  input: CreateOrganizationInput;
 };
 
 
-export type MutationcreateOrganizationArgs = {
-  input: CreateOrganizationInput;
+export type MutationcreateOrganizationAgencyAdminArgs = {
+  input: CreateOrgAgencyAdminInput;
 };
 
 
@@ -826,7 +826,7 @@ export type CreateOrgAgencyAdminMutationVariables = Exact<{
 }>;
 
 
-export type CreateOrgAgencyAdminMutation = { __typename?: 'Mutation', createOrgAgencyAdmin?: { __typename?: 'CreateOrgAgencyAdminPayload', organization?: { __typename?: 'Organization', id: number } | null } | null };
+export type CreateOrgAgencyAdminMutation = { __typename?: 'Mutation', createOrganizationAgencyAdmin?: { __typename?: 'CreateOrgAgencyAdminPayload', organization?: { __typename?: 'Organization', id: number } | null } | null };
 
 export type DeleteOrganizationMutationVariables = Exact<{
   id: Scalars['Int'];