Sync main with develop

projects/SlackClone/.gitignore

@@ -20,6 +20,7 @@ DerivedData
 *.hmap
 *.ipa
 *.xcuserstate
+ios/.xcode.env.local
 
 # Android/IntelliJ
 #
@@ -29,6 +30,7 @@ build/
 local.properties
 *.iml
 *.hprof
+.cxx/
 
 # node.js
 #
@@ -49,9 +51,10 @@ buck-out/
 # For more information about the recommended setup visit:
 # https://docs.fastlane.tools/best-practices/source-control/
 
-/fastlane/report.xml
-/fastlane/Preview.html
-/fastlane/screenshots
+**/fastlane/report.xml
+**/fastlane/Preview.html
+**/fastlane/screenshots
+**/fastlane/test_output
 /dist
 
 # Bundle artifact

projects/SlackClone/.node-version

@@ -0,0 +1 @@
+16

projects/SlackClone/.prettierrc.js

@@ -1,7 +1,7 @@
 module.exports = {
+  arrowParens: 'avoid',
+  bracketSameLine: true,
   bracketSpacing: false,
-  jsxBracketSameLine: true,
   singleQuote: true,
   trailingComma: 'all',
-  arrowParens: 'avoid',
 };

projects/SlackClone/App.js

@@ -1,43 +1,43 @@
-import {USER_ID, USER_TOKEN} from 'react-native-dotenv';
-import {BottomSheetModalProvider} from '@gorhom/bottom-sheet';
-import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
-import {NavigationContainer} from '@react-navigation/native';
-import {createStackNavigator} from '@react-navigation/stack';
-import React, {useEffect, useState} from 'react';
+import { USER_ID, USER_TOKEN } from 'react-native-dotenv';
+import { BottomSheetModalProvider } from '@gorhom/bottom-sheet';
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import { NavigationContainer } from '@react-navigation/native';
+import { createStackNavigator } from '@react-navigation/stack';
+import React, { useEffect, useState } from 'react';
 import {
   ActivityIndicator,
   Alert,
   LogBox,
   SafeAreaView,
   StyleSheet,
   View,
+  useColorScheme,
 } from 'react-native';
-import {AppearanceProvider, useColorScheme} from 'react-native-appearance';
 import {
   SafeAreaProvider,
   useSafeAreaInsets,
 } from 'react-native-safe-area-context';
-import {Chat, OverlayProvider} from 'stream-chat-react-native';
+import { Chat, OverlayProvider } from 'stream-chat-react-native';
 
-import {DarkTheme, LightTheme} from './src/appTheme';
-import {BottomTabs} from './src/components/BottomTabs';
-import {SlackAppContext} from './src/contexts/SlackAppContext';
+import { DarkTheme, LightTheme } from './src/appTheme';
+import { BottomTabs } from './src/components/BottomTabs';
+import { SlackAppContext } from './src/contexts/SlackAppContext';
 import useStreamChatTheme from './src/hooks/useStreamChatTheme';
