Activate eslint no-unsafe-argument

Arnei · Arnei · commit 9893c8424cf5 · 2025-07-14T09:48:07.000+02:00
Enables the eslint rule no-unsafe-argument
diff --git a/eslint.config.js b/eslint.config.js
@@ -19,7 +19,6 @@ export default [
             "@typescript-eslint/no-explicit-any": "off",
             "@typescript-eslint/no-floating-promises": "off",
             "@typescript-eslint/no-misused-promises": "off",
-            "@typescript-eslint/no-unsafe-argument": "off",
             "@typescript-eslint/no-unsafe-member-access": "off",
             "@typescript-eslint/no-unused-vars": "off",
             "@typescript-eslint/no-unsafe-return": "off",
diff --git a/src/components/About.tsx b/src/components/About.tsx
@@ -20,12 +20,13 @@ const About = () => {
 			return `/ui/config/admin-ui/${location.pathname.split("/").pop()}.${language}.html`;
 		};
 
-		axios.get(getURL(i18n.language))
+		// We should be getting HTML from the endpoint
+		axios.get<string>(getURL(i18n.language))
 			.then(response => {
 				setAboutContent(response.data);
 			})
 			.catch(() => {
-				axios.get(getURL(typeof i18n.options.fallbackLng === "string" ? i18n.options.fallbackLng : "en-US"))
+				axios.get<string>(getURL(typeof i18n.options.fallbackLng === "string" ? i18n.options.fallbackLng : "en-US"))
 					.then(response => {
 						setAboutContent(response.data);
 					})
diff --git a/src/components/configuration/partials/wizard/NewThemeWizard.tsx b/src/components/configuration/partials/wizard/NewThemeWizard.tsx
@@ -99,7 +99,7 @@ const NewThemeWizard = ({
 								setActivePage={setPage}
 								completed={pageCompleted}
 								setCompleted={setPageCompleted}
-								formik={formik}
+								isValid={formik.isValid}
 							/>
 							<div>
 								{steps[page].name === "generalForm" && (
diff --git a/src/components/events/partials/modals/EditScheduledEventsModal.tsx b/src/components/events/partials/modals/EditScheduledEventsModal.tsx
@@ -142,7 +142,7 @@ const EditScheduledEventsModal = ({
 								setActivePage={setPage}
 								completed={pageCompleted}
 								setCompleted={setPageCompleted}
-								formik={formik}
+								isValid={formik.isValid}
 							/>
 							<div>
 								{steps[page].name === "general" && (
diff --git a/src/components/events/partials/modals/StartTaskModal.tsx b/src/components/events/partials/modals/StartTaskModal.tsx
@@ -108,7 +108,7 @@ const StartTaskModal = ({
 								setActivePage={setPage}
 								completed={pageCompleted}
 								setCompleted={setPageCompleted}
-								formik={formik}
+								isValid={formik.isValid}
 							/>
 							<div>
 								{steps[page].name === "general" && (
diff --git a/src/components/events/partials/wizards/NewEventWizard.tsx b/src/components/events/partials/wizards/NewEventWizard.tsx
@@ -187,8 +187,8 @@ const NewEventWizard = ({
 								setActivePage={setPage}
 								completed={pageCompleted}
 								setCompleted={setPageCompleted}
-								formik={formik}
-								hasAccessPage
+								isValid={formik.isValid}
+								acls={formik.values.policies}
 							/>
 							<div>
 								{steps[page].name === "metadata" && (
diff --git a/src/components/events/partials/wizards/NewSeriesWizard.tsx b/src/components/events/partials/wizards/NewSeriesWizard.tsx
@@ -171,8 +171,8 @@ const NewSeriesWizard = ({
 								setActivePage={setPage}
 								completed={pageCompleted}
 								setCompleted={setPageCompleted}
-								formik={formik}
-								hasAccessPage
+								acls={formik.values.policies}
+								isValid={formik.isValid}
 							/>
 							<div>
 								{steps[page].name === "metadata" && (
diff --git a/src/components/shared/TimeSeriesStatistics.tsx b/src/components/shared/TimeSeriesStatistics.tsx
@@ -221,10 +221,9 @@ const TimeSeriesStatistics = ({
 									name="timeMode"
 									value={mode.value}
 									id={providerId + "-mode-" + key}
-// @ts-expect-error TS(7006): Parameter 'event' implicitly has an 'any' type.
-									onChange={event =>
+									onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
 										changeTimeMode(
-											event.target.value,
+											event.target.value as TimeMode, // see type of "mode.value"
 											formik.setFieldValue,
 											formik.values.fromDate,
 											formik.values.toDate,
@@ -328,10 +327,9 @@ const TimeSeriesStatistics = ({
 										name="dataResolution"
 										as="select"
 										data-width="'100px'"
-// @ts-expect-error TS(7006): Parameter 'event' implicitly has an 'any' type.
-										onChange={event =>
+										onChange={(event: React.ChangeEvent<HTMLSelectElement>) =>
 											changeGranularity(
-												event.target.value,
+												event.target.value as DataResolution,
 												formik.setFieldValue,
 												formik.values.timeMode,
 												formik.values.fromDate,
diff --git a/src/components/shared/wizard/RenderField.tsx b/src/components/shared/wizard/RenderField.tsx
@@ -172,7 +172,7 @@ const EditableDateValue = ({
 		<div onClick={e => { e.stopPropagation(); }}>
 			<DatePicker
 				ref={ref}
-				selected={!isNaN(Date.parse(field.value)) ? new Date(field.value) : null}
+				selected={!isNaN(Date.parse(field.value as string)) ? new Date(field.value as string) : null}
 				onChange={value => setFieldValue(field.name, value)}
 				showTimeInput
 				showYearDropdown
diff --git a/src/components/shared/wizard/SelectContainer.tsx b/src/components/shared/wizard/SelectContainer.tsx
@@ -32,7 +32,7 @@ const SelectContainer = ({
 
 	// Formik hook for getting data of specific form field
 	// DON'T delete field and meta, hook works with indices not variable names
-	const [field, , helpers] = useField(formikField);
+	const [field, , helpers] = useField<Item[]>(formikField);
 
 	// Search field for filter options/items
 	const [searchField, setSearchField] = useState("");
diff --git a/src/components/shared/wizard/WizardStepper.tsx b/src/components/shared/wizard/WizardStepper.tsx
@@ -11,6 +11,7 @@ import { checkAcls } from "../../../slices/aclSlice";
 import { useAppDispatch } from "../../../store";
 import { FormikProps } from "formik/dist/types";
 import { ParseKeys } from "i18next";
+import { TransformedAcl } from "../../../slices/aclDetailsSlice";
 
 export type WizardStep = {
 	translation: ParseKeys,
@@ -24,32 +25,32 @@ const WizardStepper = ({
 	steps,
 	activePageIndex,
 	setActivePage,
-	formik,
 	completed,
 	setCompleted,
-	hasAccessPage = false,
+	acls,
+	isValid = false,
 }: {
 	steps: WizardStep[],
 	activePageIndex: number,
 	setActivePage: (num: number) => void,
-	formik: FormikProps<any>,
 	completed: Record<number, boolean>,
 	setCompleted: (rec: Record<number, boolean>) => void,
-	hasAccessPage?: boolean,
+	acls?: TransformedAcl[], // If there is an acl page
+	isValid: boolean,
 }) => {
 	const { t } = useTranslation();
 	const dispatch = useAppDispatch();
 
 	const handleOnClick = async (key: number) => {
 		if (isSummaryReachable(key, steps, completed)) {
-			if (hasAccessPage) {
-				const check = await dispatch(checkAcls(formik.values.acls));
+			if (acls) {
+				const check = await dispatch(checkAcls(acls));
 				if (!check) {
 					return;
 				}
 			}
 
-			if (formik.isValid) {
+			if (isValid) {
 				const updatedCompleted = completed;
 				updatedCompleted[activePageIndex] = true;
 				setCompleted(updatedCompleted);
@@ -62,7 +63,7 @@ const WizardStepper = ({
 				}
 			}
 
-			if (!formik.isValid) {
+			if (!isValid) {
 				if (completed[key]) {
 					setActivePage(key);
 				}
diff --git a/src/components/users/partials/wizard/NewAclWizard.tsx b/src/components/users/partials/wizard/NewAclWizard.tsx
@@ -88,8 +88,8 @@ const NewAclWizard = ({
 								setActivePage={setPage}
 								completed={pageCompleted}
 								setCompleted={setPageCompleted}
-								formik={formik}
-								hasAccessPage
+								isValid={formik.isValid}
+								acls={formik.values.policies}
 							/>
 							<div>
 								{steps[page].name === "metadata" && (
diff --git a/src/components/users/partials/wizard/NewGroupWizard.tsx b/src/components/users/partials/wizard/NewGroupWizard.tsx
@@ -91,7 +91,7 @@ const NewGroupWizard: React.FC<{
 								setActivePage={setPage}
 								completed={pageCompleted}
 								setCompleted={setPageCompleted}
-								formik={formik}
+								isValid={formik.isValid}
 							/>
 							<div>
 								{steps[page].name === "metadata" && (
diff --git a/src/configs/statisticsConfig.ts b/src/configs/statisticsConfig.ts
@@ -1,7 +1,12 @@
 /* this file contains constants for available options and used date formats for statistics */
 
+import { TimeMode } from "../slices/statisticsSlice";
+
 // available modes of choosing statistic timeframe
-export const statisticTimeModes = [
+export const statisticTimeModes: {
+	value: TimeMode,
+	translation: string,
+}[] = [
 	{
 		value: "year",
 		translation: "Year",
diff --git a/src/index.tsx b/src/index.tsx
@@ -22,9 +22,9 @@ import { HotkeysProvider } from "react-hotkeys-hook";
 // Commenting persistent stuff out can help with debugging
 const persistor = persistStore(store);
 
-if (import.meta.env.DEV && import.meta.env.VITE_TEST_SERVER_URL && typeof import.meta.env.VITE_TEST_SERVER_URL === "string") {
+if (import.meta.env.DEV && import.meta.env.VITE_TEST_SERVER_URL) {
 	axios.defaults.baseURL = import.meta.env.VITE_TEST_SERVER_URL || "";
-	if (import.meta.env.VITE_TEST_SERVER_AUTH && import.meta.env.VITE_TEST_SERVER_AUTH === "string") {
+	if (import.meta.env.VITE_TEST_SERVER_AUTH) {
 		axios.defaults.headers.common["Authorization"] = "Basic " + window.btoa(import.meta.env.VITE_TEST_SERVER_AUTH);
 	}
 }
diff --git a/src/slices/eventDetailsSlice.ts b/src/slices/eventDetailsSlice.ts
@@ -1,5 +1,5 @@
 import { PayloadAction, SerializedError, createSlice, unwrapResult } from "@reduxjs/toolkit";
-import axios from "axios";
+import axios, { AxiosError } from "axios";
 import { addNotification, removeNotificationWizardForm } from "./notificationSlice";
 import {
 	getHttpHeaders,
@@ -953,7 +953,7 @@ export const fetchEventDetailsTobira = createAppAsyncThunk("eventDetails/fetchEv
 	{ dispatch },
 ) => {
 	const res = await axios.get<EventDetailsState["tobiraData"]>(`/admin-ng/event/${id}/tobira/pages`)
-		.catch(response => handleTobiraError(response, dispatch));
+		.catch((error: AxiosError) => handleTobiraError(error, dispatch));
 
 	if (!res) {
 		throw new Error();
diff --git a/src/slices/seriesDetailsSlice.ts b/src/slices/seriesDetailsSlice.ts
@@ -1,5 +1,5 @@
 import { PayloadAction, SerializedError, createSlice } from "@reduxjs/toolkit";
-import axios from "axios";
+import axios, { AxiosError } from "axios";
 import _ from "lodash";
 import {
 	getSeriesDetailsExtendedMetadata,
@@ -344,7 +344,7 @@ export const fetchSeriesDetailsTobira = createAppAsyncThunk("seriesDetails/fetch
 	{ dispatch },
 ) => {
 	const res = await axios.get<SeriesDetailsState["tobiraData"]>(`/admin-ng/series/${id}/tobira/pages`)
-		.catch(response => handleTobiraError(response, dispatch));
+		.catch((error: AxiosError) => handleTobiraError(error, dispatch));
 
 	if (!res) {
 		throw new Error();
diff --git a/src/slices/seriesSlice.ts b/src/slices/seriesSlice.ts
@@ -1,6 +1,6 @@
 import { PayloadAction, SerializedError, createSlice } from "@reduxjs/toolkit";
 import { seriesTableConfig } from "../configs/tableConfigs/seriesTableConfig";
-import axios from "axios";
+import axios, { AxiosError } from "axios";
 import {
 	getURLParams,
 	prepareAccessPolicyRulesForPost,
@@ -350,7 +350,7 @@ export const deleteMultipleSeries = createAppAsyncThunk("series/deleteMultipleSe
 // fetch metadata of certain series from server
 export const fetchSeriesDetailsTobiraNew = createAppAsyncThunk("seriesDetails/fetchSeriesDetailsTobiraNew", async (path: TobiraPage["path"], { dispatch }) => {
 	const res = await axios.get<TobiraPage>("/admin-ng/series/new/tobira/page?path=" + path)
-		.catch(response => handleTobiraError(response, dispatch));
+		.catch((error: AxiosError) => handleTobiraError(error, dispatch));
 
 	if (!res) {
 		throw new Error();
diff --git a/src/slices/shared/tobiraErrors.ts b/src/slices/shared/tobiraErrors.ts
@@ -1,29 +1,14 @@
+import { AxiosError } from "axios";
 import { NOTIFICATION_CONTEXT_TOBIRA } from "../../configs/modalConfig";
 import { AppDispatch } from "../../store";
 import { addNotification } from "../notificationSlice";
 
-type AxiosErrorResponse = {
-    stack: string;
-    message: string;
-    name: string;
-    code: string;
-    config: Record<string, any>;
-    request: XMLHttpRequest;
-    response: {
-        data?: any;
-        status: number;
-        statusText: string;
-        headers: Record<string, string>;
-        config: Record<string, any>;
-        request: XMLHttpRequest;
-    };
-};
 
 // All Tobira fetch endpoints are using the same return codes which are handled in the same way.
 // So this should be fine to reuse. In the case of `503` I decided not to log the complete error,
 // as it isn't really helpful and might not even be considered as one (see TODO comment below).
-export const handleTobiraError = (response: AxiosErrorResponse, dispatch: AppDispatch) => {
-    const data = response.response;
+export const handleTobiraError = (response: AxiosError, dispatch: AppDispatch) => {
+    const data = response;
 
     if (data.status === 503) {
         // TODO: figure out what to do:
diff --git a/src/utils/resourceUtils.ts b/src/utils/resourceUtils.ts
@@ -265,8 +265,11 @@ export const getMetadataCollectionFieldName = (metadataField: { collection?: { [
 				element => element.value === field.value,
 			);
 
-			if (collectionField && isJson(collectionField.name as string)) {
-				return t(JSON.parse(collectionField.name as string).label);
+			if (collectionField && collectionField.name && isJson(collectionField.name as string)) {
+				// TODO: Handle JSON parsing errors
+				// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+				const name: { label?: ParseKeys } = JSON.parse(collectionField.name as string);
+				return name.label ? t(name.label) : "";
 			}
 
 			return collectionField ? t(collectionField.name as ParseKeys) : "";
diff --git a/src/utils/statisticsUtils.ts b/src/utils/statisticsUtils.ts
@@ -37,7 +37,7 @@ function createXAxisTickCallback(
 
 	return function (tickValue: number | string) {
 		// @ts-expect-error: Typescript does not like "this", but the chart.js documentation insists we should do it this way
-		// eslint-disable-next-line @typescript-eslint/no-unsafe-call
+		// eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-argument
 		return moment(this.getLabelForValue(tickValue)).locale(language).format(formatString);
 	};
 };
diff --git a/vite-env.d.ts b/vite-env.d.ts
@@ -0,0 +1,11 @@
+/**
+ * Types for our user defined variables
+ */
+interface ImportMetaEnv {
+  readonly VITE_TEST_SERVER_URL: string
+  readonly VITE_TEST_SERVER_AUTH: string
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}
