From 1928c765a8033f460d0ba7beea64c14334f68871 Mon Sep 17 00:00:00 2001 From: Bharat Kathi Date: Sun, 5 May 2024 19:43:09 -0700 Subject: [PATCH] whole lotta eslint fixes --- dashboard/.eslintrc.cjs | 7 +++-- dashboard/package-lock.json | 7 +++++ dashboard/package.json | 1 + dashboard/src/App.tsx | 26 +------------------ dashboard/src/components/DashboardHeader.tsx | 2 -- dashboard/src/consts/config.tsx | 2 +- dashboard/src/lib/auth.ts | 2 +- dashboard/src/models/user.tsx | 22 ++++++++-------- dashboard/src/pages/auth/RegisterPage.tsx | 4 +-- .../src/pages/dashboard/DashboardPage.tsx | 7 +---- .../src/pages/gr24/pedal/PedalDetailsPage.tsx | 26 +++---------------- .../src/pages/gr24/pedal/PedalLiveWidget.tsx | 18 +------------ 12 files changed, 33 insertions(+), 91 deletions(-) diff --git a/dashboard/.eslintrc.cjs b/dashboard/.eslintrc.cjs index 6e8698b..7060681 100644 --- a/dashboard/.eslintrc.cjs +++ b/dashboard/.eslintrc.cjs @@ -10,9 +10,8 @@ module.exports = { parser: "@typescript-eslint/parser", plugins: ["react-refresh"], rules: { - "react-refresh/only-export-components": [ - "warn", - { allowConstantExport: true }, - ], + "@typescript-eslint/no-explicit-any": ["off"], + "react-refresh/only-export-components": ["off"], + "react-hooks/exhaustive-deps": ["off"], }, }; diff --git a/dashboard/package-lock.json b/dashboard/package-lock.json index eeaccae..0cc8bb4 100644 --- a/dashboard/package-lock.json +++ b/dashboard/package-lock.json @@ -41,6 +41,7 @@ "tailwindcss-animate": "^1.0.7" }, "devDependencies": { + "@types/crypto-js": "^4.2.2", "@types/node": "^20.11.0", "@types/react": "^18.2.43", "@types/react-dom": "^18.2.17", @@ -2097,6 +2098,12 @@ "integrity": "sha512-myfUej5naTBWnqOCc/MdVOLVjXUXtIA+NpDrDBKJtLLg2shUjBu3cZmB/85RyitKc55+lUUyl7oRfLOvkr2hsw==", "dev": true }, + "node_modules/@types/crypto-js": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/@types/crypto-js/-/crypto-js-4.2.2.tgz", + "integrity": "sha512-sDOLlVbHhXpAUAL0YHDUUwDZf3iN4Bwi4W6a0W0b+QcAezUbRtH4FVb+9J4h+XFPW7l/gQ9F8qC7P+Ec4k8QVQ==", + "dev": true + }, "node_modules/@types/d3-array": { "version": "3.2.1", "resolved": "https://registry.npmjs.org/@types/d3-array/-/d3-array-3.2.1.tgz", diff --git a/dashboard/package.json b/dashboard/package.json index 3450608..f189fdb 100644 --- a/dashboard/package.json +++ b/dashboard/package.json @@ -45,6 +45,7 @@ "tailwindcss-animate": "^1.0.7" }, "devDependencies": { + "@types/crypto-js": "^4.2.2", "@types/node": "^20.11.0", "@types/react": "^18.2.43", "@types/react-dom": "^18.2.17", diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx index 6b4ee03..e778556 100644 --- a/dashboard/src/App.tsx +++ b/dashboard/src/App.tsx @@ -1,5 +1,5 @@ import "./App.css"; -import React, { useReducer } from "react"; +import React from "react"; import axios from "axios"; import { MAPACHE_API_URL } from "./consts/config"; import { Button } from "./components/ui/button"; @@ -11,14 +11,9 @@ import { getAxiosErrorMessage, } from "./lib/axios-error-handler"; import { useNavigate } from "react-router-dom"; -import { checkCredentials } from "./lib/auth"; function App() { const navigate = useNavigate(); - const [, forceUpdate] = useReducer((x) => x + 1, 0); - - const [connected, setConnected] = React.useState(false); - const [pingResponse, setPingResponse] = React.useState({}); const [loginLoading, setLoginLoading] = React.useState(false); const [loginEmail, setLoginEmail] = React.useState(""); @@ -26,27 +21,8 @@ function App() { React.useEffect(() => { init(); - checkVpnConnection(); - const interval = setInterval(() => { - // checkVpnConnection(); - }, 1000); - - return () => clearInterval(interval); }, []); - const checkVpnConnection = async () => { - try { - const response = await axios.get(`${MAPACHE_API_URL}/ping`); - if (response.status == 200) { - setConnected(true); - setPingResponse(response.data); - } - } catch (error) { - setConnected(false); - return; - } - }; - const init = async () => { if ( localStorage.getItem("id") != null && diff --git a/dashboard/src/components/DashboardHeader.tsx b/dashboard/src/components/DashboardHeader.tsx index 87ec82e..cd629e3 100644 --- a/dashboard/src/components/DashboardHeader.tsx +++ b/dashboard/src/components/DashboardHeader.tsx @@ -1,11 +1,9 @@ import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import { Separator } from "./ui/separator"; -import { Button } from "@/components/ui/button"; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, - DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; diff --git a/dashboard/src/consts/config.tsx b/dashboard/src/consts/config.tsx index c940dc4..3eb7cd5 100644 --- a/dashboard/src/consts/config.tsx +++ b/dashboard/src/consts/config.tsx @@ -1,6 +1,6 @@ import { User, initUser } from "@/models/user"; -export var currentUser: User = initUser; +export const currentUser: User = initUser; export const MAPACHE_API_URL = import.meta.env.VITE_MAPACHE_API_URL ?? "http://localhost:7001"; diff --git a/dashboard/src/lib/auth.ts b/dashboard/src/lib/auth.ts index 69946eb..902d3b9 100644 --- a/dashboard/src/lib/auth.ts +++ b/dashboard/src/lib/auth.ts @@ -9,7 +9,7 @@ export const checkCredentials = async () => { return 1; } else if (currentUser.id == "") { try { - var userId = localStorage.getItem("id"); + const userId = localStorage.getItem("id"); const response = await axios.get(`${MAPACHE_API_URL}/users/${userId}`, { headers: { Authorization: `Bearer ${localStorage.getItem("token")}`, diff --git a/dashboard/src/models/user.tsx b/dashboard/src/models/user.tsx index 56ff973..07cf601 100644 --- a/dashboard/src/models/user.tsx +++ b/dashboard/src/models/user.tsx @@ -9,18 +9,18 @@ export interface User { roles: string[]; } -function setUser(user: User, userInput: any): void { - user.id = userInput.id || user.id; - user.firstName = userInput.firstName || user.firstName; - user.lastName = userInput.lastName || user.lastName; - user.email = userInput.email || user.email; - user.subteam = userInput.subteam || user.subteam; - user.createdAt = userInput.createdAt || user.createdAt; - user.updatedAt = userInput.updatedAt || user.updatedAt; - user.roles = userInput.roles || user.roles; -} +// function setUser(user: User, userInput: any): void { +// user.id = userInput.id || user.id; +// user.firstName = userInput.firstName || user.firstName; +// user.lastName = userInput.lastName || user.lastName; +// user.email = userInput.email || user.email; +// user.subteam = userInput.subteam || user.subteam; +// user.createdAt = userInput.createdAt || user.createdAt; +// user.updatedAt = userInput.updatedAt || user.updatedAt; +// user.roles = userInput.roles || user.roles; +// } -export var initUser = { +export const initUser = { id: "", firstName: "", lastName: "", diff --git a/dashboard/src/pages/auth/RegisterPage.tsx b/dashboard/src/pages/auth/RegisterPage.tsx index 0276c1a..3fdf454 100644 --- a/dashboard/src/pages/auth/RegisterPage.tsx +++ b/dashboard/src/pages/auth/RegisterPage.tsx @@ -38,7 +38,7 @@ function RegisterPage() { navigate("/"); } try { - var userId = localStorage.getItem("id"); + const userId = localStorage.getItem("id"); const response = await axios.get(`${MAPACHE_API_URL}/users/${userId}`, { headers: { Authorization: `Bearer ${localStorage.getItem("token")}`, @@ -81,7 +81,7 @@ function RegisterPage() { return; setCreateAccountLoading(true); try { - var userId = localStorage.getItem("id"); + const userId = localStorage.getItem("id"); const response = await axios.post( `${MAPACHE_API_URL}/users/${userId}`, { diff --git a/dashboard/src/pages/dashboard/DashboardPage.tsx b/dashboard/src/pages/dashboard/DashboardPage.tsx index 95c8fb9..9486115 100644 --- a/dashboard/src/pages/dashboard/DashboardPage.tsx +++ b/dashboard/src/pages/dashboard/DashboardPage.tsx @@ -1,9 +1,5 @@ import React from "react"; -import axios from "axios"; import { Loader2 } from "lucide-react"; -import { useToast } from "@/components/ui/use-toast"; -import { MAPACHE_API_URL, currentUser } from "@/consts/config"; -import { Input } from "@/components/ui/input"; import { Button } from "@/components/ui/button"; import { useNavigate } from "react-router-dom"; import { checkCredentials } from "@/lib/auth"; @@ -12,7 +8,6 @@ import GR24PedalLiveWidget from "../gr24/pedal/PedalLiveWidget"; import { Card } from "@/components/ui/card"; function DashboardPage() { - const { toast } = useToast(); const navigate = useNavigate(); const [loading, setLoading] = React.useState(true); @@ -21,7 +16,7 @@ function DashboardPage() { }, []); const init = async () => { - var status = await checkCredentials(); + const status = await checkCredentials(); if (status != 0) { navigate("/auth/register"); } else { diff --git a/dashboard/src/pages/gr24/pedal/PedalDetailsPage.tsx b/dashboard/src/pages/gr24/pedal/PedalDetailsPage.tsx index cf1f941..5badd66 100644 --- a/dashboard/src/pages/gr24/pedal/PedalDetailsPage.tsx +++ b/dashboard/src/pages/gr24/pedal/PedalDetailsPage.tsx @@ -1,14 +1,4 @@ -import axios from "axios"; import { Loader2 } from "lucide-react"; -import { useToast } from "@/components/ui/use-toast"; -import { - LineChart, - Line, - CartesianGrid, - XAxis, - YAxis, - Tooltip, -} from "recharts"; import React, { useCallback } from "react"; import { checkCredentials } from "@/lib/auth"; import { useNavigate } from "react-router-dom"; @@ -17,14 +7,10 @@ import { Button } from "@/components/ui/button"; import { Progress } from "@/components/ui/progress"; function PedalDetailsPage() { - const { toast } = useToast(); const navigate = useNavigate(); const [loading, setLoading] = React.useState(true); - const [socketUrl, setSocketUrl] = React.useState( - "ws://localhost:7001/ws/gr24/pedal", - ); - const [messageHistory, setMessageHistory] = React.useState([]); + const [socketUrl] = React.useState("ws://localhost:7001/ws/gr24/pedal"); const { sendMessage, lastMessage, readyState } = useWebSocket(socketUrl); const [jsonData, setJsonData] = React.useState([{}]); @@ -32,15 +18,11 @@ function PedalDetailsPage() { React.useEffect(() => { init(); if (lastMessage !== null) { - setMessageHistory((prev) => prev.concat(lastMessage)); - if (messageHistory.length > 999) { - setMessageHistory([]); - } setJsonData((prev) => [ ...prev.concat(JSON.parse(lastMessage.data)).slice(-100), ]); } - }, [lastMessage, setMessageHistory]); + }, [lastMessage]); const handleClickSendMessage = useCallback(() => sendMessage("Hello"), []); @@ -54,7 +36,7 @@ function PedalDetailsPage() { const init = async () => { const currentRoute = window.location.pathname + window.location.search; - var status = await checkCredentials(); + const status = await checkCredentials(); if (status != 0) { navigate(`/auth/register?route=${currentRoute}`); } else { @@ -133,7 +115,7 @@ function PedalDetailsPage() {

