refactor(eslint): add new rules and fix new errors

AntaresSimulatorTeam · Mar 7, 2024 · d3dadeb · d3dadeb
1 parent add0c63
commit d3dadeb
Show file tree

Hide file tree

Showing 12 changed files with 153 additions and 27 deletions.
diff --git a/webapp/.eslintrc.cjs b/webapp/.eslintrc.cjs
@@ -11,12 +11,14 @@ module.exports = {
     "plugin:react/recommended",
     "plugin:react/jsx-runtime",
     "plugin:react-hooks/recommended",
+    "plugin:jsdoc/recommended-typescript",
     "plugin:prettier/recommended",
   ],
   plugins: ["react-refresh"],
   ignorePatterns: ["dist", ".eslintrc.cjs"],
   parser: "@typescript-eslint/parser",
   parserOptions: {
+    // `ecmaVersion` is automatically sets by `esXXXX` in `env`
     sourceType: "module",
     project: ["./tsconfig.json", "./tsconfig.node.json"],
     tsconfigRootDir: __dirname,
@@ -41,6 +43,9 @@ module.exports = {
         ],
       },
     ],
+    curly: "error",
+    "jsdoc/require-jsdoc": "off",
+    "jsdoc/tag-lines": ["warn", "any", { "startLines": 1 }], // Expected 1 line after block description
     "no-param-reassign": [
       "error",
       {
@@ -65,6 +70,8 @@ module.exports = {
       "warn",
       { allowConstantExport: true },
     ],
+    "react/hook-use-state": "error",
     "react/prop-types": "off",
+    "react/self-closing-comp": "error",
   },
 };
diff --git a/webapp/package-lock.json b/webapp/package-lock.json
diff --git a/webapp/package.json b/webapp/package.json
@@ -95,6 +95,7 @@
     "@vitejs/plugin-react-swc": "3.5.0",
     "eslint": "8.55.0",
     "eslint-config-prettier": "9.0.0",
+    "eslint-plugin-jsdoc": "48.2.0",
     "eslint-plugin-prettier": "5.0.0",
     "eslint-plugin-react": "7.33.2",
     "eslint-plugin-react-hooks": "4.6.0",

