feat: implement a notification provider for dSocial to get Expo Push …

…Token and register device to the new push notification service Signed-off-by: D4ryl00 <[email protected]>
gnoverse · Jun 25, 2024 · 17e071a · 17e071a
1 parent 11d53e3
commit 17e071a
Show file tree

Hide file tree

Showing 12 changed files with 429 additions and 74 deletions.
diff --git a/mobile/.env b/mobile/.env
@@ -1,10 +1,15 @@
-#EXPO_PUBLIC_GNO_REMOTE=http://localhost:36657
-EXPO_PUBLIC_GNO_REMOTE=https://api.gno.berty.io:443
+# Prod
 
-#EXPO_PUBLIC_FAUCET_REMOTE=http://localhost:8545
+EXPO_PUBLIC_GNO_REMOTE=https://api.gno.berty.io:443
 EXPO_PUBLIC_FAUCET_REMOTE=https://faucetpass.gno.berty.io
-
-#EXPO_PUBLIC_INDEXER_REMOTE=http://localhost:26660
 EXPO_PUBLIC_INDEXER_REMOTE=https://indexer.gno.berty.io
+EXPO_PUBLIC_NOTIFICATION_REMOTE=https://notification.gno.berty.io
 
 EXPO_PUBLIC_GNO_CHAIN_ID=dev
+
+# local
+
+# EXPO_PUBLIC_GNO_REMOTE=http://localhost:26657
+# EXPO_PUBLIC_FAUCET_REMOTE=http://localhost:5050
+# EXPO_PUBLIC_INDEXER_REMOTE=http://localhost:26660
+# EXPO_PUBLIC_NOTIFICATION_REMOTE=http://localhost:26661
diff --git a/mobile/.gitignore b/mobile/.gitignore
@@ -37,3 +37,7 @@ yarn-error.*
 # native folders
 android/
 ios/
+
+# Firebase config files
+google-services.json
+GoogleService-Info.plist
diff --git a/mobile/Makefile b/mobile/Makefile
@@ -24,9 +24,11 @@ android.reverse:
 	  >&2 echo "ERROR: no Android device found"; exit 1; \
 	fi
 	adb -s $(ANDROID_DEVICE) reverse tcp:8081 tcp:8081 # metro
-	adb -s $(ANDROID_DEVICE) reverse tcp:36657 tcp:36657 # gnoland
-	adb -s $(ANDROID_DEVICE) reverse tcp:8545 tcp:8545 # faucet
+	adb -s $(ANDROID_DEVICE) reverse tcp:26657 tcp:26657 # gnodev
+	adb -s $(ANDROID_DEVICE) reverse tcp:5050 tcp:5050 # faucet
+	adb -s $(ANDROID_DEVICE) reverse tcp:8546 tcp:8546 # tx-indexer
 	adb -s $(ANDROID_DEVICE) reverse tcp:26660 tcp:26660 # indexer
+	adb -s $(ANDROID_DEVICE) reverse tcp:26661 tcp:26661 # push notifications
 .PHONY: android.reverse
 
 start: node_modules

diff --git a/mobile/app.json b/mobile/app.json
@@ -27,15 +27,17 @@
             }
           }
         }
-      }
+      },
+      "googleServicesFile": "./GoogleService-Info.plist"
     },
     "android": {
       "adaptiveIcon": {
         "foregroundImage": "./assets/images/adaptive-icon.png",
         "backgroundColor": "#ffffff"
       },
       "package": "tech.berty.dsocial.android",
-      "versionCode": 8
+      "versionCode": 8,
+      "googleServicesFile": "./google-services.json"
     },
     "web": {
       "favicon": "./assets/images/favicon.png"
@@ -49,9 +51,9 @@
         "origin": false
       },
       "eas": {
-        "projectId": "40710094-d25f-4c27-9e2f-752938bd2a3d"
+        "projectId": "90cf25eb-7332-4489-83b4-65a9e1d9f9a2"
       }
     },
-    "owner": "iuriberty"
+    "owner": "bertytechnologies"
   }
 }
diff --git a/mobile/app/_layout.tsx b/mobile/app/_layout.tsx
@@ -12,6 +12,7 @@ import { store } from "@gno/redux";
 import { Guard } from "@gno/components/auth/guard";
 import { GnoNativeProvider } from "@gnolang/gnonative";
 import { IndexerProvider } from "@gno/provider/indexer-provider";
