separateDust setting will persist in local storage

src/pages/Devices.tsx

@@ -123,7 +123,15 @@ export default function Devices() {
   const [groupSettingsIsOpen, setGroupSettingsIsOpen] = useState<boolean>(false);
 
   const [fieldContains, setFieldContains] = useState<Map<string, string>>(new Map<string, string>())
-  const [seperateDust, setSeperateDust] = useState(false)
+  
+  const [separateDust, setSeparateDust] = useState(() => {
+    const stored = localStorage.getItem('separateDust');
+    return stored !== null ? stored === 'true' : false;
+  });
+
+  useEffect(() => {
+    localStorage.setItem('separateDust', separateDust.toString());
+  }, [separateDust]);
 
   const [preferencesAnchor, setPreferencesAnchor] = useState<any>(null)
 
@@ -304,7 +312,6 @@ export default function Devices() {
   }
 
   const toDevice = (device: Device) => {
-
     let url = getGroup() ? insertGroupContext(getGroup().id().toString(), device.id().toString()) : ""
     if (url.length < 1) url = device.id().toString()
     navigate(url, { state: {device: device} })
@@ -406,7 +413,7 @@ export default function Devices() {
           if (device.status.sen5x?.temperature) {
             return (
               <Box sx={{ marginLeft: 1 }}>
-                <StatusSen5x device={device} noDust={seperateDust} />
+                <StatusSen5x device={device} noDust={separateDust} />
               </Box>
             )
           } else {
@@ -416,7 +423,7 @@ export default function Devices() {
           }
         }
       })
-      if (seperateDust) columns.push({
+      if (separateDust) columns.push({
         title: "Dust",
         render: (device: Device) => {
           if (device.status.sen5x?.temperature) {
@@ -544,13 +551,13 @@ export default function Devices() {
         onClose={() => setPreferencesAnchor(null)}
         disableAutoFocusItem>
           <MenuItem 
-            onClick={() => setSeperateDust(!seperateDust)}
+            onClick={() => setSeparateDust(!separateDust)}
             sx={{ marginLeft: -0.75 }}
             dense
           >
             <ListItemIcon>
               <Checkbox 
-                checked={seperateDust}
+                checked={separateDust}
               />
             </ListItemIcon>
             <ListItemText primary={"Seperate Dust"} />