Basic storage of watched paths.

src/main/ipc/ipcMainConfig.ts

@@ -2,6 +2,10 @@ import { ipcMain } from "electron";
 import ipcTypes from "../../util/ipcTypes.json";
 import log from "electron-log/main";
 import { ipcMainHandleAuthStateChanged } from "./ipcMainHandler.user";
+import {
+  SettingsWatchedFilePathsGet,
+  SettingsWatchedFilePathsAdd,
+} from "./ipcMainHandler.settings";
 // Log all IPC messages and their payloads
 
 const logIpcMessages = () => {
@@ -35,4 +39,12 @@ ipcMain.on(ipcTypes.toMain.test, (payload: any) =>
 
 ipcMain.on(ipcTypes.toMain.authStateChanged, ipcMainHandleAuthStateChanged);
 
+ipcMain.handle(
+  ipcTypes.toMain.settings.filepaths.get,
+  SettingsWatchedFilePathsGet
+);
+ipcMain.handle(
+  ipcTypes.toMain.settings.filepaths.add,
+  SettingsWatchedFilePathsAdd
+);
 logIpcMessages();

src/main/ipc/ipcMainHandler.settings.ts

@@ -0,0 +1,31 @@
+import { BrowserWindow, dialog, IpcMainInvokeEvent } from "electron";
+import log from "electron-log/main";
+import _ from "lodash";
+import Store from "../store/store";
+
+const SettingsWatchedFilePathsAdd = async (event: IpcMainInvokeEvent) => {
+  const mainWindow = BrowserWindow.getAllWindows()[0]; //TODO: Filter to only main window once a proper key has been set.
+  if (!mainWindow) {
+    log.error("No main window found when trying to open dialog");
+    return;
+  }
+  const result = await dialog.showOpenDialog(mainWindow, {
+    properties: ["openDirectory"],
+  });
+
+  if (!result.canceled) {
+    Store.set(
+      "settings.filepaths",
+      _.union(result.filePaths, Store.get("filepaths"))
+    );
+  }
+
+  return Store.get("settings.filepaths");
+};
+
+const SettingsWatchedFilePathsGet = async (event: IpcMainInvokeEvent) => {
+  const filepaths = Store.get("settings.filepaths");
+  return filepaths;
+};
+
+export { SettingsWatchedFilePathsAdd, SettingsWatchedFilePathsGet };

src/main/store/store.ts

@@ -3,11 +3,13 @@
 const Store = require("electron-store").default;
 const store = new Store({
   defaults: {
-    filePaths: [],
-    runWatcherOnStartup: true,
-    polling: {
-      enabled: false,
-      pollingInterval: 30000,
+    settings: {
+      filepaths: [],
+      runWatcherOnStartup: true,
+      polling: {
+        enabled: false,
+        pollingInterval: 30000,
+      },
     },
     user: null,
   },

src/renderer/src/App.tsx

@@ -10,6 +10,7 @@ import { auth } from "./util/firebase";
 import {} from "react-error-boundary";
 import { ErrorBoundary } from "react-error-boundary";
 import ErrorBoundaryFallback from "./components/ErrorBoundaryFallback/ErrorBoundaryFallback";
+import Settings from "./components/Settings/Settings";
 
 const App: React.FC = () => {
   const [user, setUser] = useState<User | null>(null);
@@ -36,7 +37,7 @@ const App: React.FC = () => {
               <NavigationHeader />
               <Routes>
                 <Route path="/" element={<div>AuthHome</div>} />
-                <Route path="settings" element={<div>Settings</div>} />
+                <Route path="settings" element={<Settings />} />
               </Routes>
             </>
           )}

src/renderer/src/components/Settings/Settings.WatchedPaths.tsx

@@ -0,0 +1,34 @@
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import ipcTypes from "../../../../util/ipcTypes.json";
+import { Button } from "antd";
+
+const SettingsWatchedPaths: React.FC = () => {
+  const [watchedPaths, setWatchedPaths] = useState<string[]>([]);
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    window.electron.ipcRenderer
+      .invoke(ipcTypes.toMain.settings.filepaths.get)
+      .then((paths: string[]) => {
+        setWatchedPaths(paths);
+      });
+  }, []);
+
+  const handleAddPath = () => {
+    window.electron.ipcRenderer
+      .invoke(ipcTypes.toMain.settings.filepaths.add)
+      .then((paths: string[]) => {
+        setWatchedPaths(paths);
+      });
+  };
+
+  return (
+    <div>
+      <div>Currently Watched paths</div>
+      <ul>{watchedPaths?.map((path, index) => <li key={index}>{path}</li>)}</ul>
+      <Button onClick={handleAddPath}>{t("settings.actions.addpath")}</Button>
+    </div>
+  );
+};
+export default SettingsWatchedPaths;

src/renderer/src/components/Settings/Settings.tsx

@@ -0,0 +1,10 @@
+import SettingsWatchedPaths from "./Settings.WatchedPaths";
+
+const Settings: React.FC = () => {
+  return (
+    <div>
+      <SettingsWatchedPaths />
+    </div>
+  );
+};
+export default Settings;

src/util/ipcTypes.json

@@ -1,7 +1,13 @@
 {
   "toMain": {
     "test": "toMain_test",
-    "authStateChanged": "toMain_authStateChanged"
+    "authStateChanged": "toMain_authStateChanged",
+    "settings": {
+      "filepaths": {
+        "get": "toMain_settings_filepaths_get",
+        "add": "toMain_settings_filepaths_add"
+      }
+    }
   },
   "toRenderer": {
     "test": "toRenderer_test"

src/util/translations/en-US/renderer.json

@@ -3,6 +3,11 @@
 		"navigation": {
 			"home": "Home",
 			"settings": "Settings"
+		},
+		"settings": {
+			"actions": {
+				"addpath": "Add path"
+			}
 		}
 	}
 }