-import {ChannelListScreen} from './src/screens/ChannelListScreen/ChannelListScreen';
-import {ChannelScreen} from './src/screens/ChannelScreen/ChannelScreen';
-import {ChannelSearchScreen} from './src/screens/ChannelSearchScreen/ChannelSearchScreen';
-import {JumpToSearchScreen} from './src/screens/ChannelSearchScreen/JumpToSearchScreen';
-import {DirectMessagesScreen} from './src/screens/DirectMessagesScreen';
-import {DraftsScreen} from './src/screens/DraftsScreen';
-import {MentionsScreen} from './src/screens/MentionsScreen/MentionsScreen';
-import {MessageSearchScreen} from './src/screens/MessageSearchScreen/MessageSearchScreen';
-import {NewMessageScreen} from './src/screens/NewMessageScreen/NewMessageScreen';
-import {ProfileScreen} from './src/screens/ProfileScreen';
-import {ShareMessageScreen} from './src/screens/ShareMessageScreen/ShareMessageScreen';
-import {ThreadScreen} from './src/screens/ThreadScreen';
-import {UserPickerModal} from './src/screens/UserPickerModal/UserPickerModal';
-import {HEADER_HEIGHT} from './src/utils';
-import {ChatClientStore} from './src/utils/ChatClientStore';
+import { ChannelListScreen } from './src/screens/ChannelListScreen/ChannelListScreen';
+import { ChannelScreen } from './src/screens/ChannelScreen/ChannelScreen';
+import { ChannelSearchScreen } from './src/screens/ChannelSearchScreen/ChannelSearchScreen';
+import { JumpToSearchScreen } from './src/screens/ChannelSearchScreen/JumpToSearchScreen';
+import { DirectMessagesScreen } from './src/screens/DirectMessagesScreen';
+import { DraftsScreen } from './src/screens/DraftsScreen';
+import { MentionsScreen } from './src/screens/MentionsScreen/MentionsScreen';
+import { MessageSearchScreen } from './src/screens/MessageSearchScreen/MessageSearchScreen';
+import { NewMessageScreen } from './src/screens/NewMessageScreen/NewMessageScreen';
+import { ProfileScreen } from './src/screens/ProfileScreen';
+import { ShareMessageScreen } from './src/screens/ShareMessageScreen/ShareMessageScreen';
+import { ThreadScreen } from './src/screens/ThreadScreen';
+import { UserPickerModal } from './src/screens/UserPickerModal/UserPickerModal';
+import { HEADER_HEIGHT } from './src/utils';
+import { ChatClientStore } from './src/utils/ChatClientStore';
 
 LogBox.ignoreAllLogs();
 const Tab = createBottomTabNavigator();
@@ -97,49 +97,47 @@ export default () => {
     return (
       <SafeAreaView>
         <View style={styles.loadingContainer}>
-          <ActivityIndicator color="black" size="small" />
+          <ActivityIndicator color='black' size='small' />
         </View>
       </SafeAreaView>
     );
   }
 
   return (
     <SafeAreaProvider>
-      <AppearanceProvider>
-        <NavigationContainer theme={scheme === 'dark' ? DarkTheme : LightTheme}>
-          <View style={styles.container}>
-            <SlackAppContext.Provider
-              value={{
-                activeChannel,
-                activeMessage,
-                openUserPicker,
-                setActiveChannel,
-                setActiveMessage,
-                switchUser: userId => {
-                  /**
-                   * Dev token generations will only work in case of development mode.
-                   * So please make sure you have auth check disabled, if you are planning to
-                   * check user picker feature.
-                   */
-                  const token = chatClient.devToken(userId);
-                  setCurrentUser({
-                    id: userId,
-                    token,
-                  }),
-                    setUserPickerVisible(false);
-                },
-              }}>
-              <RootNavigation />
-              <UserPickerModal
-                label={'name'}
-                modalVisible={userPickerVisible}
-                onRequestClose={closeUserPicker}
-                onValueChange={closeUserPicker}
-              />
-            </SlackAppContext.Provider>
-          </View>
-        </NavigationContainer>
-      </AppearanceProvider>
+      <NavigationContainer theme={scheme === 'dark' ? DarkTheme : LightTheme}>
+        <View style={styles.container}>
+          <SlackAppContext.Provider
+            value={{
+              activeChannel,
+              activeMessage,
+              openUserPicker,
+              setActiveChannel,
+              setActiveMessage,
+              switchUser: (userId) => {
+                /**
+                 * Dev token generations will only work in case of development mode.
+                 * So please make sure you have auth check disabled, if you are planning to
+                 * check user picker feature.
+                 */
+                const token = chatClient.devToken(userId);
+                setCurrentUser({
+                  id: userId,
+                  token,
+                }),
+                  setUserPickerVisible(false);
+              },
+            }}>
+            <RootNavigation />
+            <UserPickerModal
+              label={'name'}
+              modalVisible={userPickerVisible}
+              onRequestClose={closeUserPicker}
+              onValueChange={closeUserPicker}
+            />
+          </SlackAppContext.Provider>
+        </View>
+      </NavigationContainer>
     </SafeAreaProvider>
   );
 };
