added remove callback for group settings dialog

src/group/GroupSettings.tsx

@@ -62,6 +62,7 @@ interface Props {
   refreshCallback: () => void;
   canEdit?: boolean;
   groupDevices?: Device[];
+  removeGroupCallback?: Function;
 }
 
 export default function GroupSettings(props: Props) {
@@ -75,6 +76,7 @@ export default function GroupSettings(props: Props) {
     refreshCallback,
     canEdit,
     groupDevices,
+    removeGroupCallback,
   } = props;
   const prevInitialGroup = usePrevious(initialGroup);
   const [{as}] = useGlobalState();
@@ -94,6 +96,15 @@ export default function GroupSettings(props: Props) {
 
   const [groupDeviceNumbers, setGroupDeviceNumbers] = useState<number[]>([])
 
+  // Use a ref to store removeGroupCallback
+  const removeCallbackRef = React.useRef(removeGroupCallback);
+
+  // Update ref when prop changes
+  useEffect(() => {
+    console.log("Updating removeCallbackRef with:", removeGroupCallback);
+    removeCallbackRef.current = removeGroupCallback;
+  }, [removeGroupCallback]);
+
   useEffect(() => {
     let newNumbers: number[] = []
     groupDevices?.forEach(device => {
@@ -471,11 +482,14 @@ export default function GroupSettings(props: Props) {
   };
 
   const dialogs = () => {
+    console.log("dialogs: removeCallbackRef.current =", removeCallbackRef.current); // Log ref
+    console.log("dialogs: removeGroupCallback =", removeGroupCallback); // Log prop
     return (
       <RemoveGroup
         group={group}
         isDialogOpen={isRemoveGroupOpen}
         closeDialogCallback={closeRemoveGroup}
+        removeCallback={removeCallbackRef.current}
       />
     );
   };

src/group/RemoveGroup.tsx

@@ -25,6 +25,7 @@ interface Props {
   group: Group;
   isDialogOpen: boolean;
   closeDialogCallback: Function;
+  removeCallback?: Function;
 }
 
 export default function RemoveGroup(props: Props) {
@@ -32,7 +33,7 @@ export default function RemoveGroup(props: Props) {
   const navigate = useNavigate();
   const groupAPI = useGroupAPI();
   const { success, error, warning } = useSnackbar();
-  const { group, isDialogOpen, closeDialogCallback } = props;
+  const { group, isDialogOpen, closeDialogCallback, removeCallback } = props;
   let groupName = group.name();
 
   const closeDialog = () => {
@@ -45,10 +46,15 @@ export default function RemoveGroup(props: Props) {
       .then((response: any) => {
         success(groupName + " was successfully removed");
         // navigate("/groups");
+        console.log(removeCallback)
+        if (removeCallback) removeCallback()
+        // removeCallback()
       })
       .catch((err: any) => {
         err ? warning(err) : error("Error occured while removing " + groupName);
         closeDialog();
+      }).finally(() => {
+        closeDialogCallback()
       });
   };