chore(plugin-multi-tenant): remove SELECT_ALL constant (#11660)

Author: JarrodMFlesch

examples/multi-tenant/pnpm-lock.yaml

@@ -5,7 +5,6 @@ import type { RelationshipFieldClientProps } from 'payload'
 import { RelationshipField, useField } from '@payloadcms/ui'
 import React from 'react'
 
-import { SELECT_ALL } from '../../constants.js'
 import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'
 import './index.scss'
 
@@ -30,14 +29,11 @@ export const TenantField = (args: Props) => {
         setTenant({ id: value, refresh: unique })
       } else {
         // in the document view, the tenant field should always have a value
-        const defaultValue =
-          !selectedTenantID || selectedTenantID === SELECT_ALL
-            ? options[0]?.value
-            : selectedTenantID
+        const defaultValue = selectedTenantID || options[0]?.value
         setTenant({ id: defaultValue, refresh: unique })
       }
       hasSetValueRef.current = true
-    } else if ((!value || value !== selectedTenantID) && selectedTenantID !== SELECT_ALL) {
+    } else if (!value || value !== selectedTenantID) {
       // Update the field on the document value when the tenant is changed
       setValue(selectedTenantID)
     }

packages/plugin-multi-tenant/src/components/TenantField/index.client.tsx

@@ -7,7 +7,6 @@ import './index.scss'
 import { SelectInput, useTranslation } from '@payloadcms/ui'
 import React from 'react'
 
