refactor: expect existing TS errors (#767)

* refactor: expect existing TS errors

* refactor: fail build on new TS errors

frontend/.env

@@ -1 +0,0 @@
-TSC_COMPILE_ON_ERROR=true

frontend/src/component/addons/AddonForm/AddonParameters/AddonParameter/AddonParameter.tsx

@@ -33,6 +33,7 @@ export const AddonParameter = ({
 }: IAddonParameterProps) => {
     const value = config.parameters[definition.name] || '';
     const type = resolveType(definition, value);
+    // @ts-expect-error
     const error = errors.parameters[definition.name];
 
     return (
@@ -51,6 +52,7 @@ export const AddonParameter = ({
                 }}
                 value={value}
                 error={error}
+                // @ts-expect-error
                 onChange={setParameterValue(definition.name)}
                 variant="outlined"
                 helperText={definition.description}

frontend/src/component/addons/AddonForm/AddonParameters/AddonParameters.tsx

@@ -30,6 +30,7 @@ export const AddonParameters = ({
                 </p>
             ) : null}
             {provider.parameters.map(parameter => (
+                // @ts-expect-error
                 <AddonParameter
                     key={parameter.name}
                     definition={parameter}

frontend/src/component/addons/EditAddon/EditAddon.tsx

@@ -26,7 +26,8 @@ export const EditAddon = () => {
         (addon: IAddon) => addon.id === Number(addonId)
     ) || { ...cloneDeep(DEFAULT_DATA) };
     const provider = addon
-        ? providers.find(provider => provider.name === addon.provider)
+        ? // @ts-expect-error
+          providers.find(provider => provider.name === addon.provider)
         : undefined;
 
     return (

frontend/src/component/admin/api-token/ApiTokenForm/ApiTokenForm.tsx

@@ -92,6 +92,7 @@ const ApiTokenForm: React.FC<IApiTokenFormProps> = ({
                     label="Token Type"
                     id="api_key_type"
                     name="type"
+                    // @ts-expect-error
                     IconComponent={KeyboardArrowDownOutlined}
                     className={styles.selectInput}
                 />
@@ -104,6 +105,7 @@ const ApiTokenForm: React.FC<IApiTokenFormProps> = ({
                     options={selectableProjects}
                     onChange={e => setProject(e.target.value as string)}
                     label="Project"
+                    // @ts-expect-error
                     IconComponent={KeyboardArrowDownOutlined}
                     className={styles.selectInput}
                 />
@@ -118,6 +120,7 @@ const ApiTokenForm: React.FC<IApiTokenFormProps> = ({
                     label="Environment"
                     id="api_key_environment"
                     name="environment"
+                    // @ts-expect-error
                     IconComponent={KeyboardArrowDownOutlined}
                     className={styles.selectInput}
                 />

frontend/src/component/admin/project-roles/EditProjectRole/EditProjectRole.tsx

@@ -42,6 +42,7 @@ const EditProjectRole = () => {
     useEffect(() => {
         const initialCheckedPermissions = role?.permissions?.reduce(
             (acc: { [key: string]: IPermission }, curr: IPermission) => {
+                // @ts-expect-error
                 acc[getRoleKey(curr)] = curr;
                 return acc;
             },

frontend/src/component/admin/project-roles/ProjectRoles/ProjectRoleList/ProjectRoleList.tsx

@@ -61,6 +61,7 @@ const ProjectRoleList = () => {
                     name={role.name}
                     type={role.type}
                     description={role.description}
+                    // @ts-expect-error
                     setCurrentRole={setCurrentRole}
                     setDelDialog={setDelDialog}
                 />
@@ -94,6 +95,7 @@ const ProjectRoleList = () => {
             </Table>
             <br />
             <ProjectRoleDeleteConfirm
+                // @ts-expect-error
                 role={currentRole}
                 open={delDialog}
                 setDeldialogue={setDelDialog}

frontend/src/component/admin/project-roles/ProjectRoles/ProjectRoleList/ProjectRoleListItem/ProjectRoleListItem.tsx

@@ -51,6 +51,7 @@ const RoleListItem = ({
                     <PermissionIconButton
                         data-loading
                         aria-label="Edit"
+                        // @ts-expect-error
                         disabled={type === BUILTIN_ROLE_TYPE}
                         onClick={() => {
                             history.push(`/admin/roles/${id}/edit`);
@@ -62,8 +63,10 @@ const RoleListItem = ({
                     <PermissionIconButton
                         data-loading
                         aria-label="Remove role"
+                        // @ts-expect-error
                         disabled={type === BUILTIN_ROLE_TYPE}
                         onClick={() => {
+                            // @ts-expect-error
                             setCurrentRole({ id, name, description });
                             setDelDialog(true);
                         }}

frontend/src/component/admin/project-roles/hooks/useProjectRoleForm.ts

@@ -43,6 +43,7 @@ const useProjectRoleForm = (
     ) => {
         const formattedInitialCheckedPermissions =
             isAllEnvironmentPermissionsChecked(
+                // @ts-expect-error
                 isAllProjectPermissionsChecked(initialCheckedPermissions)
             );
 
@@ -59,6 +60,7 @@ const useProjectRoleForm = (
         });
 
         if (isAllChecked) {
+            // @ts-expect-error
             initialCheckedPermissions[PROJECT_CHECK_ALL_KEY] = true;
         } else {
             delete initialCheckedPermissions[PROJECT_CHECK_ALL_KEY];
@@ -82,6 +84,7 @@ const useProjectRoleForm = (
             const key = `${ENVIRONMENT_CHECK_ALL_KEY}-${env.name}`;
 
             if (isAllChecked) {
+                // @ts-expect-error
                 initialCheckedPermissions[key] = true;
             } else {
                 delete initialCheckedPermissions[key];
@@ -109,10 +112,12 @@ const useProjectRoleForm = (
         }
 
         if (type === 'project') {
+            // @ts-expect-error
             checkedPermissionsCopy = isAllProjectPermissionsChecked(
                 checkedPermissionsCopy
             );
         } else {
+            // @ts-expect-error
             checkedPermissionsCopy = isAllEnvironmentPermissionsChecked(
                 checkedPermissionsCopy
             );
@@ -141,6 +146,7 @@ const useProjectRoleForm = (
                 };
 
                 if (lastItem) {
+                    // @ts-expect-error
                     checkedPermissionsCopy[PROJECT_CHECK_ALL_KEY] = true;
                 }
             }
@@ -173,6 +179,7 @@ const useProjectRoleForm = (
                 };
 
                 if (lastItem) {
+                    // @ts-expect-error
                     checkedPermissionsCopy[environmentCheckAllKey] = true;
                 }
             }
@@ -204,6 +211,7 @@ const useProjectRoleForm = (
         try {
             await validateRole(payload);
         } catch (e) {
+            // @ts-expect-error
             if (e.toString().includes(NAME_EXISTS_ERROR)) {
                 setErrors(prev => ({
                     ...prev,

frontend/src/component/admin/users/UserForm/UserForm.tsx

@@ -51,6 +51,7 @@ const UserForm: React.FC<IUserForm> = ({
     const { roles } = useUsers();
     const { bootstrap } = useUiBootstrap();
 
+    // @ts-expect-error
     const sortRoles = (a, b) => {
         if (b.name[0] < a.name[0]) {
             return 1;
@@ -102,6 +103,7 @@ const UserForm: React.FC<IUserForm> = ({
                         onChange={e => setRootRole(+e.target.value)}
                         data-loading
                     >
+                        {/* @ts-expect-error */}
                         {roles.sort(sortRoles).map(role => (
                             <FormControlLabel
                                 key={`role-${role.id}`}

frontend/src/component/admin/users/UsersList/ChangePassword/ChangePassword.tsx

@@ -29,6 +29,7 @@ const ChangePassword = ({
     const [validPassword, setValidPassword] = useState(false);
     const commonStyles = useCommonStyles();
 
+    // @ts-expect-error
     const updateField = e => {
         setError({});
         setData({
@@ -37,10 +38,12 @@ const ChangePassword = ({
         });
     };
 
+    // @ts-expect-error
     const submit = async e => {
         e.preventDefault();
 
         if (!validPassword) {
+            // @ts-expect-error
             if (!data.password || data.password.length < 8) {
                 setError({
                     password:
@@ -48,6 +51,7 @@ const ChangePassword = ({
                 });
                 return;
             }
+            // @ts-expect-error
             if (!(data.password === data.confirm)) {
                 setError({ confirm: 'Passwords does not match' });
                 return;
@@ -55,15 +59,18 @@ const ChangePassword = ({
         }
 
         try {
+            // @ts-expect-error
             await changePassword(user, data.password);
             setData({});
             closeDialog();
         } catch (error) {
+            // @ts-expect-error
             const msg = error.message || 'Could not update password';
             setError({ general: msg });
         }
     };
 
+    // @ts-expect-error
     const onCancel = e => {
         e.preventDefault();
         setData({});
@@ -111,6 +118,7 @@ const ChangePassword = ({
                     </Typography>
                 </div>
                 <PasswordChecker
+                    // @ts-expect-error
                     password={data.password}
                     callback={setValidPassword}
                 />
@@ -118,6 +126,7 @@ const ChangePassword = ({
                     label="New password"
                     name="password"
                     type="password"
+                    // @ts-expect-error
                     value={data.password}
                     helperText={error.password}
                     onChange={updateField}
@@ -128,6 +137,7 @@ const ChangePassword = ({
                     label="Confirm password"
                     name="confirm"
                     type="password"
+                    // @ts-expect-error
                     value={data.confirm}
                     error={error.confirm !== undefined}
                     helperText={error.confirm}
@@ -136,7 +146,9 @@ const ChangePassword = ({
                     size="small"
                 />
                 <PasswordMatcher
+                    // @ts-expect-error
                     started={data.password && data.confirm}
+                    // @ts-expect-error
                     matchingPasswords={data.password === data.confirm}
                 />
             </form>

frontend/src/component/admin/users/UsersList/UsersList.tsx

@@ -73,6 +73,7 @@ const UsersList = () => {
 
     const onDeleteUser = async () => {
         try {
+            // @ts-expect-error
             await removeUser(delUser);
             setToastData({
                 title: `${delUser?.name} has been deleted`,
@@ -113,6 +114,7 @@ const UsersList = () => {
         return page.map(user => {
             return (
                 <UserListItem
+                    // @ts-expect-error
                     key={user.id}
                     user={user}
                     openPwDialog={openPwDialog}
@@ -162,8 +164,10 @@ const UsersList = () => {
             <ChangePassword
                 showDialog={pwDialog.open}
                 closeDialog={closePwDialog}
+                // @ts-expect-error
                 changePassword={changePassword}
                 validatePassword={validatePassword}
+                // @ts-expect-error
                 user={pwDialog.user}
             />
 

frontend/src/component/admin/users/hooks/useAddUserForm.ts

@@ -54,6 +54,7 @@ const useCreateUserForm = (
     };
 
     const validateEmail = () => {
+        // @ts-expect-error
         if (users.some(user => user['email'] === email)) {
             setErrors(prev => ({ ...prev, email: 'Email already exists' }));
             return false;

frontend/src/component/common/EnvironmentStrategiesDialog/EnvironmentStrategyDialog.tsx

@@ -23,6 +23,7 @@ const EnvironmentStrategyDialog = ({
     const strategiesLink = `/projects/${projectId}/features/${featureId}/strategies?environment=${environmentName}&addStrategy=true`;
 
     return (
+        // @ts-expect-error
         <Dialogue
             open={open}
             maxWidth="sm"

frontend/src/component/common/Input/Input.tsx

@@ -32,6 +32,7 @@ const Input = ({
     return (
         <div className={styles.inputContainer} data-loading>
             <TextField
+                // @ts-expect-error
                 size="small"
                 variant="outlined"
                 label={label}
@@ -43,6 +44,7 @@ const Input = ({
                 value={value}
                 onChange={onChange}
                 FormHelperTextProps={{
+                    // @ts-expect-error
                     ['data-test']: INPUT_ERROR_TEXT,
                     classes: {
                         root: styles.helperText,

frontend/src/component/common/ListPlaceholder/ListPlaceholder.tsx

@@ -17,6 +17,7 @@ const ListPlaceholder = ({ text, link, linkText }: IListPlaceholderProps) => {
             {text}
             <ConditionallyRender
                 condition={Boolean(link && linkText)}
+                // @ts-expect-error
                 show={<Link to={link}>Add your first toggle</Link>}
             />
         </ListItem>

frontend/src/component/common/NoItems/NoItemsStrategies/NoItemsStrategies.tsx

@@ -48,6 +48,7 @@ const NoItemsStrategies = ({
                 condition={Boolean(onClick)}
                 show={
                     <PermissionButton
+                        // @ts-expect-error
                         variant="contained"
                         permission={CREATE_FEATURE_STRATEGY}
                         projectId={projectId}

frontend/src/component/common/PermissionButton/PermissionButton.tsx

@@ -65,6 +65,7 @@ const PermissionButton: React.FC<IPermissionButtonProps> = ({
                     onClick={onClick}
                     disabled={disabled || !access}
                     variant="contained"
+                    // @ts-expect-error
                     color="primary"
                     {...rest}
                     endIcon={

frontend/src/component/common/PermissionIconButton/PermissionIconButton.tsx

@@ -46,6 +46,7 @@ const PermissionIconButton: React.FC<IPermissionIconButtonProps> = ({
     return (
         <Tooltip title={tooltipText} arrow>
             <span>
+                {/* @ts-expect-error */}
                 <IconButton onClick={onClick} disabled={!access} {...rest}>
                     {children}
                 </IconButton>

frontend/src/component/common/ResponsiveButton/ResponsiveButton.tsx

@@ -35,6 +35,7 @@ const ResponsiveButton: React.FC<IResponsiveButtonProps> = ({
             condition={smallScreen}
             show={
                 <PermissionIconButton
+                    // @ts-expect-error
                     disabled={disabled}
                     onClick={onClick}
                     permission={permission}
@@ -53,6 +54,7 @@ const ResponsiveButton: React.FC<IResponsiveButtonProps> = ({
                     permission={permission}
                     projectId={projectId}
                     color="primary"
+                    // @ts-expect-error
                     variant="contained"
                     disabled={disabled}
                     environmentId={environmentId}

frontend/src/component/common/TagSelect/TagSelect.tsx

@@ -17,15 +17,18 @@ const TagSelect = ({ value, onChange, ...rest }: ITagSelect) => {
     }));
 
     return (
-        <GeneralSelect
+        <>
-            label="Tag type"
+            {/* @ts-expect-error */}
-            name="tag-select"
+            <GeneralSelect
-            id="tag-select"
+                label="Tag type"
-            options={options}
+                name="tag-select"
-            value={value}
+                id="tag-select"
-            onChange={onChange}
+                options={options}
-            {...rest}
+                value={value}
-        />
+                onChange={onChange}
+                {...rest}
+            />
+        </>
     );
 };
 

frontend/src/component/environments/EnvironmentList/EnvironmentListItem/EnvironmentListItem.tsx

@@ -122,6 +122,7 @@ const EnvironmentListItem = ({
     }
 
     return (
+        // @ts-expect-error
         <ListItem
             style={{ position: 'relative', opacity }}
             ref={ref}

frontend/src/component/feature/CreateFeature/CreateFeature.tsx

@@ -45,6 +45,7 @@ const CreateFeature = () => {
         if (validToggleName) {
             const payload = getTogglePayload();
             try {
+                // @ts-expect-error
                 await createFeatureToggle(project, payload);
                 history.push(`/projects/${project}/features/${name}`);
                 setToastData({

frontend/src/component/feature/FeatureForm/FeatureForm.tsx

@@ -92,6 +92,7 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
                 </p>
                 <FeatureTypeSelect
                     value={type}
+                    // @ts-expect-error
                     onChange={(e: React.ChangeEvent) => setType(e.target.value)}
                     label={'Toggle type'}
                     id="feature-type-select"
@@ -121,6 +122,7 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
                     }}
                     enabled={editable}
                     filter={projectFilterGenerator(permissions, CREATE_FEATURE)}
+                    // @ts-expect-error
                     IconComponent={KeyboardArrowDownOutlined}
                     className={styles.selectInput}
                 />

frontend/src/component/feature/FeatureToggleListNew/FeatureToggleListNewItem/FeatureToggleListNewItem.tsx

@@ -113,6 +113,7 @@ const FeatureToggleListNewItem = ({
                     onClick={onClick}
                 >
                     <Link
+                        // @ts-expect-error
                         to={getTogglePath(projectId, name, uiConfig.flags.E)}
                         className={styles.link}
                     >

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvSwitches/FeatureOverviewEnvSwitch/FeatureOverviewEnvSwitch.tsx

@@ -43,9 +43,12 @@ const FeatureOverviewEnvSwitch = ({
                 callback();
             }
         } catch (e) {
+            // @ts-expect-error
             if (e.message === ENVIRONMENT_STRATEGY_ERROR) {
+                // @ts-expect-error
                 showInfoBox(true);
             } else {
+                // @ts-expect-error
                 setToastApiError(e.message);
             }
         }

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/FeatureOverviewEnvironment.tsx

@@ -73,6 +73,7 @@ const FeatureOverviewEnvironment = ({
                 } else {
                     acc[current.name] = {
                         count: 1,
+                        // @ts-expect-error
                         Icon: getFeatureStrategyIcon(current.name),
                     };
                 }
@@ -146,6 +147,7 @@ const FeatureOverviewEnvironment = ({
                                                                 styles.strategyIconContainer
                                                             }
                                                         >
+                                                            {/* @ts-expect-error */}
                                                             <Icon
                                                                 className={
                                                                     styles.strategyIcon
@@ -184,10 +186,12 @@ const FeatureOverviewEnvironment = ({
                         />
                         <ConditionallyRender
                             condition={
+                                // @ts-expect-error
                                 featureEnvironment?.strategies?.length > 0
                             }
                             show={
                                 <FeatureOverviewEnvironmentFooter
+                                    // @ts-expect-error
                                     env={env}
                                     environmentMetric={environmentMetric}
                                 />

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/FeatureOverviewEnvironmentMetrics/FeatureOverviewEnvironmentMetrics.tsx

@@ -54,6 +54,7 @@ const FeatureOverviewEnvironmentMetrics = ({
                 </p>
             </div>
             <PercentageCircle
+                // @ts-expect-error
                 className={styles.percentageCircle}
                 percentage={percentage}
                 data-loading

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/FeatureOverviewEnvironmentStrategies/FeatureOverviewEnvironmentStrategy/FeatureOverviewEnvironmentStrategy.tsx

@@ -39,6 +39,7 @@ const FeatureOverviewEnvironmentStrategy = ({
                         permission={UPDATE_FEATURE_STRATEGY}
                         environmentId={environmentName}
                         projectId={projectId}
+                        // @ts-expect-error
                         component={Link}
                         to={`/projects/${projectId}/features/${featureId}/strategies?environment=${environmentName}`}
                     >

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewMetaData/FeatureOverviewMetaData.tsx

@@ -39,6 +39,7 @@ const FeatureOverviewMetaData = () => {
                         Project: {project}
                     </span>
                     <ConditionallyRender
+                        // @ts-expect-error
                         condition={description}
                         show={
                             <span className={styles.bodyItem} data-loading>
@@ -48,6 +49,7 @@ const FeatureOverviewMetaData = () => {
                                     <PermissionIconButton
                                         projectId={projectId}
                                         permission={UPDATE_FEATURE}
+                                        // @ts-expect-error
                                         component={Link}
                                         to={`/projects/${projectId}/features/${featureId}/settings`}
                                     >
@@ -63,6 +65,7 @@ const FeatureOverviewMetaData = () => {
                                     <PermissionIconButton
                                         projectId={projectId}
                                         permission={UPDATE_FEATURE}
+                                        // @ts-expect-error
                                         component={Link}
                                         to={`/projects/${projectId}/features/${featureId}/settings`}
                                     >

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewMetaData/FeatureOverviewTags/FeatureOverviewTags.tsx

@@ -98,6 +98,7 @@ const FeatureOverviewTags: React.FC<IFeatureOverviewTagsProps> = ({
         }
     };
 
+    // @ts-expect-error
     const renderTag = t => (
         <Chip
             icon={tagIcon(t.type)}
@@ -118,29 +119,32 @@ const FeatureOverviewTags: React.FC<IFeatureOverviewTagsProps> = ({
     );
 
     return (
-        <div className={styles.container} {...rest}>
+        <>
-            <Dialogue
+            {/* @ts-expect-error */}
-                open={showDelDialog}
+            <div className={styles.container} {...rest}>
-                onClose={() => {
+                <Dialogue
-                    setShowDelDialog(false);
+                    open={showDelDialog}
-                    setSelectedTag({ type: '', value: '' });
+                    onClose={() => {
-                }}
+                        setShowDelDialog(false);
-                onClick={() => {
+                        setSelectedTag({ type: '', value: '' });
-                    setShowDelDialog(false);
+                    }}
-                    handleDelete();
+                    onClick={() => {
-                    setSelectedTag({ type: '', value: '' });
+                        setShowDelDialog(false);
-                }}
+                        handleDelete();
-                title="Are you sure you want to delete this tag?"
+                        setSelectedTag({ type: '', value: '' });
-            />
+                    }}
-
+                    title="Are you sure you want to delete this tag?"
-            <div className={styles.tagContent}>
-                <ConditionallyRender
-                    condition={tags.length > 0}
-                    show={tags.map(renderTag)}
-                    elseShow={<p data-loading>No tags to display</p>}
                 />
+
+                <div className={styles.tagContent}>
+                    <ConditionallyRender
+                        condition={tags.length > 0}
+                        show={tags.map(renderTag)}
+                        elseShow={<p data-loading>No tags to display</p>}
+                    />
+                </div>
             </div>
-        </div>
+        </>
     );
 };
 

frontend/src/component/feature/FeatureView/FeatureSettings/FeatureSettingsMetadata/FeatureSettingsMetadata.tsx

@@ -65,6 +65,7 @@ const FeatureSettingsMetadata = () => {
             <FeatureTypeSelect
                 value={type}
                 id="feature-type-select"
+                // @ts-expect-error
                 onChange={e => setType(e.target.value)}
                 label="Feature type"
                 editable={editable}

frontend/src/component/feature/FeatureView/FeatureSettings/FeatureSettingsMetadata/FeatureTypeSelect/FeatureTypeSelect.tsx

@@ -4,10 +4,15 @@ import GeneralSelect, {
 } from '../../../../../common/GeneralSelect/GeneralSelect';
 
 const FeatureTypeSelect = ({
+    // @ts-expect-error
     editable,
+    // @ts-expect-error
     value,
+    // @ts-expect-error
     id,
+    // @ts-expect-error
     label,
+    // @ts-expect-error
     onChange,
     ...rest
 }) => {
@@ -24,15 +29,18 @@ const FeatureTypeSelect = ({
     }
 
     return (
-        <GeneralSelect
+        <>
-            disabled={!editable}
+            {/* @ts-expect-error */}
-            options={options}
+            <GeneralSelect
-            value={value}
+                disabled={!editable}
-            onChange={onChange}
+                options={options}
-            label={label}
+                value={value}
-            id={id}
+                onChange={onChange}
-            {...rest}
+                label={label}
-        />
+                id={id}
+                {...rest}
+            />
+        </>
     );
 };
 

frontend/src/component/feature/FeatureView/FeatureSettings/FeatureSettingsProject/FeatureProjectSelect/FeatureProjectSelect.tsx

@@ -36,18 +36,22 @@ const FeatureProjectSelect = ({
             .filter(project => {
                 return filter(project.id);
             })
+            // @ts-expect-error
             .map(formatOption);
     } else {
+        // @ts-expect-error
         options = projects.map(formatOption);
     }
 
     if (value && !options.find(o => o.key === value)) {
+        // @ts-expect-error
         options.push({ key: value, label: value });
     }
 
     return (
         <GeneralSelect
             label="Project"
+            // @ts-expect-error
             options={options}
             value={value}
             onChange={onChange}

frontend/src/component/feature/FeatureView/FeatureSettings/FeatureSettingsProject/FeatureSettingsProject.tsx

@@ -93,6 +93,7 @@ const FeatureSettingsProject = () => {
             <FeatureProjectSelect
                 value={project}
                 onChange={e => setProject(e.target.value)}
+                // @ts-expect-error
                 label="Project"
                 enabled={editable}
                 filter={filterProjects()}

frontend/src/component/feature/FeatureView/FeatureSettings/FeatureSettingsProject/FeatureSettingsProjectConfirm/FeatureSettingsProjectConfirm.tsx

@@ -50,6 +50,7 @@ const FeatureSettingsProjectConfirm = ({
                 incompatible = [...incompatible, env];
             }
         });
+        // @ts-expect-error
         setIncompatibleEnvs(incompatible);
     };
 
@@ -77,6 +78,7 @@ const FeatureSettingsProjectConfirm = ({
                 </Dialogue>
             }
             elseShow={
+                // @ts-expect-error
                 <Dialogue
                     open={open}
                     onClose={onClose}

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesEnvironments/FeatureStrategiesConfigure/FeatureStrategiesConfigure.tsx

@@ -35,11 +35,17 @@ const FeatureStrategiesConfigure = () => {
     );
     const styles = useStyles();
     const {
+        // @ts-expect-error
         activeEnvironment,
+        // @ts-expect-error
         setConfigureNewStrategy,
+        // @ts-expect-error
         configureNewStrategy,
+        // @ts-expect-error
         setExpandedSidebar,
+        // @ts-expect-error
         featureCache,
+        // @ts-expect-error
         setFeatureCache,
     } = useContext(FeatureStrategiesUIContext);
 
@@ -83,6 +89,7 @@ const FeatureStrategiesConfigure = () => {
 
             const feature = cloneDeep(featureCache);
             const environment = feature.environments.find(
+                // @ts-expect-error
                 env => env.name === activeEnvironment.name
             );
 
@@ -123,6 +130,7 @@ const FeatureStrategiesConfigure = () => {
                     <FeatureStrategyAccordion
                         strategy={configureNewStrategy}
                         expanded
+                        // @ts-expect-error
                         hideActions
                         parameters={strategyParams}
                         constraints={strategyConstraints}

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesEnvironments/FeatureStrategiesCreateHeader/FeatureStrategiesCreateHeader.tsx

@@ -6,6 +6,7 @@ import { useStyles } from './FeatureStrategiesCreateHeader.styles';
 
 const FeatureStrategiesCreateHeader = () => {
     const styles = useStyles();
+    // @ts-expect-error
     const { expandedSidebar, configureNewStrategy, activeEnvironment } =
         useContext(FeatureStrategiesUIContext);
 

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesEnvironments/FeatureStrategiesEnvironmentList/FeatureStrategiesEnvironmentList.tsx

@@ -52,6 +52,7 @@ const FeatureStrategiesEnvironmentList = ({
         featureId,
         activeEnvironment,
         updateFeatureEnvironmentCache,
+        // @ts-expect-error
     } = useFeatureStrategiesEnvironmentList(strategies);
 
     const [{ isOver }, drop] = useDrop({
@@ -86,19 +87,26 @@ const FeatureStrategiesEnvironmentList = ({
     const productionGuardMarkup = useProductionGuardMarkup({
         show: productionGuard.show,
         onClick: () => {
+            // @ts-expect-error
             updateStrategy(productionGuard.strategy);
+            // @ts-expect-error
             productionGuard.callback();
             setProductionGuard({
                 show: false,
+                // @ts-expect-error
                 strategy: null,
             });
         },
         onClose: () =>
+            // @ts-expect-error
             setProductionGuard({ show: false, strategy: null, callback: null }),
     });
 
+    // @ts-expect-error
     const resolveUpdateStrategy = (strategy: IFeatureStrategy, callback) => {
+        // @ts-expect-error
         if (activeEnvironmentsRef?.current?.type === PRODUCTION && !dontShow) {
+            // @ts-expect-error
             setProductionGuard({ show: true, strategy, callback });
             return;
         }
@@ -115,6 +123,7 @@ const FeatureStrategiesEnvironmentList = ({
                         <FeatureStrategyEditable
                             currentStrategy={strategy}
                             setDelDialog={setDelDialog}
+                            // @ts-expect-error
                             updateStrategy={resolveUpdateStrategy}
                             index={index}
                         />
@@ -128,6 +137,7 @@ const FeatureStrategiesEnvironmentList = ({
                         key={strategy.id}
                         setDelDialog={setDelDialog}
                         currentStrategy={strategy}
+                        // @ts-expect-error
                         updateStrategy={resolveUpdateStrategy}
                         index={index}
                     />
@@ -141,6 +151,7 @@ const FeatureStrategiesEnvironmentList = ({
     });
 
     const strategiesContainerClasses = classnames({
+        // @ts-expect-error
         [styles.strategiesContainer]: !expandedSidebar,
     });
 
@@ -153,7 +164,7 @@ const FeatureStrategiesEnvironmentList = ({
                         condition={!expandedSidebar}
                         show={
                             <div className={styles.headerContainer}>
-                                <div className={styles.headerInnerContainer}>
+                                <div>
                                     <FeatureOverviewEnvSwitch
                                         text={
                                             activeEnvironment.enabled

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesEnvironments/FeatureStrategiesEnvironmentList/useFeatureStrategiesEnvironmentList.ts

@@ -19,12 +19,19 @@ const useFeatureStrategiesEnvironmentList = () => {
         useFeatureStrategyApi();
 
     const {
+        // @ts-expect-error
         setConfigureNewStrategy,
+        // @ts-expect-error
         configureNewStrategy,
+        // @ts-expect-error
         activeEnvironment,
+        // @ts-expect-error
         setExpandedSidebar,
+        // @ts-expect-error
         expandedSidebar,
+        // @ts-expect-error
         setFeatureCache,
+        // @ts-expect-error
         featureCache,
     } = useContext(FeatureStrategiesUIContext);
 
@@ -78,10 +85,12 @@ const useFeatureStrategiesEnvironmentList = () => {
             const feature = cloneDeep(featureCache);
 
             const environment = feature.environments.find(
+                // @ts-expect-error
                 env => env.name === activeEnvironment.name
             );
 
             const strategy = environment.strategies.find(
+                // @ts-expect-error
                 strategy => strategy.id === updatedStrategy.id
             );
 
@@ -106,9 +115,11 @@ const useFeatureStrategiesEnvironmentList = () => {
 
             const feature = cloneDeep(featureCache);
             const environment = feature.environments.find(
+                // @ts-expect-error
                 env => env.name === environmentId
             );
             const strategyIdx = environment.strategies.findIndex(
+                // @ts-expect-error
                 strategy => strategy.id === strategyId
             );
 

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesEnvironments/FeatureStrategiesEnvironments.tsx

@@ -42,12 +42,19 @@ const FeatureStrategiesEnvironments = () => {
 
     const { a11yProps, activeTabIdx, setActiveTab } = useTabs(startingTabId);
     const {
+        // @ts-expect-error
         setActiveEnvironment,
+        // @ts-expect-error
         activeEnvironment,
+        // @ts-expect-error
         configureNewStrategy,
+        // @ts-expect-error
         expandedSidebar,
+        // @ts-expect-error
         setExpandedSidebar,
+        // @ts-expect-error
         featureCache,
+        // @ts-expect-error
         setFeatureCache,
     } = useContext(FeatureStrategiesUIContext);
 
@@ -105,6 +112,7 @@ const FeatureStrategiesEnvironments = () => {
     if (!feature) return null;
 
     const renderTabs = () => {
+        // @ts-expect-error
         return featureCache?.environments?.map((env, index) => {
             return (
                 <Tab
@@ -132,6 +140,7 @@ const FeatureStrategiesEnvironments = () => {
 
         feature?.environments?.forEach(env => {
             const cachedEnv = featureCache?.environments?.find(
+                // @ts-expect-error
                 cacheEnv => cacheEnv.name === env.name
             );
 
@@ -140,6 +149,7 @@ const FeatureStrategiesEnvironments = () => {
                 return;
             }
             // If displayName is different
+            // @ts-expect-error
             if (env?.displayName !== cachedEnv?.displayName) {
                 equal = false;
                 return;
@@ -155,6 +165,7 @@ const FeatureStrategiesEnvironments = () => {
 
         feature?.environments?.forEach(env => {
             const cachedEnv = featureCache?.environments?.find(
+                // @ts-expect-error
                 cachedEnv => cachedEnv.name === env.name
             );
 
@@ -167,14 +178,17 @@ const FeatureStrategiesEnvironments = () => {
 
             env?.strategies?.forEach(strategy => {
                 const cachedStrategy = cachedEnv?.strategies?.find(
+                    // @ts-expect-error
                     cachedStrategy => cachedStrategy.id === strategy.id
                 );
                 // Check stickiness
+                // @ts-expect-error
                 if (cachedStrategy?.stickiness !== strategy?.stickiness) {
                     equal = false;
                     return;
                 }
 
+                // @ts-expect-error
                 if (cachedStrategy?.groupId !== strategy?.groupId) {
                     equal = false;
                     return;
@@ -256,6 +270,7 @@ const FeatureStrategiesEnvironments = () => {
             ),
         });
 
+        // @ts-expect-error
         return featureCache?.environments?.map((env, index) => {
             return (
                 <TabPanel
@@ -274,6 +289,7 @@ const FeatureStrategiesEnvironments = () => {
                                         className={styles.addStrategyButton}
                                         data-test={ADD_NEW_STRATEGY_ID}
                                         onClick={() =>
+                                            // @ts-expect-error
                                             setExpandedSidebar(prev => !prev)
                                         }
                                         Icon={Add}
@@ -307,6 +323,7 @@ const FeatureStrategiesEnvironments = () => {
                                                 envName={env.name}
                                                 onClick={() =>
                                                     setExpandedSidebar(
+                                                        // @ts-expect-error
                                                         prev => !prev
                                                     )
                                                 }

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesEnvironments/FeatureStrategyEditable/FeatureStrategyEditable.tsx

@@ -44,6 +44,7 @@ const FeatureStrategyEditable = ({
     const { loading } = useFeatureApi();
 
     const { projectId, featureId } = useParams<IFeatureViewParams>();
+    // @ts-expect-error
     const { activeEnvironment, featureCache, dirty, setDirty } = useContext(
         FeatureStrategiesUIContext
     );
@@ -71,15 +72,18 @@ const FeatureStrategyEditable = ({
         mutate(FEATURE_STRATEGY_CACHE_KEY, { ...updatedStrategy }, false);
 
         const dirtyParams = isDirtyParams(parameters);
+        // @ts-expect-error
         setDirty(prev => ({ ...prev, [strategy.id]: dirtyParams }));
     };
 
     const updateFeatureStrategy = () => {
         const cleanup = () => {
             setStrategyCache(cloneDeep(strategy));
+            // @ts-expect-error
             setDirty(prev => ({ ...prev, [strategy.id]: false }));
         };
 
+        // @ts-expect-error
         updateStrategy(strategy, cleanup);
     };
 
@@ -109,6 +113,7 @@ const FeatureStrategyEditable = ({
     };
 
     const discardChanges = () => {
+        // @ts-expect-error
         setDirty(prev => ({ ...prev, [strategy.id]: false }));
         mutate(FEATURE_STRATEGY_CACHE_KEY, { ...strategyCache }, false);
     };
@@ -117,6 +122,7 @@ const FeatureStrategyEditable = ({
         const updatedStrategy = cloneDeep(strategy);
 
         updatedStrategy.constraints = [...cloneDeep(constraints)];
+        // @ts-expect-error
         setDirty(prev => ({ ...prev, [strategy.id]: true }));
         mutate(FEATURE_STRATEGY_CACHE_KEY, { ...updatedStrategy }, false);
     };
@@ -136,6 +142,7 @@ const FeatureStrategyEditable = ({
                 data-test={`${STRATEGY_ACCORDION_ID}-${strategy.name}`}
                 strategy={strategy}
                 setStrategyParams={setStrategyParams}
+                // @ts-expect-error
                 setStrategyConstraints={setStrategyConstraints}
                 dirty={dirty[strategy.id]}
                 actions={
@@ -147,6 +154,7 @@ const FeatureStrategyEditable = ({
                             data-test={`${DELETE_STRATEGY_ID}-${strategy.name}`}
                             onClick={e => {
                                 e.stopPropagation();
+                                // @ts-expect-error
                                 setDelDialog({
                                     strategyId: strategy.id,
                                     show: true,
@@ -167,6 +175,7 @@ const FeatureStrategyEditable = ({
                                     permission={UPDATE_FEATURE_STRATEGY}
                                     projectId={projectId}
                                     environmentId={activeEnvironment?.name}
+                                    // @ts-expect-error
                                     variant="contained"
                                     color="primary"
                                     className={styles.editButton}
@@ -181,6 +190,7 @@ const FeatureStrategyEditable = ({
                                     className={styles.editButton}
                                     disabled={loading}
                                     color="tertiary"
+                                    // @ts-expect-error
                                     variant="text"
                                     permission={UPDATE_FEATURE_STRATEGY}
                                     projectId={projectId}

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesList/FeatureStrategiesList.tsx

@@ -9,6 +9,7 @@ import ConditionallyRender from '../../../../common/ConditionallyRender';
 
 const FeatureStrategiesList = () => {
     const smallScreen = useMediaQuery('(max-width:700px)');
+    // @ts-expect-error
     const { expandedSidebar, setExpandedSidebar } = useContext(
         FeatureStrategiesUIContext
     );
@@ -32,6 +33,7 @@ const FeatureStrategiesList = () => {
     };
 
     const toggleSidebar = () => {
+        // @ts-expect-error
         setExpandedSidebar(prev => !prev);
     };
 

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategiesList/FeatureStrategyCard/FeatureStrategyCard.tsx

@@ -37,6 +37,7 @@ const FeatureStrategyCard = ({
     const { featureId, projectId } = useParams<IFeatureViewParams>();
     const { strategies } = useStrategies();
 
+    // @ts-expect-error
     const { setConfigureNewStrategy, setExpandedSidebar, activeEnvironment } =
         useContext(FeatureStrategiesUIContext);
     const { hasAccess } = useContext(AccessContext);
@@ -81,7 +82,7 @@ const FeatureStrategyCard = ({
                                 {<Icon className={styles.icon} />}
                             </div>
                         </div>
-                        <div className={styles.rightSection}>
+                        <div>
                             <PermissionIconButton
                                 className={styles.addButton}
                                 onClick={handleClick}

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategyAccordion/FeatureStrategyAccordion.tsx

@@ -83,6 +83,7 @@ const FeatureStrategyAccordion: React.FC<IFeatureStrategyAccordionProps> = ({
                     </div>
                 </AccordionSummary>
                 <AccordionDetails className={styles.accordionDetails}>
+                    {/* @ts-expect-error */}
                     <FeatureStrategyAccordionBody
                         strategy={{ ...strategy, parameters }}
                         updateParameters={updateParameters}

frontend/src/component/feature/FeatureView/FeatureStrategies/FeatureStrategyAccordion/FeatureStrategyAccordionBody/FeatureStrategyAccordionBody.tsx

@@ -53,6 +53,7 @@ const FeatureStrategyAccordionBody: React.FC<
     const { uiConfig } = useUiConfig();
     const [showConstraints, setShowConstraints] = useState(false);
     const { hasAccess } = useContext(AccessContext);
+    // @ts-expect-error
     const { activeEnvironment } = useContext(FeatureStrategiesUIContext);
 
     const { context } = useUnleashContext();
@@ -164,6 +165,7 @@ const FeatureStrategyAccordionBody: React.FC<
                         <PermissionButton
                             className={styles.addConstraintBtn}
                             onClick={toggleConstraints}
+                            // @ts-expect-error
                             variant={'text'}
                             data-test={ADD_CONSTRAINT_ID}
                             permission={[
@@ -192,14 +194,18 @@ const FeatureStrategyAccordionBody: React.FC<
                 <StrategyConstraints
                     updateConstraints={updateConstraints}
                     constraints={constraints || []}
+                    // @ts-expect-error
                     constraintError={constraintError}
+                    // @ts-expect-error
                     setConstraintError={setConstraintError}
                 />
             </Dialogue>
 
             <Type
                 parameters={parameters}
+                // @ts-expect-error
                 updateParameter={updateParameters}
+                // @ts-expect-error
                 strategyDefinition={definition}
                 context={context}
                 editable={editable}

frontend/src/component/feature/FeatureView/FeatureStrategies/common/FlexibleStrategy/FlexibleStrategy.tsx

@@ -50,10 +50,13 @@ const FlexibleStrategy = ({
     const resolveStickiness = () =>
         builtInStickinessOptions.concat(
             context
+                // @ts-expect-error
                 .filter(c => c.stickiness)
                 .filter(
+                    // @ts-expect-error
                     c => !builtInStickinessOptions.find(s => s.key === c.name)
                 )
+                // @ts-expect-error
                 .map(c => ({ key: c.name, label: c.name }))
         );
 

frontend/src/component/feature/FeatureView/FeatureStrategies/common/GeneralStrategy/GeneralStrategy.tsx

@@ -28,20 +28,26 @@ const GeneralStrategy = ({
     editable,
 }: IGeneralStrategyProps) => {
     const styles = useStyles();
+    // @ts-expect-error
     const onChangeTextField = (field, evt) => {
         const { value } = evt.currentTarget;
 
         evt.preventDefault();
+        // @ts-expect-error
         updateParameter(field, value);
     };
 
+    // @ts-expect-error
     const onChangePercentage = (field, evt, newValue) => {
         evt.preventDefault();
+        // @ts-expect-error
         updateParameter(field, newValue);
     };
 
+    // @ts-expect-error
     const handleSwitchChange = (key, currentValue) => {
         const value = currentValue === 'true' ? 'false' : 'true';
+        // @ts-expect-error
         updateParameter(key, value);
     };
 
@@ -50,6 +56,7 @@ const GeneralStrategy = ({
         strategyDefinition?.parameters.length > 0
     ) {
         return strategyDefinition.parameters.map(
+            // @ts-expect-error
             ({ name, type, description, required }) => {
                 let value = parameters[name];
 

frontend/src/component/feature/FeatureView/FeatureStrategies/common/StrategyConstraints/StrategyConstraints.tsx

@@ -36,6 +36,7 @@ const StrategyConstraints: React.FC<IStrategyConstraintProps> = ({
     const contextFields = context;
 
     const enabled = uiConfig.flags[C];
+    // @ts-expect-error
     const contextNames = contextFields.map(context => context.name);
 
     const onClick = (evt: React.SyntheticEvent) => {
@@ -65,9 +66,11 @@ const StrategyConstraints: React.FC<IStrategyConstraintProps> = ({
         updateConstraints(updatedConstraints);
     };
 
+    // @ts-expect-error
     const updateConstraint = (index: number) => (value, field) => {
         const updatedConstraints = [...constraints];
         const constraint = updatedConstraints[index];
+        // @ts-expect-error
         constraint[field] = value;
         updateConstraints(updatedConstraints);
     };

frontend/src/component/feature/FeatureView/FeatureStrategies/common/StrategyInputList/StrategyInputList.tsx

@@ -28,6 +28,7 @@ const StrategyInputList = ({
     };
 
     const onKeyDown = (e: ChangeEvent) => {
+        // @ts-expect-error
         if (e?.key === ENTERKEY) {
             setValue(e);
             e.preventDefault();
@@ -37,11 +38,13 @@ const StrategyInputList = ({
 
     const setValue = (evt: ChangeEvent) => {
         evt.preventDefault();
+        // @ts-expect-error
         const value = evt.target.value;
 
         if (value) {
             const newValues = value
                 .split(/,\s*/)
+                // @ts-expect-error
                 .filter(a => !list.includes(a));
             if (newValues.length > 0) {
                 const newList = list.concat(newValues).filter(a => a);
@@ -52,6 +55,7 @@ const StrategyInputList = ({
     };
 
     const onClose = (index: number) => {
+        // @ts-expect-error
         list[index] = null;
         setConfig(
             name,
@@ -59,6 +63,7 @@ const StrategyInputList = ({
         );
     };
 
+    // @ts-expect-error
     const onChange = e => {
         setInput(e.currentTarget.value);
     };
@@ -96,9 +101,11 @@ const StrategyInputList = ({
                             placeholder=""
                             onBlur={onBlur}
                             onChange={onChange}
+                            // @ts-expect-error
                             onKeyDown={onKeyDown}
                             data-test={STRATEGY_INPUT_LIST}
                         />
+                        {/* @ts-expect-error */}
                         <Button
                             onClick={setValue}
                             data-test={ADD_TO_STRATEGY_INPUT_LIST}

frontend/src/component/feature/FeatureView/FeatureVariants/FeatureVariantsList/AddFeatureVariant/AddFeatureVariant.tsx

@@ -155,14 +155,17 @@ const AddVariant = ({
             clear();
             closeDialog();
         } catch (error) {
+            // @ts-expect-error
             if (error?.body?.details[0]?.message?.includes('duplicate value')) {
                 setError({ name: 'A variant with that name already exists.' });
             } else if (
+                // @ts-expect-error
                 error?.body?.details[0]?.message?.includes('must be a number')
             ) {
                 setError({ weight: 'Weight must be a number' });
             } else {
                 const msg =
+                    // @ts-expect-error
                     error?.body?.details[0]?.message || 'Could not add variant';
                 setError({ general: msg });
             }
@@ -173,6 +176,7 @@ const AddVariant = ({
         e.preventDefault();
         setPayload({
             ...payload,
+            // @ts-expect-error
             [e.target.name]: e.target.value,
         });
     };
@@ -189,6 +193,7 @@ const AddVariant = ({
             setOverrides(
                 overrides.map((o, i) => {
                     if (i === index) {
+                        // @ts-expect-error
                         o[e.target.name] = e.target.value;
                     }
 

frontend/src/component/feature/FeatureView/FeatureVariants/FeatureVariantsList/FeatureVariantsList.tsx

@@ -56,14 +56,17 @@ const FeatureOverviewVariants = () => {
     useEffect(() => {
         const options = [
             'default',
+            // @ts-expect-error
             ...context.filter(c => c.stickiness).map(c => c.name),
         ];
 
+        // @ts-expect-error
         setStickinessOptions(options);
     }, [context]);
 
     const editable = hasAccess(UPDATE_FEATURE_VARIANTS, projectId);
 
+    // @ts-expect-error
     const setClonedVariants = clonedVariants =>
         setVariants(cloneDeep(clonedVariants));
 
@@ -101,16 +104,20 @@ const FeatureOverviewVariants = () => {
         const options = stickinessOptions.map(c => ({ key: c, label: c }));
 
         // guard on stickiness being disabled for context field.
+        // @ts-expect-error
         if (!stickinessOptions.includes(value)) {
+            // @ts-expect-error
             options.push({ key: value, label: value });
         }
 
+        // @ts-expect-error
         const onChange = event => {
             updateStickiness(event.target.value);
         };
 
         return (
             <section style={{ paddingTop: '16px' }}>
+                {/* @ts-expect-error */}
                 <GeneralSelect
                     label="Stickiness"
                     options={options}
@@ -315,6 +322,7 @@ const FeatureOverviewVariants = () => {
                 editing={editing}
                 validateName={validateName}
                 validateWeight={validateWeight}
+                // @ts-expect-error
                 editVariant={editVariant}
                 title={editing ? 'Edit variant' : 'Add variant'}
             />

frontend/src/component/feature/FeatureView/FeatureView.tsx

@@ -158,6 +158,7 @@ export const FeatureView = () => {
                                     projectId={projectId}
                                     tooltip="Copy"
                                     data-loading
+                                    // @ts-expect-error
                                     component={Link}
                                     to={`/projects/${projectId}/features/${featureId}/strategies/copy`}
                                 >

frontend/src/component/project/Project/Project.tsx

@@ -69,6 +69,7 @@ const Project = () => {
             });
         }
 
+        // @ts-expect-error
         tabData.filter(tab => !tab.disabled);
 
         /* eslint-disable-next-line */

frontend/src/component/project/Project/ProjectInfo/ProjectInfo.tsx

@@ -51,6 +51,7 @@ const ProjectInfo = ({
         <PermissionIconButton
             permission={UPDATE_PROJECT}
             projectId={id}
+            // @ts-expect-error
             component={Link}
             className={permissionButtonClass}
             data-loading

frontend/src/component/project/ProjectAccess/ProjectAccessList/ProjectAccessListItem/ProjectAccessListItem.tsx

@@ -79,6 +79,7 @@ export const ProjectAccessListItem = ({
                     onClick={() => {
                         handleRemoveAccess(user);
                     }}
+                    // @ts-expect-error
                     disabled={access.users.length === 1}
                     tooltip={
                         access.users.length === 1

frontend/src/component/project/ProjectCard/ProjectCard.tsx

@@ -39,6 +39,7 @@ export const ProjectCard = ({
     const history = useHistory();
     const { setToastData, setToastApiError } = useToast();
 
+    // @ts-expect-error
     const handleClick = e => {
         e.preventDefault();
         setAnchorEl(e.currentTarget);
@@ -82,6 +83,7 @@ export const ProjectCard = ({
                     anchorEl={anchorEl}
                     style={{ top: '40px', left: '-60px' }}
                     onClose={e => {
+                        // @ts-expect-error
                         e.preventDefault();
                         setAnchorEl(null);
                     }}
@@ -132,6 +134,7 @@ export const ProjectCard = ({
             </div>
             <Dialogue
                 open={showDelDialog}
+                // @ts-expect-error
                 onClick={onRemoveProject}
                 onClose={() => {
                     setAnchorEl(null);

frontend/src/component/providers/SWRProvider/SWRProvider.tsx

@@ -19,6 +19,7 @@ const SWRProvider: React.FC<ISWRProviderProps> = ({
     const history = useHistory();
     const { setToastApiError } = useToast();
 
+    // @ts-expect-error
     const handleFetchError = error => {
         if (error.status === 401) {
             const path = location.pathname;
@@ -36,6 +37,7 @@ const SWRProvider: React.FC<ISWRProviderProps> = ({
                 return;
             }
 
+            // @ts-expect-error
             cache.clear();
 
             history.push('/login');

frontend/src/component/strategies/StrategiesList/StrategiesList.styles.ts

@@ -13,6 +13,7 @@ export const useStyles = makeStyles(theme => ({
     },
     deprecated: {
         '& a': {
+            // @ts-expect-error
             color: theme.palette.links.deprecated,
         },
     },

frontend/src/component/strategies/StrategyForm/StrategyForm.tsx

@@ -33,6 +33,7 @@ export const StrategyForm = ({ editMode, strategy }: IStrategyFormProps) => {
     const [name, setName] = useState(strategy?.name || '');
     const [description, setDescription] = useState(strategy?.description || '');
     const [params, setParams] = useState<ICustomStrategyParams[]>(
+        // @ts-expect-error
         strategy?.parameters || []
     );
     const [errors, setErrors] = useState<ICustomStrategyErrors>({});

frontend/src/component/strategies/StrategyView/StrategyView.tsx

@@ -30,6 +30,7 @@ export const StrategyView = () => {
             label: 'Details',
             component: (
                 <StrategyDetails
+                    // @ts-expect-error
                     strategy={strategy}
                     toggles={toggles}
                     applications={applications}
@@ -38,6 +39,7 @@ export const StrategyView = () => {
         },
         {
             label: 'Edit',
+            // @ts-expect-error
             component: <StrategyForm strategy={strategy} editMode />,
         },
     ];

frontend/src/component/user/ForgottenPassword/ForgottenPassword.tsx

@@ -79,8 +79,7 @@ const ForgottenPassword = () => {
                     onSubmit={onClick}
                     className={classnames(
                         commonStyles.contentSpacingY,
-                        commonStyles.flexColumn,
+                        commonStyles.flexColumn
-                        styles.container
                     )}
                 >
                     <Typography

frontend/src/component/user/StandaloneBanner/StandaloneBanner.tsx

@@ -18,7 +18,9 @@ const StandaloneBanner: FC<IStandaloneBannerProps> = ({ title, children }) => {
     return (
         <Gradient
             from={theme.palette.primary.main}
+            // @ts-expect-error
             to={theme.palette.login.gradient.bottom}
+            // @ts-expect-error
             className={styles.gradient}
         >
             <div className={styles.container}>

frontend/src/component/user/common/ResetPasswordForm/PasswordChecker/PasswordChecker.styles.ts

@@ -10,6 +10,7 @@ export const useStyles = makeStyles(theme => ({
     },
     headerContainer: { display: 'flex', padding: '0.5rem' },
     divider: {
+        // @ts-expect-error
         backgroundColor: theme.palette.borders?.main,
         height: '1px',
         width: '100%',

frontend/src/hooks/api/actions/useContextsApi/useContextsApi.ts

@@ -1,4 +1,3 @@
-import { IContext } from '../../../../interfaces/context';
 import useAPI from '../useApi/useApi';
 
 const useContextsApi = () => {
@@ -23,6 +22,7 @@ const useContextsApi = () => {
         }
     };
 
+    // @ts-expect-error
     const createContext = async (payload: IContext) => {
         const path = URI;
         const req = createRequest(path, {
@@ -39,6 +39,7 @@ const useContextsApi = () => {
         }
     };
 
+    // @ts-expect-error
     const updateContext = async (context: IContext) => {
         const path = `${URI}/${context.name}`;
         const req = createRequest(path, {

frontend/src/hooks/api/getters/useProject/useProject.ts

@@ -22,6 +22,7 @@ const useProject = (id: string, options: SWRConfiguration = {}) => {
 
     const sortedData = (data: IProject | undefined): IProject => {
         if (data) {
+            // @ts-expect-error
             return { ...data, features: sort(data.features || []) };
         }
         return fallbackProject;

frontend/src/hooks/usePersistentGlobalState.ts

@@ -20,7 +20,7 @@ export const createPersistentGlobalStateHook = <T extends object>(
 
     const setGlobalState = (value: React.SetStateAction<T>) => {
         const prev = container.getGlobalState(key);
-        const next = typeof value === 'function' ? value(prev) : value;
+        const next = value instanceof Function ? value(prev) : value;
         container.setGlobalState(key, next);
         setLocalStorageItem(key, next);
     };