feat(backend/frontend): 3256 able to view deleted tenant

packages/backend/src/tenants/service.test.ts

@@ -75,7 +75,7 @@ describe('Tenant Service', (): void => {
       expect(tenant).toEqual(createdTenant)
     })
 
-    test('returns undefined if tenant is deleted', async (): Promise<void> => {
+    test('returns deletedAt set if tenant is deleted', async (): Promise<void> => {
       const dbTenant = await Tenant.query(knex).insertAndFetch({
         apiSecret: 'test-secret',
         email: faker.internet.email(),
@@ -85,10 +85,10 @@ describe('Tenant Service', (): void => {
       })
 
       const tenant = await tenantService.get(dbTenant.id)
-      expect(tenant).toBeUndefined()
+      expect(tenant?.deletedAt).toBeDefined()
     })
 
-    test('returns undefined if tenant is deleted', async (): Promise<void> => {
+    test('returns deletedAt set if tenant is deleted', async (): Promise<void> => {
       const dbTenant = await Tenant.query(knex).insertAndFetch({
         apiSecret: 'test-secret',
         email: faker.internet.email(),
@@ -98,7 +98,7 @@ describe('Tenant Service', (): void => {
       })
 
       const tenant = await tenantService.get(dbTenant.id)
-      expect(tenant).toBeUndefined()
+      expect(tenant?.deletedAt).toBeDefined()
     })
   })
 
@@ -409,7 +409,8 @@ describe('Tenant Service', (): void => {
               .mockImplementation(async () => undefined)
             await tenantService.delete(tenant.id)
 
-            await expect(tenantService.get(tenant.id)).resolves.toBeUndefined()
+            const tenantDeleted = await tenantService.get(tenant.id)
+            await expect(tenantDeleted?.deletedAt).toBeDefined()
 
             // Ensure that cache was set for deletion
             expect(spyCacheDelete).toHaveBeenCalledTimes(1)

packages/backend/src/tenants/service.ts

@@ -43,9 +43,7 @@ async function getTenant(
 ): Promise<Tenant | undefined> {
   const inMem = await deps.tenantCache.get(id)
   if (inMem) return inMem
-  const tenant = await Tenant.query(deps.knex)
-    .findById(id)
-    .whereNull('deletedAt')
+  const tenant = await Tenant.query(deps.knex).findById(id)
   if (tenant) await deps.tenantCache.set(tenant.id, tenant)
 
   return tenant

packages/frontend/app/routes/tenants.$tenantId.tsx

@@ -41,12 +41,13 @@ export async function loader({ request, params }: LoaderFunctionArgs) {
   if (!tenant)
     throw json(null, { status: 404, statusText: 'Tenant not found.' })
 
+  const tenantDeleted = tenant.deletedAt ? tenant.deletedAt.length > 0 : false
   const me = await whoAmI(request)
-  return json({ tenant, me })
+  return json({ tenant, me, tenantDeleted })
 }
 
 export default function ViewTenantPage() {
-  const { tenant, me } = useLoaderData<typeof loader>()
+  const { tenant, me, tenantDeleted } = useLoaderData<typeof loader>()
   const response = useActionData<typeof action>()
   const navigation = useNavigation()
   const [formData, setFormData] = useState<FormData>()
@@ -78,7 +79,9 @@ export default function ViewTenantPage() {
           <div className='col-span-1 pt-3'>
             <h3 className='text-lg font-medium'>General Information</h3>
             <p className='text-sm'>
-              Created at {new Date(tenant.createdAt).toLocaleString()}
+              {tenantDeleted && tenant.deletedAt
+                ? `Deleted at ${new Date(tenant.deletedAt).toLocaleString()}`
+                : `Created at ${new Date(tenant.createdAt).toLocaleString()}`}
             </p>
             <ErrorPanel errors={response?.errors.message} />
           </div>
@@ -102,25 +105,29 @@ export default function ViewTenantPage() {
                   <Input
                     label='Public Name'
                     name='publicName'
+                    disabled={tenantDeleted}
                     defaultValue={tenant.publicName ?? undefined}
                     error={response?.errors?.fieldErrors.publicName}
                   />
                   <Input
                     label='Email'
                     name='email'
+                    disabled={tenantDeleted}
                     defaultValue={tenant.email ?? undefined}
                     error={response?.errors?.fieldErrors.email}
                   />
                 </div>
                 <div className='flex justify-end p-4'>
-                  <Button
-                    aria-label='save general information'
-                    type='submit'
-                    name='intent'
-                    value='general'
-                  >
-                    {isSubmitting ? 'Saving ...' : 'Save'}
-                  </Button>
+                  {!tenantDeleted && (
+                    <Button
+                      aria-label='save general information'
+                      type='submit'
+                      name='intent'
+                      value='general'
+                    >
+                      {isSubmitting ? 'Saving ...' : 'Save'}
+                    </Button>
+                  )}
                 </div>
               </fieldset>
             </Form>
@@ -147,25 +154,29 @@ export default function ViewTenantPage() {
                   <Input
                     name='idpConsentUrl'
                     label='Consent URL'
+                    disabled={tenantDeleted}
                     defaultValue={tenant.idpConsentUrl ?? undefined}
                     error={response?.errors?.fieldErrors.idpConsentUrl}
                   />
                   <PasswordInput
                     name='idpSecret'
                     label='Secret'
+                    disabled={tenantDeleted}
                     defaultValue={tenant.idpSecret ?? undefined}
                     error={response?.errors?.fieldErrors.idpSecret}
                   />
                 </div>
                 <div className='flex justify-end p-4'>
-                  <Button
-                    aria-label='save ip information'
-                    type='submit'
-                    name='intent'
-                    value='ip'
-                  >
-                    {isSubmitting ? 'Saving ...' : 'Save'}
-                  </Button>
+                  {!tenantDeleted && (
+                    <Button
+                      aria-label='save ip information'
+                      type='submit'
+                      name='intent'
+                      value='ip'
+                    >
+                      {isSubmitting ? 'Saving ...' : 'Save'}
+                    </Button>
+                  )}
                 </div>
               </fieldset>
             </Form>
@@ -197,7 +208,7 @@ export default function ViewTenantPage() {
         </div>
         {/* Sensitive - END */}
         {/* DELETE TENANT - Danger zone */}
-        {me.isOperator && me.id !== tenant.id && (
+        {!tenantDeleted && me.isOperator && me.id !== tenant.id && (
           <DangerZone title='Delete Tenant'>
             <Form method='post' onSubmit={submitHandler}>
               <Input type='hidden' name='id' value={tenant.id} />

packages/frontend/app/routes/tenants._index.tsx

@@ -80,12 +80,8 @@ export default function TenantsPage() {
               tenantEdges.map((tenant) => (
                 <Table.Row
                   key={tenant.node.id}
-                  className={tenant.node.deletedAt ? '' : 'cursor-pointer'}
-                  onClick={() =>
-                    tenant.node.deletedAt
-                      ? 'return'
-                      : navigate(`/tenants/${tenant.node.id}`)
-                  }
+                  className='cursor-pointer'
+                  onClick={() => navigate(`/tenants/${tenant.node.id}`)}
                 >
                   <Table.Cell>
                     <div className='flex flex-col'>