Crossbell-Box · dohooo · Nov 30, 2023 · Nov 30, 2023 · Nov 30, 2023 · Nov 30, 2023
diff --git a/.changeset/mean-beers-grin.md b/.changeset/mean-beers-grin.md
@@ -0,0 +1,5 @@
+---
+"xlog": minor
+---
+
+Remove node polyfills.
diff --git a/App.tsx b/App.tsx
@@ -89,7 +89,7 @@ export default () => {
       <NotificationRegister/>
       <StatusBar />
       <RootNavigator />
-      <NetworkSafeView ifReachable={<WalletConnectModal />}/>
+      <WalletConnectModal />
     </ProviderComposer>
   );
 };

diff --git a/metro.config.js b/metro.config.js
@@ -2,11 +2,6 @@ const { getDefaultConfig } = require("expo/metro-config");
 
 const config = getDefaultConfig(__dirname);
 
-config.resolver.extraNodeModules = {
-  ...(config.resolver.extraNodeModules || {}),
-  ...(require("node-libs-expo")),
-};
-
 config.resolver.sourceExts.push("mjs");
 
 module.exports = config;
diff --git a/package.json b/package.json
@@ -36,7 +36,7 @@
     "test:ci": "act -P ubuntu-latest=caspianzhao/ubuntu:act-latest --secret-file ./.act.secrets --container-architecture linux/amd64",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "postinstall": "patch-package && rn-nodeify --install crypto --hack && rn-nodeify --install stream --hack",
+    "postinstall": "patch-package",
     "prepare": "husky install"
   },
   "dependencies": {
@@ -60,7 +60,7 @@
     "@crossbell/util-metadata": "1.5.17",
     "@dohooo/eslint-config": "^0.0.7",
     "@ethersproject/providers": "^5.7.2",
-    "@ethersproject/shims": "^5.7.0",
+    "@ethersproject/shims": "5.7.0",
     "@gorhom/bottom-sheet": "5.0.0-alpha.3",
     "@manypkg/get-packages": "^1.1.3",
     "@nomiclabs/hardhat-ethers": "^2.2.3",
@@ -116,8 +116,7 @@
     "envalid": "^8.0.0",
     "eslint": "^8.38.0",
     "ethereum-waffle": "^4.0.10",
-    "ethers": "^6.7.1",
-    "events": "^1.1.1",
+    "ethers": "6.9.0",
     "expo": "^49.0.13",
     "expo-application": "~5.3.0",
     "expo-blur": "~12.4.1",
@@ -155,7 +154,6 @@
     "mdast-util-toc": "^6.1.1",
     "moment": "^2.29.4",
     "net": "^1.0.2",
-    "node-libs-expo": "^0.0.3",
     "npm-run-all": "^4.1.5",
     "patch-package": "^6.4.7",
     "path-browserify": "0.0.0",
@@ -195,7 +193,7 @@
     "react-native-sensors": "^7.3.6",
     "react-native-shadow-2": "^7.0.7",
     "react-native-svg": "13.9.0",
-    "react-native-url-polyfill": "^1.3.0",
+    "react-native-url-polyfill": "2.0.0",
     "react-native-view-shot": "3.7.0",
     "react-native-web": "~0.19.6",
     "react-native-webview": "13.2.2",
@@ -228,56 +226,6 @@
     "vm-browserify": "^0.0.4",
     "web3": "^1.10.2"
   },
