diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/package-lock.json b/addOns/webuipoc/src/main/pocs/reactWebUI/package-lock.json index cfa0050d986..aabcba4ab6c 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/package-lock.json +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/package-lock.json @@ -28,6 +28,7 @@ "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" } }, @@ -16970,6 +16971,21 @@ "node": ">= 0.8.0" } }, + "node_modules/prettier": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz", + "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==", + "dev": true, + "bin": { + "prettier": "bin/prettier.cjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/prettier/prettier?sponsor=1" + } + }, "node_modules/pretty-bytes": { "version": "5.6.0", "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.6.0.tgz", diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/package.json b/addOns/webuipoc/src/main/pocs/reactWebUI/package.json index 9747b03e278..713e0d2e879 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/package.json +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/package.json @@ -23,7 +23,11 @@ "build": "PUBLIC_URL=/reactWebUI/ BUILD_PATH=./dist react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", - "lint": "eslint" + "lint": "eslint 'src/**/*.{js,jsx,ts,tsx}'", + "format": "prettier --write 'src/**/*.{js,jsx,ts,tsx}'", + "check-format": "prettier --check 'src/**/*.{js,jsx,ts,tsx}'" + + }, "browserslist": { "production": [ @@ -43,6 +47,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" } + + } diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/App.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/App.js index b688a08e7c0..39c20b00420 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/App.js +++ b/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 (
@@ -23,16 +22,16 @@ const App = () => {
ID | Method | Host | Path | URI
-
-
-
-

- {/* {childNode && +
+
+

+ {/* {childNode && childNode.map((node) => (

{node.hrefId}

))} */} +
diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/App.test.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/App.test.js index 1f03afeece5..9382b9ad53b 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/App.test.js +++ b/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(); const linkElement = screen.getByText(/learn react/i); expect(linkElement).toBeInTheDocument(); diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Accordion/AccordionData.jsx b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Accordion/AccordionData.jsx index 59f29e46210..e047032ce19 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Accordion/AccordionData.jsx +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Accordion/AccordionData.jsx @@ -1,57 +1,47 @@ import React, { useState } from "react"; const Accordion = ({ site, fetchChildren }) => { - const [isAccordionOpen, setAccordionOpen] = useState(false); - const [children, setChildren] = useState([]) + const [isAccordionOpen, setAccordionOpen] = useState(false); + const [children, setChildren] = useState([]); - const handleExpand = async () => { - if (isAccordionOpen == false && site.isLeaf == false) { - const childNodes = await fetchChildren(site.name) - setChildren(childNodes) - } - setAccordionOpen(!isAccordionOpen); + const handleExpand = async () => { + if (isAccordionOpen == false && site.isLeaf == false) { + const childNodes = await fetchChildren(site.name); + setChildren(childNodes); } - + setAccordionOpen(!isAccordionOpen); + }; return (
- - { - isAccordionOpen && ( -
-

- { - children.map((child) => ( - - )) - } -

-
- ) - } -
- + {isAccordionOpen && ( +
+

+ {children.map((child) => ( + + ))} +

+
+ )} + ); }; diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Header/HeaderBase.jsx b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Header/HeaderBase.jsx index d1a2108427d..3bc6ae6a7a2 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Header/HeaderBase.jsx +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Header/HeaderBase.jsx @@ -1,17 +1,18 @@ -import React from 'react'; +import React from "react"; const Header = () => { - return ( -
-
-
-
ZAP
- -
- -
+ return ( +
+
+
+
ZAP
+
- ); -} +
+
+ ); +}; export default Header; diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/HistoryBar.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/HistoryBar.js index 2afd3004e58..8a8ece7ea8d 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/HistoryBar.js +++ b/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 ( -
- History -
- ) + return
History
; } -export default HistoryBar +export default HistoryBar; -// WIP \ No newline at end of file +// WIP diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Request-Response/Req-Resp-Bar.jsx b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Request-Response/Req-Resp-Bar.jsx index b357a81193a..b61f635d09e 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Request-Response/Req-Resp-Bar.jsx +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Request-Response/Req-Resp-Bar.jsx @@ -1,36 +1,31 @@ -import React from 'react'; +import React from "react"; function ResponseBar() { return (
- -
- - -
+
+
Request
-
+
-

############

+

############

- - -
+ +
Response
-
+
-

#############

+

#############

- -
+
); } diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SearchBar/SearchBar.jsx b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SearchBar/SearchBar.jsx index 1bc4b9b5c70..260bd94e559 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SearchBar/SearchBar.jsx +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SearchBar/SearchBar.jsx @@ -1,15 +1,19 @@ -import React from 'react'; +import React from "react"; function SearchBar() { return ( -
-
- +
+
+ +
-
); } diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/Sidebar.jsx b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/Sidebar.jsx index 2709aab546a..aec9c029046 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/Sidebar.jsx +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/Sidebar.jsx @@ -1,21 +1,24 @@ -import React from 'react'; -import { SidebarData } from './SidebarData'; +import React from "react"; +import { SidebarData } from "./SidebarData"; function Sidebar() { return ( -
-
    +
    +
      {SidebarData.map((val, key) => { return ( -
    • { - window.location.pathname =val.ink - }}> - -
      {val.icon}
      -
      {val.title}
      + window.location.pathname = val.ink; + }} + > +
      + {" "} + {val.icon} +
      +
      {val.title}
      • ); })} diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/SidebarData.jsx b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/SidebarData.jsx index da0a538fdd8..db8cb374ea6 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/SidebarData.jsx +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/Sidebar/SidebarData.jsx @@ -1,30 +1,21 @@ -import React from 'react'; -import HomeIcon from '@mui/icons-material/Home'; -import SettingsIcon from '@mui/icons-material/Settings'; -import HighlightOffIcon from '@mui/icons-material/HighlightOff'; - - -export const SidebarData = [ - - { - - icon: , - link: "/home" - } , - - { - - icon: , - link: "/home" - } , - - { - - icon: , - link: "/home" - } - - - -] - +import React from "react"; +import HomeIcon from "@mui/icons-material/Home"; +import SettingsIcon from "@mui/icons-material/Settings"; +import HighlightOffIcon from "@mui/icons-material/HighlightOff"; + +export const SidebarData = [ + { + icon: , + link: "/home", + }, + + { + icon: , + link: "/home", + }, + + { + icon: , + link: "/home", + }, +]; diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SitesTree/SitesTree.jsx b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SitesTree/SitesTree.jsx index 2b2ad382d0d..32d50080ba0 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SitesTree/SitesTree.jsx +++ b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Components/SitesTree/SitesTree.jsx @@ -1,24 +1,22 @@ -import { useState,useEffect } from "react"; +import { useState, useEffect } from "react"; import Accordion from "../Accordion/AccordionData"; import { sendChildNode } from "../../Utilities/requests"; const SiteTree = () => { - - const [initialSitesTree, setInitialSitesTree] = useState(null) - + const [initialSitesTree, setInitialSitesTree] = useState(null); useEffect(() => { - const fetchData = async () => { - try { - const response = await sendChildNode(""); - setInitialSitesTree(response); - } catch (error) { - console.error("Error fetching data:", error); - } - }; + const fetchData = async () => { + try { + const response = await sendChildNode(""); + setInitialSitesTree(response); + } catch (error) { + console.error("Error fetching data:", error); + } + }; - fetchData(); - }, []); + fetchData(); + }, []); return (
      @@ -32,7 +30,7 @@ const SiteTree = () => {
      {initialSitesTree && initialSitesTree.map((node) => ( - + ))}
    diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Contexts/SitesTreeNodeIDContext.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Contexts/SitesTreeNodeIDContext.js new file mode 100644 index 00000000000..4b0fb8ad549 --- /dev/null +++ b/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 ( + + {children} + + ); +}; diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Utilities/req-resp.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Utilities/req-resp.js new file mode 100644 index 00000000000..35931f22736 --- /dev/null +++ b/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 }; diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Utilities/requests.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/Utilities/requests.js index a0622c5af28..b86873324d1 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/Utilities/requests.js +++ b/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 }; diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/index.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/index.js index 1675893a7c6..df86817034b 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/index.js +++ b/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( - -); \ No newline at end of file + , +); diff --git a/addOns/webuipoc/src/main/pocs/reactWebUI/src/setupTests.js b/addOns/webuipoc/src/main/pocs/reactWebUI/src/setupTests.js index 8f2609b7b3e..1dd407a63ef 100644 --- a/addOns/webuipoc/src/main/pocs/reactWebUI/src/setupTests.js +++ b/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"; diff --git a/addOns/webuipoc/webuipoc.gradle.kts b/addOns/webuipoc/webuipoc.gradle.kts index d0fbcc96a21..3798e04cd43 100644 --- a/addOns/webuipoc/webuipoc.gradle.kts +++ b/addOns/webuipoc/webuipoc.gradle.kts @@ -49,8 +49,15 @@ for (dir in pocsSrcDir.listFiles()!!) { workingDir = dir args.set(arrayListOf("run", "lint")) } + val checkFormatTask = + tasks.register("checkFormatPoc$normalizedPocName") { + group = pocBuildTasksGroup + dependsOn(installTask) + workingDir = dir + args.set(arrayListOf("run", "check-format")) + } tasks.named(LifecycleBasePlugin.CHECK_TASK_NAME) { - dependsOn(lintTask) + dependsOn(lintTask, checkFormatTask) } } } else {