diff --git a/src/components/users/partials/modal/GroupDetails.tsx b/src/components/users/partials/modal/GroupDetails.tsx index 890af306d6..80461cfdd9 100644 --- a/src/components/users/partials/modal/GroupDetails.tsx +++ b/src/components/users/partials/modal/GroupDetails.tsx @@ -9,7 +9,7 @@ import { EditGroupSchema } from "../../../../utils/validate"; import { getGroupDetails } from "../../../../selectors/groupDetailsSelectors"; import ModalNavigation from "../../../shared/modals/ModalNavigation"; import { useAppDispatch, useAppSelector } from "../../../../store"; -import { updateGroupDetails } from "../../../../slices/groupDetailsSlice"; +import { UpdateGroupDetailsState, updateGroupDetails } from "../../../../slices/groupDetailsSlice"; /** * This component manages the pages of the group details @@ -60,13 +60,11 @@ const GroupDetails: React.FC<{ }, ]; -// @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: UpdateGroupDetailsState) => { dispatch(updateGroupDetails({values: values, groupId: groupDetails.id})); close(); }; diff --git a/src/components/users/partials/modal/GroupDetailsModal.tsx b/src/components/users/partials/modal/GroupDetailsModal.tsx index d8a88680bd..c04f511d48 100644 --- a/src/components/users/partials/modal/GroupDetailsModal.tsx +++ b/src/components/users/partials/modal/GroupDetailsModal.tsx @@ -8,9 +8,12 @@ import { availableHotkeys } from "../../../../configs/hotkeysConfig"; * This component renders the modal for displaying group details */ const GroupDetailsModal = ({ - close, - groupName -}: any) => { + close, + groupName +}: { + close: () => void, + groupName: string, +}) => { const { t } = useTranslation(); useHotkeys( diff --git a/src/components/users/partials/wizard/GroupUsersPage.tsx b/src/components/users/partials/wizard/GroupUsersPage.tsx index 660f4b05d9..5a6496be3a 100644 --- a/src/components/users/partials/wizard/GroupUsersPage.tsx +++ b/src/components/users/partials/wizard/GroupUsersPage.tsx @@ -19,7 +19,7 @@ const GroupUsersPage = ({ isEdit?: boolean, }) => { // users that can be chosen by user - const [users, setUsers] = useState([]); + const [users, setUsers] = useState<{ id: string, name: string }[]>([]); // flag for API call const [loading, setLoading] = useState(false); @@ -37,7 +37,6 @@ const GroupUsersPage = ({ }); } -// @ts-expect-error TS(2345): Argument of type '{ id: string; name: any; }[]' is... Remove this comment to see the full error message setUsers(userNames); setLoading(false); } diff --git a/src/components/users/partials/wizard/NewGroupSummaryPage.tsx b/src/components/users/partials/wizard/NewGroupSummaryPage.tsx index d38b535598..d1a9b83f54 100644 --- a/src/components/users/partials/wizard/NewGroupSummaryPage.tsx +++ b/src/components/users/partials/wizard/NewGroupSummaryPage.tsx @@ -3,18 +3,12 @@ import WizardNavigationButtons from "../../../shared/wizard/WizardNavigationButt import { useTranslation } from "react-i18next"; import Notifications from "../../../shared/Notifications"; import { FormikProps } from "formik"; +import { initialFormValuesNewGroup } from "../../../../configs/modalConfig"; /** * This component renders the summary page for new groups in the new group wizard. */ -interface RequiredFormProps { - name: string, - description: string, - roles: string[], - users: string[], -} - -const NewGroupSummaryPage = ({ +const NewGroupSummaryPage = ({ formik, previousPage, }: { diff --git a/src/configs/modalConfig.ts b/src/configs/modalConfig.ts index edfdc69991..414f9a3bb8 100644 --- a/src/configs/modalConfig.ts +++ b/src/configs/modalConfig.ts @@ -132,7 +132,12 @@ export const initialFormValuesNewAcl: { // All fields for new group 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 initialFormValuesNewGroup = { +export const initialFormValuesNewGroup: { + name: string, + description: string, + roles: { name: string }[], + users: { id: string, name: string }[], +} = { name: "", description: "", roles: [], diff --git a/src/slices/groupDetailsSlice.ts b/src/slices/groupDetailsSlice.ts index 7d38e6433d..3bb01d2279 100644 --- a/src/slices/groupDetailsSlice.ts +++ b/src/slices/groupDetailsSlice.ts @@ -7,7 +7,7 @@ import { createAppAsyncThunk } from '../createAsyncThunkWithTypes'; /** * This file contains redux reducer for actions affecting the state of details of a group */ -type GroupDetailsState = { +export type GroupDetailsState = { status: 'uninitialized' | 'loading' | 'succeeded' | 'failed', error: SerializedError | null, role: string, @@ -18,6 +18,10 @@ type GroupDetailsState = { users: {id: string, name: string}[], } +export interface UpdateGroupDetailsState extends Omit { + roles: { name: string}[] +} + // initial redux state const initialState: GroupDetailsState = { status: 'uninitialized', @@ -37,8 +41,7 @@ export const fetchGroupDetails = createAppAsyncThunk('groupDetails/fetchGroupDet let users: GroupDetailsState["users"] = []; if (response.users.length > 0) { -// @ts-expect-error TS(7006): Parameter 'user' implicitly has an 'any' type. - users = response.users.map((user) => { + users = response.users.map((user: { username: string, name: string }) => { return { id: user.username, name: user.name, @@ -60,7 +63,7 @@ export const fetchGroupDetails = createAppAsyncThunk('groupDetails/fetchGroupDet // update details of a certain group export const updateGroupDetails = createAppAsyncThunk('groupDetails/updateGroupDetails', async (params: { - values: GroupDetailsState, + values: UpdateGroupDetailsState, groupId: string }, {dispatch}) => { const { values, groupId } = params diff --git a/src/slices/groupSlice.ts b/src/slices/groupSlice.ts index 8ae43eb54f..35422c6ca2 100644 --- a/src/slices/groupSlice.ts +++ b/src/slices/groupSlice.ts @@ -5,11 +5,12 @@ import { buildGroupBody, getURLParams } from '../utils/resourceUtils'; import { addNotification } from './notificationSlice'; import { TableConfig } from '../configs/tableConfigs/aclsTableConfig'; import { createAppAsyncThunk } from '../createAsyncThunkWithTypes'; +import { initialFormValuesNewGroup } from '../configs/modalConfig'; /** * This file contains redux reducer for actions affecting the state of groups */ -type Group = { +export type Group = { description: string, id: string, name: string, @@ -58,7 +59,7 @@ export const fetchGroups = createAppAsyncThunk('groups/fetchGroups', async (_, { }); // post new group to backend -export const postNewGroup = createAppAsyncThunk('groups/postNewGroup', async (values: Group, {dispatch}) => { +export const postNewGroup = createAppAsyncThunk('groups/postNewGroup', async (values: typeof initialFormValuesNewGroup, {dispatch}) => { // get URL params used for post request let data = buildGroupBody(values); diff --git a/src/utils/resourceUtils.ts b/src/utils/resourceUtils.ts index 89b004594a..10e262af7a 100644 --- a/src/utils/resourceUtils.ts +++ b/src/utils/resourceUtils.ts @@ -14,6 +14,7 @@ import { UserInfoState } from "../slices/userInfoSlice"; import { hasAccess, isJson } from "./utils"; import { RootState } from "../store"; import { MetadataCatalog } from "../slices/eventSlice"; +import { initialFormValuesNewGroup } from '../configs/modalConfig'; import { UpdateUser } from '../slices/userDetailsSlice'; /** @@ -87,8 +88,9 @@ export const buildUserBody = (values: NewUser | UpdateUser) => { }; // used for create URLSearchParams for API requests used to create/update group -// @ts-expect-error TS(7006): Parameter 'values' implicitly has an 'any' type. -export const buildGroupBody = (values) => { +export const buildGroupBody = ( + values: typeof initialFormValuesNewGroup +) => { let roles = [], users = [];