From c73db112c70ac15133dd7e262ea3beccb4187873 Mon Sep 17 00:00:00 2001
From: Dave Richer <dave@imexsystems.ca>
Date: Mon, 28 Apr 2025 09:26:15 -0400
Subject: [PATCH] feature/IO-3205-Paint-Scale-Integrations: Checkpoint

---
 .idea/material_theme_project_new.xml          |   4 +-
 .../PaintScale/usePaintScaleConfig.ts         | 100 +++++-----
 .../Settings.PaintScaleInputPaths.tsx         | 179 ++++++++++++------
 .../Settings.PaintScaleOutputPaths.tsx        | 161 ++++++++++------
 src/util/translations/en-US/renderer.json     |   5 +-
 5 files changed, 276 insertions(+), 173 deletions(-)

diff --git a/.idea/material_theme_project_new.xml b/.idea/material_theme_project_new.xml
index 0cb5647..4647599 100644
--- a/.idea/material_theme_project_new.xml
+++ b/.idea/material_theme_project_new.xml
@@ -3,7 +3,9 @@
   <component name="MaterialThemeProjectNewConfig">
     <option name="metadata">
       <MTProjectMetadataState>
-        <option name="userId" value="-70fa916f:1961b191ca1:-748b" />
+        <option name="migrated" value="true" />
+        <option name="pristineConfig" value="false" />
+        <option name="userId" value="-4002d172:18ee315e3ba:-7ffe" />
       </MTProjectMetadataState>
     </option>
   </component>
