brandxtech/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed devices page not refreshing after changing group

Browse source
This commit is contained in:
Carter 2025-02-21 14:00:46 -06:00
parent db1b3c54a4
commit 538c807766
3 changed files with 30 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

40
src/group/GroupSettings.tsx
View file

@ -61,7 +61,7 @@ interface Props {
mode?: "add" | "update" | "remove" | undefined;
isDialogOpen: boolean;
closeDialogCallback: Function;
refreshCallback: Function;
refreshCallback: () => void;
canEdit?: boolean;
groupDevices?: Device[];
}
@ -76,11 +76,12 @@ export default function GroupSettings(props: Props) {
closeDialogCallback,
refreshCallback,
canEdit,
groupDevices
groupDevices,
} = props;
const prevInitialGroup = usePrevious(initialGroup);
const groupAPI = useGroupAPI();
const deviceAPI = useDeviceAPI();
const snackbar = useSnackbar()
const [devices, setDevices] = useState<Device[]>([]);
const [group, setGroup] = useState<Group>(initialGroup ? Group.clone(initialGroup) : new Group());
const [isRemoveGroupOpen, setIsRemoveGroupOpen] = useState<boolean>(
@ -92,6 +93,16 @@ export default function GroupSettings(props: Props) {
const [deviceSearch, setDeviceSearch] = useState<string>("");
const [loadingDevices, setLoadingDevices] = useState<boolean>(false);
const [groupDeviceNumbers, setGroupDeviceNumbers] = useState<number[]>([])
useEffect(() => {
let newNumbers: number[] = []
groupDevices?.forEach(device => {
newNumbers.push(device.id())
})
setGroupDeviceNumbers(newNumbers)
}, [groupDevices])
const loadDevices = useCallback(() => {
setLoadingDevices(true);
deviceAPI
@ -116,10 +127,9 @@ export default function GroupSettings(props: Props) {
}
if (prevTabIndex !== 1 && tabIndex === 1) {
console.log("loading?")
loadDevices();
}
}, [initialGroup, loadDevices, prevInitialGroup, prevTabIndex, props, tabIndex, groupDevices]);
}, [initialGroup, loadDevices, prevInitialGroup, prevTabIndex, props, tabIndex]);
const close = () => {
closeDialogCallback();
@ -311,8 +321,7 @@ export default function GroupSettings(props: Props) {
<Checkbox
edge="end"
onChange={() => changeDevices(device.id())}
// checked={group.settings.devices.includes(device.id())}
checked={groupDevices?.some(dev => dev.id() === device.id())}
checked={groupDeviceNumbers.includes(device.id())}
inputProps={{ "aria-labelledby": label }}
disabled={!canEdit}
/>
@ -331,20 +340,26 @@ export default function GroupSettings(props: Props) {
//}, [groupDevices])
const addDevice = (device: number) => {
console.log("adding device?????")
groupAPI.addDevice(group.id(), device).then(() => {
console.log("successfully added")
let newDevices = [...groupDeviceNumbers];
newDevices.push(device)
setGroupDeviceNumbers(newDevices)
snackbar.success("Device " + device + " successfully added to group")
refreshCallback();
}).catch(() => {
console.log("Error adding")
snackbar.error("Failed to add device")
});
};
const removeDevice = (device: number) => {
groupAPI.removeDevice(group.id(), device).then(() => {
console.log("successfully removed")
let newDevices = groupDeviceNumbers.filter(dev => dev !== device)
setGroupDeviceNumbers(newDevices)
snackbar.success("Device " + device + " successfully removed from group")
refreshCallback();
});
}).catch(() => {
snackbar.error("Failed to remove device")
})
};
const devicesTab = () => {
@ -375,7 +390,8 @@ export default function GroupSettings(props: Props) {
if (checked) addDevice(device.id());
else removeDevice(device.id());
}}
checked={Boolean(groupDevices?.find(dev => dev.id() === device.id()))}
// checked={Boolean(groupDevices?.find(dev => dev.id() === device.id()))}
checked={groupDeviceNumbers.includes(device.id())}
inputProps={{ "aria-labelledby": label }}
disabled={!canEdit}
/>