webuipoc: integrate code formatter

addOns/webuipoc/src/main/pocs/reactWebUI/package.json

@@ -43,6 +43,9 @@
     "eslint-plugin-react": "^7.34.1",
     "eslint-plugin-react-hooks": "^4.6.2",
     "nth-check": ">=2.0.1",
+    "prettier": "3.3.3",
     "tailwindcss": "^3.4.3"
   }
+
+
 }

addOns/webuipoc/src/main/pocs/reactWebUI/src/App.js

@@ -9,7 +9,6 @@ import { sendChildNode } from "./Utilities/requests";
 import SearchBar from "./Components/SearchBar/SearchBar";
 
 const App = () => {
-
   return (
     <div className="flex mt-16 overflow-auto">
       <HeaderBase />
@@ -23,16 +22,16 @@ const App = () => {
             <div className=" w-1/3 p-4 font-serif text-center ">
               ID | Method | Host | Path | URI
             </div>
-          </div>
-          <div className="flex flex-row  justify-center text-center">
-            <div className=" p-4">
-              <p className="font-mono "></p>
-              {/* {childNode &&
+            <div className="flex flex-row  justify-center text-center">
+              <div className=" p-4">
+                <p className="font-mono "></p>
+                {/* {childNode &&
                 childNode.map((node) => (
                   <p className="" key={childNode}>
                     {node.hrefId}
                   </p>
                 ))} */}
+              </div>
             </div>
           </div>
         </div>

addOns/webuipoc/src/main/pocs/reactWebUI/src/App.test.js

@@ -1,7 +1,7 @@
-import { render, screen } from '@testing-library/react';
-import App from './App';
+import { render, screen } from "@testing-library/react";
+import App from "./App";
 
-test('renders learn react link', () => {
+test("renders learn react link", () => {
   render(<App />);
   const linkElement = screen.getByText(/learn react/i);
   expect(linkElement).toBeInTheDocument();

addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/HistoryBar.js

@@ -1,13 +1,9 @@
-import React from 'react'
+import React from "react";
 
 function HistoryBar() {
-  return (
-     <div className="w-full bg-gray-400 text-white h-[250px]">
-              History
-            </div>
-  )
+  return <div className="w-full bg-gray-400 text-white h-[250px]">History</div>;
 }
 
-export default HistoryBar
+export default HistoryBar;
 
-// WIP 
+// WIP

addOns/webuipoc/src/main/pocs/reactWebUI/src/Contexts/SitesTreeNodeIDContext.js

@@ -0,0 +1,12 @@
+import React, { useState, createContext } from "react";
+
+export const nodeIDContext = createContext();
+
+export const NodeIDProvider = ({ children }) => {
+  const [nodeID, setNodeID] = useState(0);
+  return (
+    <nodeIDContext.Provider value={{ nodeID, setNodeID }}>
+      {children}
+    </nodeIDContext.Provider>
+  );
+};

addOns/webuipoc/src/main/pocs/reactWebUI/src/Utilities/req-resp.js

@@ -0,0 +1,13 @@
+import axios from "axios";
+
+const sendMessage = async (id) => {
+  try {
+    const response = await axios.get(`/JSON/core/view/message?id=${id}`);
+    return response.data.message;
+  } catch (error) {
+    console.error("Error fetching data:", error);
+    throw error;
+  }
+};
+
+export { sendMessage };

addOns/webuipoc/src/main/pocs/reactWebUI/src/Utilities/requests.js

@@ -1,25 +1,24 @@
-import axios from 'axios';
+import axios from "axios";
 
 const sendChildNode = async (url) => {
-    try {
-        if (url.length === 0) {
-             if (process.env.NODE_ENV === "development") {
-                axios.defaults.baseURL = "http://localhost:1337";
-             } else {
-                axios.defaults.baseURL = "";
-       }
+  try {
+    if (url.length === 0) {
+      if (process.env.NODE_ENV === "development") {
+        axios.defaults.baseURL = "http://localhost:1337";
+      } else {
+        axios.defaults.baseURL = "";
+      }
 
-            const response = await axios.get('/JSON/core/view/childNodes/');
-            return response.data.childNodes;
-        } else {
-            const response = await axios.get(`/JSON/core/view/childNodes?url=${url}`);
-            return response.data.childNodes;
-          }
- } catch (error) {
-        console.error('Error fetching data:', error);
-        throw error;
+      const response = await axios.get("/JSON/core/view/childNodes/");
+      return response.data.childNodes;
+    } else {
+      const response = await axios.get(`/JSON/core/view/childNodes?url=${url}`);
+      return response.data.childNodes;
     }
-
+  } catch (error) {
+    console.error("Error fetching data:", error);
+    throw error;
+  }
 };
 
 export { sendChildNode };

addOns/webuipoc/src/main/pocs/reactWebUI/src/index.js

@@ -1,11 +1,11 @@
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import './index.css';
-import App from './App';
+import React from "react";
+import ReactDOM from "react-dom/client";
+import "./index.css";
+import App from "./App";
 
-const root = ReactDOM.createRoot(document.getElementById('root'));
+const root = ReactDOM.createRoot(document.getElementById("root"));
 root.render(
   <React.StrictMode>
     <App />
-  </React.StrictMode>
-);
+  </React.StrictMode>,
+);

addOns/webuipoc/src/main/pocs/reactWebUI/src/setupTests.js

@@ -2,4 +2,4 @@
 // allows you to do things like:
 // expect(element).toHaveTextContent(/react/i)
 // learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";