-import { SELECT_ALL } from '../../constants.js'
 import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'
 
 export const TenantSelector = ({ label, viewType }: { label: string; viewType?: ViewTypes }) => {
@@ -38,13 +37,7 @@ export const TenantSelector = ({ label, viewType }: { label: string; viewType?:
         onChange={handleChange}
         options={options}
         path="setTenant"
-        value={
-          selectedTenantID
-            ? selectedTenantID === SELECT_ALL
-              ? undefined
-              : (selectedTenantID as string)
-            : undefined
-        }
+        value={selectedTenantID as string | undefined}
       />
     </div>
   )

packages/plugin-multi-tenant/src/components/TenantSelector/index.tsx

@@ -1,6 +1,5 @@
 import type { PayloadRequest, Where } from 'payload'
 
-import { SELECT_ALL } from '../constants.js'
 import { getCollectionIDType } from '../utilities/getCollectionIDType.js'
 import { getTenantFromCookie } from '../utilities/getTenantFromCookie.js'
 
@@ -20,13 +19,13 @@ export const filterDocumentsBySelectedTenant = ({
   })
   const selectedTenant = getTenantFromCookie(req.headers, idType)
 
-  if (selectedTenant === SELECT_ALL) {
-    return {}
+  if (selectedTenant) {
+    return {
+      [tenantFieldName]: {
+        equals: selectedTenant,
+      },
+    }
   }
 
-  return {
-    [tenantFieldName]: {
-      equals: selectedTenant,
-    },
-  }
+  return {}
 }

packages/plugin-multi-tenant/src/constants.ts

@@ -1,6 +1,5 @@
 import type { PayloadRequest, Where } from 'payload'
 
-import { SELECT_ALL } from '../constants.js'
 import { getCollectionIDType } from '../utilities/getCollectionIDType.js'
 import { getTenantFromCookie } from '../utilities/getTenantFromCookie.js'
 
@@ -18,13 +17,13 @@ export const filterTenantsBySelectedTenant = ({
   })
   const selectedTenant = getTenantFromCookie(req.headers, idType)
 
-  if (selectedTenant === SELECT_ALL) {
-    return {}
+  if (selectedTenant) {
+    return {
+      id: {
+        equals: selectedTenant,
+      },
+    }
   }
 
-  return {
-    id: {
-      equals: selectedTenant,
-    },
-  }
+  return {}
 }

packages/plugin-multi-tenant/src/list-filters/filterDocumentsBySelectedTenant.ts

@@ -1,6 +1,5 @@
 import type { PayloadRequest, Where } from 'payload'
 
-import { SELECT_ALL } from '../constants.js'
 import { getCollectionIDType } from '../utilities/getCollectionIDType.js'
 import { getTenantFromCookie } from '../utilities/getTenantFromCookie.js'
 
@@ -25,13 +24,13 @@ export const filterUsersBySelectedTenant = ({
   })
   const selectedTenant = getTenantFromCookie(req.headers, idType)
 
-  if (selectedTenant === SELECT_ALL) {
-    return {}
+  if (selectedTenant) {
+    return {
+      [`${tenantsArrayFieldName}.${tenantsArrayTenantFieldName}`]: {
+        in: [selectedTenant],
+      },
+    }
   }
 
-  return {
-    [`${tenantsArrayFieldName}.${tenantsArrayTenantFieldName}`]: {
-      in: [selectedTenant],
-    },
-  }
+  return {}
 }

packages/plugin-multi-tenant/src/list-filters/filterTenantsBySelectedTenant.ts

@@ -6,8 +6,6 @@ import { useAuth } from '@payloadcms/ui'
 import { useRouter } from 'next/navigation.js'
 import React, { createContext } from 'react'
 
-import { SELECT_ALL } from '../../constants.js'
-
 type ContextType = {
   /**
    * Array of options to select from
@@ -76,8 +74,8 @@ export const TenantSelectionProviderClient = ({
     ({ id, refresh }) => {
       if (id === undefined) {
         if (tenantOptions.length > 1) {
-          setSelectedTenantID(SELECT_ALL)
-          setCookie(SELECT_ALL)
+          setSelectedTenantID(undefined)
+          deleteCookie()
         } else {
           setSelectedTenantID(tenantOptions[0]?.value)
           setCookie(String(tenantOptions[0]?.value))
@@ -90,15 +88,11 @@ export const TenantSelectionProviderClient = ({
         router.refresh()
       }
     },
-    [setSelectedTenantID, setCookie, router, preventRefreshOnChange, tenantOptions],
+    [deleteCookie, preventRefreshOnChange, router, setCookie, setSelectedTenantID, tenantOptions],
   )
 
   React.useEffect(() => {
-    if (
-      selectedTenantID &&
-      selectedTenantID !== SELECT_ALL &&
-      !tenantOptions.find((option) => option.value === selectedTenantID)
-    ) {
+    if (selectedTenantID && !tenantOptions.find((option) => option.value === selectedTenantID)) {
       if (tenantOptions?.[0]?.value) {
         setTenant({ id: tenantOptions[0].value, refresh: true })
       } else {
@@ -111,9 +105,13 @@ export const TenantSelectionProviderClient = ({
     if (userID && !tenantCookie) {
       // User is logged in, but does not have a tenant cookie, set it
       setSelectedTenantID(initialValue)
-      setCookie(String(initialValue))
+      if (initialValue) {
+        setCookie(String(initialValue))
+      } else {
+        deleteCookie()
+      }
     }
-  }, [userID, tenantCookie, initialValue, setCookie, router])
+  }, [userID, tenantCookie, initialValue, setCookie, deleteCookie, router])
 
   React.useEffect(() => {
     if (!userID && tenantCookie) {
@@ -131,7 +129,7 @@ export const TenantSelectionProviderClient = ({
       data-selected-tenant-id={selectedTenantID}
       data-selected-tenant-title={selectedTenantLabel}
     >
-      <Context.Provider
+      <Context
         value={{
           options: tenantOptions,
           selectedTenantID,
@@ -140,9 +138,9 @@ export const TenantSelectionProviderClient = ({
         }}
       >
         {children}
-      </Context.Provider>
+      </Context>
     </span>
   )
 }
 
-export const useTenantSelection = () => React.useContext(Context)
+export const useTenantSelection = () => React.use(Context)

packages/plugin-multi-tenant/src/list-filters/filterUsersBySelectedTenant.ts

@@ -2,7 +2,6 @@ import type { OptionObject, Payload, User } from 'payload'
 
 import { cookies as getCookies } from 'next/headers.js'
 
-import { SELECT_ALL } from '../../constants.js'
 import { findTenantOptions } from '../../queries/findTenantOptions.js'
 import { TenantSelectionProviderClient } from './index.client.js'
 
@@ -43,18 +42,24 @@ export const TenantSelectionProvider = async ({
   let tenantCookie = cookies.get('payload-tenant')?.value
   let initialValue = undefined
 
-  if (tenantOptions.length > 1 && tenantCookie === SELECT_ALL) {
-    initialValue = SELECT_ALL
-  } else {
+  /**
+   * Ensure the cookie is a valid tenant
+   */
+  if (tenantCookie) {
     const matchingOption = tenantOptions.find((option) => String(option.value) === tenantCookie)
     if (matchingOption) {
       initialValue = matchingOption.value
-    } else {
-      tenantCookie = undefined
-      initialValue = tenantOptions.length > 1 ? SELECT_ALL : tenantOptions[0]?.value
     }
   }
 
+  /**
+   * If the there was no cookie or the cookie was an invalid tenantID set intialValue
+   */
+  if (!initialValue) {
+    tenantCookie = undefined
+    initialValue = tenantOptions.length > 1 ? undefined : tenantOptions[0]?.value
+  }
+
   return (
     <TenantSelectionProviderClient
       initialValue={initialValue}

packages/plugin-multi-tenant/src/providers/TenantSelectionProvider/index.client.tsx

@@ -1,6 +1,5 @@
 import type { Payload, User, ViewTypes } from 'payload'
 
-import { SELECT_ALL } from '../constants.js'
 import { findTenantOptions } from '../queries/findTenantOptions.js'
 import { getCollectionIDType } from './getCollectionIDType.js'
 import { getTenantFromCookie } from './getTenantFromCookie.js'
@@ -34,7 +33,7 @@ export async function getGlobalViewRedirect({
   let tenant = getTenantFromCookie(headers, idType)
   let redirectRoute
 
-  if (!tenant || tenant === SELECT_ALL) {
+  if (!tenant) {
     const tenantsQuery = await findTenantOptions({
       limit: 1,
       payload,