-  "react-native": {
-    "zlib": "browserify-zlib",
-    "console": "console-browserify",
-    "constants": "constants-browserify",
-    "crypto": "react-native-crypto",
-    "dns": "dns.js",
-    "domain": "domain-browser",
-    "http": "@tradle/react-native-http",
-    "https": "https-browserify",
-    "os": "react-native-os",
-    "path": "path-browserify",
-    "querystring": "querystring-es3",
-    "fs": "react-native-level-fs",
-    "_stream_transform": "readable-stream/transform",
-    "_stream_readable": "readable-stream/readable",
-    "_stream_writable": "readable-stream/writable",
-    "_stream_duplex": "readable-stream/duplex",
-    "_stream_passthrough": "readable-stream/passthrough",
-    "stream": "stream-browserify",
-    "timers": "timers-browserify",
-    "tty": "tty-browserify",
-    "vm": "vm-browserify",
-    "tls": false,
-    "dgram": "react-native-udp"
-  },
-  "browser": {
-    "zlib": "browserify-zlib",
-    "console": "console-browserify",
-    "constants": "constants-browserify",
-    "crypto": "react-native-crypto",
-    "dns": "dns.js",
-    "domain": "domain-browser",
-    "http": "@tradle/react-native-http",
-    "https": "https-browserify",
-    "os": "react-native-os",
-    "path": "path-browserify",
-    "querystring": "querystring-es3",
-    "fs": "react-native-level-fs",
-    "_stream_transform": "readable-stream/transform",
-    "_stream_readable": "readable-stream/readable",
-    "_stream_writable": "readable-stream/writable",
-    "_stream_duplex": "readable-stream/duplex",
-    "_stream_passthrough": "readable-stream/passthrough",
-    "stream": "stream-browserify",
-    "timers": "timers-browserify",
-    "tty": "tty-browserify",
-    "vm": "vm-browserify",
-    "tls": false,
-    "dgram": "react-native-udp"
-  },
   "devDependencies": {
     "@babel/core": "^7.21.8",
     "@babel/preset-react": "^7.18.6",

diff --git a/shim.js b/shim.js
@@ -1,8 +1,8 @@
-import "node-libs-expo/globals";
+import "react-native-url-polyfill/auto";
 import "intl-pluralrules";
 import "text-encoding-polyfill";
-import "react-native-url-polyfill/auto";
 import "react-native-get-random-values";
+import "@walletconnect/react-native-compat";
 import "@ethersproject/shims";
 import { Platform } from "react-native";
 import { btoa, atob, toByteArray } from "react-native-quick-base64";
@@ -80,3 +80,11 @@ if (Platform.OS !== "web") {
     fr.readAsDataURL(blob);
   };
 }
+
+// https://github.com/Crossbell-Box/crossbell-universe/blob/cd0cbaa1ed93e8fc8ff214b1af77b162e406ee2b/packages/react-account/src/apis/siwe.ts#L28
+// Polyfill for window.location.host/origin
+if (typeof window !== "undefined") {
+  if (!window.location) {
+    window.location = {};
+  }
+}
diff --git a/src/components/WalletConnectModal.tsx b/src/components/WalletConnectModal.tsx
@@ -5,7 +5,7 @@ import { WalletConnectModal as Modal, type IProviderMetadata } from "@walletconn
 import * as Clipboard from "expo-clipboard";
 import { resolveScheme } from "expo-linking";
 
