refactor(web): remove typescript

packages/web/src/pages/Authentication/RoleMappings.jsx

@@ -1,36 +1,25 @@
 import { useMutation } from '@apollo/client';
-import { TSamlAuthProvider, TSamlAuthProviderRole } from 'types';
 import LoadingButton from '@mui/lab/LoadingButton';
 import Divider from '@mui/material/Divider';
 import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
 import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
 import { useMemo } from 'react';
-
 import Form from 'components/Form';
 import { UPSERT_SAML_AUTH_PROVIDERS_ROLE_MAPPINGS } from 'graphql/mutations/upsert-saml-auth-providers-role-mappings';
 import useFormatMessage from 'hooks/useFormatMessage';
 import useSamlAuthProviderRoleMappings from 'hooks/useSamlAuthProviderRoleMappings';
-
 import RoleMappingsFieldArray from './RoleMappingsFieldsArray';
-
-type RoleMappingsProps = {
-  provider?: TSamlAuthProvider;
-  providerLoading: boolean;
-};
-
-function generateFormRoleMappings(roleMappings: TSamlAuthProviderRole[]) {
+function generateFormRoleMappings(roleMappings) {
   if (roleMappings.length === 0) {
     return [{ roleId: '', remoteRoleName: '' }];
   }
-
   return roleMappings.map(({ roleId, remoteRoleName }) => ({
     roleId,
     remoteRoleName,
   }));
 }
-
-function RoleMappings({ provider, providerLoading }: RoleMappingsProps) {
+function RoleMappings({ provider, providerLoading }) {
   const formatMessage = useFormatMessage();
   const enqueueSnackbar = useEnqueueSnackbar();
   const { roleMappings, loading: roleMappingsLoading } =
@@ -39,8 +28,7 @@ function RoleMappings({ provider, providerLoading }: RoleMappingsProps) {
     upsertSamlAuthProvidersRoleMappings,
     { loading: upsertRoleMappingsLoading },
   ] = useMutation(UPSERT_SAML_AUTH_PROVIDERS_ROLE_MAPPINGS);
-
-  const handleRoleMappingsUpdate = async (values: any) => {
+  const handleRoleMappingsUpdate = async (values) => {
     try {
       if (provider?.id) {
         await upsertSamlAuthProvidersRoleMappings({
@@ -48,16 +36,10 @@ function RoleMappings({ provider, providerLoading }: RoleMappingsProps) {
             input: {
               samlAuthProviderId: provider.id,
               samlAuthProvidersRoleMappings: values.roleMappings.map(
-                ({
+                ({ roleId, remoteRoleName }) => ({
                   roleId,
                   remoteRoleName,
-                }: {
-                  roleId: string;
-                  remoteRoleName: string;
-                }) => ({
-                  roleId,
-                  remoteRoleName,
-                })
+                }),
               ),
             },
           },
@@ -73,18 +55,15 @@ function RoleMappings({ provider, providerLoading }: RoleMappingsProps) {
       throw new Error('Failed while saving!');
     }
   };
-
   const defaultValues = useMemo(
     () => ({
       roleMappings: generateFormRoleMappings(roleMappings),
     }),
-    [roleMappings]
+    [roleMappings],
   );
-
   if (providerLoading || !provider?.id || roleMappingsLoading) {
     return null;
   }
-
   return (
     <>
       <Divider sx={{ pt: 2 }} />
@@ -108,5 +87,4 @@ function RoleMappings({ provider, providerLoading }: RoleMappingsProps) {
     </>
   );
 }
-
 export default RoleMappings;

packages/web/src/pages/Authentication/RoleMappingsFieldsArray.jsx

@@ -1,22 +1,17 @@
 import { useFieldArray, useFormContext } from 'react-hook-form';
-import { IRole } from 'types';
 import MuiTextField from '@mui/material/TextField';
 import Stack from '@mui/material/Stack';
 import DeleteIcon from '@mui/icons-material/Delete';
 import IconButton from '@mui/material/IconButton';
 import Button from '@mui/material/Button';
-
 import useRoles from 'hooks/useRoles.ee';
 import useFormatMessage from 'hooks/useFormatMessage';
-
 import ControlledAutocomplete from 'components/ControlledAutocomplete';
 import TextField from 'components/TextField';
 import { Divider, Typography } from '@mui/material';
-
-function generateRoleOptions(roles: IRole[]) {
+function generateRoleOptions(roles) {
   return roles?.map(({ name: label, id: value }) => ({ label, value }));
 }
-
 function RoleMappingsFieldArray() {
   const formatMessage = useFormatMessage();
   const { control } = useFormContext();
@@ -25,9 +20,8 @@ function RoleMappingsFieldArray() {
     control,
     name: 'roleMappings',
   });
-
   const handleAppendMapping = () => append({ roleId: '', remoteRoleName: '' });
-  const handleRemoveMapping = (index: number) => () => remove(index);
+  const handleRemoveMapping = (index) => () => remove(index);
   return (
     <>
       {fields.length === 0 && (
@@ -89,5 +83,4 @@ function RoleMappingsFieldArray() {
     </>
   );
 }
-
 export default RoleMappingsFieldArray;

packages/web/src/pages/Authentication/SamlConfiguration.jsx

@@ -1,26 +1,16 @@
-import { QueryResult, useMutation } from '@apollo/client';
-import { IRole, TSamlAuthProvider } from 'types';
+import { useMutation } from '@apollo/client';
 import LoadingButton from '@mui/lab/LoadingButton';
 import Stack from '@mui/material/Stack';
 import MuiTextField from '@mui/material/TextField';
 import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
 import * as React from 'react';
-
 import ControlledAutocomplete from 'components/ControlledAutocomplete';
 import Form from 'components/Form';
 import Switch from 'components/Switch';
 import TextField from 'components/TextField';
-
 import { UPSERT_SAML_AUTH_PROVIDER } from 'graphql/mutations/upsert-saml-auth-provider';
 import useFormatMessage from 'hooks/useFormatMessage';
 import useRoles from 'hooks/useRoles.ee';
-
-type SamlConfigurationProps = {
-  provider?: TSamlAuthProvider;
-  providerLoading: boolean;
-  refetchProvider: QueryResult<TSamlAuthProvider | undefined>['refetch'];
-};
-
 const defaultValues = {
   active: false,
   name: '',
@@ -34,26 +24,17 @@ const defaultValues = {
   roleAttributeName: '',
   defaultRoleId: '',
 };
-
-function generateRoleOptions(roles: IRole[]) {
+function generateRoleOptions(roles) {
   return roles?.map(({ name: label, id: value }) => ({ label, value }));
 }
-
-function SamlConfiguration({
-  provider,
-  providerLoading,
-  refetchProvider,
-}: SamlConfigurationProps) {
+function SamlConfiguration({ provider, providerLoading, refetchProvider }) {
   const formatMessage = useFormatMessage();
   const { roles, loading: rolesLoading } = useRoles();
   const enqueueSnackbar = useEnqueueSnackbar();
   const [upsertSamlAuthProvider, { loading }] = useMutation(
-    UPSERT_SAML_AUTH_PROVIDER
+    UPSERT_SAML_AUTH_PROVIDER,
   );
-
-  const handleProviderUpdate = async (
-    providerDataToUpdate: Partial<TSamlAuthProvider>
-  ) => {
+  const handleProviderUpdate = async (providerDataToUpdate) => {
     try {
       const {
         name,
@@ -68,7 +49,6 @@ function SamlConfiguration({
         active,
         defaultRoleId,
       } = providerDataToUpdate;
-
       await upsertSamlAuthProvider({
         variables: {
           input: {
@@ -86,11 +66,9 @@ function SamlConfiguration({
           },
         },
       });
-
       if (!provider?.id) {
         await refetchProvider();
       }
-
       enqueueSnackbar(formatMessage('authenticationForm.successfullySaved'), {
         variant: 'success',
         SnackbarProps: {
@@ -101,11 +79,9 @@ function SamlConfiguration({
       throw new Error('Failed while saving!');
     }
   };
-
   if (providerLoading) {
     return null;
   }
-
   return (
     <Form
       defaultValues={provider || defaultValues}
@@ -209,5 +185,4 @@ function SamlConfiguration({
     </Form>
   );
 }
-
 export default SamlConfiguration;

packages/web/src/pages/Authentication/index.jsx

@@ -1,15 +1,11 @@
 import Grid from '@mui/material/Grid';
 import Stack from '@mui/material/Stack';
-
 import PageTitle from 'components/PageTitle';
 import Container from 'components/Container';
-
 import useFormatMessage from 'hooks/useFormatMessage';
 import useSamlAuthProvider from 'hooks/useSamlAuthProvider';
-
 import SamlConfiguration from './SamlConfiguration';
 import RoleMappings from './RoleMappings';
-
 function AuthenticationPage() {
   const formatMessage = useFormatMessage();
   const {
@@ -17,7 +13,6 @@ function AuthenticationPage() {
     loading: providerLoading,
     refetch: refetchProvider,
   } = useSamlAuthProvider();
-
   return (
     <Container sx={{ py: 3, display: 'flex', justifyContent: 'center' }}>
       <Grid container item xs={12} sm={10} md={9}>
@@ -41,5 +36,4 @@ function AuthenticationPage() {
     </Container>
   );
 }
-
 export default AuthenticationPage;