fixing all linter issues

.github/workflows/lint.yml

@@ -0,0 +1,15 @@
+name: Run Unit Tests and Lint Files
+on: push
+
+jobs:
+  unit_test-lint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@master
+        with:
+          node-version: 18.19
+      - run: |
+              yarn
+              yarn run build
+              yarn run lint

orval.config.js

@@ -1,6 +1,6 @@
 import { mockOntologies } from "./mock/data/mockOntologies";
 import { mockOrganization, mockOrganizations } from "./mock/data/mockOrganizations";
-import { mockTerms, mockTerm } from "./mock/data/mockTerms";
+import { mockTerms } from "./mock/data/mockTerms";
 import { mockSearch } from "./mock/data/mockSearch";
 import { mockVariants, mockVariant } from "./mock/data/mockVariants";
 import { mockVersions } from "./mock/data/mockVersions";
@@ -10,7 +10,7 @@ import { mockForks } from "./mock/data/mockForks";
 import { mockPatchBulkTermsResponse, mockPatchTermResponse } from "./mock/data/mockPatchTermResponse";
 import { mockDiscussions, mockPostMessage } from "./mock/data/mockDiscussions";
 
-module.exports = {
+export default {
   uri: {
     input: {
       target: "https://uri.olympiangods.org/docs/swagger.json",

src/App.jsx

@@ -7,21 +7,22 @@ import {
 	useLocation,
 } from "react-router-dom";
 import theme from "./theme";
+import PropTypes from 'prop-types';
 import Header from "./components/Header";
-import SearchResults from "./components/SearchResults";
-import SingleTermView from "./components/SingleTermView";
-import HomePage from "./components/HomePage";
 import Footer from "./components/Footer";
-import Organizations from "./components/organizations";
-import CurieEditor from "./components/CurieEditor";
-import TermActivity from "./components/term_activity/TermActivity";
-import { GlobalDataProvider } from "./contexts/DataContext";
-import Dashboard from "./components/Dashboard";
 import Login from "./components/Auth/Login";
+import HomePage from "./components/HomePage";
+import Dashboard from "./components/Dashboard";
 import Register from "./components/Auth/Register";
-import ForgotPassword from "./components/Auth/ForgotPassword";
+import CurieEditor from "./components/CurieEditor";
+import SearchResults from "./components/SearchResults";
+import Organizations from "./components/organizations";
+import SingleTermView from "./components/SingleTermView";
+import { GlobalDataProvider } from "./contexts/DataContext";
 import ResetPassword from "./components/Auth/ResetPassword";
+import ForgotPassword from "./components/Auth/ForgotPassword";
 import SingleOrganization from "./components/SingleOrganization";
+import TermActivity from "./components/term_activity/TermActivity";
 import OrganizationsCurieEditor from "./components/CurieEditor/OrganizationCurieEditor";
 
 const PageContainer = ({ children }) => {
@@ -31,6 +32,7 @@ const PageContainer = ({ children }) => {
 		</Box>
 	);
 };
+
 function MainContent() {
 	return (
 		<Box
@@ -144,4 +146,12 @@ function App() {
 	);
 }
 
+PageContainer.propTypes = {
+	children: PropTypes.node.isRequired,
+};
+
+Layout.propTypes = {
+	children: PropTypes.node.isRequired,
+};
+
 export default App;

src/Icons/index.jsx

@@ -885,9 +885,9 @@ export const StatusErrorBackgroundPattern = () => (
 				width="46"
 				height="46"
 				filterUnits="userSpaceOnUse"
-				color-interpolation-filters="sRGB"
+				colorInterpolationFilters="sRGB"
 			>
-				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feFlood floodOpacity="0" result="BackgroundImageFix" />
 				<feColorMatrix
 					in="SourceAlpha"
 					type="matrix"
@@ -939,8 +939,8 @@ export const StatusErrorBackgroundPattern = () => (
 				y2="104"
 				gradientUnits="userSpaceOnUse"
 			>
-				<stop stop-color="#F9FAFB" />
-				<stop offset="1" stop-color="#EDF0F3" />
+				<stop stopColor="#F9FAFB" />
+				<stop offset="1" stopColor="#EDF0F3" />
 			</linearGradient>
 		</defs>
 	</svg>
@@ -975,9 +975,9 @@ export const StatusWarningBackgroundPattern = () => (
 				width="46"
 				height="46"
 				filterUnits="userSpaceOnUse"
-				color-interpolation-filters="sRGB"
+				colorInterpolationFilters="sRGB"
 			>
-				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feFlood floodOpacity="0" result="BackgroundImageFix" />
 				<feColorMatrix
 					in="SourceAlpha"
 					type="matrix"
@@ -1029,8 +1029,8 @@ export const StatusWarningBackgroundPattern = () => (
 				y2="104"
 				gradientUnits="userSpaceOnUse"
 			>
-				<stop stop-color="#F9FAFB" />
-				<stop offset="1" stop-color="#EDF0F3" />
+				<stop stopColor="#F9FAFB" />
+				<stop offset="1" stopColor="#EDF0F3" />
 			</linearGradient>
 		</defs>
 	</svg>

src/components/About/index.jsx

@@ -1,10 +1,23 @@
-import { Box, Container, Grid, List, ListItem, ListItemButton, ListItemText, Typography } from "@mui/material";
-import { vars } from "../../theme/variables";
-import { ForwardIcon } from "../../Icons";
-import Tabs from '@mui/material/Tabs';
-import Tab from '@mui/material/Tab';
 import React from "react";
+import PropTypes from 'prop-types';
+import {
+    Box,
+    Container,
+    Grid,
+    List,
+    ListItem,
+    ListItemButton,
+    ListItemText,
+    Tab,
+    Tabs,
+    Typography
+} from "@mui/material";
+
+
+import { ForwardIcon } from "../../Icons";
+import { vars } from "../../theme/variables";
 import TabsData from "../../static/AboutTabs.json";
+
 const { gray50, gray700, gray500, brand700 } = vars;
 
 const style = {
@@ -123,8 +136,8 @@ const About = () => {
                                 TabsData.tabs.map((tab, index) => (
                                     <Tab label={tab?.heading} {...a11yProps(index)} key={tab?.heading} />
                                 ))
-                            }                          
-                        </Tabs>      
+                            }
+                        </Tabs>
                         </Grid>
                         <Grid item xs={10}>
                             {
@@ -183,4 +196,10 @@ const About = () => {
     )
 }
 
-export default About;
+TabPanel.propTypes = {
+    children: PropTypes.node,
+    value: PropTypes.any.isRequired,
+    index: PropTypes.any.isRequired,
+};
+
+export default About;

src/components/Auth/Login.jsx

@@ -40,7 +40,6 @@ const Login = () => {
   };
 
   const handleOrcidSignIn = () => {
-    const originUrl = window.location.href;
     const orcidSignInUrl = `https://uri.olympiangods.org/u/ops/orcid-login`;
     window.location.href = orcidSignInUrl;
   };

src/components/Auth/ResetPassword.jsx

@@ -1,9 +1,8 @@
 import * as React from "react";
-import { Box, Button, FormControl, Grid, Paper, Typography } from "@mui/material";
-import { ArrowBack } from "@mui/icons-material";
-import PasswordField from "./UI/PasswordField";
 import { Link } from "react-router-dom";
-import { handleForgotPassword } from "../../api/endpoints/index";
+import PasswordField from "./UI/PasswordField";
+import { ArrowBack } from "@mui/icons-material";
+import { Box, Button, FormControl, Grid, Paper, Typography } from "@mui/material";
 
 const ResetPassword = () => {
   const [password, setPassword] = React.useState("");
@@ -16,7 +15,8 @@ const ResetPassword = () => {
     }
 
     try {
-      await handleResetPassword(password);
+      // Call the reset password API
+      // await handleResetPassword(password);
       console.log("Password reset successful");
     } catch (error) {
       console.error("Error:", error);
@@ -61,4 +61,4 @@ const ResetPassword = () => {
   );
 };
 
-export default ResetPassword;
+export default ResetPassword;

src/components/Auth/UI/Formfield.jsx

@@ -1,4 +1,3 @@
-import * as React from "react";
 import PropTypes from "prop-types";
 import { Grid, FormControl, Box, FormHelperText, OutlinedInput } from "@mui/material";
 

src/components/Auth/UI/PasswordField.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import PropTypes from "prop-types";
 import {
   FormControl,

src/components/CurieEditor/CurieEditorDialog.jsx

@@ -1,10 +1,10 @@
 import * as React from "react";
+import PropTypes from 'prop-types';
+import { EditNoteIcon } from "../../Icons";
 import { Box, Button } from "@mui/material";
+import StatusDialog from "../common/StatusDialog";
 import CustomizedDialog from "../common/CustomizedDialog";
-import { EditNoteIcon } from "../../Icons";
 import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
-import StatusDialog from "../common/StatusDialog";
-
 
 const HeaderRightSideContent = ({ handleClose, onSaveCuries }) => {
     return (
@@ -18,6 +18,7 @@ const HeaderRightSideContent = ({ handleClose, onSaveCuries }) => {
     )
 }
 
+
 const CurieEditorDialog = ({ open, handleClose, onSubmit, children, isFromOrganization }) => {
     const [openStatusDialog, setOpenStatusDialog] = React.useState(false);
 
@@ -62,4 +63,17 @@ const CurieEditorDialog = ({ open, handleClose, onSubmit, children, isFromOrgani
     )
 }
 
-export default CurieEditorDialog;
+HeaderRightSideContent.propTypes = {
+    handleClose: PropTypes.func.isRequired,
+    onSaveCuries: PropTypes.func.isRequired,
+};
+
+CurieEditorDialog.propTypes = {
+    open: PropTypes.bool.isRequired,
+    handleClose: PropTypes.func.isRequired,
+    onSubmit: PropTypes.func.isRequired,
+    children: PropTypes.node.isRequired,
+    isFromOrganization: PropTypes.bool,
+};
+
+export default CurieEditorDialog;

src/components/CurieEditor/CuriesTabPanel.jsx

@@ -1,11 +1,12 @@
 import * as React from "react";
-import { Box, TableRow, TableCell, IconButton, TextField, ClickAwayListener, CircularProgress } from "@mui/material";
+import PropTypes from 'prop-types';
 import CustomTable from "../common/CustomTable";
 import { getComparator, stableSort } from "../../utils";
-import DeleteOutlineOutlinedIcon from '@mui/icons-material/DeleteOutlineOutlined';
 import AddOutlinedIcon from '@mui/icons-material/AddOutlined';
-import { vars } from "../../theme/variables";
+import DeleteOutlineOutlinedIcon from '@mui/icons-material/DeleteOutlineOutlined';
+import { Box, TableRow, TableCell, IconButton, TextField, ClickAwayListener, CircularProgress } from "@mui/material";
 
+import { vars } from "../../theme/variables";
 const { gray600, brand500, gray100, gray300, gray700 } = vars;
 
 const headCells = [
@@ -65,7 +66,7 @@ const CuriesTabPanel = (props) => {
 
     React.useEffect(() => {
         onCurieAmountChange?.(rows.length)
-    }, [rows])
+    }, [rows, onCurieAmountChange]);
 
     const handleExit = () => {
         setRowIndex(-1);
@@ -167,4 +168,17 @@ const CuriesTabPanel = (props) => {
     )
 }
 
-export default CuriesTabPanel;
+CuriesTabPanel.propTypes = {
+    curieValue: PropTypes.string.isRequired,
+    error: PropTypes.bool,
+    loading: PropTypes.bool,
+    rows: PropTypes.array,
+    editMode: PropTypes.bool,
+    numberOfVisibleCuries: PropTypes.number,
+    onCurieAmountChange: PropTypes.func,
+    onAddRow: PropTypes.func,
+    onDeleteRow: PropTypes.func,
+    onChangeRow: PropTypes.func
+}
+
+export default CuriesTabPanel;

src/components/CurieEditor/OntologyTabPanel.jsx

@@ -1,8 +1,7 @@
-import React from "react"
 import { Grid, Stack } from "@mui/material";
 import CustomAutocompleteBox from "../common/CustomAutocompleteBox";
 import FolderSharedOutlinedIcon from '@mui/icons-material/FolderSharedOutlined';
-import { getOrganizationOntologies } from "../../api/endpoints";
+// import { getOrganizationOntologies } from "../../api/endpoints";
 
 const OntologyTabPanel = () => {
 
@@ -24,4 +23,4 @@ const OntologyTabPanel = () => {
     </Grid>)
 }
 
-export default OntologyTabPanel;
+export default OntologyTabPanel;

src/components/CurieEditor/OrganizationCurieEditor.jsx

@@ -1,16 +1,21 @@
-import React, { useState, useEffect, useMemo, useCallback } from "react";
-import { Box, Typography, Divider, Grid, Stack } from "@mui/material";
-import CustomButton from "../common/CustomButton";
+import {
+    useState,
+    useEffect,
+    useMemo,
+    useCallback
+} from "react";
+import debounce from 'lodash/debounce';
+import { EditNoteIcon } from "../../Icons";
 import BasicTabs from "../common/CustomTabs";
-import CurieEditorDialog from "./CurieEditorDialog";
 import CuriesTabPanel from "./CuriesTabPanel";
-import { EditNoteIcon } from "../../Icons";
-import { vars } from "../../theme/variables";
-import CustomSingleSelect from "../common/CustomSingleSelect";
+import CustomButton from "../common/CustomButton";
 import OntologyTabPanel from "./OntologyTabPanel";
+import CurieEditorDialog from "./CurieEditorDialog";
 import { getOrganizationCuries } from "../../api/endpoints";
-import debounce from 'lodash/debounce';
+import CustomSingleSelect from "../common/CustomSingleSelect";
+import { Box, Typography, Divider, Grid, Stack } from "@mui/material";
 
+import { vars } from "../../theme/variables";
 const { gray200, gray600, gray700 } = vars;
 
 const generatePageOptions = (curieAmount) => {
@@ -20,11 +25,11 @@ const generatePageOptions = (curieAmount) => {
 };
 
 const newRowObj = { prefix: '', namespace: '' };
-
 const curiesTabs = ["Organization", "Ontologies"];
 
 const OrganizationsCurieEditor = () => {
     const [loading, setLoading] = useState(true);
+    // eslint-disable-next-line no-unused-vars
     const [error, setError] = useState(null);
     const [curies, setCuries] = useState([]);
     const [tabValue, setTabValue] = useState(0);
@@ -42,8 +47,9 @@ const OrganizationsCurieEditor = () => {
         }).catch((error) => {
             console.log("Error ", error)
         });
-    }, [getOrganizationCuries]);
+    }, [setCuries, setCurieAmount, setLoading]);
 
+    // eslint-disable-next-line no-unused-vars
     const handleAddNewCurieRow = (curieValue) => {
         setCuries(prev => [
             ...prev, newRowObj
@@ -62,6 +68,7 @@ const OrganizationsCurieEditor = () => {
         []
     );
 
+    // eslint-disable-next-line no-unused-vars
     const handleInputChangeCurieRow = (e, rowIndex, columnName, curieValue) => {
         console.log("UPDATE: here connect to update method")
         const updatedRows = curies.map((row, index) => index === rowIndex ? { ...row, [columnName]: e.target.value } : row);