-import { OIA_HOST, WALLET_PROJECT_ID, WALLET_RELAY_URL } from "@/constants/env";
+import { OIA_HOST, WALLET_PROJECT_ID } from "@/constants/env";
 import { useThemeStore } from "@/hooks/use-theme-store";
 
 const onCopyClipboard = (value: string) => {
@@ -52,12 +52,11 @@ export function WalletConnectModal() {
 
   return (
     <Modal
+      themeMode={mode}
       projectId={WALLET_PROJECT_ID}
-      providerMetadata={providerMetadata}
-      onCopyClipboard={onCopyClipboard}
       sessionParams={sessionParams}
-      relayUrl={WALLET_RELAY_URL}
-      themeMode={mode}
+      onCopyClipboard={onCopyClipboard}
+      providerMetadata={providerMetadata}
     />
   );
 }
diff --git a/src/constants/env.ts b/src/constants/env.ts
@@ -5,7 +5,6 @@ export const INFURA_ID = Constants.expoConfig.extra?.INFURA_ID;
 export const SENTRY_DSN = Constants.expoConfig.extra?.SENTRY_DSN;
 export const WALLET_PROJECT_ID = Constants.expoConfig.extra?.WALLET_PROJECT_ID;
 export const IPFS_GATEWAY = "https://ipfs.crossbell.io/ipfs/";
-export const WALLET_RELAY_URL = "wss://relay.walletconnect.com";
 export const CSB_SCAN = Constants.expoConfig.extra?.CSB_SCAN || "https://scan.crossbell.io";
 export const CSB_XCHAR = Constants.expoConfig.extra?.CSB_XCHAR || "https://xchar.app";
 export const ENV = Constants.expoConfig.extra?.ENV || "production";

diff --git a/src/context/post-indicator-context.ts b/src/context/post-indicator-context.ts
@@ -2,8 +2,16 @@ import { createContext } from "react";
 
 import type { EditorValues, NoteType } from "@/types";
 
+export interface Asset {
+  uri: string
+  dimensions?: {
+    width: number
+    height: number
+  }
+}
+
 export type TaskType = {
-  assets: string[]
+  assets: Array<Asset>
   characterId?: number
   type?: NoteType
 } & EditorValues;

diff --git a/src/pages/CreateShots/index.tsx b/src/pages/CreateShots/index.tsx
@@ -69,7 +69,13 @@ export const CreateShotsPage: FC<NativeStackScreenProps<RootStackParamList, "Cre
     });
 
     addPostTask({
-      assets: assets.map(asset => asset.uri),
+      assets: assets.map(asset => ({
+        uri: asset.uri,
+        dimensions: {
+          width: asset.width,
+          height: asset.height,
+        },
+      })),
       characterId,
       content,
       title,

diff --git a/src/providers/connect-kit-provider/index.tsx b/src/providers/connect-kit-provider/index.tsx
@@ -27,6 +27,7 @@ export function ConnectKitProvider({ children }: React.PropsWithChildren) {
   const onDisconnect = useRefCallback(() => {
     if (isConnected) {
       walletConnectProvider?.disconnect?.();
+      walletConnectProvider?.cleanupPendingPairings?.();
     }
   });
 

diff --git a/src/providers/post-indicator-provider.tsx b/src/providers/post-indicator-provider.tsx
@@ -143,7 +143,7 @@ const PostIndicator: FC<{
         <BlurView tint="dark" intensity={30} style={StyleSheet.absoluteFillObject}/>
       </Stack>
       <XStack padding="$3" gap="$2">
-        <Image source={{ uri: task.assets[0] }} style={styles.coverImage}/>
+        <Image source={{ uri: task.assets[0].uri }} style={styles.coverImage}/>
         <YStack flex={1}>
 
           {

diff --git a/src/utils/upload-file.ts b/src/utils/upload-file.ts
@@ -2,16 +2,17 @@ import { Image } from "react-native-compressor";
 import * as mime from "react-native-mime-types";
 
 import * as FileSystem from "expo-file-system";
-import sizeOf from "image-size";
+
+import type { Asset } from "@/context/post-indicator-context";
 
 /**
  * Only support image file currently.
 */
 export const uploadFile = async (
-  uri: string,
+  file: Asset,
   onProgressChange?: (event: FileSystem.UploadProgressData) => void,
 ) => {
-  const compressedImage = await Image.compress(uri, { input: "uri" });
+  const compressedImage = await Image.compress(file.uri, { input: "uri" });
   const mimeType = mime.lookup(compressedImage) || undefined;
   const task = FileSystem.createUploadTask(
     "https://ipfs-relay.crossbell.io/upload?gnfd=t",
@@ -25,57 +26,47 @@ export const uploadFile = async (
   );
 
   const result = await task.uploadAsync();
-  let dimension: { width: number; height: number } | undefined;
-
-  try {
-    const buffer = await FileSystem.readAsStringAsync(compressedImage, {
-      encoding: FileSystem.EncodingType.Base64,
-    });
-    dimension = sizeOf(Buffer.from(buffer, "base64"));
-  }
-  catch (e) {
-  }
 
   const url = JSON.parse(result.body)?.url as string;
 
   return {
     url,
     mimeType,
-    dimension,
+    dimension: file.dimensions,
   };
 };
 
 /**
  * Only support image file currently.
 */
 export const uploadFiles = async (
-  uris: string[],
-  onProgressChange?: (uri: string, event: FileSystem.UploadProgressData) => void,
+  files: Asset[],
+  onProgressChange?: (file: Asset, event: FileSystem.UploadProgressData) => void,
   onTotalProgressChange?: (event: {
-    uri: string
+    file: Asset
     totalTaskCount: number
     completedTaskCount: number
     currentFileEvent: FileSystem.UploadProgressData
   }) => void,
 ) => {
-  const totalTaskCount = uris.length;
+  const totalTaskCount = files.length;
   let completedTaskCount = 0;
 
   return Promise.all(
-    uris.map((uri) => {
-      return uploadFile(uri, (event) => {
+    files.map((file) => {
+      return uploadFile(file, (event) => {
         const isCompleted = event.totalBytesSent === event.totalBytesExpectedToSend;
         if (isCompleted) {
           completedTaskCount += 1;
           onTotalProgressChange?.({
-            uri,
+            file,
             totalTaskCount,
             completedTaskCount,
             currentFileEvent: event,
           });
         }
 
-        onProgressChange?.(uri, event);
+        onProgressChange?.(file, event);
       });
     },
     ));