M2-4835: Revert print width to 100

.prettierrc

@@ -6,7 +6,7 @@
  "jsxSingleQuote": false,
  "trailingComma": "all",
  "semi": true,
- "printWidth": 120,
+ "printWidth": 100,
  "tabWidth": 2,
  "useTabs": false,
  "endOfLine": "lf"

src/__mocks__/EditorController.tsx

@@ -2,5 +2,9 @@ import { Input } from '@mui/material';
 import { EditorProps } from 'md-editor-rt';
 
 export const StyledMdEditor = ({ modelValue, onChange, sanitize }: EditorProps) => (
- <Input value={sanitize?.(modelValue) ?? modelValue} onChange={(e) => onChange?.(e.target.value)} multiline />
+ <Input
+ value={sanitize?.(modelValue) ?? modelValue}
+ onChange={(e) => onChange?.(e.target.value)}
+ multiline
+ />
 );

src/modules/Auth/features/Login/LockForm/LockForm.tsx

@@ -7,7 +7,13 @@ import { yupResolver } from '@hookform/resolvers/yup';
 import { SignIn } from 'api';
 import { useAppDispatch } from 'redux/store';
 import { InputController } from 'shared/components/FormComponents';
-import { variables, StyledBodyMedium, StyledHeadline, StyledTitleMedium, StyledErrorText } from 'shared/styles';
+import {
+ variables,
+ StyledBodyMedium,
+ StyledHeadline,
+ StyledTitleMedium,
+ StyledErrorText,
+} from 'shared/styles';
 import { auth, User } from 'redux/modules';
 import { useLogout } from 'shared/hooks/useLogout';
 import { Avatar } from 'shared/components';