+import { NotificationProvider } from "@gno/provider/notification-provider";
 
 const gnoDefaultConfig = {
   remote: process.env.EXPO_PUBLIC_GNO_REMOTE!,
@@ -22,24 +23,30 @@ const indexerDefaultConfig = {
   remote: process.env.EXPO_PUBLIC_INDEXER_REMOTE!,
 };
 
+const notificationDefaultConfig = {
+  remote: process.env.EXPO_PUBLIC_NOTIFICATION_REMOTE!,
+};
+
 export default function AppLayout() {
   return (
     <GnoNativeProvider config={gnoDefaultConfig}>
-      <IndexerProvider config={indexerDefaultConfig}>
-        <Provider store={store}>
-          <ThemeProvider value={DefaultTheme}>
-            <Guard>
-              <Stack
-                screenOptions={{
-                  headerShown: false,
-                  headerLargeTitle: true,
-                  headerBackVisible: false,
-                }}
-              />
-            </Guard>
-          </ThemeProvider>
-        </Provider>
-      </IndexerProvider>
+      <NotificationProvider config={notificationDefaultConfig}>
+        <IndexerProvider config={indexerDefaultConfig}>
+          <Provider store={store}>
+            <ThemeProvider value={DefaultTheme}>
+              <Guard>
+                <Stack
+                  screenOptions={{
+                    headerShown: false,
+                    headerLargeTitle: true,
+                    headerBackVisible: false,
+                  }}
+                />
+              </Guard>
+            </ThemeProvider>
+          </Provider>
+        </IndexerProvider>
+      </NotificationProvider>
     </GnoNativeProvider>
   );
 }
diff --git a/mobile/app/home/profile.tsx b/mobile/app/home/profile.tsx
@@ -1,4 +1,4 @@
-import { StyleSheet, View } from "react-native";
+import { Alert, StyleSheet, View } from "react-native";
 import { router, useNavigation } from "expo-router";
 import { useEffect, useState } from "react";
 import { useGnoNativeContext } from "@gnolang/gnonative";
@@ -11,18 +11,20 @@ import { LoadingModal } from "@gno/components/loading";
 import { AccountBalance } from "@gno/components/settings";
 import Text from "@gno/components/text";
 import { useSearch } from "@gno/hooks/use-search";
+import { useNotificationContext } from "@gno/provider/notification-provider";
 
 export default function Page() {
   const [activeAccount, setActiveAccount] = useState<KeyInfo | undefined>(undefined);
   const [loading, setLoading] = useState(false);
   const [chainID, setChainID] = useState("");
   const [remote, setRemote] = useState("");
-	const [followersCount, setFollowersCount] = useState({ n_followers: 0, n_following: 0 });
+  const [followersCount, setFollowersCount] = useState({ n_followers: 0, n_following: 0 });
 
   const gno = useGnoNativeContext();
-	const search = useSearch();
+  const search = useSearch();
   const navigation = useNavigation();
   const dispatch = useAppDispatch();
+  const push = useNotificationContext();
 
   const onboarding = useOnboarding();
 
@@ -53,19 +55,36 @@ export default function Page() {
     }
   };
 
+  const onPressNotification = async () => {
+    if (!activeAccount) {
+      console.log("No active account");
+      return;
+    }
+    setLoading(true);
+    try {
+      const address_bech32 = await gno.addressToBech32(activeAccount?.address);
+      await push.registerDevice(address_bech32);
+      Alert.alert("Push notification", "You have successfully registered for push notification!");
+    } catch (error) {
+      console.log("Error on onPressNotification", JSON.stringify(error));
+    } finally {
+      setLoading(false);
+    }
+  };
+
   const fetchAccountData = async () => {
-		const account = await gno.getActiveAccount();
-		const chainId = await gno.getChainID();
-		const remote = await gno.getRemote();
-		setActiveAccount(account.key);
-		setChainID(chainId);
-		setRemote(remote);
+    const account = await gno.getActiveAccount();
+    const chainId = await gno.getChainID();
+    const remote = await gno.getRemote();
+    setActiveAccount(account.key);
+    setChainID(chainId);
+    setRemote(remote);
 
     try {
-			const address = await gno.addressToBech32(account?.key?.address!);
-			const followersCount = await search.GetJsonFollowersCount(address);
+      const address = await gno.addressToBech32(account?.key?.address!);
+      const followersCount = await search.GetJsonFollowersCount(address);
 
-			setFollowersCount(followersCount);
+      setFollowersCount(followersCount);
 
       console.log("remote: %s chainId %s " + remote, chainId);
     } catch (error: unknown | Error) {
@@ -74,7 +93,7 @@ export default function Page() {
   };
 
   const onRemoveAccount = async () => {
-		router.navigate({ pathname: "account/remove" });
+    router.navigate({ pathname: "account/remove" });
   };
 
   const onPressLogout = async () => {
@@ -91,14 +110,19 @@ export default function Page() {
             <Text.Body>{chainID}</Text.Body>
             <Text.Subheadline>Remote:</Text.Subheadline>
             <Text.Body>{remote}</Text.Body>
-						<Text.Subheadline>Followers:</Text.Subheadline>
-						<Text.Body>{followersCount.n_followers}</Text.Body>
-						<Text.Subheadline>Following:</Text.Subheadline>
-						<Text.Body>{followersCount.n_following}</Text.Body>
+            <Text.Subheadline>Followers:</Text.Subheadline>
+            <Text.Body>{followersCount.n_followers}</Text.Body>
+            <Text.Subheadline>Following:</Text.Subheadline>
+            <Text.Body>{followersCount.n_following}</Text.Body>
             <View></View>
           </>
           <Layout.Footer>
             <Button.TouchableOpacity title="Onboard the current user" onPress={onboard} variant="primary" />
+            <Button.TouchableOpacity
+              title="Register to the notification service"
+              onPress={onPressNotification}
+              variant="primary"
+            />
             <Button.TouchableOpacity title="Logout" onPress={onPressLogout} style={styles.logout} variant="primary-red" />
             <Button.TouchableOpacity
               title="Remove Account"