diff --git a/src/renderer/src/components/Settings/PaintScale/usePaintScaleConfig.ts b/src/renderer/src/components/Settings/PaintScale/usePaintScaleConfig.ts
index b6fb7da..e2859bb 100644
--- a/src/renderer/src/components/Settings/PaintScale/usePaintScaleConfig.ts
+++ b/src/renderer/src/components/Settings/PaintScale/usePaintScaleConfig.ts
@@ -8,51 +8,52 @@ export const usePaintScaleConfig = (configType: ConfigType) => {
   const [paintScaleConfigs, setPaintScaleConfigs] = useState<PaintScaleConfig[]>([]);
 
   // Get the appropriate IPC methods based on config type
-  const getConfigsMethod = configType === 'input' 
-    ? ipcTypes.toMain.settings.paintScale.getInputConfigs
-    : ipcTypes.toMain.settings.paintScale.getOutputConfigs;
-  
+  const getConfigsMethod = configType === 'input'
+      ? ipcTypes.toMain.settings.paintScale.getInputConfigs
+      : ipcTypes.toMain.settings.paintScale.getOutputConfigs;
+
   const setConfigsMethod = configType === 'input'
-    ? ipcTypes.toMain.settings.paintScale.setInputConfigs
-    : ipcTypes.toMain.settings.paintScale.setOutputConfigs;
-  
+      ? ipcTypes.toMain.settings.paintScale.setInputConfigs
+      : ipcTypes.toMain.settings.paintScale.setOutputConfigs;
+
   const setPathMethod = configType === 'input'
-    ? ipcTypes.toMain.settings.paintScale.setInputPath
-    : ipcTypes.toMain.settings.paintScale.setOutputPath;
+      ? ipcTypes.toMain.settings.paintScale.setInputPath
+      : ipcTypes.toMain.settings.paintScale.setOutputPath;
 
   // Load paint scale configs on mount
   useEffect(() => {
     window.electron.ipcRenderer
-      .invoke(getConfigsMethod)
-      .then((configs: PaintScaleConfig[]) => {
-        // Ensure all configs have a pollingInterval (for backward compatibility)
-        const updatedConfigs = configs.map(config => ({
-          ...config,
-          pollingInterval: config.pollingInterval || 60 // Default to 60 seconds if not set
-        }));
-        setPaintScaleConfigs(updatedConfigs || []);
-      })
-      .catch((error) => {
-        console.error(`Failed to load paint scale ${configType} configs:`, error);
-      });
+        .invoke(getConfigsMethod)
+        .then((configs: PaintScaleConfig[]) => {
+          // Ensure all configs have a pollingInterval and type (for backward compatibility)
+          const updatedConfigs = configs.map(config => ({
+            ...config,
+            pollingInterval: config.pollingInterval || 1440, // Default to 1440 seconds if not set
+            type: config.type || PaintScaleType.PPG, // Default type if missing
+          }));
+          setPaintScaleConfigs(updatedConfigs || []);
+        })
+        .catch((error) => {
+          console.error(`Failed to load paint scale ${configType} configs:`, error);
+        });
   }, [getConfigsMethod]);
 
   // Save configs to store
   const saveConfigs = (configs: PaintScaleConfig[]) => {
     window.electron.ipcRenderer
-      .invoke(setConfigsMethod, configs)
-      .catch((error) => {
-        console.error(`Failed to save paint scale ${configType} configs:`, error);
-      });
+        .invoke(setConfigsMethod, configs)
+        .catch((error) => {
+          console.error(`Failed to save paint scale ${configType} configs:`, error);
+        });
   };
 
   // Handle adding a new paint scale config
-  const handleAddConfig = () => {
+  const handleAddConfig = (type: PaintScaleType) => {
     const newConfig: PaintScaleConfig = {
       id: Date.now().toString(),
       path: null,
-      type: PaintScaleType.PPG,
-      pollingInterval: 60, // Default to 60 seconds
+      type,
+      pollingInterval: 1440, // Default to 1440 seconds
     };
     const updatedConfigs = [...paintScaleConfigs, newConfig];
     setPaintScaleConfigs(updatedConfigs);
@@ -69,34 +70,25 @@ export const usePaintScaleConfig = (configType: ConfigType) => {
   // Handle path selection
   const handlePathChange = (id: string) => {
     window.electron.ipcRenderer
-      .invoke(setPathMethod, id)
-      .then((path: string | null) => {
-        if (path) {
-          const updatedConfigs = paintScaleConfigs.map((config) =>
-            config.id === id ? { ...config, path } : config,
-          );
-          setPaintScaleConfigs(updatedConfigs);
-          saveConfigs(updatedConfigs);
-        }
-      })
-      .catch((error) => {
-        console.error(`Failed to set paint scale ${configType} path:`, error);
-      });
-  };
-
-  // Handle type change
-  const handleTypeChange = (id: string, type: PaintScaleType) => {
-    const updatedConfigs = paintScaleConfigs.map((config) =>
-      config.id === id ? { ...config, type } : config,
-    );
-    setPaintScaleConfigs(updatedConfigs);
-    saveConfigs(updatedConfigs);
+        .invoke(setPathMethod, id)
+        .then((path: string | null) => {
+          if (path) {
+            const updatedConfigs = paintScaleConfigs.map((config) =>
+                config.id === id ? { ...config, path } : config,
+            );
+            setPaintScaleConfigs(updatedConfigs);
+            saveConfigs(updatedConfigs);
+          }
+        })
+        .catch((error) => {
+          console.error(`Failed to set paint scale ${configType} path:`, error);
+        });
   };
 
   // Handle polling interval change
   const handlePollingIntervalChange = (id: string, pollingInterval: number) => {
     const updatedConfigs = paintScaleConfigs.map((config) =>
-      config.id === id ? { ...config, pollingInterval } : config,
+        config.id === id ? { ...config, pollingInterval } : config,
     );
     setPaintScaleConfigs(updatedConfigs);
     saveConfigs(updatedConfigs);
@@ -107,8 +99,6 @@ export const usePaintScaleConfig = (configType: ConfigType) => {
     handleAddConfig,
     handleRemoveConfig,
     handlePathChange,
-    handleTypeChange,
-    handlePollingIntervalChange
+    handlePollingIntervalChange,
   };
-};
-
+};
\ No newline at end of file
diff --git a/src/renderer/src/components/Settings/Settings.PaintScaleInputPaths.tsx b/src/renderer/src/components/Settings/Settings.PaintScaleInputPaths.tsx
index 126009e..187ff77 100644
--- a/src/renderer/src/components/Settings/Settings.PaintScaleInputPaths.tsx
+++ b/src/renderer/src/components/Settings/Settings.PaintScaleInputPaths.tsx
@@ -1,6 +1,21 @@
-import { FileAddFilled, FolderOpenFilled, CheckCircleFilled, WarningFilled } from "@ant-design/icons";
-import { Button, Card, Input, Select, Space, Table, Tooltip } from "antd";
-import { FC } from "react";
+import {
+  CheckCircleFilled,
+  FileAddFilled,
+  FolderOpenFilled,
+  WarningFilled,
+} from "@ant-design/icons";
+import {
+  Button,
+  Card,
+  Input,
+  Modal,
+  Select,
+  Space,
+  Table,
+  Tag,
+  Tooltip,
+} from "antd";
+import { FC, useState } from "react";
 import { useTranslation } from "react-i18next";
 import {
   PaintScaleConfig,
@@ -16,55 +31,85 @@ const SettingsPaintScaleInputPaths: FC = () => {
     handleAddConfig,
     handleRemoveConfig,
     handlePathChange,
-    handleTypeChange,
     handlePollingIntervalChange,
   } = usePaintScaleConfig("input");
 
+  const [isModalVisible, setIsModalVisible] = useState(false);
+  const [selectedType, setSelectedType] = useState<PaintScaleType | null>(null);
+
+  // Show modal when adding a new path
+  const showAddPathModal = () => {
+    setSelectedType(null);
+    setIsModalVisible(true);
+  };
+
+  // Handle modal confirmation
+  const handleModalOk = () => {
+    if (selectedType) {
+      handleAddConfig(selectedType);
+      setIsModalVisible(false);
+    }
+  };
+
+  // Handle modal cancellation
+  const handleModalCancel = () => {
+    setIsModalVisible(false);
+  };
+
   // Table columns for paint scale configs
   const columns = [
     {
       title: t("settings.labels.paintScaleType"),
       dataIndex: "type",
       key: "type",
-      render: (type: PaintScaleType, record: PaintScaleConfig) => (
-          <Select
-              value={type}
-              options={paintScaleTypeOptions}
-              onChange={(value) => handleTypeChange(record.id, value)}
-              style={{ width: 120 }}
-          />
-      ),
+      render: (type: PaintScaleType) => {
+        const typeOption = paintScaleTypeOptions.find(
+          (option) => option.value === type,
+        );
+        const label = typeOption ? typeOption.label : type;
+        const colorMap: Partial<Record<PaintScaleType, string>> = {
+          [PaintScaleType.PPG]: "blue",
+          // Add other types and colors as needed
+        };
+        return <Tag color={colorMap[type] || "default"}>{label}</Tag>;
+      },
     },
     {
       title: t("settings.labels.paintScalePath"),
       dataIndex: "path",
       key: "path",
       render: (path: string | null, record: PaintScaleConfig) => {
-        const isValid = path && path.trim() !== ""; // Simple validity check
+        const isValid = path && path.trim() !== "";
         return (
-            <Space>
-              <Input
-                  value={path || ""}
-                  placeholder={t("settings.labels.paintScalePath")}
-                  disabled
-                  style={{
-                    borderColor: isValid ? "#52c41a" : "#d9d9d9", // Green for valid, default for invalid
-                  }}
-                  suffix={
-                    <Tooltip title={isValid ? t("settings.labels.validPath") : t("settings.labels.invalidPath")}>
-                      {isValid ? (
-                          <CheckCircleFilled style={{ color: "#52c41a" }} />
-                      ) : (
-                          <WarningFilled style={{ color: "#faad14" }} />
-                      )}
-                    </Tooltip>
+          <Space>
+            <Input
+              value={path || ""}
+              placeholder={t("settings.labels.paintScalePath")}
+              disabled
+              style={{
+                borderColor: isValid ? "#52c41a" : "#d9d9d9",
+              }}
+              suffix={
+                <Tooltip
+                  title={
+                    isValid
+                      ? t("settings.labels.validPath")
+                      : t("settings.labels.invalidPath")
                   }
-              />
-              <Button
-                  onClick={() => handlePathChange(record.id)}
-                  icon={<FolderOpenFilled />}
-              />
-            </Space>
+                >
+                  {isValid ? (
+                    <CheckCircleFilled style={{ color: "#52c41a" }} />
+                  ) : (
+                    <WarningFilled style={{ color: "#faad14" }} />
+                  )}
+                </Tooltip>
+              }
+            />
+            <Button
+              onClick={() => handlePathChange(record.id)}
+              icon={<FolderOpenFilled />}
+            />
+          </Space>
         );
       },
     },
@@ -73,45 +118,63 @@ const SettingsPaintScaleInputPaths: FC = () => {
       dataIndex: "pollingInterval",
       key: "pollingInterval",
       render: (pollingInterval: number, record: PaintScaleConfig) => (
-          <Input
-              type="number"
-              value={pollingInterval}
-              onChange={(e) =>
-                  handlePollingIntervalChange(record.id, Number(e.target.value))
-              }
-              style={{ width: 100 }}
-              placeholder={t("settings.labels.pollingInterval")}
-          />
+        <Input
+          type="number"
+          value={pollingInterval}
+          onChange={(e) =>
+            handlePollingIntervalChange(record.id, Number(e.target.value))
+          }
+          style={{ width: 100 }}
+          placeholder={t("settings.labels.pollingInterval")}
+        />
       ),
     },
     {
       title: t("settings.labels.actions"),
       key: "actions",
       render: (_: any, record: PaintScaleConfig) => (
-          <Button danger onClick={() => handleRemoveConfig(record.id)}>
-            {t("settings.labels.remove")}
-          </Button>
+        <Button danger onClick={() => handleRemoveConfig(record.id)}>
+          {t("settings.labels.remove")}
+        </Button>
       ),
     },
   ];
 
   return (
+    <>
       <Card
-          title={t("settings.labels.paintScaleSettingsInput")}
-          extra={
-            <Button icon={<FileAddFilled />} onClick={handleAddConfig}>
-              {t("settings.actions.addpath")}
-            </Button>
-          }
+        title={t("settings.labels.paintScaleSettingsInput")}
+        extra={
+          <Button onClick={showAddPathModal} icon={<FileAddFilled />}>
+            {t("settings.actions.addpath")}
+          </Button>
+        }
       >
         <Table
-            dataSource={paintScaleConfigs}
-            columns={columns}
-            rowKey="id"
-            pagination={false}
+          dataSource={paintScaleConfigs}
+          columns={columns}
+          rowKey="id"
+          pagination={false}
         />
       </Card>
+
+      <Modal
+        title={t("settings.labels.selectPaintScaleType")}
+        open={isModalVisible}
+        onOk={handleModalOk}
+        onCancel={handleModalCancel}
+        okButtonProps={{ disabled: !selectedType }}
+      >
+        <Select
+          value={selectedType}
+          options={paintScaleTypeOptions}
+          onChange={(value) => setSelectedType(value)}
+          style={{ width: "100%" }}
+          placeholder={t("settings.labels.selectPaintScaleType")}
+        />
+      </Modal>
+    </>
   );
 };
 
-export default SettingsPaintScaleInputPaths;
\ No newline at end of file
+export default SettingsPaintScaleInputPaths;
diff --git a/src/renderer/src/components/Settings/Settings.PaintScaleOutputPaths.tsx b/src/renderer/src/components/Settings/Settings.PaintScaleOutputPaths.tsx
index 5dca32b..60da7e6 100644
--- a/src/renderer/src/components/Settings/Settings.PaintScaleOutputPaths.tsx
+++ b/src/renderer/src/components/Settings/Settings.PaintScaleOutputPaths.tsx
@@ -1,6 +1,11 @@
-import { FileAddFilled, FolderOpenFilled, CheckCircleFilled, WarningFilled } from "@ant-design/icons";
-import { Button, Card, Input, Select, Space, Table } from "antd";
-import { FC } from "react";
+import {
+  CheckCircleFilled,
+  FileAddFilled,
+  FolderOpenFilled,
+  WarningFilled,
+} from "@ant-design/icons";
+import { Button, Card, Input, Modal, Select, Space, Table, Tag } from "antd";
+import { FC, useState } from "react";
 import { useTranslation } from "react-i18next";
 import {
   PaintScaleConfig,
@@ -16,53 +21,77 @@ const SettingsPaintScaleOutputPaths: FC = () => {
     handleAddConfig,
     handleRemoveConfig,
     handlePathChange,
-    handleTypeChange,
     handlePollingIntervalChange,
   } = usePaintScaleConfig("output");
 
+  const [isModalVisible, setIsModalVisible] = useState(false);
+  const [selectedType, setSelectedType] = useState<PaintScaleType | null>(null);
+
+  // Show modal when adding a new path
+  const showAddPathModal = () => {
+    setSelectedType(null);
+    setIsModalVisible(true);
+  };
+
+  // Handle modal confirmation
+  const handleModalOk = () => {
+    if (selectedType) {
+      handleAddConfig(selectedType);
+      setIsModalVisible(false);
+    }
+  };
+
+  // Handle modal cancellation
+  const handleModalCancel = () => {
+    setIsModalVisible(false);
+  };
+
   // Table columns for paint scale configs
   const columns = [
     {
       title: t("settings.labels.paintScaleType"),
       dataIndex: "type",
       key: "type",
-      render: (type: PaintScaleType, record: PaintScaleConfig) => (
-          <Select
-              value={type}
-              options={paintScaleTypeOptions}
-              onChange={(value) => handleTypeChange(record.id, value)}
-              style={{ width: 120 }}
-          />
-      ),
+      render: (type: PaintScaleType) => {
+        const typeOption = paintScaleTypeOptions.find(
+          (option) => option.value === type,
+        );
+        const label = typeOption ? typeOption.label : type;
+        const colorMap: Partial<Record<PaintScaleType, string>> = {
+          [PaintScaleType.PPG]: "blue",
+          // Add other types and colors as needed
+        };
+        return <Tag color={colorMap[type] || "default"}>{label}</Tag>;
+      },
     },
     {
       title: t("settings.labels.paintScalePath"),
       dataIndex: "path",
       key: "path",
       render: (path: string | null, record: PaintScaleConfig) => {
-        const isValid = path && path.trim() !== ""; // Simple validity check
+        const isValid = path && path.trim() !== "";
         return (
-            <Space>
-              <Input
-                  value={path || ""}
-                  placeholder={t("settings.labels.paintScalePath")}
-                  disabled
-                  style={{
-                    borderColor: isValid ? "#52c41a" : "#d9d9d9", // Green for valid, default for invalid
-                  }}
-                  suffix={
-                    isValid ? (
-                        <CheckCircleFilled style={{ color: "#52c41a" }} />
-                    ) : (
-                        <WarningFilled style={{ color: "#faad14" }} />
-                    )
-                  }
-              />
-              <Button
-                  onClick={() => handlePathChange(record.id)}
-                  icon={<FolderOpenFilled />}
-              />
-            </Space>
+          <Space>
+            <Input
+              value={path || ""}
+              placeholder={t("settings.labels.paintScalePath")}
+              disabled
+              style={{
+                borderColor: isValid ? "#52c41a" : "#d9d9d9",
+              }}
+              suffix={
+                isValid ? (
+                  <CheckCircleFilled style={{ color: "#52c41a" }} />
+                ) : (
+                  <WarningFilled style={{ color: "#faad14" }} />
+                )
+              }
+            />
+            <Button
+              onClick={() => handlePathChange(record.id)}
+              icon={<FolderOpenFilled />}
+            />
+          </Space>
         );
       },
     },
@@ -71,45 +100,63 @@ const SettingsPaintScaleOutputPaths: FC = () => {
       dataIndex: "pollingInterval",
       key: "pollingInterval",
       render: (pollingInterval: number, record: PaintScaleConfig) => (
-          <Input
-              type="number"
-              value={pollingInterval}
-              onChange={(e) =>
-                  handlePollingIntervalChange(record.id, Number(e.target.value))
-              }
-              style={{ width: 100 }}
-              placeholder={t("settings.labels.pollingInterval")}
-          />
+        <Input
+          type="number"
+          value={pollingInterval}
+          onChange={(e) =>
+            handlePollingIntervalChange(record.id, Number(e.target.value))
+          }
+          style={{ width: 100 }}
+          placeholder={t("settings.labels.pollingInterval")}
+        />
       ),
     },
     {
       title: t("settings.labels.actions"),
       key: "actions",
       render: (_: any, record: PaintScaleConfig) => (
-          <Button danger onClick={() => handleRemoveConfig(record.id)}>
-            {t("settings.labels.remove")}
-          </Button>
+        <Button danger onClick={() => handleRemoveConfig(record.id)}>
+          {t("settings.labels.remove")}
+        </Button>
       ),
     },
   ];
 
   return (
+    <>
       <Card
-          title={t("settings.labels.paintScaleSettingsOutput")}
-          extra={
-            <Button onClick={handleAddConfig} icon={<FileAddFilled />}>
-              {t("settings.actions.addpath")}
-            </Button>
-          }
+        title={t("settings.labels.paintScaleSettingsOutput")}
+        extra={
+          <Button onClick={showAddPathModal} icon={<FileAddFilled />}>
+            {t("settings.actions.addpath")}
+          </Button>
+        }
       >
         <Table
-            dataSource={paintScaleConfigs}
-            columns={columns}
-            rowKey="id"
-            pagination={false}
+          dataSource={paintScaleConfigs}
+          columns={columns}
+          rowKey="id"
+          pagination={false}
         />
       </Card>
+
+      <Modal
+        title={t("settings.labels.selectPaintScaleType")}
+        open={isModalVisible}
+        onOk={handleModalOk}
+        onCancel={handleModalCancel}
+        okButtonProps={{ disabled: !selectedType }}
+      >
+        <Select
+          value={selectedType}
+          options={paintScaleTypeOptions}
+          onChange={(value) => setSelectedType(value)}
+          style={{ width: "100%" }}
+          placeholder={t("settings.labels.selectPaintScaleType")}
+        />
+      </Modal>
+    </>
   );
 };
 
-export default SettingsPaintScaleOutputPaths;
\ No newline at end of file
+export default SettingsPaintScaleOutputPaths;
diff --git a/src/util/translations/en-US/renderer.json b/src/util/translations/en-US/renderer.json
index 7d4eed5..f86bf3a 100644
--- a/src/util/translations/en-US/renderer.json
+++ b/src/util/translations/en-US/renderer.json
@@ -42,9 +42,10 @@
 				"addPaintScalePath": "Add Paint Scale Path",
 				"remove": "Remove",
 				"actions": "Actions",
-				"pollingInterval": "Polling Interval (s)",
+				"pollingInterval": "Polling Interval (m)",
 				"validPath": "Valid path",
-				"invalidPath": "Path not set or invalid"
+				"invalidPath": "Path not set or invalid",
+				"selectPaintScaleType": "Select Paint Scale Type"
 			}
 		},
 		"title": {