diff --git a/src/components/accountsBottomSheet/container/accountsBottomSheetContainer.js b/src/components/accountsBottomSheet/container/accountsBottomSheetContainer.js
index 5d2f872c2..010566cea 100644
--- a/src/components/accountsBottomSheet/container/accountsBottomSheetContainer.js
+++ b/src/components/accountsBottomSheet/container/accountsBottomSheetContainer.js
@@ -1,16 +1,26 @@
 import React, { useEffect, useRef } from 'react';
-import { View } from 'react-native';
-import { useSelector } from 'react-redux';
+import { useSelector, useDispatch } from 'react-redux';
+
+import { navigate } from '../../../navigation/service';
+
+import { updateCurrentAccount } from '../../../redux/actions/accountAction';
+import { isRenderRequired } from '../../../redux/actions/applicationActions';
+
+import { getUserDataWithUsername } from '../../../realm/realm';
+import { switchAccount } from '../../../providers/hive/auth';
 
 import { AccountContainer } from '../../../containers';
 import AccountsBottomSheet from '../view/accountsBottomSheetView';
 
 const AccountsBottomSheetContainer = ({ navigation }) => {
+  const dispatch = useDispatch();
   const accountsBottomSheetRef = useRef();
 
   const isVisibleAccountsBottomSheet = useSelector(
     (state) => state.ui.isVisibleAccountsBottomSheet,
   );
+  const currentAccount = useSelector((state) => state.account.currentAccount);
+  const accounts = useSelector((state) => state.account.otherAccounts);
 
   useEffect(() => {
     if (isVisibleAccountsBottomSheet) {
@@ -18,23 +28,60 @@ const AccountsBottomSheetContainer = ({ navigation }) => {
     }
   }, [isVisibleAccountsBottomSheet]);
 
-  const _navigateToRoute = (route = null) => {
-    if (route) {
-      //navigation.navigate(route);
+  const _navigateToRoute = (routeName = null) => {
+    if (routeName) {
+      accountsBottomSheetRef.current?.closeAccountsBottomSheet();
+      navigate({ routeName });
     }
   };
 
+  const _switchAccount = async (switchingAccount = {}) => {
+    accountsBottomSheetRef.current?.closeAccountsBottomSheet();
+
+    //TODO: Remove setTimeout
+    const timeout = setTimeout(async () => {
+      if (switchingAccount.username !== currentAccount.name) {
+        const accountData = accounts.filter(
+          (account) => account.username === switchingAccount.username,
+        )[0];
+
+        // control user persist whole data or just username
+        if (accountData.name) {
+          accountData.username = accountData.name;
+
+          dispatch(updateCurrentAccount(accountData));
+          dispatch(isRenderRequired(true));
+
+          const upToDateCurrentAccount = await switchAccount(accountData.name);
+          const realmData = await getUserDataWithUsername(accountData.name);
+
+          upToDateCurrentAccount.username = upToDateCurrentAccount.name;
+          upToDateCurrentAccount.local = realmData[0];
+
+          dispatch(updateCurrentAccount(upToDateCurrentAccount));
+        } else {
+          const _currentAccount = await switchAccount(accountData.username);
+          const realmData = await getUserDataWithUsername(accountData.username);
+
+          _currentAccount.username = _currentAccount.name;
+          _currentAccount.local = realmData[0];
+
+          dispatch(updateCurrentAccount(_currentAccount));
+          dispatch(isRenderRequired(true));
+        }
+      }
+    }, 750);
+    clearTimeout(timeout);
+  };
+
   return (
-    <AccountContainer>
-      {({ accounts, currentAccount, isLoggedIn, isLoginDone, username }) => (
-        <AccountsBottomSheet
-          ref={accountsBottomSheetRef}
-          accounts={accounts}
-          currentAccount={currentAccount}
-          navigateToRoute={_navigateToRoute}
-        />
-      )}
-    </AccountContainer>
+    <AccountsBottomSheet
+      ref={accountsBottomSheetRef}
+      accounts={accounts}
+      currentAccount={currentAccount}
+      navigateToRoute={_navigateToRoute}
+      switchAccount={_switchAccount}
+    />
   );
 };
 
diff --git a/src/components/accountsBottomSheet/view/accountsBottomSheetView.js b/src/components/accountsBottomSheet/view/accountsBottomSheetView.js
index 3d7e01f97..68d9752aa 100644
--- a/src/components/accountsBottomSheet/view/accountsBottomSheetView.js
+++ b/src/components/accountsBottomSheet/view/accountsBottomSheetView.js
@@ -16,108 +16,94 @@ import { UserAvatar, Icon, TextButton, Separator } from '../../index';
 import { default as ROUTES } from '../../../constants/routeNames';
 
 import styles from './accountsBottomSheetStyles';
+import { switchAccount } from '../../../providers/hive/auth';
 
-const data = [
-  {
-    name: 'example',
-    username: 'furkankilic',
-    isCurrentAccount: true,
-  },
-  {
-    name: 'example',
-    username: 'furkankilic',
-  },
-  {
-    name: 'example',
-    username: 'furkankilic',
-  },
-  {
-    name: 'example',
-    username: 'furkankilic',
-  },
-];
+const AccountsBottomSheet = forwardRef(
+  ({ accounts, currentAccount, navigateToRoute, switchAccount }, ref) => {
+    const dispatch = useDispatch();
+    const bottomSheetModalRef = useRef();
+    const insets = useSafeAreaInsets();
+    const intl = useIntl();
 
-const AccountsBottomSheet = forwardRef(({ accounts, currentAccount, navigateToRoute }, ref) => {
-  const dispatch = useDispatch();
-  const bottomSheetModalRef = useRef();
-  const insets = useSafeAreaInsets();
-  const intl = useIntl();
+    const snapPoints = useMemo(() => [accounts.length <= 4 ? accounts.length * 60 + 150 : 405], []);
 
-  const snapPoints = useMemo(() => [data.length <= 4 ? data.length * 60 + 150 : 405], []);
+    useImperativeHandle(ref, () => ({
+      showAccountsBottomSheet() {
+        bottomSheetModalRef.current?.present();
+      },
+      closeAccountsBottomSheet() {
+        bottomSheetModalRef.current?.dismiss();
+      },
+    }));
 
-  useImperativeHandle(ref, () => ({
-    showAccountsBottomSheet() {
-      bottomSheetModalRef.current?.present();
-    },
-  }));
+    const _handleDismissBottomSheet = () => {
+      bottomSheetModalRef.current?.dismiss();
+      dispatch(toggleAccountsBottomSheet());
+    };
 
-  const _handleDismissBottomSheet = () => {
-    bottomSheetModalRef.current?.dismiss();
-    dispatch(toggleAccountsBottomSheet());
-  };
-
-  //_handlePressAccountTile(item)
-  const _renderAccountTile = (item) => (
-    <TouchableOpacity style={styles.accountTile} onPress={() => {}}>
-      <View style={styles.avatarAndNameContainer}>
-        <UserAvatar username={item.username} />
-        <View style={styles.nameContainer}>
-          {item.displayName && <Text style={styles.displayName}>{item.displayName}</Text>}
-          <Text style={styles.name}>{item.name}</Text>
+    //_handlePressAccountTile(item)
+    const _renderAccountTile = (item) => (
+      <TouchableOpacity style={styles.accountTile} onPress={() => switchAccount(item)}>
+        <View style={styles.avatarAndNameContainer}>
+          <UserAvatar username={item.username} />
+          <View style={styles.nameContainer}>
+            {item.displayName && <Text style={styles.displayName}>{item.displayName}</Text>}
+            <Text style={styles.name}>{`@${item.name}`}</Text>
+          </View>
         </View>
-      </View>
-      {item.isCurrentAccount && (
-        <Icon iconType="AntDesign" name="checkcircle" style={styles.checkIcon} size={24} />
-      )}
-    </TouchableOpacity>
-  );
-
-  return (
-    <BottomSheetModalProvider>
-      <BottomSheetModal
-        backdropComponent={() => (
-          <TouchableOpacity
-            style={styles.backdrop}
-            activeOpacity={1}
-            onPress={bottomSheetModalRef.current?.dismiss}
-            // when call the onPress, it calls onDismiss.
-          />
+        {currentAccount.name === item.name && (
+          <Icon iconType="AntDesign" name="checkcircle" style={styles.checkIcon} size={24} />
         )}
-        ref={bottomSheetModalRef}
-        index={0}
-        snapPoints={snapPoints}
-        onDismiss={_handleDismissBottomSheet}
-        shouldMeasureContentHeight={true}
-      >
-        <BottomSheetFlatList
-          data={data}
-          scrollEnabled
-          keyExtractor={(item) => item.name}
-          renderItem={({ item }) => _renderAccountTile(item)}
-          //contentContainerStyle={styles.contentContainer}
-        />
-        <Separator style={styles.separator} />
-        <View style={{ paddingBottom: insets.bottom }}>
-          <View style={styles.buttonContainer}>
-            <TextButton
-              text={intl.formatMessage({ id: 'side_menu.create_a_new_account' })}
-              textStyle={styles.textButton}
-              onPress={() => navigateToRoute(ROUTES.SCREENS.REGISTER)}
+      </TouchableOpacity>
+    );
+
+    return (
+      <BottomSheetModalProvider>
+        <BottomSheetModal
+          backdropComponent={() => (
+            <TouchableOpacity
+              style={styles.backdrop}
+              activeOpacity={1}
+              onPress={bottomSheetModalRef.current?.dismiss}
+              // when call the onPress, it calls onDismiss.
             />
-          </View>
+          )}
+          ref={bottomSheetModalRef}
+          index={0}
+          snapPoints={snapPoints}
+          onDismiss={_handleDismissBottomSheet}
+          shouldMeasureContentHeight={true}
+        >
+          <BottomSheetFlatList
+            data={accounts}
+            scrollEnabled
+            keyExtractor={(item) => item.name}
+            renderItem={({ item }) => _renderAccountTile(item)}
+            //contentContainerStyle={styles.contentContainer}
+          />
           <Separator style={styles.separator} />
-          <View style={styles.buttonContainer}>
-            <TextButton
-              text={intl.formatMessage({ id: 'side_menu.add_an_existing_account' })}
-              textStyle={styles.textButton}
-              onPress={() => navigateToRoute(ROUTES.SCREENS.LOGIN)}
-            />
+          <View style={{ paddingBottom: insets.bottom }}>
+            <View style={styles.buttonContainer}>
+              <TextButton
+                text={intl.formatMessage({ id: 'side_menu.create_a_new_account' })}
+                textStyle={styles.textButton}
+                onPress={() => navigateToRoute(ROUTES.SCREENS.REGISTER)}
+              />
+            </View>
+            <Separator style={styles.separator} />
+            <View style={styles.buttonContainer}>
+              <TextButton
+                text={intl.formatMessage({ id: 'side_menu.add_an_existing_account' })}
+                textStyle={styles.textButton}
+                onPress={() => navigateToRoute(ROUTES.SCREENS.LOGIN)}
+              />
+            </View>
+            <Separator style={styles.separator} />
           </View>
-          <Separator style={styles.separator} />
-        </View>
-      </BottomSheetModal>
-    </BottomSheetModalProvider>
-  );
-});
+        </BottomSheetModal>
+      </BottomSheetModalProvider>
+    );
+  },
+);
 
 export default AccountsBottomSheet;