From 166622971924efd53fa1c959bd13f463ceffb794 Mon Sep 17 00:00:00 2001
From: Arnab Chakraborty <11457760+Rocky43007@users.noreply.github.com>
Date: Tue, 17 Sep 2024 12:10:51 -0400
Subject: [PATCH] Get access token from storage in mobile

---
 .../src/components/overview/Devices.tsx       | 32 ++++++++++++++++++-
 apps/mobile/src/utils/index.ts                |  6 ++++
 2 files changed, 37 insertions(+), 1 deletion(-)
 create mode 100644 apps/mobile/src/utils/index.ts

diff --git a/apps/mobile/src/components/overview/Devices.tsx b/apps/mobile/src/components/overview/Devices.tsx
index b75e2a4a0..f11e24d34 100644
--- a/apps/mobile/src/components/overview/Devices.tsx
+++ b/apps/mobile/src/components/overview/Devices.tsx
@@ -5,8 +5,9 @@ import React, { useEffect, useState } from 'react';
 import { Platform, Text, View } from 'react-native';
 import DeviceInfo from 'react-native-device-info';
 import { ScrollView } from 'react-native-gesture-handler';
-import { HardwareModel, NodeState, StatisticsResponse } from '@sd/client';
+import { HardwareModel, NodeState, StatisticsResponse, useBridgeQuery } from '@sd/client';
 import { tw, twStyle } from '~/lib/tailwind';
+import { getAccessToken } from '~/utils';
 
 import Fade from '../layout/Fade';
 import { Button } from '../primitive/Button';
@@ -44,6 +45,23 @@ const Devices = ({ node, stats }: Props) => {
 		Omit<RNFS.FSInfoResultT, 'totalSpaceEx' | 'freeSpaceEx'>
 	>({ freeSpace: 0, totalSpace: 0 });
 	const [deviceName, setDeviceName] = useState<string>('');
+	const [accessToken, setAccessToken] = useState<string>('');
+	useEffect(() => {
+		(async () => {
+			const at = await getAccessToken();
+			setAccessToken(at ?? '');
+		})();
+	}, []);
+
+	const devices = useBridgeQuery(['cloud.devices.list', { access_token: accessToken.trim() }]);
+
+	// Refetch devices every 10 seconds
+	useEffect(() => {
+		const interval = setInterval(async () => {
+			await devices.refetch();
+		}, 10000);
+		return () => clearInterval(interval);
+	}, []);
 
 	useEffect(() => {
 		const getFSInfo = async () => {
@@ -93,6 +111,18 @@ const Devices = ({ node, stats }: Props) => {
 								connectionType={null}
 							/>
 						)}
+						{/* {devices.data?.map((device) => (
+							<StatCard
+								key={device.pub_id}
+								name={device.name}
+								// TODO (Optional): Use Brand Type for Different Android Models/iOS Models using DeviceInfo.getBrand()
+								icon={hardwareModelToIcon(device.hardware_model)}
+								totalSpace={device.storage_size.toString()}
+								freeSpace={(device.storage_size - device.used_storage).toString()}
+								color="#0362FF"
+								connectionType={'cloud'}
+							/>
+						))} */}
 						<NewCard
 							icons={['Laptop', 'Server', 'SilverBox', 'Tablet']}
 							text="Spacedrive works best on all your devices."
diff --git a/apps/mobile/src/utils/index.ts b/apps/mobile/src/utils/index.ts
new file mode 100644
index 000000000..ccb0e94a4
--- /dev/null
+++ b/apps/mobile/src/utils/index.ts
@@ -0,0 +1,6 @@
+import AsyncStorage from '@react-native-async-storage/async-storage';
+
+export async function getAccessToken() {
+	const fetched = await AsyncStorage.getItem('supertokens-rn-front-token-key');
+	return fetched;
+}