fix: fix empty checkboxes when selecting a bulk action

SoftwareBrothers · Jan 24, 2024 · df54a10 · df54a10
1 parent c4de228
commit df54a10
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 6 deletions.
diff --git a/src/backend/controllers/app-controller.ts b/src/backend/controllers/app-controller.ts
@@ -35,7 +35,7 @@ export default class AppController {
     if (!recordIds) {
       throw new Error('you have to give "recordIds" in the request parameters')
     }
-    const arrayOfIds = recordIds.split(',')
+    const arrayOfIds = recordIds?.split?.(',')
     const href = this.h.bulkActionUrl({ resourceId, actionName, recordIds: arrayOfIds })
     return layoutTemplate(this._admin, this.currentAdmin, href)
   }

diff --git a/src/frontend/components/actions/list.tsx b/src/frontend/components/actions/list.tsx
@@ -45,8 +45,13 @@ const List: React.FC<ActionProps> = ({ resource, setTag }) => {
     const search = new URLSearchParams(location.search)
     if (search.get(REFRESH_KEY)) {
       setSelectedRecords([])
+    } else {
+      const recordIds = search.get('recordIds')?.split?.(',') ?? []
+      setSelectedRecords(
+        records.filter((r) => recordIds.includes(r.id.toString())),
+      )
     }
-  }, [location.search])
+  }, [location.search, records])
 
   const handleActionPerformed = (): any => fetchData()
 

diff --git a/src/frontend/components/app/records-table/selected-records.tsx b/src/frontend/components/app/records-table/selected-records.tsx
@@ -51,7 +51,9 @@ const SelectedRecords: React.FC<SelectedRecordsProps> = (props) => {
     translateFunctions,
     modalFunctions,
   })
+
   const contentTag = getResourceElementCss(resource.id, 'table-caption')
+
   return (
     <TableCaption data-css={contentTag}>
       <Box flex py="sm" alignItems="center">

diff --git a/src/frontend/components/routes/bulk-action.tsx b/src/frontend/components/routes/bulk-action.tsx
@@ -66,7 +66,7 @@ const BulkAction: React.FC = () => {
 
   useEffect(() => {
     fetchRecords()
-  }, [params.resourceId, params.actionName])
+  }, [params.resourceId, params.actionName, location.search])
 
   if (!resource) {
     return <NoResourceError resourceId={resourceId!} />
@@ -121,6 +121,7 @@ const BulkAction: React.FC = () => {
             action={action as ActionJSON}
             resource={resource}
             records={records}
+            setTag={setTag}
           />
         </DrawerPortal>
         <Wrapper width={listAction.containerWidth}>
@@ -138,8 +139,13 @@ const BulkAction: React.FC = () => {
 
   return (
     <Wrapper width={action.containerWidth}>
-      {!action?.showInDrawer ? <ActionHeader resource={resource} action={action} /> : ''}
-      <BaseActionComponent action={action as ActionJSON} resource={resource} records={records} />
+      {!action?.showInDrawer ? <ActionHeader resource={resource} action={action} tag={tag} /> : ''}
+      <BaseActionComponent
+        action={action as ActionJSON}
+        resource={resource}
+        records={records}
+        setTag={setTag}
+      />
     </Wrapper>
   )
 }

diff --git a/src/frontend/interfaces/action/action-href.ts b/src/frontend/interfaces/action/action-href.ts
@@ -14,6 +14,10 @@ export const actionHref = (
     return null
   }
 
+  if (params.recordIds?.length) {
+    params.recordIds = [...new Set(params.recordIds)]
+  }
+
   const hrefMap = {
     record: (): string => h.recordActionUrl({
       ...params as RecordActionParams,

diff --git a/src/frontend/interfaces/action/build-action-click-handler.ts b/src/frontend/interfaces/action/build-action-click-handler.ts
@@ -10,6 +10,7 @@ import { ActionJSON } from './action-json.interface.js'
 import { buildActionCallApiTrigger } from './build-action-api-call-trigger.js'
 import { TranslateFunctions } from '../../../utils/index.js'
 import { ModalData, ModalFunctions } from '../modal.interface.js'
+import { REFRESH_KEY } from '../../components/actions/utils/append-force-refresh.js'
 
 export type BuildActionClickOptions = {
   action: ActionJSON
@@ -71,9 +72,13 @@ export const buildActionClickHandler = (
       const hrefParams = new URLSearchParams(url.search)
       const currentParams = new URLSearchParams(action.showInDrawer ? location?.search ?? '' : '')
       Object.entries(Object.fromEntries(currentParams.entries())).forEach(([key, value]) => {
-        hrefParams.append(key, value)
+        if (!hrefParams.has(key)) hrefParams.set(key, value)
       })
 
+      if (location?.pathname === url.pathname) {
+        hrefParams.set(REFRESH_KEY, 'true')
+      }
+
       navigate({
         pathname: url.pathname,
         search: hrefParams.toString(),