Add collapsible section component.

Can now collapse server categories.
Client remembers collapse state, incl. advanced appearance settings.

src/redux/index.ts

@@ -14,6 +14,7 @@ import { QueuedMessage } from "./reducers/queue";
 import { ExperimentOptions } from "./reducers/experiments";
 import { LastOpened } from "./reducers/last_opened";
 import { Notifications } from "./reducers/notifications";
+import { SectionToggle } from "./reducers/section_toggle";
 
 export type State = {
     config: Core.RevoltNodeConfiguration,
@@ -28,6 +29,7 @@ export type State = {
     experiments: ExperimentOptions;
     lastOpened: LastOpened;
     notifications: Notifications;
+    sectionToggle: SectionToggle;
 };
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -56,7 +58,8 @@ store.subscribe(() => {
         sync,
         experiments,
         lastOpened,
-        notifications
+        notifications,
+        sectionToggle
     } = store.getState() as State;
 
     localForage.setItem("state", {
@@ -70,6 +73,7 @@ store.subscribe(() => {
         sync,
         experiments,
         lastOpened,
-        notifications
+        notifications,
+        sectionToggle
     });
 });

src/redux/reducers/index.ts

@@ -13,6 +13,7 @@ import { sync, SyncAction } from "./sync";
 import { experiments, ExperimentsAction } from "./experiments";
 import { lastOpened, LastOpenedAction } from "./last_opened";
 import { notifications, NotificationsAction } from "./notifications";
+import { sectionToggle, SectionToggleAction } from "./section_toggle";
 
 export default combineReducers({
     config,
@@ -26,7 +27,8 @@ export default combineReducers({
     sync,
     experiments,
     lastOpened,
-    notifications
+    notifications,
+    sectionToggle
 });
 
 export type Action =
@@ -42,6 +44,7 @@ export type Action =
     | ExperimentsAction
     | LastOpenedAction
     | NotificationsAction
+    | SectionToggleAction
     | { type: "__INIT"; state: State };
 
 export type WithDispatcher = { dispatcher: (action: Action) => void };

src/redux/reducers/section_toggle.ts

@@ -0,0 +1,37 @@
+export interface SectionToggle {
+    [key: string]: boolean
+}
+
+export type SectionToggleAction =
+    | { type: undefined }
+    | {
+        type: "SECTION_TOGGLE_SET";
+        id: string;
+        state: boolean;
+      }
+    | {
+        type: "SECTION_TOGGLE_UNSET";
+        id: string;
+      }
+    | {
+          type: "RESET";
+      };
+
+export function sectionToggle(state = {} as SectionToggle, action: SectionToggleAction): SectionToggle {
+    switch (action.type) {
+        case "SECTION_TOGGLE_SET": {
+            return {
+                ...state,
+                [action.id]: action.state
+            }
+        }
+        case "SECTION_TOGGLE_UNSET": {
+            const { [action.id]: _, ...newState } = state;
+            return newState;
+        }
+        case "RESET":
+            return {};
+        default:
+            return state;
+    }
+}