test to verify if proper headers are set

packages/explorer/src/components/SearchBar.tsx

@@ -1,7 +1,7 @@
 import { useContext, useRef } from 'react'
 import { useNavigate } from 'react-router-dom'
 import { ComputerContext } from '@bitcoin-computer/components'
-import { isValidHexadecimalPublicKey } from '../utils'
+import { isPossibleCryptoAddress, isValidHexadecimalPublicKey } from '../utils'
 
 export function SearchBar() {
   const inputRef = useRef<HTMLInputElement>(null)
@@ -21,6 +21,7 @@ export function SearchBar() {
         }
       } else if (isValidHexadecimalPublicKey(searchInput))
         navigate(`/?public-key=${searchInput.trim()}`)
+      else if (isPossibleCryptoAddress(searchInput)) navigate(`/utxos/${searchInput}`)
       else navigate(`/transactions/${searchInput}`)
     }
   }

packages/explorer/src/utils.ts

@@ -96,6 +96,16 @@ export const getValueForType = (type: string, stringValue: string) => {
 export const capitalizeFirstLetter = (string: string) =>
   string.charAt(0).toUpperCase() + string.slice(1)
 
+export const isPossibleCryptoAddress = (address: string): boolean => {
+  // Regular expressions for common address formats
+  const p2pkhRegex = /^[1mn][a-km-zA-HJ-NP-Z1-9]{25,34}$/ // P2PKH (mainnet/testnet)
+  const p2shRegex = /^[23][a-km-zA-HJ-NP-Z1-9]{25,34}$/ // P2SH (mainnet/testnet)
+  const bech32Regex = /^(bc1|ltc1|doge1|dc1|t[a-z]{2})[a-z0-9]{6,80}$/ // Bech32 (mainnet/testnet)
+
+  // Check if the address matches any of the regex patterns
+  return p2pkhRegex.test(address) || p2shRegex.test(address) || bech32Regex.test(address)
+}
+
 export const isValidHexadecimalPublicKey = (publicKey: string): boolean => {
   if (!publicKey) return false
   const trimmedPublicKey = publicKey.trim()

packages/lib/package.json

@@ -36,17 +36,19 @@
         "require": "./dist/bc-lib.commonjs.min.cjs"
       },
       "browser": {
-        "import": "./dist/bc-lib.module.es.mjs"
+        "import": "./dist/bc-lib.browser.min.mjs"
       },
       "default": "./dist/bc-lib.main.es.mjs"
     }
   },
   "main": "dist/bc-lib.main.es.mjs",
