melledijkstra · melledijkstra · Dec 9, 2024
diff --git a/.env.development b/.env.development
@@ -0,0 +1 @@
+NODE_ENV=development
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "gas-fire",
-  "version": "3.2.0",
+  "version": "4.0.0",
   "author": "Melle Dijkstra",
   "description": "Google App Script utilities to automate the FIRE google sheet",
   "license": "MIT",

diff --git a/src/client/settings-dialog/Dialog.stories.ts → ...config-validator-dialog/Dialog.stories.ts b/src/client/settings-dialog/Dialog.stories.ts → ...config-validator-dialog/Dialog.stories.ts
@@ -6,8 +6,8 @@ const meta: Meta<typeof Dialog> = {
   title: 'Dialogs/Settings',
   component: Dialog,
   args: {
-    dialogSize: DIALOG_SIZES.settings,
-    dialogTitle: 'Settings Dialog',
+    dialogSize: DIALOG_SIZES.configValidator,
+    dialogTitle: 'Config Validator Dialog',
   },
 };
 

diff --git a/src/client/config-validator-dialog/Dialog.tsx b/src/client/config-validator-dialog/Dialog.tsx
@@ -0,0 +1,89 @@
+import {
+  Alert,
+  Collapse,
+  Icon,
+  List,
+  ListItemButton,
+  ListItemIcon,
+  ListItemText,
+} from '@mui/material';
+import { Application } from '../Application';
+import { useEffect, useState } from 'react';
+import { serverFunctions } from '../utils/serverFunctions';
+import { ConfigData } from '@/common/types';
+
+const ConfigItem = ({
+  accountId,
+  config,
+}: {
+  accountId: string;
+  config: ConfigData;
+}) => {
+  // const [open, setOpen] = useState(false);
+
+  // const toggleOpen = () => {
+  //   setOpen(!open);
+  // };
+
+  return (
+    <>
+      <ListItemButton>
+        <ListItemIcon>
+          <Icon>account_balance</Icon>
+        </ListItemIcon>
+        <ListItemText primary={accountId} />
+        {/* {open ? <Icon>expand_less</Icon> : <Icon>expand_more</Icon>} */}
+      </ListItemButton>
+      {/* <Collapse in={open}>
+        <List component="div" disablePadding>
+          <ListItemButton sx={{ pl: 4 }}>
+            <ListItemText primary="-" />
+          </ListItemButton>
+        </List>
+      </Collapse> */}
+    </>
+  );
+};
+
+export const Dialog = () => {
+  const [loading, setLoading] = useState(true);
+  const [configs, setConfigs] = useState<Record<string, ConfigData>>({});
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    setConfigs({});
+    setError(null);
+    setLoading(true);
+    serverFunctions
+      .getConfiguration()
+      .then((configs) => {
+        setConfigs(configs);
+        setLoading(false);
+      })
+      .catch((error: Error) => {
+        setError(error.message);
+      });
+  }, []);
+
+  const text = loading
+    ? 'Loading...'
+    : `${Object.keys(configs).length} configs loaded`;
+
+  return (
+    <Application>
+      <Alert severity="info">{text}</Alert>
+      <Alert severity="success">Configuration is valid!</Alert>
+      {error && <Alert severity="error">{error}</Alert>}
+
+      <List sx={{ width: '100%', bgcolor: 'background.paper' }} component="nav">
+        {Object.keys(configs).map((accountId) => (
+          <ConfigItem
+            key={accountId}
+            accountId={accountId}
+            config={configs[accountId]}
+          />
+        ))}
+      </List>
+    </Application>
+  );
+};
diff --git a/src/client/settings-dialog/index.html → ...client/config-validator-dialog/index.html b/src/client/settings-dialog/index.html → ...client/config-validator-dialog/index.html
@@ -3,6 +3,10 @@
   <head>
     <base target="_top" />
     <!-- Add any external scripts and stylesheets here -->
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/icon?family=Material+Icons"
+    />
     <script
       crossorigin
       integrity="sha384-DGyLxAyjq0f9SPpVevD6IgztCFlnMF6oW/XQGmfe+IsZ8TqEiDrcHkMLKI6fiB/Z"

diff --git a/src/client/settings-dialog/index.tsx → src/client/config-validator-dialog/index.tsx b/src/client/settings-dialog/index.tsx → src/client/config-validator-dialog/index.tsx
diff --git a/src/client/settings-dialog/Dialog.tsx b/src/client/settings-dialog/Dialog.tsx
diff --git a/src/client/settings-dialog/components/AutomaticCategorizationForm.tsx b/src/client/settings-dialog/components/AutomaticCategorizationForm.tsx
diff --git a/src/client/settings-dialog/components/FormRule.tsx b/src/client/settings-dialog/components/FormRule.tsx
diff --git a/src/client/settings-dialog/components/ImportRulesForm.tsx b/src/client/settings-dialog/components/ImportRulesForm.tsx
diff --git a/src/common/constants.ts b/src/common/constants.ts
@@ -1,6 +1,6 @@
 export enum DialogType {
   import,
-  settings,
+  configValidator,
   about,
 }
 
@@ -12,7 +12,7 @@ export enum NAMED_RANGES {
 
 export const DIALOG_SIZES: Record<keyof typeof DialogType, [number, number]> = {
   import: [900, 600],
-  settings: [900, 600],
+  configValidator: [900, 600],
   about: [300, 200],
 };
 
@@ -35,7 +35,7 @@ export const FIRE_COLUMNS = [
   'currency',
 ] as const;
 
-export type FireColumn = (typeof FIRE_COLUMNS)[number];
+export const DEFAULT_CACHE_SECOND = 20;
 
 export const SOURCE_SHEET_ID = 1093484485;
 

diff --git a/src/common/types.ts b/src/common/types.ts
@@ -1,3 +1,5 @@
+import { FIRE_COLUMNS } from './constants';
+
 export type Strategies = {
   [key: string]: string;
 };
@@ -33,3 +35,16 @@ export type JsonTable = Record<string, string>[];
 export type ServerResponse = {
   message: string;
 };
+
+export type FireColumn = (typeof FIRE_COLUMNS)[number];
+
+export type ColumnMap = {
+  [key in FireColumn]?: string;
+};
+
+export type ConfigData = {
+  columnMap: ColumnMap;
+  autoFillColumnIndices: number[];
+  autoFillEnabled: boolean;
+  autoCategorizationEnabled: boolean;
+};