refactor: add useEnqueueSnackbar with data-test attr

This commit is contained in:
Ali BARIN
2023-10-06 09:18:13 +00:00
parent 60d8af5c16
commit 174240a220
17 changed files with 166 additions and 145 deletions

View File

@@ -1,16 +1,16 @@
import { useMemo } from 'react';
import Stack from '@mui/material/Stack';
import { useMutation } from '@apollo/client';
import { TSamlAuthProvider, TSamlAuthProviderRole } from '@automatisch/types';
import Typography from '@mui/material/Typography';
import LoadingButton from '@mui/lab/LoadingButton';
import Divider from '@mui/material/Divider';
import { useMutation } from '@apollo/client';
import { useSnackbar } from 'notistack';
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 Form from 'components/Form';
import RoleMappingsFieldArray from './RoleMappingsFieldsArray';
@@ -32,7 +32,7 @@ function generateFormRoleMappings(roleMappings: TSamlAuthProviderRole[]) {
function RoleMappings({ provider, providerLoading }: RoleMappingsProps) {
const formatMessage = useFormatMessage();
const { enqueueSnackbar } = useSnackbar();
const enqueueSnackbar = useEnqueueSnackbar();
const { roleMappings, loading: roleMappingsLoading } =
useSamlAuthProviderRoleMappings(provider?.id);
const [

View File

@@ -1,16 +1,15 @@
import * as React from 'react';
import { QueryResult, useMutation } from '@apollo/client';
import { IRole, TSamlAuthProvider } from '@automatisch/types';
import LoadingButton from '@mui/lab/LoadingButton';
import Stack from '@mui/material/Stack';
import MuiTextField from '@mui/material/TextField';
import LoadingButton from '@mui/lab/LoadingButton';
import { IRole } from '@automatisch/types';
import { useSnackbar } from 'notistack';
import { TSamlAuthProvider } from '@automatisch/types';
import { QueryResult, useMutation } from '@apollo/client';
import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
import * as React from 'react';
import Form from 'components/Form';
import TextField from 'components/TextField';
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';
@@ -47,7 +46,7 @@ function SamlConfiguration({
}: SamlConfigurationProps) {
const formatMessage = useFormatMessage();
const { roles, loading: rolesLoading } = useRoles();
const { enqueueSnackbar } = useSnackbar();
const enqueueSnackbar = useEnqueueSnackbar();
const [upsertSamlAuthProvider, { loading }] = useMutation(
UPSERT_SAML_AUTH_PROVIDER
);

View File

@@ -2,14 +2,14 @@ import { useMutation } from '@apollo/client';
import LoadingButton from '@mui/lab/LoadingButton';
import Grid from '@mui/material/Grid';
import Stack from '@mui/material/Stack';
import PermissionCatalogField from 'components/PermissionCatalogField/index.ee';
import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
import * as React from 'react';
import { useNavigate } from 'react-router-dom';
import PermissionCatalogField from 'components/PermissionCatalogField/index.ee';
import { useSnackbar } from 'notistack';
import Container from 'components/Container';
import Form from 'components/Form';
import PageTitle from 'components/PageTitle';
import Container from 'components/Container';
import TextField from 'components/TextField';
import * as URLS from 'config/urls';
import { CREATE_ROLE } from 'graphql/mutations/create-role.ee';
@@ -23,7 +23,7 @@ export default function CreateRole(): React.ReactElement {
const navigate = useNavigate();
const formatMessage = useFormatMessage();
const [createRole, { loading }] = useMutation(CREATE_ROLE);
const { enqueueSnackbar } = useSnackbar();
const enqueueSnackbar = useEnqueueSnackbar();
const handleRoleCreation = async (
roleData: Partial<RoleWithComputedPermissions>

View File

@@ -1,23 +1,23 @@
import * as React from 'react';
import { useNavigate } from 'react-router-dom';
import { useMutation } from '@apollo/client';
import { IRole, IUser } from '@automatisch/types';
import LoadingButton from '@mui/lab/LoadingButton';
import Grid from '@mui/material/Grid';
import Stack from '@mui/material/Stack';
import MuiTextField from '@mui/material/TextField';
import LoadingButton from '@mui/lab/LoadingButton';
import { IUser, IRole } from '@automatisch/types';
import { useSnackbar } from 'notistack';
import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
import * as React from 'react';
import { useNavigate } from 'react-router-dom';
import { CREATE_USER } from 'graphql/mutations/create-user.ee';
import * as URLS from 'config/urls';
import Can from 'components/Can';
import useRoles from 'hooks/useRoles.ee';
import PageTitle from 'components/PageTitle';
import Container from 'components/Container';
import Form from 'components/Form';
import ControlledAutocomplete from 'components/ControlledAutocomplete';
import Form from 'components/Form';
import PageTitle from 'components/PageTitle';
import TextField from 'components/TextField';
import * as URLS from 'config/urls';
import { CREATE_USER } from 'graphql/mutations/create-user.ee';
import useFormatMessage from 'hooks/useFormatMessage';
import useRoles from 'hooks/useRoles.ee';
function generateRoleOptions(roles: IRole[]) {
return roles?.map(({ name: label, id: value }) => ({ label, value }));
@@ -28,7 +28,7 @@ export default function CreateUser(): React.ReactElement {
const formatMessage = useFormatMessage();
const [createUser, { loading }] = useMutation(CREATE_USER);
const { roles, loading: rolesLoading } = useRoles();
const { enqueueSnackbar } = useSnackbar();
const enqueueSnackbar = useEnqueueSnackbar();
const handleUserCreation = async (userData: Partial<IUser>) => {
try {

View File

@@ -1,15 +1,15 @@
import { useMutation } from '@apollo/client';
import LoadingButton from '@mui/lab/LoadingButton';
import Grid from '@mui/material/Grid';
import Stack from '@mui/material/Stack';
import Skeleton from '@mui/material/Skeleton';
import Stack from '@mui/material/Stack';
import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
import * as React from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import { useSnackbar } from 'notistack';
import Container from 'components/Container';
import Form from 'components/Form';
import PageTitle from 'components/PageTitle';
import Container from 'components/Container';
import PermissionCatalogField from 'components/PermissionCatalogField/index.ee';
import TextField from 'components/TextField';
import * as URLS from 'config/urls';
@@ -32,7 +32,7 @@ export default function EditRole(): React.ReactElement {
const navigate = useNavigate();
const { roleId } = useParams<EditRoleParams>();
const { role, loading: roleLoading } = useRole(roleId);
const { enqueueSnackbar } = useSnackbar();
const enqueueSnackbar = useEnqueueSnackbar();
const handleRoleUpdate = async (
roleData: Partial<RoleWithComputedPermissions>

View File

@@ -1,25 +1,25 @@
import * as React from 'react';
import { useParams, useNavigate } from 'react-router-dom';
import { useMutation } from '@apollo/client';
import { IRole, IUser } from '@automatisch/types';
import LoadingButton from '@mui/lab/LoadingButton';
import Grid from '@mui/material/Grid';
import Skeleton from '@mui/material/Skeleton';
import Stack from '@mui/material/Stack';
import MuiTextField from '@mui/material/TextField';
import Skeleton from '@mui/material/Skeleton';
import LoadingButton from '@mui/lab/LoadingButton';
import { IUser, IRole } from '@automatisch/types';
import { useSnackbar } from 'notistack';
import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
import * as React from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import { UPDATE_USER } from 'graphql/mutations/update-user.ee';
import Can from 'components/Can';
import * as URLS from 'config/urls';
import useUser from 'hooks/useUser';
import useRoles from 'hooks/useRoles.ee';
import PageTitle from 'components/PageTitle';
import Container from 'components/Container';
import Form from 'components/Form';
import ControlledAutocomplete from 'components/ControlledAutocomplete';
import Form from 'components/Form';
import PageTitle from 'components/PageTitle';
import TextField from 'components/TextField';
import * as URLS from 'config/urls';
import { UPDATE_USER } from 'graphql/mutations/update-user.ee';
import useFormatMessage from 'hooks/useFormatMessage';
import useRoles from 'hooks/useRoles.ee';
import useUser from 'hooks/useUser';
type EditUserParams = {
userId: string;
@@ -35,7 +35,7 @@ export default function EditUser(): React.ReactElement {
const { userId } = useParams<EditUserParams>();
const { user, loading: userLoading } = useUser(userId);
const { roles, loading: rolesLoading } = useRoles();
const { enqueueSnackbar } = useSnackbar();
const enqueueSnackbar = useEnqueueSnackbar();
const navigate = useNavigate();
const handleUserUpdate = async (userDataToUpdate: Partial<IUser>) => {

View File

@@ -1,29 +1,29 @@
import * as React from 'react';
import { useMutation } from '@apollo/client';
import { yupResolver } from '@hookform/resolvers/yup';
import Alert from '@mui/material/Alert';
import AlertTitle from '@mui/material/AlertTitle';
import Button from '@mui/material/Button';
import Grid from '@mui/material/Grid';
import Typography from '@mui/material/Typography';
import { styled } from '@mui/material/styles';
import Grid from '@mui/material/Grid';
import Button from '@mui/material/Button';
import { useSnackbar } from 'notistack';
import { yupResolver } from '@hookform/resolvers/yup';
import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
import * as React from 'react';
import * as yup from 'yup';
import PageTitle from 'components/PageTitle';
import Container from 'components/Container';
import Form from 'components/Form';
import TextField from 'components/TextField';
import DeleteAccountDialog from 'components/DeleteAccountDialog/index.ee';
import Form from 'components/Form';
import PageTitle from 'components/PageTitle';
import TextField from 'components/TextField';
import { UPDATE_CURRENT_USER } from 'graphql/mutations/update-current-user';
import useFormatMessage from 'hooks/useFormatMessage';
import useCurrentUser from 'hooks/useCurrentUser';
import useFormatMessage from 'hooks/useFormatMessage';
type TMutationInput = {
fullName: string;
email: string;
password?: string;
}
};
const validationSchema = yup
.object({
@@ -43,8 +43,9 @@ const StyledForm = styled(Form)`
`;
function ProfileSettings() {
const [showDeleteAccountConfirmation, setShowDeleteAccountConfirmation] = React.useState(false);
const { enqueueSnackbar } = useSnackbar();
const [showDeleteAccountConfirmation, setShowDeleteAccountConfirmation] =
React.useState(false);
const enqueueSnackbar = useEnqueueSnackbar();
const currentUser = useCurrentUser();
const formatMessage = useFormatMessage();
const [updateCurrentUser] = useMutation(UPDATE_CURRENT_USER);
@@ -55,7 +56,7 @@ function ProfileSettings() {
const mutationInput: TMutationInput = {
fullName,
email,
}
};
if (password) {
mutationInput.password = password;
@@ -80,7 +81,6 @@ function ProfileSettings() {
});
};
return (
<Container sx={{ py: 3, display: 'flex', justifyContent: 'center' }}>
<Grid container item xs={12} sm={9} md={8} lg={6}>
@@ -90,7 +90,11 @@ function ProfileSettings() {
<Grid item xs={12} justifyContent="flex-end">
<StyledForm
defaultValues={{ ...currentUser, password: '', confirmPassword: '' }}
defaultValues={{
...currentUser,
password: '',
confirmPassword: '',
}}
onSubmit={handleProfileSettingsUpdate}
resolver={yupResolver(validationSchema)}
mode="onChange"
@@ -109,7 +113,7 @@ function ProfileSettings() {
fullWidth
name="fullName"
label={formatMessage('profileSettings.fullName')}
margin='dense'
margin="dense"
error={touchedFields.fullName && !!errors?.fullName}
helperText={errors?.fullName?.message || ' '}
/>
@@ -118,7 +122,7 @@ function ProfileSettings() {
fullWidth
name="email"
label={formatMessage('profileSettings.email')}
margin='dense'
margin="dense"
error={touchedFields.email && !!errors?.email}
helperText={errors?.email?.message || ' '}
/>
@@ -127,7 +131,7 @@ function ProfileSettings() {
fullWidth
name="password"
label={formatMessage('profileSettings.newPassword')}
margin='dense'
margin="dense"
type="password"
error={touchedFields.password && !!errors?.password}
helperText={
@@ -139,7 +143,7 @@ function ProfileSettings() {
fullWidth
name="confirmPassword"
label={formatMessage('profileSettings.confirmNewPassword')}
margin='dense'
margin="dense"
type="password"
error={
touchedFields.confirmPassword && !!errors?.confirmPassword
@@ -163,9 +167,11 @@ function ProfileSettings() {
/>
</Grid>
<Grid item xs={12} justifyContent="flex-end" sx={{pt: 5 }}>
<Grid item xs={12} justifyContent="flex-end" sx={{ pt: 5 }}>
<Alert variant="outlined" severity="error" sx={{ fontWeight: 500 }}>
<AlertTitle sx={{ fontWeight: 700 }}>{formatMessage('profileSettings.deleteMyAccount')}</AlertTitle>
<AlertTitle sx={{ fontWeight: 700 }}>
{formatMessage('profileSettings.deleteMyAccount')}
</AlertTitle>
<Typography variant="body1" gutterBottom>
{formatMessage('profileSettings.deleteAccountSubtitle')}

View File

@@ -1,26 +1,26 @@
import * as React from 'react';
import { useMutation } from '@apollo/client';
import Grid from '@mui/material/Grid';
import Stack from '@mui/material/Stack';
import Skeleton from '@mui/material/Skeleton';
import LoadingButton from '@mui/lab/LoadingButton';
import { useSnackbar } from 'notistack';
import Grid from '@mui/material/Grid';
import Skeleton from '@mui/material/Skeleton';
import Stack from '@mui/material/Stack';
import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
import merge from 'lodash/merge';
import * as React from 'react';
import { GET_CONFIG } from 'graphql/queries/get-config.ee';
import { UPDATE_CONFIG } from 'graphql/mutations/update-config.ee';
import useConfig from 'hooks/useConfig';
import PageTitle from 'components/PageTitle';
import ColorInput from 'components/ColorInput';
import Container from 'components/Container';
import Form from 'components/Form';
import PageTitle from 'components/PageTitle';
import TextField from 'components/TextField';
import useFormatMessage from 'hooks/useFormatMessage';
import ColorInput from 'components/ColorInput';
import { UPDATE_CONFIG } from 'graphql/mutations/update-config.ee';
import { GET_CONFIG } from 'graphql/queries/get-config.ee';
import nestObject from 'helpers/nestObject';
import useConfig from 'hooks/useConfig';
import useFormatMessage from 'hooks/useFormatMessage';
import {
primaryMainColor,
primaryDarkColor,
primaryLightColor,
primaryMainColor,
} from 'styles/theme';
type UserInterface = {
@@ -58,7 +58,7 @@ export default function UserInterface(): React.ReactElement {
'palette.primary.dark',
'logo.svgData',
]);
const { enqueueSnackbar } = useSnackbar();
const enqueueSnackbar = useEnqueueSnackbar();
const configWithDefaults = merge(
{},
defaultValues,