-  "module": "dist/bc-lib.module.es.mjs",
+  "module": "dist/bc-lib.main.es.mjs",
   "browser": "dist/bc-lib.browser.min.mjs",
   "types": "./index.d.ts",
   "files": [
-    "dist"
+    "dist",
+    "computer.d.ts",
+    "index.d.ts"
   ],
   "scripts": {
     "clean": "npm run clean:logs",

packages/vite-template/package.json

@@ -15,9 +15,9 @@
     "lint:fix": "eslint . --fix",
     "preview": "vite preview",
     "start": "vite",
-    "test": "vitest run",
+    "test": "vitest run && npm run test:puppeteer:build:headless",
     "test:dev": "vitest",
-    "test:puppeteer": "vitest run --config vite.puppeteer.config.ts",
+    "test:puppeteer": "vitest run --config vitest.puppeteer.config.ts",
     "test:puppeteer:headless": "HEADLESS=true npm run test:puppeteer",
     "test:puppeteer:build:headless": "npm run build && (npm run preview & sleep 2 && URL=http://localhost:4173 HEADLESS=true npm run test:puppeteer && pkill -f 'vite preview')",
     "test:show": "npm run test 2>&1 | tee vite-template-test.log; if [ ${PIPESTATUS[0]} -ne 0 ]; then open vite-template-test.log; fi",

packages/vite-template/tailwind.config.js

@@ -1,14 +1,18 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: ["./src/**/*.{js,jsx,ts,tsx}", "../components/built/**/*.{js,jsx,ts,tsx}"],
-  darkMode: "media",
+  content: [
+    './src/**/*.{js,jsx,ts,tsx}',
+    '../components/built/**/*.{js,jsx,ts,tsx}',
+    './node_modules/@bitcoin-computer/components/built/**/*.{js,jsx,ts,tsx}',
+  ],
+  darkMode: 'media',
   theme: {
     extend: {
       colors: {
-        "blue-1": "#000F38",
-        "blue-2": "#002A99",
-        "blue-3": "#0046FF",
-        "blue-4": "#A7BFFF",
+        'blue-1': '#000F38',
+        'blue-2': '#002A99',
+        'blue-3': '#0046FF',
+        'blue-4': '#A7BFFF',
       },
     },
   },

packages/vite-template/tests/browser.test.ts

@@ -38,16 +38,16 @@ describe('Bitcoin Computer Tests', () => {
     await browser.close()
   })
 
-  it('should display the correct title', async () => {
+  it('should load the page and have correct headers', async () => {
     const response = await page.goto(process.env.URL ? process.env.URL : 'http://localhost:1032')
     const title = await page.title()
     expect(title).toBe('Vite + React + TS')
-    
-    expect(response).not.toBeNull();
+
+    expect(response).not.toBeNull()
     if (response) {
-      const headers = response.headers();
-      expect(headers['cross-origin-opener-policy']).toBe('same-origin');
-      expect(headers['cross-origin-embedder-policy']).toBe('require-corp');
+      const headers = response.headers()
+      expect(headers['cross-origin-opener-policy']).toBe('same-origin')
+      expect(headers['cross-origin-embedder-policy']).toBe('require-corp')
     }
   })
 

packages/vite-template/vite.config.ts

@@ -1,33 +1,18 @@
-/// <reference types="vitest" />
 /// <reference types="vite/client" />
 
 import { defineConfig, loadEnv } from 'vite'
 import react from '@vitejs/plugin-react'
-import path from 'path'
 
-// https://vitejs.dev/config/
 export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd(), '')
   return {
     plugins: [react()],
-    resolve: {
-      alias: {
-        // Define the alias pointing to the specific entry point in node_modules
-        '@bitcoin-computer/lib': path.resolve(__dirname, '../lib/dist/bc-lib.browser.min.mjs'),
-      },
-    },
     server: {
       port: parseInt(env.VITE_PORT),
       headers: {
-        "Cross-Origin-Opener-Policy": "same-origin",
-        "Cross-Origin-Embedder-Policy": "require-corp"
-      }
-    },
-    test: {
-      globals: true,
-      include: ['src/**/*.test.tsx'],
-      environment: 'jsdom',
-      setupFiles: ['./src/setupTests.ts'],
+        'Cross-Origin-Opener-Policy': 'same-origin',
+        'Cross-Origin-Embedder-Policy': 'require-corp',
+      },
     },
   }
 })

packages/vite-template/vitest.config.ts

@@ -0,0 +1,34 @@
+/// <reference types="vitest" />
+/// <reference types="vite/client" />
+
+import { defineConfig } from 'vitest/config'
+import baseConfig from './vite.config'
+import path from 'path'
+import fs from 'fs'
+
+function getAliasPath() {
+  const monorepoPath = path.resolve(__dirname, '../lib/dist/bc-lib.browser.min.mjs')
+  const standalonePath = path.resolve(
+    __dirname,
+    './node_modules/@bitcoin-computer/lib/dist/bc-lib.browser.min.mjs',
+  )
+  return fs.existsSync(monorepoPath) ? monorepoPath : standalonePath
+}
+
+export default defineConfig(({ mode }) => {
+  // Load the base Vite configuration
+  const base = baseConfig({ mode, command: 'serve' })
+
+  return {
+    ...base,
+    test: {
+      globals: true,
+      include: ['src/**/*.test.tsx'],
+      environment: 'jsdom',
+      setupFiles: ['./src/setupTests.ts'],
+      alias: {
+        '@bitcoin-computer/lib': getAliasPath(),
+      },
+    },
+  }
+})

packages/vite-template/vitest.puppeteer.config.ts

@@ -0,0 +1,20 @@
+/// <reference types="vitest" />
+/// <reference types="vite/client" />
+
+import { defineConfig } from 'vitest/config'
+import baseConfig from './vite.config'
+
+// Extend the core Vite configuration with Puppeteer-specific test settings
+export default defineConfig(({ mode }) => {
+  // Load the base Vite configuration
+  const base = baseConfig({ mode, command: 'serve' })
+
+  return {
+    ...base,
+    test: {
+      include: ['tests/**/*.test.ts'],
+      environment: 'node',
+      testTimeout: 30000,
+    },
+  }
+})