@@ -63,8 +69,12 @@ export const LockForm = () => {
  <Avatar caption={userInitials} />
  </StyledImageContainer>
  <StyledUserInfo>
- <StyledTitleMedium sx={{ color: variables.palette.on_surface }}>{fullName}</StyledTitleMedium>
- <StyledBodyMedium sx={{ color: variables.palette.on_surface_variant }}>{email}</StyledBodyMedium>
+ <StyledTitleMedium sx={{ color: variables.palette.on_surface }}>
+ {fullName}
+ </StyledTitleMedium>
+ <StyledBodyMedium sx={{ color: variables.palette.on_surface_variant }}>
+ {email}
+ </StyledBodyMedium>
  </StyledUserInfo>
  </StyledUserInfoController>
  <StyledController>

src/modules/Auth/features/Login/Login.styles.ts

@@ -1,6 +1,13 @@
 import { styled, Button, Box } from '@mui/material';
 
-import { theme, variables, StyledHeadline, StyledLinkBtn, StyledBodyMedium, StyledFlexAllCenter } from 'shared/styles';
+import {
+ theme,
+ variables,
+ StyledHeadline,
+ StyledLinkBtn,
+ StyledBodyMedium,
+ StyledFlexAllCenter,
+} from 'shared/styles';
 
 export const StyledWelcome = styled(StyledHeadline)`
  color: ${variables.palette.primary};

src/modules/Auth/features/Login/LoginForm/LoginForm.test.tsx

@@ -25,7 +25,9 @@ describe('Login component tests', () => {
  await waitFor(() => expect(screen.getByText('Email must be valid')).toBeInTheDocument());
 
  submitForm(mockedEmail, ` ${mockedPassword}`);
- await waitFor(() => expect(screen.getByText('Password must not contain spaces.')).toBeInTheDocument());
+ await waitFor(() =>
+ expect(screen.getByText('Password must not contain spaces.')).toBeInTheDocument(),
+ );
 
  submitForm('', '');
  await waitFor(() => expect(screen.getByText('Email is required')).toBeInTheDocument());

src/modules/Auth/features/Login/LoginForm/LoginForm.tsx

@@ -75,7 +75,9 @@ export const LoginForm = () => {
  </StyledWelcome>
  <StyledForm onSubmit={handleSubmit(onSubmit)} noValidate>
  <StyledHeadline color={variables.palette.on_surface}>{t('login')}</StyledHeadline>
- <StyledLoginSubheader color={variables.palette.on_surface_variant}>{t('logIntoAccount')}</StyledLoginSubheader>
+ <StyledLoginSubheader color={variables.palette.on_surface_variant}>
+ {t('logIntoAccount')}
+ </StyledLoginSubheader>
  <StyledController>
  <InputController
  fullWidth
@@ -98,13 +100,25 @@ export const LoginForm = () => {
  />
  </StyledController>
  {errorMessage && <StyledErrorText marginTop={0}>{errorMessage}</StyledErrorText>}
- <StyledForgotPasswordLink onClick={() => navigate(page.passwordReset)} data-testid="login-form-forgot-password">
+ <StyledForgotPasswordLink
+ onClick={() => navigate(page.passwordReset)}
+ data-testid="login-form-forgot-password"
+ >
  {t('forgotPassword')}
  </StyledForgotPasswordLink>
- <StyledButton onClick={handleLoginClick} variant="contained" type="submit" data-testid="login-form-signin">
+ <StyledButton
+ onClick={handleLoginClick}
+ variant="contained"
+ type="submit"
+ data-testid="login-form-signin"
+ >
  {t('login')}
  </StyledButton>
- <StyledButton variant="outlined" onClick={handleCreateAccountClick} data-testid="login-form-signup">
+ <StyledButton
+ variant="outlined"
+ onClick={handleCreateAccountClick}
+ data-testid="login-form-signup"
+ >
  {t('createAccount')}
  </StyledButton>
  </StyledForm>

src/modules/Auth/features/ResetPassword/Confirmation/Confirmation.tsx

@@ -19,13 +19,19 @@ export const Confirmation = ({ email }: { email: string }) => {
  sx={{ mb: theme.spacing(2.4), color: variables.palette.on_surface_variant }}
  >
  <Trans i18nKey="passwordResetLink">
- A password reset link is sent to {{ email }} <br /> if that email is associated with a MindLogger account.
+ A password reset link is sent to {{ email }} <br /> if that email is associated with a
+ MindLogger account.
  </Trans>
  </StyledBodyMedium>
  <StyledBodyMedium sx={{ mb: theme.spacing(2.4), color: variables.palette.outline }}>
  {t('ifYouDontReceiveEmail')}
  </StyledBodyMedium>
- <Button data-testid="confirmation-button" variant="contained" type="button" onClick={() => navigate(page.login)}>
+ <Button
+ data-testid="confirmation-button"
+ variant="contained"
+ type="button"
+ onClick={() => navigate(page.login)}
+ >
  {t('backToLogin')}
  </Button>
  </StyledConfirmation>

src/modules/Auth/features/ResetPassword/ResetForm/ResetForm.tsx

@@ -52,7 +52,13 @@ export const ResetForm = ({ setEmail }: ResetFormProps) => {
  {t('enterEmailAssociatedWithAccount')}
  </StyledResetPasswordSubheader>
  <StyledController>
- <InputController fullWidth name="email" control={control} label={t('email')} data-testid="reset-form-email" />
+ <InputController
+ fullWidth
+ name="email"
+ control={control}
+ label={t('email')}
+ data-testid="reset-form-email"
+ />
  </StyledController>
  {errorMessage && <StyledErrorText>{errorMessage}</StyledErrorText>}
  <StyledButton variant="contained" type="submit" data-testid="reset-form-reset">

src/modules/Auth/features/SignUp/AdvancedSettings/AdvancedSettings.tsx

@@ -22,11 +22,17 @@ export const AdvancedSettings = () => {
  const [showSettings, setShowSettings] = useState(false);
 
  const handleServerChange = (e: React.SyntheticEvent, selectedValue: string | ServerUrlOption) => {
- storage.setItem(LocalStorageKeys.ApiUrl, typeof selectedValue === 'string' ? selectedValue : selectedValue.value);
+ storage.setItem(
+ LocalStorageKeys.ApiUrl,
+ typeof selectedValue === 'string' ? selectedValue : selectedValue.value,
+ );
  setSelectValue(selectedValue);
  };
 
- const handleFilterOptions = (options: ServerUrlOption[], params: FilterOptionsState<ServerUrlOption>) => {
+ const handleFilterOptions = (
+ options: ServerUrlOption[],
+ params: FilterOptionsState<ServerUrlOption>,
+ ) => {
  const { inputValue } = params;
  const filtered = options.filter((option) => option.name.includes(inputValue));
  const isExisting = options.some((option) => inputValue === option.value);
@@ -63,8 +69,12 @@ export const AdvancedSettings = () => {
  clearOnBlur
  options={BACKEND_SERVERS}
  getOptionLabel={(option) => (typeof option === 'string' ? option : option.name)}
- renderOption={(props, option) => <StyledMenuItem {...props}>{option.name}</StyledMenuItem>}
- renderInput={({ InputLabelProps, ...params }) => <TextField {...params} label={t('serverUrl')} />}
+ renderOption={(props, option) => (
+ <StyledMenuItem {...props}>{option.name}</StyledMenuItem>
+ )}
+ renderInput={({ InputLabelProps, ...params }) => (
+ <TextField {...params} label={t('serverUrl')} />
+ )}
  freeSolo
  />
  </StyledFormControl>

src/modules/Auth/features/SignUp/SignUpForm/SignUpForm.test.tsx

@@ -35,7 +35,9 @@ describe('SignUp component tests', () => {
  await waitFor(() => expect(screen.getByText('Email must be valid')).toBeInTheDocument());
 
  submitForm(mockedEmail, ` ${mockedPassword}`, 'fname', 'lname');
- await waitFor(() => expect(screen.getByText('Password must not contain spaces.')).toBeInTheDocument());
+ await waitFor(() =>
+ expect(screen.getByText('Password must not contain spaces.')).toBeInTheDocument(),
+ );
 
  submitForm('', '', '', '');
  await waitFor(() => expect(screen.getByText('Email is required')).toBeInTheDocument());

src/modules/Auth/features/SignUp/SignUpForm/SignUpForm.tsx

@@ -68,9 +68,17 @@ export const SignUpForm = () => {
 
  return (
  <StyledForm onSubmit={handleSubmit(onSubmit)} noValidate>
- <StyledSignUpHeader color={variables.palette.on_surface}>{t('createAccount')}</StyledSignUpHeader>
+ <StyledSignUpHeader color={variables.palette.on_surface}>
+ {t('createAccount')}
+ </StyledSignUpHeader>
  <StyledController>
- <InputController fullWidth name="email" control={control} label={t('email')} data-testid="signup-form-email" />
+ <InputController
+ fullWidth
+ name="email"
+ control={control}
+ label={t('email')}
+ data-testid="signup-form-email"
+ />
  </StyledController>
  <StyledController>
  <InputController
@@ -117,7 +125,12 @@ export const SignUpForm = () => {
  data-testid="signup-form-terms"
  />
  </StyledController>
- <StyledButton variant="contained" type="submit" disabled={!termsOfService} data-testid="signup-form-signup">
+ <StyledButton
+ variant="contained"
+ type="submit"
+ disabled={!termsOfService}
+ data-testid="signup-form-signup"
+ >
  {t('createAccount')}
  </StyledButton>
  <StyledBackWrapper>

src/modules/Auth/state/Auth.reducer.ts

@@ -4,7 +4,11 @@ import { ApiErrorReturn } from 'shared/state/Base';
 
 import { AuthSchema } from './Auth.schema';
 import { signIn, getUserDetails } from './Auth.thunk';
-import { createAuthFulfilledData, createAuthPendingData, createAuthRejectedData } from './Auth.utils';
+import {
+ createAuthFulfilledData,
+ createAuthPendingData,
+ createAuthRejectedData,
+} from './Auth.utils';
 import { state as initialState } from './Auth.state';
 
 export const reducers = {

src/modules/Auth/state/Auth.thunk.ts

@@ -5,7 +5,15 @@ import { authStorage } from 'shared/utils/authStorage';
 import { Mixpanel } from 'shared/utils/mixpanel';
 import { getApiErrorResult, getErrorMessage } from 'shared/utils/errors';
 import { ApiErrorResponse } from 'shared/state/Base';
-import { signInApi, SignIn, getUserDetailsApi, signUpApi, SignUpArgs, resetPasswordApi, ResetPassword } from 'api';
+import {
+ signInApi,
+ SignIn,
+ getUserDetailsApi,
+ signUpApi,
+ SignUpArgs,
+ resetPasswordApi,
+ ResetPassword,
+} from 'api';
 
 export const signIn = createAsyncThunk(
  'auth/login',
@@ -30,17 +38,20 @@ export const signIn = createAsyncThunk(
  },
 );
 
-export const getUserDetails = createAsyncThunk('auth/getUserData', async (_: void, { rejectWithValue, signal }) => {
- try {
- const { data } = await getUserDetailsApi(signal);
+export const getUserDetails = createAsyncThunk(
+ 'auth/getUserData',
+ async (_: void, { rejectWithValue, signal }) => {
+ try {
+ const { data } = await getUserDetailsApi(signal);
 
- return { data };
- } catch (exception) {
- const errorResult = getApiErrorResult(exception as AxiosError<ApiErrorResponse>);
+  return { data };
+  } catch (exception) {
+  const errorResult = getApiErrorResult(exception as AxiosError<ApiErrorResponse>);
 
- return rejectWithValue(errorResult);
- }
-});
+ return rejectWithValue(errorResult);
+ }
+ },
+);
 
 export const signUp = createAsyncThunk(
  'auth/signup',

src/modules/Auth/state/Auth.utils.ts

@@ -12,7 +12,11 @@ export const createAuthPendingData = (authentication: Draft<BaseSchema>, request
  }
 };
 
-export const createAuthFulfilledData = (state: Draft<AuthSchema>, requestId: string, data: AuthData) => {
+export const createAuthFulfilledData = (
+ state: Draft<AuthSchema>,
+ requestId: string,
+ data: AuthData,
+) => {
  const { authentication } = state;
  if (authentication.status === 'loading' && authentication.requestId === requestId) {
  authentication.requestId = initialState.authentication.requestId;
@@ -23,7 +27,11 @@ export const createAuthFulfilledData = (state: Draft<AuthSchema>, requestId: str
  }
 };
 
-export const createAuthRejectedData = (state: Draft<AuthSchema>, requestId: string, error: ApiErrorReturn) => {
+export const createAuthRejectedData = (
+ state: Draft<AuthSchema>,
+ requestId: string,
+ error: ApiErrorReturn,
+) => {
  const { authentication } = state;
  if (authentication.status === 'loading' && authentication.requestId === requestId) {
  authentication.requestId = initialState.authentication.requestId;

src/modules/Auth/state/index.ts

@@ -28,7 +28,8 @@ export const auth = {
  },
  }) => status,
  ),
- useAuthorized: (): AuthSchema['isAuthorized'] => useAppSelector(({ auth: { isAuthorized } }) => isAuthorized),
+ useAuthorized: (): AuthSchema['isAuthorized'] =>
+ useAppSelector(({ auth: { isAuthorized } }) => isAuthorized),
  useData: (): AuthSchema['authentication']['data'] =>
  useAppSelector(
  ({
@@ -43,7 +44,13 @@ export const auth = {
  auth: {
  authentication: { data },
  },
- }) => (data ? `${data.user.firstName.substring(0, 1)}${data.user.lastName.substring(0, 1)}`.toUpperCase() : ''),
+ }) =>
+ data
+ ? `${data.user.firstName.substring(0, 1)}${data.user.lastName.substring(
+ 0,
+ 1,
+ )}`.toUpperCase()
+ : '',
  ),
  useLogoutInProgress: (): AuthSchema['isLogoutInProgress'] =>
  useAppSelector(({ auth: { isLogoutInProgress } }) => isLogoutInProgress),