feature/IO-2976-GlobalSearch-First-link-Navigate - Fix global search so it goes to the first url if it is available, added an ID for rome tours.

Signed-off-by: Dave Richer <dave@imexsystems.ca>

_reference/dockerreadme.md

@@ -4,16 +4,139 @@ This guide will walk you through the steps to configure your WSL2 (Windows Subsy
 
 ## Prerequisites
 
-1. **Windows 11**
-2. **Docker Desktop For Windows (Latest Version)
+1. **Windows 10/11** with **WSL2** installed.
+2. **Hyper-V** enabled on your system. If not, follow these steps to enable it:
+  - Open PowerShell as Administrator and run:
+    ```powershell
+    dism.exe /Online /Enable-Feature /All /FeatureName:Microsoft-Hyper-V
+    ```
+  - Restart your computer.
 
-# Docker Setup
-Inside the root of the project exists the `docker-compose.yaml` file, you can simply run
-`docker-compose up` to launch the backend.
+3. A basic understanding of networking and WSL2 configuration.
 
-Things to note:
-- When installing NPM packages, you will need to rebuild the `node-app` container 
-- Making changes to the server files will restart the `node-app`
+---
+
+## Step 1: Create an External Hyper-V Switch
+
+1. **Open Hyper-V Manager**:
+  - Press `Windows Key + X`, select `Hyper-V Manager`.
+
+2. **Create a Virtual Switch**:
+  - In the right-hand pane, click `Virtual Switch Manager`.
+  - Choose `External` and click `Create Virtual Switch`.
+  - Select your external network adapter (this is usually your Ethernet or Wi-Fi adapter).
+  - Give the switch a name (e.g., `WSL External Switch`), then click `Apply` and `OK`.
+
+---
+
+## Step 2: Configure WSL2 to Use the External Hyper-V Switch
+
+Now that you've created the external virtual switch, follow these steps to configure your WSL2 instance to use this switch.
+
+1. **Set WSL2 to Use the External Switch**:
+  - By default, WSL2 uses NAT to connect to your local network. You need to configure WSL2 to use the external Hyper-V switch instead.
+
+2. **Check WSL2 Networking**:
+  - Inside WSL, run:
+    ```bash
+    ip a
+    ```
+  - You should see an IP address in the range of your local network (e.g., `192.168.x.x`).
+
+---
+
+## Step 3: Configure a Static IP Address for WSL2
+
+Once WSL2 is connected to the external network, you can assign a static IP address to your WSL2 instance.
+
+1. **Open WSL2** and Edit the Network Configuration:
+  - Depending on your Linux distribution, the file paths may vary, but typically for Ubuntu-based systems:
+    ```bash
+    sudo nano /etc/netplan/01-netcfg.yaml
+    ```
+  - If this file doesn’t exist, create a new file or use the correct configuration file path.
+
+2. **Configure Static IP**:
+  - Add or update the following configuration:
+    ```yaml
+    network:
+      version: 2
+      renderer: networkd
+      ethernets:
+        eth0:
+          dhcp4: no
+          addresses:
+            - 192.168.1.100/24  # Choose an IP address in your network range
+          gateway4: 192.168.1.1  # Your router's IP address
+          nameservers:
+            addresses:
+              - 8.8.8.8
+              - 8.8.4.4
+    ```
+  - Adjust the values according to your local network settings:
+    - `addresses`: This is the static IP you want to assign.
+    - `gateway4`: This should be the IP address of your router.
+    - `nameservers`: These are DNS servers, you can use Google's public DNS or any other DNS provider.
+
+3. **Apply the Changes**:
+  - Run the following command to apply the network configuration:
+    ```bash
+    sudo netplan apply
+    ```
+
+4. **Verify the Static IP**:
+  - Check if the static IP is correctly set by running:
+    ```bash
+    ip a
+    ```
+  - You should see the static IP you configured (e.g., `192.168.1.100`) on the appropriate network interface (usually `eth0`).
+
+---
+
+## Step 4: Restart WSL2 to Apply Changes
+
+To ensure the changes are fully applied, restart WSL2:
+
+1. Open PowerShell or Command Prompt and run:
+   ```powershell
+   wsl --shutdown
+2. Then, start your WSL2 instance again.
+
+## Step 5: Verify Connectivity
+
+1. Check Internet and Local Network Connectivity:
+   - Run a ping command from within WSL to verify that it can reach the internet: ```ping 8.8.8.8```
+2. Test Access from other Devices:
+    - If you're running services inside WSL (e.g., a web server), ensure they are accessible from other devices on your local network using the static IP address you configured (e.g., `http://192.168.1.100:4000`).
+
+
+
+# Configuring `vm.overcommit_memory` in sysctl for WSL2
+
+To prevent memory overcommitment issues and optimize performance, you can configure the `vm.overcommit_memory` setting in WSL2. This is particularly useful when running Redis or other memory-intensive services inside WSL2, as it helps control how the Linux kernel handles memory allocation.
+
+### 1. **Open the sysctl Configuration File**:
+To set the `vm.overcommit_memory` value, you'll need to edit the sysctl configuration file. Inside your WSL2 instance, run the following command to open the `sysctl.conf` file for editing:
+```bash
+   sudo nano /etc/sysctl.conf
+```
+### 2. Add the Overcommit Memory Setting:
+Add the following line at the end of the file to allow memory overcommitment:
+```bash
+vm.overcommit_memory = 1
+```
+
+This setting tells the Linux kernel to always allow memory allocation, regardless of how much memory is available, which can prevent out-of-memory errors when running certain applications.
+
+### 3. Apply the Changes:
+After editing the file, save it and then apply the new sysctl configuration by running:
+
+```bash
+sudo sysctl -p
+```
+
+# Install Docker and Docker Compose in WSL2
+- https://docs.docker.com/desktop/wsl/
 
 # Local Stack 
 - LocalStack Front end (Optional) - https://apps.microsoft.com/detail/9ntrnft9zws2?hl=en-us&gl=US

client/src/components/global-search/global-search-os.component.jsx

@@ -3,13 +3,15 @@ import axios from "axios";
 import _ from "lodash";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Link } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import PhoneNumberFormatter from "../../utils/PhoneFormatter";
 import OwnerNameDisplay, { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
 import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
 
 export default function GlobalSearchOs() {
   const { t } = useTranslation();
+  const navigate = useNavigate();
+
   const [loading, setLoading] = useState(false);
   const [data, setData] = useState(false);
 
@@ -177,7 +179,18 @@ export default function GlobalSearchOs() {
   };
 
   return (
-    <AutoComplete options={data} onSearch={handleSearch} defaultActiveFirstOption onClear={() => setData([])}>
+    <AutoComplete
+      options={data}
+      onSearch={handleSearch}
+      onKeyDown={(e) => {
+        if (e.key !== "Enter") return;
+        const firstUrlForSearch = data?.[0]?.options?.[0]?.label?.props?.to;
+        if (!firstUrlForSearch) return;
+        navigate(firstUrlForSearch);
+      }}
+      defaultActiveFirstOption
+      onClear={() => setData([])}
+    >
       <Input.Search
         size="large"
         placeholder={t("general.labels.globalsearch")}

client/src/components/global-search/global-search.component.jsx

@@ -3,7 +3,7 @@ import { AutoComplete, Divider, Input, Space } from "antd";
 import _ from "lodash";
 import React from "react";
 import { useTranslation } from "react-i18next";
-import { Link } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import { GLOBAL_SEARCH_QUERY } from "../../graphql/search.queries";
 import PhoneNumberFormatter from "../../utils/PhoneFormatter";
 import AlertComponent from "../alert/alert.component";
@@ -13,6 +13,7 @@ import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.compon
 export default function GlobalSearch() {
   const { t } = useTranslation();
   const [callSearch, { loading, error, data }] = useLazyQuery(GLOBAL_SEARCH_QUERY);
+  const navigate = useNavigate();
 
   const executeSearch = (v) => {
     if (v && v.variables.search && v.variables.search !== "" && v.variables.search.length >= 3) callSearch(v);
@@ -20,7 +21,6 @@ export default function GlobalSearch() {
   const debouncedExecuteSearch = _.debounce(executeSearch, 750);
 
   const handleSearch = (value) => {
-    console.log("Handle Search");
     debouncedExecuteSearch({ variables: { search: value } });
   };
 
@@ -156,7 +156,17 @@ export default function GlobalSearch() {
   if (error) return <AlertComponent message={error.message} type="error" />;
 
   return (
-    <AutoComplete options={options} onSearch={handleSearch} defaultActiveFirstOption>
+    <AutoComplete
+      options={options}
+      onSearch={handleSearch}
+      defaultActiveFirstOption
+      onKeyDown={(e) => {
+        if (e.key !== "Enter") return;
+        const firstUrlForSearch = options?.[0]?.options?.[0]?.label?.props?.to;
+        if (!firstUrlForSearch) return;
+        navigate(firstUrlForSearch);
+      }}
+    >
       <Input.Search
         size="large"
         placeholder={t("general.labels.globalsearch")}

client/src/components/parts-order-list-table/parts-order-list-table.component.jsx

@@ -242,7 +242,8 @@ export function PartsOrderListTableComponent({
       title: t("general.labels.actions"),
       dataIndex: "actions",
       key: "actions",
-      render: (text, record) => recordActions(record, true)
+      render: (text, record) => recordActions(record, true),
+      id: "parts-order-list-table-actions"
     }
   ];
 

client/src/components/production-board-kanban/production-board-kanban.component.jsx

@@ -185,7 +185,7 @@ function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insertAuditTr
   const cardSettings = useMemo(() => {
     const kanbanSettings = associationSettings?.kanban_settings;
     return mergeWithDefaults(kanbanSettings);
-  }, [associationSettings?.kanban_settings]);
+  }, [associationSettings]);
 
   const handleSettingsChange = () => {
     setFilter(defaultFilters);

client/src/components/production-list-table/production-list-config-manager.component.jsx

@@ -457,42 +457,41 @@ export function ProductionListConfigManager({
           value={activeView}
           disabled={open || isAddingNewProfile} // Disable the Select box when the popover is open or adding a new profile
         >
-          {bodyshop?.production_config &&
-            bodyshop.production_config
-              .slice()
-              .sort((a, b) =>
-                a.name === t("production.constants.main_profile")
-                  ? -1
-                  : b.name === t("production.constants.main_profile")
-                    ? 1
-                    : 0
-              ) //
-              .map((config) => (
-                <Select.Option key={config.name} label={config.name}>
-                  <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center" }}>
-                    <span
-                      style={{
-                        flex: 1,
-                        maxWidth: "80%",
-                        marginRight: "1rem",
-                        textOverflow: "ellipsis"
-                      }}
+          {bodyshop.production_config
+            .slice()
+            .sort((a, b) =>
+              a.name === t("production.constants.main_profile")
+                ? -1
+                : b.name === t("production.constants.main_profile")
+                  ? 1
+                  : 0
+            ) //
+            .map((config) => (
+              <Select.Option key={config.name} label={config.name}>
+                <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center" }}>
+                  <span
+                    style={{
+                      flex: 1,
+                      maxWidth: "80%",
+                      marginRight: "1rem",
+                      textOverflow: "ellipsis"
+                    }}
+                  >
+                    {config.name}
+                  </span>
+                  {config.name !== t("production.constants.main_profile") && (
+                    <Popconfirm
+                      placement="right"
+                      title={t("general.labels.areyousure")}
+                      onConfirm={() => handleTrash(config.name)}
+                      onCancel={(e) => e.stopPropagation()}
                     >
-                      {config.name}
-                    </span>
-                    {config.name !== t("production.constants.main_profile") && (
-                      <Popconfirm
-                        placement="right"
-                        title={t("general.labels.areyousure")}
-                        onConfirm={() => handleTrash(config.name)}
-                        onCancel={(e) => e.stopPropagation()}
-                      >
-                        <DeleteOutlined onClick={(e) => e.stopPropagation()} />
-                      </Popconfirm>
-                    )}
-                  </div>
-                </Select.Option>
-              ))}
+                      <DeleteOutlined onClick={(e) => e.stopPropagation()} />
+                    </Popconfirm>
+                  )}
+                </div>
+              </Select.Option>
+            ))}
           <Select.Option key="add_new" label={t("production.labels.addnewprofile")}>
             <div style={{ display: "flex", alignItems: "center" }}>
               <PlusOutlined style={{ marginRight: "0.5rem" }} />

client/src/components/production-list-table/production-list-table.component.jsx

@@ -51,8 +51,8 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
 
   const initialColumnsRef = useRef(
     (initialStateRef.current &&
-      bodyshop?.production_config
-        ?.find((p) => p.name === defaultView)
+      bodyshop.production_config
+        .find((p) => p.name === defaultView)
         ?.columns.columnKeys.map((k) => {
           return {
             ...ProductionListColumns({
@@ -76,8 +76,8 @@ export function ProductionListTable({ loading, data, refetch, bodyshop, technici
   const { t } = useTranslation();
 
   const matchingColumnConfig = useMemo(() => {
-    return bodyshop?.production_config?.find((p) => p.name === defaultView);
-  }, [bodyshop.production_config]);
+    return bodyshop.production_config.find((p) => p.name === defaultView);
+  }, [bodyshop.production_config, defaultView]);
 
   useEffect(() => {
     const newColumns =