Add job status & correct claimant info checks.

src/renderer/src/components/NavigationHeader/Navigationheader.tsx

@@ -1,10 +1,13 @@
-import { Layout, Menu } from "antd";
+import { selectWatcherStatus } from "@renderer/redux/app.slice";
+import { useAppSelector } from "@renderer/redux/reduxHooks";
+import { Badge, Layout, Menu } from "antd";
 import { MenuItemType } from "antd/es/menu/interface";
 import { useTranslation } from "react-i18next";
 import { NavLink } from "react-router";
 
 const NavigationHeader: React.FC = () => {
   const { t } = useTranslation();
+  const isWatcherStarted = useAppSelector(selectWatcherStatus);
   const menuItems: MenuItemType[] = [
     { label: <NavLink to="/">{t("navigation.home")}</NavLink>, key: "home" },
     {
@@ -13,16 +16,24 @@ const NavigationHeader: React.FC = () => {
     },
   ];
   return (
-    <Layout.Header style={{ display: "flex", alignItems: "center" }}>
-      <div className="demo-logo" />
-      <Menu
-        theme="dark"
-        mode="horizontal"
-        defaultSelectedKeys={["2"]}
-        items={menuItems}
-        style={{ flex: 1, minWidth: 0 }}
-      />
-    </Layout.Header>
+    <Badge.Ribbon
+      text={
+        isWatcherStarted
+          ? t("settings.labels.started")
+          : t("settings.labels.stopped")
+      }
+      color={isWatcherStarted ? "green" : "red"}
+    >
+      <Layout.Header style={{ display: "flex", alignItems: "center" }}>
+        <Menu
+          theme="dark"
+          mode="horizontal"
+          defaultSelectedKeys={["2"]}
+          items={menuItems}
+          style={{ flex: 1, minWidth: 0 }}
+        />
+      </Layout.Header>
+    </Badge.Ribbon>
   );
 };
 

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

@@ -6,8 +6,8 @@ import {
   selectWatcherError,
   selectWatcherStatus,
 } from "@renderer/redux/app.slice";
-import { useAppDispatch, useAppSelector } from "@renderer/redux/reduxHooks";
-import { Button, Space } from "antd";
+import { useAppSelector } from "@renderer/redux/reduxHooks";
+import { Alert, Button, Space } from "antd";
 import { useTranslation } from "react-i18next";
 import ipcTypes from "../../../../util/ipcTypes.json";
 
@@ -15,7 +15,6 @@ const SettingsWatcher: React.FC = () => {
   const { t } = useTranslation();
   const isWatcherStarted = useAppSelector(selectWatcherStatus);
   const watcherError = useAppSelector(selectWatcherError);
-  const dispatch = useAppDispatch();
 
   const handleStart = (): void => {
     window.electron.ipcRenderer.send(ipcTypes.toMain.watcher.start);
@@ -26,13 +25,16 @@ const SettingsWatcher: React.FC = () => {
   };
 
   return (
-    <>
-      <Button onClick={handleStart}>
-        {t("settings.actions.startwatcher")}
-      </Button>
-      <Button onClick={handleStop}>{t("settings.actions.stopwatcher")}</Button>
-      {isWatcherStarted}
-      {watcherError}
+    <Space>
+      {isWatcherStarted ? (
+        <Button onClick={handleStop}>
+          {t("settings.actions.stopwatcher")}
+        </Button>
+      ) : (
+        <Button onClick={handleStart}>
+          {t("settings.actions.startwatcher")}
+        </Button>
+      )}
       {isWatcherStarted ? (
         <Space>
           <CheckCircleOutlined style={{ color: "green" }} />
@@ -44,7 +46,8 @@ const SettingsWatcher: React.FC = () => {
           {t("settings.labels.stopped")}
         </Space>
       )}
-    </>
+      {watcherError && <Alert message={watcherError} />}
+    </Space>
   );
 };
 export default SettingsWatcher;