- Message Count: {messageHistory.length} + Message Count: {jsonData.length}

{jsonData.reverse().map((message, idx) => (
{JSON.stringify(message)}
diff --git a/dashboard/src/pages/gr24/pedal/PedalLiveWidget.tsx b/dashboard/src/pages/gr24/pedal/PedalLiveWidget.tsx index 78499cf..ca580a4 100644 --- a/dashboard/src/pages/gr24/pedal/PedalLiveWidget.tsx +++ b/dashboard/src/pages/gr24/pedal/PedalLiveWidget.tsx @@ -4,28 +4,12 @@ import useWebSocket, { ReadyState } from "react-use-websocket"; import { Progress } from "@/components/ui/progress"; import { Separator } from "@/components/ui/separator"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { - faCircleCheck, - faCircleXmark, -} from "@fortawesome/free-regular-svg-icons"; +import { faCircleXmark } from "@fortawesome/free-regular-svg-icons"; function GR24PedalLiveWidget() { const [socketUrl] = React.useState("ws://localhost:7001/ws/gr24/pedal"); const { lastMessage, readyState } = useWebSocket(socketUrl); - React.useEffect(() => { - if (lastMessage !== null) { - } - }, [lastMessage]); - - const connectionStatus = { - [ReadyState.CONNECTING]: "Connecting", - [ReadyState.OPEN]: "Open", - [ReadyState.CLOSING]: "Closing", - [ReadyState.CLOSED]: "Closed", - [ReadyState.UNINSTANTIATED]: "Uninstantiated", - }[readyState]; - const LoadingComponent = () => { if (readyState === ReadyState.CONNECTING) { return (