@@ -148,56 +146,56 @@ const ModalStackNavigator = () => (
   <ModalStack.Navigator>
     <ModalStack.Screen
       component={ChannelSearchScreen}
-      name="ChannelSearchScreen"
-      options={{headerShown: false}}
+      name='ChannelSearchScreen'
+      options={{ headerShown: false }}
     />
     <ModalStack.Screen
       component={JumpToSearchScreen}
-      name="JumpToSearchScreen"
-      options={{headerShown: false}}
+      name='JumpToSearchScreen'
+      options={{ headerShown: false }}
     />
     <ModalStack.Screen
       component={NewMessageScreen}
-      name="NewMessageScreen"
-      options={{headerShown: false}}
+      name='NewMessageScreen'
+      options={{ headerShown: false }}
     />
     <ModalStack.Screen
       component={ShareMessageScreen}
-      name="ShareMessageScreen"
-      options={{headerShown: false}}
+      name='ShareMessageScreen'
+      options={{ headerShown: false }}
     />
   </ModalStack.Navigator>
 );
 
 const HomeStackNavigator = () => (
-  <HomeStack.Navigator initialRouteName="ChannelListScreen">
+  <HomeStack.Navigator initialRouteName='ChannelListScreen'>
     <HomeStack.Screen
       component={ChannelListScreen}
-      name="ChannelListScreen"
-      options={{headerShown: false}}
+      name='ChannelListScreen'
+      options={{ headerShown: false }}
     />
     <HomeStack.Screen
       component={ChannelScreen}
-      name="ChannelScreen"
-      options={{headerShown: false}}
+      name='ChannelScreen'
+      options={{ headerShown: false }}
     />
     <HomeStack.Screen
       component={DraftsScreen}
-      name="DraftsScreen"
-      options={{headerShown: false}}
+      name='DraftsScreen'
+      options={{ headerShown: false }}
     />
     <HomeStack.Screen
       component={ThreadScreen}
-      name="ThreadScreen"
-      options={{headerShown: false}}
+      name='ThreadScreen'
+      options={{ headerShown: false }}
     />
   </HomeStack.Navigator>
 );
 
 const TabNavigation = () => (
   <BottomSheetModalProvider>
-    <Tab.Navigator tabBar={props => <BottomTabs {...props} />}>
-      <Tab.Screen component={HomeStackNavigator} name="home" />
+    <Tab.Navigator tabBar={(props) => <BottomTabs {...props} />}>
+      <Tab.Screen component={HomeStackNavigator} name='home' />
       <Tab.Screen component={DirectMessagesScreen} name={'dms'} />
       <Tab.Screen component={MentionsScreen} name={'mentions'} />
       <Tab.Screen component={MessageSearchScreen} name={'search'} />
@@ -208,21 +206,21 @@ const TabNavigation = () => (
 
 const RootNavigation = () => {
   const chatStyles = useStreamChatTheme();
-  const {bottom, top} = useSafeAreaInsets();
+  const { bottom, top } = useSafeAreaInsets();
 
   return (
     <OverlayProvider bottomInset={bottom + HEADER_HEIGHT} topInset={top}>
       <Chat client={ChatClientStore.client} style={chatStyles}>
-        <RootStack.Navigator mode="modal">
+        <RootStack.Navigator mode='modal'>
           <RootStack.Screen
             component={TabNavigation}
-            name="Tabs"
-            options={{headerShown: false}}
+            name='Tabs'
+            options={{ headerShown: false }}
           />
           <RootStack.Screen
             component={ModalStackNavigator}
             name={'Modals'}
-            options={{headerShown: false}}
+            options={{ headerShown: false }}
           />
         </RootStack.Navigator>
       </Chat>
@@ -231,7 +229,7 @@ const RootNavigation = () => {
 };
 
 const styles = StyleSheet.create({
-  channelScreenContainer: {flexDirection: 'column', height: '100%'},
+  channelScreenContainer: { flexDirection: 'column', height: '100%' },
   channelScreenSaveAreaView: {
     backgroundColor: 'white',
   },