Merge pull request #111 from ChainSafe/irubido/onInstallDialog

onInstall dialog, build:local, manifest workflow

Author: irubido

.github/workflows/check-snap-manifest.yml

@@ -0,0 +1,64 @@
+name: Check Snap Manifest
+
+on:
+  pull_request:
+    paths:
+      - 'packages/snap/snap.manifest.json'
+      - '.github/workflows/check-snap-manifest.yml'
+  push:
+    branches:
+      - main
+      - master
+    paths:
+      - 'packages/snap/snap.manifest.json'
+      - '.github/workflows/check-snap-manifest.yml'
+
+jobs:
+  check-manifest:
+    runs-on: ubuntu-latest
+    
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        
+      - name: Check snap manifest allowedOrigins
+        run: |
+          cd packages/snap
+          
+          # Check if jq is available
+          if ! command -v jq &> /dev/null; then
+            echo "jq is not installed. Installing..."
+            sudo apt-get update && sudo apt-get install -y jq
+          fi
+          
+          # Extract allowedOrigins from the manifest
+          ALLOWED_ORIGINS=$(jq -r '.initialPermissions."endowment:rpc".allowedOrigins[]' snap.manifest.json)
+          
+          echo "Current allowedOrigins in snap.manifest.json:"
+          echo "$ALLOWED_ORIGINS"
+          
+          # Check if localhost is present
+          if echo "$ALLOWED_ORIGINS" | grep -q "localhost"; then
+            echo "❌ ERROR: localhost found in allowedOrigins. This should not be in production!"
+            echo "Please ensure snap.manifest.json only contains production URLs."
+            echo "Expected: [\"https://webzjs.chainsafe.dev\"]"
+            exit 1
+          fi
+          
+          # Check if the production URL is present
+          if ! echo "$ALLOWED_ORIGINS" | grep -q "https://webzjs.chainsafe.dev"; then
+            echo "❌ ERROR: Production URL 'https://webzjs.chainsafe.dev' not found in allowedOrigins!"
+            exit 1
+          fi
+          
+          # Check if there are any unexpected URLs
+          UNEXPECTED_URLS=$(echo "$ALLOWED_ORIGINS" | grep -v "https://webzjs.chainsafe.dev" || true)
+          if [ -n "$UNEXPECTED_URLS" ]; then
+            echo "❌ ERROR: Unexpected URLs found in allowedOrigins:"
+            echo "$UNEXPECTED_URLS"
+            echo "Expected only: https://webzjs.chainsafe.dev"
+            exit 1
+          fi
+          
+          echo "✅ SUCCESS: snap.manifest.json has correct allowedOrigins configuration"
+          echo "Found: https://webzjs.chainsafe.dev" 

packages/snap/README.md

@@ -18,14 +18,27 @@ Snap uses a Rust library [WebZjs](https://github.com/ChainSafe/WebZjs) compiled
 
 ## 🔨 Development
 
-For local development, you need to add `http://localhost:8080` to the `allowedOrigins` in `snap.manifest.json`. The `endowment:rpc` section should look like this:
+For local development, you need to add `http://localhost:3000` to the `allowedOrigins` in `snap.manifest.json`. The `endowment:rpc` section should look like this:
 
 ```json
 "endowment:rpc": {
   "allowedOrigins": ["https://webzjs.chainsafe.dev", "http://localhost:3000"]
 }
 ```
 
+### Build Scripts
+
+- **`yarn build`** - Standard build for production (only allows production origins)
+- **`yarn build:local`** - Build for local development (automatically adds localhost:3000 to allowedOrigins)
+
+The `build:local` script will:
+1. Create a backup of the original `snap.manifest.json`
+2. Modify the manifest to include `http://localhost:3000` in allowedOrigins
+3. Run the build process
+
+### Development Steps
+
 1. Install dependencies with `yarn install`
-2. Build the project with `yarn build`
-3. Host snap on localhost http://localhost:8080 `yarn serve`
+2. For local development: Build with `yarn build:local`
+3. For production: Build with `yarn build`
+4. Host snap on localhost http://localhost:8080 `yarn serve`

packages/snap/build_local.sh

@@ -0,0 +1,19 @@
+#!/bin/bash
+
+# Script to build the snap with localhost development origins
+
+echo "Adding localhost:3000 to allowed origins in snap.manifest.json..."
+
+# Use jq to modify the allowedOrigins array to include localhost:3000
+jq '.initialPermissions."endowment:rpc".allowedOrigins = ["https://webzjs.chainsafe.dev", "http://localhost:3000"]' snap.manifest.json > snap.manifest.json.tmp
+
+# Replace the original file with the modified version
+mv snap.manifest.json.tmp snap.manifest.json
+
+echo "Modified snap.manifest.json to include localhost:3000 for local development"
+
+# Run the build command
+echo "Running build..."
+yarn build
+
+echo "Build completed!"

packages/snap/package.json

@@ -17,6 +17,7 @@
     "allow-scripts": "yarn workspace root allow-scripts",
     "build": "mm-snap build",
     "build:clean": "yarn clean && yarn build",
+    "build:local": "./build_local.sh",
     "clean": "rimraf dist",
     "lint": "eslint --color --ext .ts src/",
     "lint:fix": "yarn run lint --fix",

packages/snap/snap.manifest.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/ChainSafe/WebZjs.git"
   },
   "source": {
-    "shasum": "6xAVsbiI+vzYPOZ/f1+9GVEhLvYy9X/hhTuFXjQc1Sc=",
+    "shasum": "iilrA+B7Wy4NObYvZCqTVbpN2iI14kqdCYCHGhqjnBM=",
     "location": {
       "npm": {
         "filePath": "dist/bundle.js",
@@ -19,6 +19,7 @@
   },
   "initialPermissions": {
     "snap_dialog": {},
+    "endowment:lifecycle-hooks": {},
     "endowment:webassembly": {},
     "endowment:rpc": {
       "allowedOrigins": ["https://webzjs.chainsafe.dev"]

packages/snap/src/index.tsx

@@ -14,6 +14,8 @@ import { signPczt } from './rpc/signPczt'
 
 import { assert, object, number, optional, string } from 'superstruct';
 import { getSeedFingerprint } from './rpc/getSeedFingerprint';
+import type { OnInstallHandler } from "@metamask/snaps-sdk";
+import { installDialog } from './utils/dialogs';
 
 let wasm: InitOutput;
 
@@ -75,3 +77,7 @@ export const onUserInput: OnUserInputHandler = async ({ id, event }) => {
     }
   }
 };
+
+export const onInstall: OnInstallHandler = async () => {
+  await installDialog();
+};

packages/snap/src/utils/dialogs.tsx

@@ -0,0 +1,19 @@
+import { Box, Heading, Text } from "@metamask/snaps-sdk/jsx";
+
+export const installDialog = async () => {
+  await snap.request({
+    method: "snap_dialog",
+    params: {
+      type: "alert",
+      content: (
+        <Box>
+          <Heading>Thank you for installing Zcash Shielded Wallet snap</Heading>
+          <Text>
+            This snap utilizes Zcash Web Wallet.
+            Visit Zcash Web Wallet at <a href="https://webzjs.chainsafe.dev/">webzjs.chainsafe.dev</a>.
+          </Text>
+        </Box>
+      ),
+    },
+  });
+};