add bulk actions to user's rooms tab

Author: aine-etke

src/components/DeleteRoomButton.tsx

@@ -13,6 +13,8 @@ import {
   useDeleteMany,
   Identifier,
   useUnselectAll,
+  useRecordContext,
+  useResourceContext,
 } from "react-admin";
 
 interface DeleteRoomButtonProps {
@@ -34,11 +36,20 @@ const DeleteRoomButton: React.FC<DeleteRoomButtonProps> = props => {
   const [deleteMany, { isLoading }] = useDeleteMany();
   const unselectAll = useUnselectAll(resourceName);
   const recordIds = props.selectedIds;
+  const record = useRecordContext();
+  const resource = useResourceContext();
+
+  let redirectTo = "/rooms";
+  // If the room(-s) are being deleted from a user's joined rooms list,
+  // redirect back to that list after deletion
+  if (resource === "joined_rooms" && record?.id) {
+    redirectTo = `/users/${encodeURIComponent(record.id)}/rooms`;
+  }
 
   const handleDialogOpen = () => setOpen(true);
   const handleDialogClose = () => setOpen(false);
 
-  const handleDelete = (values: { block: boolean }) => {
+  const handleDelete = (values: { block: boolean }, redirectTo: string) => {
     deleteMany(
       resourceName,
       { ids: recordIds, meta: values },
@@ -47,7 +58,7 @@ const DeleteRoomButton: React.FC<DeleteRoomButtonProps> = props => {
           notify("resources.rooms.action.erase.success");
           handleDialogClose();
           unselectAll();
-          redirect("/rooms");
+          redirect(redirectTo);
         },
         /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
         onError: (error: any) =>
@@ -58,7 +69,7 @@ const DeleteRoomButton: React.FC<DeleteRoomButtonProps> = props => {
 
   const handleConfirm = () => {
     setOpen(false);
-    handleDelete({ block: block });
+    handleDelete({ block: block }, redirectTo);
   };
 
   return (

src/resources/rooms.tsx

@@ -427,7 +427,7 @@ export const RoomShow = (props: ShowProps) => {
   );
 };
 
-const RoomBulkActionButtons = () => {
+export const RoomBulkActionButtons = () => {
   const record = useListContext();
   return (
     <>

src/resources/users.tsx

@@ -72,7 +72,7 @@ import {
 import { useFormContext } from "react-hook-form";
 import { Link } from "react-router-dom";
 
-import { MakeAdminBtn } from "./rooms";
+import { MakeAdminBtn, RoomBulkActionButtons } from "./rooms";
 import AvatarField from "../components/AvatarField";
 import DeleteUserButton from "../components/DeleteUserButton";
 import DeviceRemoveButton from "../components/DeviceRemoveButton";
@@ -695,7 +695,11 @@ export const UserEdit = (props: EditProps) => {
             perPage={10}
             pagination={<Pagination />}
           >
-            <Datagrid sx={{ width: "100%" }} rowClick={id => "/rooms/" + id + "/show"} bulkActionButtons={false}>
+            <Datagrid
+              sx={{ width: "100%" }}
+              rowClick={id => "/rooms/" + id + "/show"}
+              bulkActionButtons={<RoomBulkActionButtons />}
+            >
               <ReferenceField reference="rooms" source="id" label={false} link={false} sortable={false}>
                 <AvatarField source="avatar" sx={{ height: "40px", width: "40px" }} />
               </ReferenceField>