From 73f49f0eb41ab98d9c51604712b979eaeaf1cd2d Mon Sep 17 00:00:00 2001 From: Arnei Date: Tue, 2 Jul 2024 16:46:19 +0200 Subject: [PATCH] Add typing to acl details Add typescript to acl details and assorted components. Although a lot of typing was present already, this just finishes up on the few missing parts. --- src/components/users/partials/modal/AclDetails.tsx | 13 ++++++++----- .../users/partials/modal/AclDetailsModal.tsx | 9 ++++++--- .../users/partials/wizard/AclAccessPage.tsx | 3 +-- .../users/partials/wizard/NewAclWizard.tsx | 11 +++++------ src/configs/modalConfig.ts | 5 ++++- src/slices/aclSlice.ts | 11 +++++------ 6 files changed, 29 insertions(+), 23 deletions(-) diff --git a/src/components/users/partials/modal/AclDetails.tsx b/src/components/users/partials/modal/AclDetails.tsx index dc4291249f..68e5653b38 100644 --- a/src/components/users/partials/modal/AclDetails.tsx +++ b/src/components/users/partials/modal/AclDetails.tsx @@ -9,7 +9,7 @@ import { NewAclSchema } from "../../../../utils/validate"; import ModalNavigation from "../../../shared/modals/ModalNavigation"; import { checkAcls } from "../../../../slices/aclSlice"; import { useAppDispatch, useAppSelector } from "../../../../store"; -import { updateAclDetails } from "../../../../slices/aclDetailsSlice"; +import { TransformedAcls, updateAclDetails } from "../../../../slices/aclDetailsSlice"; /** * This component manages the pages of the acl details modal @@ -47,13 +47,16 @@ const AclDetails = ({ }, ]; -// @ts-expect-error TS(7006): Parameter 'tabNr' implicitly has an 'any' type. - const openTab = (tabNr) => { + const openTab = (tabNr: number) => { setPage(tabNr); }; -// @ts-expect-error TS(7006): Parameter 'values' implicitly has an 'any' type. - const handleSubmit = (values) => { + const handleSubmit = ( + values: { + name: string, + acls: TransformedAcls, + } + ) => { dispatch(updateAclDetails({values: values, aclId: aclDetails.id})); close(); }; diff --git a/src/components/users/partials/modal/AclDetailsModal.tsx b/src/components/users/partials/modal/AclDetailsModal.tsx index 21cb21b7b0..5ea9b57d58 100644 --- a/src/components/users/partials/modal/AclDetailsModal.tsx +++ b/src/components/users/partials/modal/AclDetailsModal.tsx @@ -8,9 +8,12 @@ import { availableHotkeys } from "../../../../configs/hotkeysConfig"; * This component renders the modal for displaying acl details */ const AclDetailsModal = ({ - close, - aclName -}: any) => { + close, + aclName +}: { + close: () => void, + aclName: string, +}) => { const { t } = useTranslation(); useHotkeys( diff --git a/src/components/users/partials/wizard/AclAccessPage.tsx b/src/components/users/partials/wizard/AclAccessPage.tsx index cef3ab18cb..70ab778d70 100644 --- a/src/components/users/partials/wizard/AclAccessPage.tsx +++ b/src/components/users/partials/wizard/AclAccessPage.tsx @@ -67,8 +67,7 @@ const AclAccessPage = ({ fetchData(); }, []); -// @ts-expect-error TS(7006): Parameter 'value' implicitly has an 'any' type. - const handleTemplateChange = async (value) => { + const handleTemplateChange = async (value: string) => { // fetch information about chosen template from backend const template = await fetchAclTemplateById(value); diff --git a/src/components/users/partials/wizard/NewAclWizard.tsx b/src/components/users/partials/wizard/NewAclWizard.tsx index c0ddbfe498..aa91a7e9f2 100644 --- a/src/components/users/partials/wizard/NewAclWizard.tsx +++ b/src/components/users/partials/wizard/NewAclWizard.tsx @@ -20,7 +20,10 @@ const NewAclWizard = ({ }) => { const dispatch = useAppDispatch(); - const initialValues = initialFormValuesNewAcl; + const initialValues = { + ...initialFormValuesNewAcl, + aclTemplate: "", + } const { snapshot, @@ -49,8 +52,7 @@ const NewAclWizard = ({ const currentValidationSchema = NewAclSchema[page]; -// @ts-expect-error TS(7006): Parameter 'values' implicitly has an 'any' type. - const handleSubmit = (values) => { + const handleSubmit = (values: typeof initialFormValuesNewAcl) => { const response = dispatch(postNewAcl(values)); console.info(response); close(); @@ -93,11 +95,8 @@ const NewAclWizard = ({ )} {page === 1 && ( )} diff --git a/src/configs/modalConfig.ts b/src/configs/modalConfig.ts index 1511a405df..f5077217bf 100644 --- a/src/configs/modalConfig.ts +++ b/src/configs/modalConfig.ts @@ -121,7 +121,10 @@ export const initialFormValuesNewThemes = { // All fields for new acl form that are fix and not depending on response of backend // InitialValues of Formik form (others computed dynamically depending on responses from backend) -export const initialFormValuesNewAcl = { +export const initialFormValuesNewAcl: { + name: string, + acls: TransformedAcl[], +} = { name: "", acls: [], }; diff --git a/src/slices/aclSlice.ts b/src/slices/aclSlice.ts index 8b631b12fe..9df17f1902 100644 --- a/src/slices/aclSlice.ts +++ b/src/slices/aclSlice.ts @@ -7,6 +7,8 @@ import { NOTIFICATION_CONTEXT_ACCESS } from '../configs/modalConfig'; import { addNotification, removeNotificationWizardAccess } from './notificationSlice'; import { AppDispatch } from '../store'; import { createAppAsyncThunk } from '../createAsyncThunkWithTypes'; +import { initialFormValuesNewAcl } from "../configs/modalConfig"; +import { TransformedAcl } from './aclDetailsSlice'; /** * This file contains redux reducer for actions affecting the state of acls @@ -118,8 +120,7 @@ export const fetchRolesWithTarget = async (target: string) => { }; // post new acl to backend -// @ts-expect-error TS(7006): Parameter 'values' implicitly has an 'any' type. -export const postNewAcl = (values) => async (dispatch: AppDispatch) => { +export const postNewAcl = (values: typeof initialFormValuesNewAcl) => async (dispatch: AppDispatch) => { let acls = prepareAccessPolicyRulesForPost(values.acls); let data = new URLSearchParams(); @@ -142,8 +143,7 @@ export const postNewAcl = (values) => async (dispatch: AppDispatch) => { }); }; // delete acl with provided id -// @ts-expect-error TS(7006): Parameter 'id' implicitly has an 'any' type. -export const deleteAcl = (id) => async (dispatch: AppDispatch) => { +export const deleteAcl = (id: string) => async (dispatch: AppDispatch) => { axios .delete(`/admin-ng/acl/${id}`) .then((res) => { @@ -158,8 +158,7 @@ export const deleteAcl = (id) => async (dispatch: AppDispatch) => { }); }; -// @ts-expect-error TS(7006): -export const checkAcls = (acls) => async (dispatch: AppDispatch) => { +export const checkAcls = (acls: TransformedAcl[]) => async (dispatch: AppDispatch) => { // Remove old notifications of context event-access // Helps to prevent multiple notifications for same problem dispatch(removeNotificationWizardAccess());