Merge pull request #677 from ChildMindInstitute/qa

Sync with qa [dev -> qa -> uat]

src/app/ui/AppProvider/ReduxProvider.tsx

@@ -24,10 +24,6 @@ export const persistConfig = {
 };
 
 const rootReducer = (state: any, action: AnyAction) => {
- if (action.type === 'identity/onLogout') {
- state = undefined;
- }
-
  const reducer = combineReducers({
  identity: IdentityModel.reducer,
  applets: AppletModel.reducer,

src/entities/identity/model/slice.ts

@@ -22,9 +22,6 @@ const identitySlice = createSlice({
  onAuthSuccess: (state, action: PayloadAction<User>) => {
  state.user = action.payload;
  },
- onLogout: state => {
- state.user = null;
- },
  },
 });
 

src/features/login/model/cleanupData.ts

@@ -0,0 +1,18 @@
+import { Logger } from '@shared/lib';
+
+import { clearEntityRecordStorages, clearUploadQueueStorage } from '../lib';
+
+export async function cleanupData() {
+ Logger.info('[cleanupData] Processing cleanup upon another user login');
+
+ try {
+ await clearEntityRecordStorages();
+ clearUploadQueueStorage();
+
+ Logger.info('[cleanupData] Cleanup operation completed successfully');
+ } catch (error) {
+ Logger.error(
+ `[cleanupData] Processing cleanup failed with error: ${error}`,
+ );
+ }
+}

src/features/login/ui/LoginForm.tsx

@@ -15,13 +15,15 @@ import {
  MixEvents,
  useAppDispatch,
  useAppForm,
+ useAppSelector,
  useFormChanges,
 } from '@shared/lib';
 import { encryption } from '@shared/lib';
 import { YStack, Box, BoxProps, SubmitButton, Center, Link } from '@shared/ui';
 import { ErrorMessage, InputField } from '@shared/ui/form';
 
 import { LoginFormSchema } from '../model';
+import { cleanupData } from '../model/cleanupData';
 
 type Props = {
  onLoginSuccess: () => void;
@@ -32,6 +34,7 @@ const LoginForm: FC<Props> = props => {
  const { navigate } = useNavigation();
 
  const dispatch = useAppDispatch();
+ const userId = useAppSelector(IdentityModel.selectors.selectUserId);
 
  const navigateToForgotPassword = () => {
  navigate('ForgotPassword');
@@ -43,12 +46,17 @@ const LoginForm: FC<Props> = props => {
  isLoading,
  reset,
  } = useLoginMutation({
- onSuccess: (response, variables) => {
+ onSuccess: async (response, variables) => {
  const userParams = {
  userId: response.data.result.user.id,
  email: response.data.result.user.email,
  password: variables.password,
  };
+
+ if (userParams.userId !== userId) {
+ await cleanupData();
+ }
+
  const userPrivateKey = encryption.getPrivateKey(userParams);
 
  UserPrivateKeyRecord.set(userPrivateKey);

src/features/logout/model/hooks.ts

@@ -6,22 +6,17 @@ import { onBeforeLogout } from '@app/entities/identity/lib/alerts';
 import { NotificationModel } from '@app/entities/notification';
 import { IdentityService } from '@app/shared/api';
 import { SystemRecord } from '@app/shared/lib/records';
-import { IdentityModel } from '@entities/identity';
 import { UserInfoRecord, UserPrivateKeyRecord } from '@entities/identity/lib';
 import { SessionModel } from '@entities/session';
 import {
  Logger,
  hasPendingMutations,
  isAppOnline,
- useAppDispatch,
  AnalyticsService,
  useTCPSocket,
 } from '@shared/lib';
 
-import { clearEntityRecordStorages, clearUploadQueueStorage } from '../lib';
-
 export function useLogout() {
- const dispatch = useAppDispatch();
  const queryClient = useQueryClient();
  const { closeConnection: closeActiveTCPConnection } = useTCPSocket();
 
@@ -42,14 +37,8 @@ export function useLogout() {
 
  AnalyticsService.logout();
 
- dispatch(IdentityModel.actions.onLogout());
-
  CacheManager.clearCache();
 
- clearEntityRecordStorages();
-
- clearUploadQueueStorage();
-
  NotificationModel.NotificationManager.clearScheduledNotifications();
 
  UserInfoRecord.clear();

src/features/logout/ui/LogoutRowButton.tsx

@@ -6,13 +6,22 @@ import { RowButton, KeyIcon } from '@shared/ui';
 
 import { useLogout } from '../model';
 
-const LogoutRowButton: FC = () => {
+type Props = {
+ onPress: () => void;
+};
+
+const LogoutRowButton: FC<Props> = ({ onPress }) => {
  const { t } = useTranslation();
  const { logout } = useLogout();
 
+ function performLogout() {
+ logout();
+ onPress();
+ }
+
  return (
  <RowButton
- onPress={logout}
+ onPress={performLogout}
  accessibilityLabel="logout-button"
  title={t('settings:logout')}
  rightIcon={KeyIcon}

src/screens/ui/SettingsScreen.tsx

@@ -1,8 +1,9 @@
-import { FC, useMemo } from 'react';
+import { FC, useMemo, useState } from 'react';
 import { StatusBar } from 'react-native';
 
 import { useNavigation } from '@react-navigation/native';
 import { useTranslation } from 'react-i18next';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
 import { UploadRetryBanner } from '@app/entities/activity';
 import { IdentityModel } from '@app/entities/identity';
@@ -13,12 +14,24 @@ import {
  getStringHashCode,
  useAppSelector,
 } from '@shared/lib';
-import { YStack, Box, RowButton, UserIcon, Text } from '@shared/ui';
+import {
+ YStack,
+ Box,
+ RowButton,
+ UserIcon,
+ Text,
+ Center,
+ ActivityIndicator,
+} from '@shared/ui';
 
 const SettingsScreen: FC = () => {
- const { navigate } = useNavigation();
+ const { navigate, setOptions } = useNavigation();
  const { t } = useTranslation();
 
+ const [isLoading, setIsLoading] = useState(false);
+
+ const { top } = useSafeAreaInsets();
+
  const userName = useAppSelector(IdentityModel.selectors.selectFirstName);
  const userEmail = useAppSelector(IdentityModel.selectors.selectEmail);
 
@@ -43,45 +56,68 @@ const SettingsScreen: FC = () => {
  return hashed;
  }, []);
 
+ function setLoading() {
+ setIsLoading(true);
+ setOptions({
+ headerShown: false,
+ });
+ }
+
  return (
- <Box flex={1} bg="$secondary">
- <StatusBar />
- <UploadRetryBanner />
-
- <Box flex={1} px="$2" jc="flex-start">
- <YStack>
- <YStack space="$2" my="$4" ai="center">
- <UserIcon color={colors.darkGrey} size={45} />
- <Text accessibilityLabel="account_name">{userName}</Text>
- <Text accessibilityLabel="account_email">{userEmail}</Text>
-
- <Text accessibilityLabel="account_device_id">{`${t(
- 'about:device_id',
- )}: ${hashedDeviceId}`}</Text>
+ <>
+ <Box flex={1} bg="$secondary">
+ <StatusBar />
+ <UploadRetryBanner />
+
+ <Box flex={1} px="$2" jc="flex-start" mt={isLoading ? top : 0}>
+ <YStack>
+ <YStack space="$2" my="$4" ai="center">
+ <UserIcon color={colors.darkGrey} size={45} />
+ <Text accessibilityLabel="account_name">{userName}</Text>
+ <Text accessibilityLabel="account_email">{userEmail}</Text>
+
+ <Text accessibilityLabel="account_device_id">{`${t(
+ 'about:device_id',
+ )}: ${hashedDeviceId}`}</Text>
+ </YStack>
+
+ <RowButton
+ onPress={navigateToChangePasswordScreen}
+ accessibilityLabel="change_password-button"
+ title={t('settings:change_pass')}
+ />
+
+ <RowButton
+ onPress={navigateToAppLanguage}
+ accessibilityLabel="change_language-button"
+ title={t('language_screen:change_app_language')}
+ />
+
+ <RowButton
+ onPress={navigateToAppLogs}
+ accessibilityLabel="upload_logs-button"
+ title={t('settings:upload_logs')}
+ />
+
+ <LogoutRowButton onPress={setLoading} />
  </YStack>
+ </Box>
+ </Box>
 
- <RowButton
- onPress={navigateToChangePasswordScreen}
- accessibilityLabel="change_password-button"
- title={t('settings:change_pass')}
- />
-
- <RowButton
- onPress={navigateToAppLanguage}
- accessibilityLabel="change_language-button"
- title={t('language_screen:change_app_language')}
- />
-
- <RowButton
- onPress={navigateToAppLogs}
- accessibilityLabel="upload_logs-button"
- title={t('settings:upload_logs')}
+ {isLoading && (
+ <Center w="100%" h="100%" position="absolute">
+ <Box
+ w="100%"
+ h="100%"
+ bg="$white"
+ position="absolute"
+ opacity={0.7}
  />
 
- <LogoutRowButton />
- </YStack>
- </Box>
- </Box>
+ <ActivityIndicator size="large" color="#0067A0" />
+ </Center>
+ )}
+ </>
  );
 };
 

src/shared/ui/RowButton.tsx

@@ -9,6 +9,10 @@ type Props = {
  rightIcon?: ElementType;
 } & BoxProps;
 
+const pressStyle = {
+ opacity: 0.5,
+};
+
 const RowButton: FC<Props> = props => {
  const {
  onPress,
@@ -27,6 +31,7 @@ const RowButton: FC<Props> = props => {
  ai="center"
  bbc="$lightGrey"
  bbw={1}
+ pressStyle={pressStyle}
  {...boxProps}
  >
  <Text>{title}</Text>

src/shared/ui/SketchCanvas/DrawingGesture.ts

@@ -58,7 +58,7 @@ function DrawingGesture(
  };
  };
 
- const androidGesture = () =>
+ const androidPanGesture = () =>
  Gesture.Pan()
  .manualActivation(true)
  .onTouchesDown((event, stateManager) => {
@@ -79,7 +79,7 @@ function DrawingGesture(
  currentTouchIdRef.value = null;
  }
  })
- .onBegin(event => {
+ .onStart(event => {
  runOnJS(onTouchStart)(event, Date.now());
  })
  .onTouchesMove((event, manager) => {
@@ -96,14 +96,14 @@ function DrawingGesture(
  runOnJS(onTouchProgress)(touchData, false, time);
  }
  })
- .onFinalize(() => {
+ .onEnd(() => {
  runOnJS(onTouchEnd)();
  });
 
- const iosGesture = () =>
+ const iosPanGesture = () =>
  Gesture.Pan()
  .maxPointers(1)
- .onBegin(event => {
+ .onStart(event => {
  const time = Date.now();
 
  runOnJS(onTouchStart)(event, time);
@@ -131,6 +131,30 @@ function DrawingGesture(
  runOnJS(onTouchEnd)();
  });
 
+ const tapGesture = () =>
+ Gesture.Tap()
+ .onStart(event => {
+ runOnJS(onTouchStart)(event, Date.now());
+ })
+ .onEnd(() => {
+ runOnJS(onTouchEnd)();
+ });
+
+ const longTapGesture = () =>
+ Gesture.LongPress()
+ .onStart(event => {
+ runOnJS(onTouchStart)(event, Date.now());
+ })
+ .onEnd(() => {
+ runOnJS(onTouchEnd)();
+ });
+
+ const iosGesture = () =>
+ Gesture.Exclusive(iosPanGesture(), tapGesture(), longTapGesture());
+
+ const androidGesture = () =>
+ Gesture.Exclusive(androidPanGesture(), tapGesture(), longTapGesture());
+
  const gesture = IS_IOS ? iosGesture() : androidGesture();
 
  return gesture;