diff --git a/webapp/src/components/App/Data/DatasetCreationDialog.tsx b/webapp/src/components/App/Data/DatasetCreationDialog.tsx
@@ -50,9 +50,9 @@ function DatasetCreationDialog(props: PropTypes) {
   const [name, setName] = useState<string>("");
   const [isJson, setIsJson] = useState(false);
   const [uploadProgress, setUploadProgress] = useState<number>(0);
-  const [currentFile, setFile] = useState<File | undefined>();
+  const [currentFile, setCurrentFile] = useState<File | undefined>();
   const [importing, setImporting] = useState(false);
-  const [publicStatus, setPublic] = useState<boolean>(false);
+  const [publicStatus, setPublicStatus] = useState<boolean>(false);
 
   const onSave = async () => {
     let closeModal = true;
@@ -93,7 +93,7 @@ function DatasetCreationDialog(props: PropTypes) {
   const onUpload = (e: ChangeEvent<HTMLInputElement>) => {
     const { target } = e;
     if (target && target.files && target.files.length === 1) {
-      setFile(target.files[0]);
+      setCurrentFile(target.files[0]);
     }
   };
 
@@ -116,7 +116,7 @@ function DatasetCreationDialog(props: PropTypes) {
 
         if (data) {
           setSelectedGroupList(data.groups);
-          setPublic(data.public);
+          setPublicStatus(data.public);
           setName(data.name);
         }
       } catch (e) {
@@ -249,7 +249,7 @@ function DatasetCreationDialog(props: PropTypes) {
             <ParamTitle>{t("global.public")}</ParamTitle>
             <Checkbox
               checked={publicStatus}
-              onChange={() => setPublic(!publicStatus)}
+              onChange={() => setPublicStatus(!publicStatus)}
               inputProps={{ "aria-label": "primary checkbox" }}
             />
           </BoxParamHeader>

diff --git a/webapp/src/components/App/Data/MatrixDialog.tsx b/webapp/src/components/App/Data/MatrixDialog.tsx
@@ -17,7 +17,7 @@ function MatrixDialog(props: PropTypes) {
   const [t] = useTranslation();
   const enqueueErrorSnackbar = useEnqueueErrorSnackbar();
   const [loading, setLoading] = useState(false);
-  const [matrix, setCurrentMatrix] = useState<MatrixType>({
+  const [matrix, setMatrix] = useState<MatrixType>({
     index: [],
     columns: [],
     data: [],
@@ -34,7 +34,7 @@ function MatrixDialog(props: PropTypes) {
             columns: matrix ? res.columns : [],
             data: matrix ? res.data : [],
           };
-          setCurrentMatrix(matrixContent);
+          setMatrix(matrixContent);
         }
       } catch (error) {
         enqueueErrorSnackbar(t("data.error.matrix"), error as AxiosError);
@@ -44,7 +44,7 @@ function MatrixDialog(props: PropTypes) {
     };
     init();
     return () => {
-      setCurrentMatrix({ index: [], columns: [], data: [] });
+      setMatrix({ index: [], columns: [], data: [] });
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [enqueueErrorSnackbar, matrixInfo, t]);

diff --git a/webapp/src/components/App/Singlestudy/explore/Debug/Data/Json.tsx b/webapp/src/components/App/Singlestudy/explore/Debug/Data/Json.tsx
@@ -22,7 +22,7 @@ function Json({ path, studyId }: Props) {
   const { enqueueSnackbar } = useSnackbar();
   const enqueueErrorSnackbar = useEnqueueErrorSnackbar();
   const [jsonData, setJsonData] = useState<string | null>(null);
-  const [isSaveAllowed, setSaveAllowed] = useState(false);
+  const [isSaveAllowed, setIsSaveAllowed] = useState(false);
 
   const res = usePromiseWithSnackbarError(
     () => getStudyData(studyId, path, -1),
@@ -34,7 +34,7 @@ function Json({ path, studyId }: Props) {
 
   // Reset save button when path changes
   useUpdateEffect(() => {
-    setSaveAllowed(false);
+    setIsSaveAllowed(false);
   }, [studyId, path]);
 
   ////////////////////////////////////////////////////////////////
@@ -48,7 +48,7 @@ function Json({ path, studyId }: Props) {
         enqueueSnackbar(t("studies.success.saveData"), {
           variant: "success",
         });
-        setSaveAllowed(false);
+        setIsSaveAllowed(false);
       } catch (e) {
         enqueueErrorSnackbar(t("studies.error.saveData"), e as AxiosError);
       }
@@ -57,7 +57,7 @@ function Json({ path, studyId }: Props) {
 
   const handleJsonChange = (newJson: string) => {
     setJsonData(newJson);
-    setSaveAllowed(true);
+    setIsSaveAllowed(true);
   };
 
   ////////////////////////////////////////////////////////////////

diff --git a/webapp/src/components/App/Singlestudy/explore/Results/ResultDetails/index.tsx b/webapp/src/components/App/Singlestudy/explore/Results/ResultDetails/index.tsx
@@ -62,7 +62,7 @@ function ResultDetails() {
 
   const { data: output } = outputRes;
   const [dataType, setDataType] = useState(DataType.General);
-  const [timestep, setTimeStep] = useState(Timestep.Hourly);
+  const [timestep, setTimestep] = useState(Timestep.Hourly);
   const [year, setYear] = useState(-1);
   const [itemType, setItemType] = useState(OutputItemType.Areas);
   const [selectedItemId, setSelectedItemId] = useState("");
@@ -151,7 +151,9 @@ function ResultDetails() {
 
   // !NOTE: Workaround to display the date in the correct format, to be replaced by a proper solution.
   const dateTimeFromIndex = useMemo(() => {
-    if (!matrixRes.data) return [];
+    if (!matrixRes.data) {
+      return [];
+    }
 
     // Annual format has a static string
     if (timestep === Timestep.Annual) {
@@ -359,7 +361,7 @@ function ResultDetails() {
                         size="small"
                         variant="outlined"
                         onChange={(event) => {
-                          setTimeStep(event?.target.value as Timestep);
+                          setTimestep(event?.target.value as Timestep);
                         }}
                       />
                     ),

diff --git a/webapp/src/components/App/Singlestudy/explore/Xpansion/Candidates/CreateCandidateDialog.tsx b/webapp/src/components/App/Singlestudy/explore/Xpansion/Candidates/CreateCandidateDialog.tsx
@@ -22,14 +22,14 @@ interface PropType {
 function CreateCandidateDialog(props: PropType) {
   const { open, links, onClose, onSave } = props;
   const [t] = useTranslation();
-  const [isToggled, setToggle] = useState(true);
+  const [isToggled, setIsToggled] = useState(true);
 
   ////////////////////////////////////////////////////////////////
   // Event Handlers
   ////////////////////////////////////////////////////////////////
 
   const handleToggle = () => {
-    setToggle(!isToggled);
+    setIsToggled(!isToggled);
   };
 
   const handleSubmit = (data: SubmitHandlerPlus<XpansionCandidate>) => {

diff --git a/webapp/src/components/App/Studies/ExportModal/ExportFilter/index.tsx b/webapp/src/components/App/Studies/ExportModal/ExportFilter/index.tsx
@@ -35,7 +35,7 @@ interface PropTypes {
 function ExportFilterModal(props: PropTypes) {
   const [t] = useTranslation();
   const { output, synthesis, filter, setFilter } = props;
-  const [year, setCurrentYear] = useState<number[]>([]);
+  const [year, setYear] = useState<number[]>([]);
   const [byYear, setByYear] = useState<{ isByYear: boolean; nbYear: number }>({
     isByYear: false,
     nbYear: -1,
@@ -105,7 +105,7 @@ function ExportFilterModal(props: PropTypes) {
           }))}
           data={year.map((elm) => elm.toString())}
           setValue={(value: string[] | string) =>
-            setCurrentYear((value as string[]).map((elm) => parseInt(elm, 10)))
+            setYear((value as string[]).map((elm) => parseInt(elm, 10)))
           }
           sx={{ width: "100%", mb: 2 }}
           required