Upgrade package version to 0.1.5 (#29)

Part of https://www.notion.so/Gentx-like-attestation-mechanism-to-add-validators-at-genesis-time-19da6b22d47280ecbf1fe657c241ff59

Reviewed-on: LaconicNetwork/laconic-wallet-web#29
Co-authored-by: Nabarun <nabarun@deepstacksoft.com>
Co-committed-by: Nabarun <nabarun@deepstacksoft.com>

.env.example

@@ -5,4 +5,5 @@ REACT_APP_DEFAULT_GAS_PRICE=0.025
 REACT_APP_GAS_ADJUSTMENT=2
 REACT_APP_LACONICD_RPC_URL=https://laconicd-sapo.laconic.com
 
-REACT_APP_DEPLOY_APP_URL=
+# Example: https://example-url-1.com,https://example-url-2.com
+REACT_APP_ALLOWED_URLS=

package.json

@@ -1,6 +1,6 @@
 {
   "name": "web-wallet",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "private": true,
   "dependencies": {
     "@cerc-io/registry-sdk": "^0.2.5",

src/App.tsx

@@ -40,6 +40,10 @@ import { WalletEmbed } from "./screens/WalletEmbed";
 import { AutoSignIn } from "./screens/AutoSignIn";
 import { checkSufficientFunds, getPathKey, sendMessage } from "./utils/misc";
 import useAccountsData from "./hooks/useAccountsData";
+import { useWebViewHandler } from "./hooks/useWebViewHandler";
+import SignRequestEmbed from "./screens/SignRequestEmbed";
+import useAddAccountEmbed from "./hooks/useAddAccountEmbed";
+import useExportPKEmbed from "./hooks/useExportPrivateKeyEmbed";
 
 const Stack = createStackNavigator<StackParamsList>();
 
@@ -279,6 +283,10 @@ const App = (): React.JSX.Element => {
 
   const showWalletConnect = useMemo(() => accounts.length > 0, [accounts]);
 
+  useWebViewHandler();
+  useAddAccountEmbed();
+  useExportPKEmbed();
+
   return (
     <Surface style={styles.appSurface}>
       <Stack.Navigator
@@ -387,6 +395,13 @@ const App = (): React.JSX.Element => {
             header: () => <></>,
           }}
         />
+        <Stack.Screen
+          name="sign-request-embed"
+          component={SignRequestEmbed}
+          options={{
+            header: () => <Header title="Wallet" />,
+          }}
+        />
       </Stack.Navigator>
       <PairingModal
         visible={modalVisible}

src/context/AccountsContext.tsx

@@ -4,7 +4,7 @@ import { Account } from '../types';
 
 const AccountsContext = createContext<{
   accounts: Account[];
-  setAccounts: (account: Account[]) => void;
+  setAccounts: React.Dispatch<React.SetStateAction<Account[]>>;
   currentIndex: number;
   setCurrentIndex: (index: number) => void;
     }>({

src/global.d.ts

@@ -0,0 +1,24 @@
+// Extends the Window interface for Android WebView communication
+declare global {
+  interface Window {
+    // Android bridge callbacks for signature and accounts related events
+    Android?: {
+      // Called when signature is successfully generated
+      onSignatureComplete?: (signature: string) => void;
+
+      // Called when signature generation fails
+      onSignatureError?: (error: string) => void;
+
+      // Called when signature process is cancelled
+      onSignatureCancelled?: () => void;
+
+      // Called when accounts are ready for use
+      onAccountsReady?: () => void;
+    };
+
+    // Handles incoming signature requests from Android
+    receiveSignRequestFromAndroid?: (message: string) => void;
+  }
+}
+
+export {};

src/hooks/useAddAccountEmbed.ts

@@ -0,0 +1,58 @@
+import { useEffect, useCallback } from 'react';
+
+import { useNetworks } from '../context/NetworksContext';
+import { sendMessage } from '../utils/misc';
+import useAccountsData from '../hooks/useAccountsData';
+import { addAccount } from '../utils/accounts';
+import { useAccounts } from '../context/AccountsContext';
+import { Account, NetworksDataState } from '../types';
+
+const REACT_APP_ALLOWED_URLS = process.env.REACT_APP_ALLOWED_URLS;
+
+const useAddAccountEmbed = () => {
+  const { networksData } = useNetworks();
+  const { setAccounts, setCurrentIndex } = useAccounts();
+  const { getAccountsData } = useAccountsData();
+
+  const addAccountHandler = useCallback(async (network: NetworksDataState) => {
+    const newAccount = await addAccount(network);
+    if (newAccount) {
+      setAccounts(prev => [...prev, newAccount]);
+      setCurrentIndex(newAccount.index);
+    }
+  }, [setAccounts, setCurrentIndex]);
+
+  useEffect(() => {
+    const handleAddAccount = async (event: MessageEvent) => {
+      if (event.data.type !== 'ADD_ACCOUNT') return;
+
+      if (!REACT_APP_ALLOWED_URLS) {
+        console.log('Unauthorized app origin:', event.origin);
+        return;
+      }
+
+      const allowedUrls = REACT_APP_ALLOWED_URLS.split(',').map(url => url.trim());
+
+      if (!allowedUrls.includes(event.origin)) {
+        console.log('Unauthorized app.');
+        return;
+      }
+
+      const network = networksData.find(network => network.chainId === event.data.chainId);
+
+      await addAccountHandler(network!);
+      const updatedAccounts = await getAccountsData(event.data.chainId);
+      const addresses = updatedAccounts.map((account: Account) => account.address);
+
+      sendMessage(event.source as Window, 'ADD_ACCOUNT_RESPONSE', addresses, event.origin);
+    };
+
+    window.addEventListener('message', handleAddAccount);
+
+    return () => {
+      window.removeEventListener('message', handleAddAccount);
+    };
+  }, [networksData, getAccountsData, addAccountHandler]);
+};
+
+export default useAddAccountEmbed;

src/hooks/useExportPrivateKeyEmbed.ts

@@ -0,0 +1,42 @@
+import { useEffect } from 'react';
+
+import { useAccounts } from '../context/AccountsContext';
+import { getPathKey, sendMessage } from '../utils/misc';
+
+const useExportPKEmbed = () => {
+  const {  accounts } = useAccounts();
+
+  useEffect(() => {
+    const handleMessage = async (event: MessageEvent) => {
+      const { type, chainId, address } = event.data;
+
+      if (type !== 'REQUEST_ACCOUNT_PK') return;
+
+      try {
+        const selectedAccount = accounts.find(account => account.address === address);
+        if (!selectedAccount) {
+          throw new Error("Account not found")
+        }
+
+        const pathKey = await getPathKey(chainId, selectedAccount.index);
+        const privateKey = pathKey.privKey;
+
+        sendMessage(
+          event.source as Window,
+          'ACCOUNT_PK_DATA',
+          { privateKey },
+          event.origin,
+        );
+      } catch (error) {
+        console.error('Error fetching private key:', error);
+      }
+    };
+
+    window.addEventListener('message', handleMessage);
+    return () => {
+      window.removeEventListener('message', handleMessage);
+    };
+  }, [accounts]);
+};
+
+export default useExportPKEmbed;

src/hooks/useGetOrCreateAccounts.ts

@@ -1,41 +1,90 @@
-import { useEffect } from "react";
+import { useEffect, useCallback } from "react";
 
 import { createWallet } from "../utils/accounts";
 import { sendMessage } from "../utils/misc";
 import useAccountsData from "./useAccountsData";
 import { useNetworks } from "../context/NetworksContext";
+import { useAccounts } from "../context/AccountsContext";
+
+const REACT_APP_ALLOWED_URLS = process.env.REACT_APP_ALLOWED_URLS;
 
 const useGetOrCreateAccounts = () => {
   const { networksData } = useNetworks();
   const { getAccountsData } = useAccountsData();
+  const { setAccounts } = useAccounts();
+
+  // Wrap the function in useCallback to prevent recreation on each render
+  const getOrCreateAccountsForChain = useCallback(async (chainId: string) => {
+    let accountsData = await getAccountsData(chainId);
+
+    if (accountsData.length === 0) {
+      console.log("Accounts not found, creating wallet...");
+      await createWallet(networksData);
+      accountsData = await getAccountsData(chainId);
+    }
+
+    // Update the AccountsContext with the new accounts
+    setAccounts(accountsData);
+
+    return accountsData;
+  }, [networksData, getAccountsData, setAccounts]);
 
   useEffect(() => {
     const handleCreateAccounts = async (event: MessageEvent) => {
       if (event.data.type !== 'REQUEST_CREATE_OR_GET_ACCOUNTS') return;
 
-      let accountsData = await getAccountsData(event.data.chainId);
+      if (!REACT_APP_ALLOWED_URLS) {
-
+        console.log('Allowed URLs are not set');
-      if (accountsData.length === 0) {
+        return;
-        console.log("Accounts not found, creating wallet...");
-        await createWallet(networksData);
-
-        // Re-fetch newly created accounts
-        accountsData = await getAccountsData(event.data.chainId);
       }
 
+      const allowedUrls = REACT_APP_ALLOWED_URLS.split(',').map(url => url.trim());
+
+      if (!allowedUrls.includes(event.origin)) {
+        console.log('Unauthorized app.');
+        return;
+      }
+
+      const accountsData = await getOrCreateAccountsForChain(event.data.chainId);
+      const accountsAddressList = accountsData.map(account => account.address);
+      console.log('Sending WALLET_ACCOUNTS_DATA accounts:', accountsAddressList);
+
       sendMessage(
         event.source as Window, 'WALLET_ACCOUNTS_DATA',
-        accountsData.map(account => account.address),
+        accountsAddressList,
         event.origin
       );
     };
 
+    const autoCreateAccounts = async () => {
+      const defaultChainId = networksData[0]?.chainId;
+
+      if (!defaultChainId) {
+        console.log('useGetOrCreateAccounts: No default chainId found');
+        return;
+      }
+      const accounts = await getOrCreateAccountsForChain(defaultChainId);
+
+      // Only notify Android when we actually have accounts
+      if (accounts.length > 0 && window.Android?.onAccountsReady) {
+        window.Android.onAccountsReady();
+      } else {
+        console.log('No accounts created or Android bridge not available');
+      }
+    };
+
     window.addEventListener('message', handleCreateAccounts);
 
+    const isAndroidWebView = !!(window.Android);
+
+    if (isAndroidWebView) {
+      autoCreateAccounts();
+    }
+
     return () => {
       window.removeEventListener('message', handleCreateAccounts);
     };
-  }, [networksData, getAccountsData]);
+  }, [networksData, getAccountsData, getOrCreateAccountsForChain]);
 };
 
 export default useGetOrCreateAccounts;

src/hooks/useWebViewHandler.ts

@@ -0,0 +1,81 @@
+import { useEffect, useCallback } from 'react';
+import { useNavigation } from '@react-navigation/native';
+import { NativeStackNavigationProp } from '@react-navigation/native-stack';
+
+import { useAccounts } from '../context/AccountsContext';
+import { useNetworks } from '../context/NetworksContext';
+import { StackParamsList } from '../types';
+import useGetOrCreateAccounts from './useGetOrCreateAccounts';
+
+export const useWebViewHandler = () => {
+  // Navigation and context hooks
+  const navigation = useNavigation<NativeStackNavigationProp<StackParamsList>>();
+  const { selectedNetwork } = useNetworks();
+  const { accounts, currentIndex } = useAccounts();
+
+  // Initialize accounts
+  useGetOrCreateAccounts();
+
+  // Core navigation handler
+  const navigateToSignRequest = useCallback((message: string) => {
+    try {
+      // Validation checks
+      if (!selectedNetwork?.namespace || !selectedNetwork?.chainId) {
+        window.Android?.onSignatureError?.('Invalid network configuration');
+        return;
+      }
+
+      if (!accounts?.length) {
+        window.Android?.onSignatureError?.('No accounts available');
+        return;
+      }
+
+      const currentAccount = accounts[currentIndex];
+      if (!currentAccount) {
+        window.Android?.onSignatureError?.('Current account not found');
+        return;
+      }
+
+      // Create the path and validate with regex
+      const path = `/sign/${selectedNetwork.namespace}/${selectedNetwork.chainId}/${currentAccount.address}/${encodeURIComponent(message)}`;
+      const pathRegex = /^\/sign\/(eip155|cosmos)\/(.+)\/(.+)\/(.+)$/;
+      const match = path.match(pathRegex);
+
+      if (!match) {
+        window.Android?.onSignatureError?.('Invalid signing path');
+        return;
+      }
+
+      const [, pathNamespace, pathChainId, pathAddress, pathMessage] = match;
+
+      // Reset navigation stack and navigate to sign request
+      navigation.reset({
+        index: 0,
+        routes: [
+          {
+            name: 'SignRequest',
+            path,
+            params: {
+              namespace: pathNamespace,
+              chainId: pathChainId,
+              address: pathAddress,
+              message: decodeURIComponent(pathMessage),
+              accountInfo: currentAccount,
+            },
+          },
+        ],
+      });
+    } catch (error) {
+      window.Android?.onSignatureError?.(`Navigation error: ${error}`);
+    }
+  }, [selectedNetwork, accounts, currentIndex, navigation]);
+
+  useEffect(() => {
+    // Assign the function to the window object
+    window.receiveSignRequestFromAndroid = navigateToSignRequest;
+
+    return () => {
+      window.receiveSignRequestFromAndroid = undefined;
+    };
+  }, [navigateToSignRequest]); // Only the function reference as dependency
+};

src/screens/AutoSignIn.tsx

@@ -7,6 +7,8 @@ import { sendMessage } from '../utils/misc';
 import useAccountsData from '../hooks/useAccountsData';
 import useGetOrCreateAccounts from '../hooks/useGetOrCreateAccounts';
 
+const REACT_APP_ALLOWED_URLS = process.env.REACT_APP_ALLOWED_URLS;
+
 export const AutoSignIn = () => {
   const { networksData } = useNetworks();
 
@@ -16,7 +18,14 @@ export const AutoSignIn = () => {
     const handleSignIn = async (event: MessageEvent) => {
       if (event.data.type !== 'AUTO_SIGN_IN') return;
 
-      if (event.origin !== process.env.REACT_APP_DEPLOY_APP_URL) {
+      if (!REACT_APP_ALLOWED_URLS) {
+        console.log('Allowed URLs are not set');
+        return;
+      }
+
+      const allowedUrls = REACT_APP_ALLOWED_URLS.split(',').map(url => url.trim());
+
+      if (!allowedUrls.includes(event.origin)) {
         console.log('Unauthorized app.');
         return;
       }

src/screens/SignRequest.tsx

@@ -202,7 +202,13 @@ const SignRequest = ({ route }: SignRequestProps) => {
         chainId,
         accountId: account.index,
       });
-      alert(`Signature ${signedMessage}`);
+      
+      // Send the result back to Android and close dialog
+      if (window.Android?.onSignatureComplete) {
+        window.Android.onSignatureComplete(signedMessage || "");
+      } else {
+        alert(`Signature: ${signedMessage}`);
+      }
     }
   };
 
@@ -230,7 +236,11 @@ const SignRequest = ({ route }: SignRequestProps) => {
     }
 
     setIsRejecting(false);
-    navigation.navigate('Home');
+    if (window.Android?.onSignatureCancelled) {
+      window.Android.onSignatureCancelled();
+    } else {
+      navigation.navigate('Home');
+    }
   };
 
   useEffect(() => {

src/screens/SignRequestEmbed.tsx

@@ -0,0 +1,189 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { ScrollView, View } from 'react-native';
+import { ActivityIndicator, Button, Text, Appbar } from 'react-native-paper';
+
+import { useNavigation } from '@react-navigation/native';
+import {
+  NativeStackNavigationProp,
+  NativeStackScreenProps,
+} from '@react-navigation/native-stack';
+import { getHeaderTitle } from '@react-navigation/elements';
+
+import { Account, StackParamsList } from '../types';
+import AccountDetails from '../components/AccountDetails';
+import styles from '../styles/stylesheet';
+import { getCosmosAccounts, retrieveSingleAccount } from '../utils/accounts';
+import { getMnemonic, getPathKey, sendMessage } from '../utils/misc';
+import { COSMOS } from '../utils/constants';
+
+const REACT_APP_ALLOWED_URLS = process.env.REACT_APP_ALLOWED_URLS;
+
+type SignRequestProps = NativeStackScreenProps<StackParamsList, 'sign-request-embed'>;
+
+const SignRequestEmbed = ({ route }: SignRequestProps) => {
+  const [displayAccount, setDisplayAccount] = useState<Account>();
+  const [message, setMessage] = useState<string>('');
+  const [chainId, setChainId] = useState<string>('');
+  const [signDoc, setSignDoc] = useState<any>(null);
+  const [signerAddress, setSignerAddress] = useState<string>('');
+  const [origin, setOrigin] = useState<string>('');
+  const [sourceWindow, setSourceWindow] = useState<Window | null>(null);
+  const [isLoading, setIsLoading] = useState(true);
+  const [isApproving, setIsApproving] = useState(false);
+
+  const navigation =
+    useNavigation<NativeStackNavigationProp<StackParamsList>>();
+
+  const signMessageHandler = async () => {
+    if (!signDoc || !signerAddress || !sourceWindow) return;
+
+    setIsApproving(true);
+    try {
+      const requestAccount = await retrieveSingleAccount(COSMOS, chainId, signerAddress);
+      const path = (await getPathKey(`${COSMOS}:${chainId}`, requestAccount!.index)).path;
+      const mnemonic = await getMnemonic();
+      const cosmosAccount = await getCosmosAccounts(mnemonic, path, 'zenith');
+
+      const cosmosAminoSignature = await cosmosAccount.cosmosWallet.signAmino(
+        signerAddress,
+        signDoc,
+      );
+
+      const signature = cosmosAminoSignature.signature.signature;
+
+      sendMessage(
+        sourceWindow,
+        'ZENITH_SIGNED_MESSAGE',
+        { signature },
+        origin,
+      );
+
+      navigation.navigate('Home');
+    } catch (err) {
+      console.error('Signing failed:', err);
+      sendMessage(
+        sourceWindow!,
+        'ZENITH_SIGNED_MESSAGE',
+        { error: err },
+        origin,
+      );
+    } finally {
+      setIsApproving(false);
+    }
+  };
+
+  const rejectRequestHandler = useCallback(async () => {
+    if (sourceWindow && origin) {
+      sendMessage(
+        sourceWindow,
+        'ZENITH_SIGNED_MESSAGE',
+        { error: 'User rejected the request' },
+        origin,
+      );
+    }
+  }, [sourceWindow, origin]);
+
+  useEffect(() => {
+    const handleCosmosSignMessage = async (event: MessageEvent) => {
+      if (event.data.type !== 'SIGN_ZENITH_MESSAGE') return;
+
+
+      if (!REACT_APP_ALLOWED_URLS) {
+        console.log('Allowed URLs are not set');
+        return;
+      }
+
+      const allowedUrls = REACT_APP_ALLOWED_URLS.split(',').map(url => url.trim());
+
+      if (!allowedUrls.includes(event.origin)) {
+        console.log('Unauthorized app.');
+        return;
+      }
+
+      try {
+        const { signerAddress, signDoc } = event.data.params;
+
+        setSignerAddress(signerAddress);
+        setSignDoc(signDoc);
+        setMessage(signDoc.memo || '');
+        setOrigin(event.origin);
+        setSourceWindow(event.source as Window);
+        setChainId(event.data.chainId);
+
+        const requestAccount = await retrieveSingleAccount(
+          COSMOS,
+          event.data.chainId,
+          signerAddress,
+        );
+
+        setDisplayAccount(requestAccount);
+        setIsLoading(false);
+      } catch (err) {
+        console.error('Error preparing sign request:', err);
+        setIsLoading(false);
+      }
+    };
+
+    window.addEventListener('message', handleCosmosSignMessage);
+    return () => window.removeEventListener('message', handleCosmosSignMessage);
+  }, []);
+
+  useEffect(() => {
+    navigation.setOptions({
+      // eslint-disable-next-line react/no-unstable-nested-components
+      header: ({ options, back }) => {
+        const title = getHeaderTitle(options, 'Sign Message');
+
+        return (
+          <Appbar.Header>
+            {back && (
+              <Appbar.BackAction
+                onPress={async () => {
+                  await rejectRequestHandler();
+                  navigation.navigate('Home');
+                }}
+              />
+            )}
+            <Appbar.Content title={title} />
+          </Appbar.Header>
+        );
+      },
+    });
+  }, [navigation, rejectRequestHandler]);
+
+  return (
+    <>
+      {isLoading ? (
+        <View style={styles.spinnerContainer}>
+          <ActivityIndicator size="large" color="#0000ff" />
+        </View>
+      ) : (
+        <>
+          <ScrollView contentContainerStyle={styles.appContainer}>
+            <AccountDetails account={displayAccount} />
+            <View style={styles.requestMessage}>
+              <Text variant="bodyLarge">{message}</Text>
+            </View>
+          </ScrollView>
+          <View style={styles.buttonContainer}>
+            <Button
+              mode="contained"
+              onPress={signMessageHandler}
+              loading={isApproving}
+              disabled={isApproving}>
+              Yes
+            </Button>
+            <Button
+              mode="contained"
+              onPress={rejectRequestHandler}
+              buttonColor="#B82B0D">
+              No
+            </Button>
+          </View>
+        </>
+      )}
+    </>
+  );
+};
+
+export default SignRequestEmbed;

src/types.ts

@@ -13,8 +13,10 @@ export type StackParamsList = {
   };
   SignRequest: {
     namespace: string;
+    chainId?: string;
     address: string;
     message: string;
+    accountInfo?: Account;
     requestEvent?: Web3WalletTypes.SessionRequest;
     requestSessionData?: SessionTypes.Struct;
   };
@@ -38,6 +40,7 @@ export type StackParamsList = {
   };
   "wallet-embed": undefined;
   "auto-sign-in": undefined;
+  "sign-request-embed": undefined;
 };
 
 export type Account = {

src/utils/constants.ts

@@ -18,6 +18,18 @@ export const DEFAULT_NETWORKS: NetworksFormData[] = [
     gasPrice: '0.001',
     isDefault: true,
   },
+  {
+    chainId: 'zenith-testnet',
+    networkName: 'zenithd testnet',
+    namespace: COSMOS,
+    rpcUrl: 'https://zenith-node-rpc.com',
+    blockExplorerUrl: '',
+    nativeDenom: 'znt',
+    addressPrefix: 'zenith',
+    coinType: '118',
+    gasPrice: '0.01',
+    isDefault: true,
+  },
   {
     chainId: 'laconic_9000-1',
     networkName: 'laconicd',

stack/stack-orchestrator/compose/docker-compose-laconic-wallet-web.yml

@@ -10,10 +10,11 @@ services:
       CERC_DEFAULT_GAS_PRICE: ${CERC_DEFAULT_GAS_PRICE:-0.025}
       CERC_GAS_ADJUSTMENT: ${CERC_GAS_ADJUSTMENT:-2}
       CERC_LACONICD_RPC_URL: ${CERC_LACONICD_RPC_URL:-https://laconicd.laconic.com}
-      CERC_DEPLOY_APP_URL: ${CERC_DEPLOY_APP_URL}
+      CERC_ALLOWED_URLS: ${CERC_ALLOWED_URLS}
     command: ["bash", "/scripts/run.sh"]
     volumes:
       - ../config/app/run.sh:/scripts/run.sh
+      - ../config/app/serve.json:/app/serve.json
     ports:
       - "80"
     healthcheck:

stack/stack-orchestrator/config/app/run.sh

@@ -10,14 +10,14 @@ echo "WALLET_CONNECT_ID: ${WALLET_CONNECT_ID}"
 echo "CERC_DEFAULT_GAS_PRICE: ${CERC_DEFAULT_GAS_PRICE}"
 echo "CERC_GAS_ADJUSTMENT: ${CERC_GAS_ADJUSTMENT}"
 echo "CERC_LACONICD_RPC_URL: ${CERC_LACONICD_RPC_URL}"
-echo "CERC_DEPLOY_APP_URL: ${CERC_DEPLOY_APP_URL}"
+echo "CERC_ALLOWED_URLS: ${CERC_ALLOWED_URLS}"
 
 # Build with required env
 REACT_APP_WALLET_CONNECT_PROJECT_ID=$WALLET_CONNECT_ID \
 REACT_APP_DEFAULT_GAS_PRICE=$CERC_DEFAULT_GAS_PRICE \
 REACT_APP_GAS_ADJUSTMENT=$CERC_GAS_ADJUSTMENT \
 REACT_APP_LACONICD_RPC_URL=$CERC_LACONICD_RPC_URL \
-REACT_APP_DEPLOY_APP_URL=$CERC_DEPLOY_APP_URL \
+REACT_APP_ALLOWED_URLS=$CERC_ALLOWED_URLS \
 yarn build
 
 # Define the directory and file path
@@ -28,5 +28,5 @@ mkdir -p "$(dirname "$FILE_PATH")"
 # Write verification code to the file
 echo "$WALLET_CONNECT_VERIFY_CODE" > "$FILE_PATH"
 
-# Serve build dir
+# Serve build dir with explicit config
-http-server --proxy http://localhost:80? -p 80 /app/build
+serve -s -l 80 -c /app/serve.json /app/build

stack/stack-orchestrator/config/app/serve.json

@@ -0,0 +1,22 @@
+{
+  "headers": [
+    {
+      "source": "/index.html",
+      "headers": [
+        {
+          "key": "Cache-Control",
+          "value": "no-cache, must-revalidate"
+        }
+      ]
+    },
+    {
+      "source": "/static/**/*.{js,css,png,jpg,jpeg,gif,svg,ico}",
+      "headers": [
+        { 
+          "key": "Cache-Control",
+          "value": "public, max-age=31536000, immutable"
+        }
+      ]
+    }
+  ]
+}

stack/stack-orchestrator/container-build/cerc-laconic-wallet-web/Dockerfile

@@ -33,7 +33,7 @@ RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
 RUN mkdir -p /scripts
 
 # Install simple web server for now (use nginx perhaps later)
-RUN yarn global add http-server
+RUN yarn global add serve
 
 WORKDIR /app
 COPY . .

stack/stack-orchestrator/stack/laconic-wallet-web/README.md

@@ -49,6 +49,9 @@ Instructions for running the `laconic-wallet-web` using [laconic-so](https://git
   # WalletConnect project ID, same should be used in the laconic-wallet
   WALLET_CONNECT_ID=
 
+  # Allowed urls is a comma separated list of allowed urls
+  CERC_ALLOWED_URLS=
+
   # Optional
 
   # WalletConnect code for hostname verification
@@ -63,10 +66,6 @@ Instructions for running the `laconic-wallet-web` using [laconic-so](https://git
 
   # RPC endpoint of laconicd node (default: https://laconicd.laconic.com)
   CERC_LACONICD_RPC_URL=
-
-  # Deploy app URL used for checking origin of the messages for auto-sign-in route
-  # Deploy app repo: https://git.vdb.to/cerc-io/snowballtools-base
-  CERC_DEPLOY_APP_URL=
   ```
 
 ## Start the deployment