Fixed build for nft-vite, explorer-vite, and wallet-vite

packages/TBC20/src/token.ts

@@ -1,5 +1,4 @@
 /* eslint-disable max-classes-per-file */
-const { Contract } = await import('@bitcoin-computer/lib')
 
 export class Token extends Contract {
   amount: number

packages/TBC20/tsconfig.release.json

@@ -3,6 +3,7 @@
   "compilerOptions": {
     "rootDir": ".",
     "outDir": "build",
+    "types": ["node", "@bitcoin-computer/lib"],
     "removeComments": true,
     "declaration": true
   },

packages/explorer-vite/src/utils.ts

@@ -1,14 +1,14 @@
 export const getFnParamNames = function (fn: string) {
   const match = fn.toString().match(/\(.*?\)/)
-  return match ? match[0].replace(/[()]/gi, '').replace(/\s/gi, '').split(',') : []
+  return match ? match[0].replace(/[()]/gi, "").replace(/\s/gi, "").split(",") : []
 }
 
 export function isValidRevString(outId: string): boolean {
   return /^[0-9A-Fa-f]{64}:\d+$/.test(outId)
 }
 
 export function isValidRev(value: any): boolean {
-  return typeof value === 'string' && isValidRevString(value)
+  return typeof value === "string" && isValidRevString(value)
 }
 
 // eslint-disable-next-line
@@ -20,13 +20,13 @@ type JBasic = undefined | null | boolean | number | string | symbol | bigint
 type JArray = Json[]
 type JObject = { [x: string]: Json }
 
-const isJUndefined = (a: any): a is undefined => typeof a === 'undefined'
+const isJUndefined = (a: any): a is undefined => typeof a === "undefined"
 const isJNull = (a: any): a is null => a === null
-const isJBoolean = (a: any): a is boolean => typeof a === 'boolean'
-const isJNumber = (a: any): a is number => typeof a === 'number'
-const isJString = (a: any): a is string => typeof a === 'string'
-const isJSymbol = (a: any): a is symbol => typeof a === 'symbol'
-const isJBigInt = (a: any): a is bigint => typeof a === 'bigint'
+const isJBoolean = (a: any): a is boolean => typeof a === "boolean"
+const isJNumber = (a: any): a is number => typeof a === "number"
+const isJString = (a: any): a is string => typeof a === "string"
+const isJSymbol = (a: any): a is symbol => typeof a === "symbol"
+const isJBigInt = (a: any): a is bigint => typeof a === "bigint"
 const isJBasic = (a: any): a is JBasic =>
   isJNull(a) ||
   isJUndefined(a) ||
@@ -54,7 +54,7 @@ export const jsonMap =
     if (isJBasic(json)) return g(json)
     if (isJArray(json)) return g(json.map(jsonMap(g)))
     if (isJObject(json)) return g(objectMap(jsonMap(g))(json))
-    throw new Error('Unsupported type')
+    throw new Error("Unsupported type")
   }
 
 export const strip = (value: Json): Json => {
@@ -75,17 +75,17 @@ export const chunk = (arr: string[], chunkSize = 4): string[][] => {
 
 export const getValueForType = (type: string, stringValue: string) => {
   switch (type) {
-    case 'number':
+    case "number":
       return Number(stringValue)
-    case 'string':
+    case "string":
       return stringValue
-    case 'boolean':
+    case "boolean":
       return true // make this dynamic
-    case 'undefined':
+    case "undefined":
       return undefined
-    case 'null':
+    case "null":
       return null
-    case 'object':
+    case "object":
       return stringValue
     default:
       return Number(stringValue)
@@ -104,18 +104,18 @@ export const isValidHexadecimalPublicKey = (publicKey: string): boolean => {
 export const getErrorMessage = (error: any): string => {
   if (
     error?.response?.data?.error ===
-    'mandatory-script-verify-flag-failed (Operation not valid with the current stack size)'
+    "mandatory-script-verify-flag-failed (Operation not valid with the current stack size)"
   ) {
-    return 'You are not authorised to make changes to this smart object'
+    return "You are not authorised to make changes to this smart object"
   }
 
   if (error?.response?.data?.error) {
     return error?.response?.data?.error
   }
 
-  return error.message ? error.message : 'Error occurred'
+  return error.message ? error.message : "Error occurred"
 }
 
 // https://github.com/GoogleChromeLabs/jsbi/issues/30
 export const toObject = (obj: any) =>
-  JSON.stringify(obj, (key, value) => (typeof value === 'bigint' ? value.toString() : value), 2)
+  JSON.stringify(obj, (_, value) => (typeof value === "bigint" ? value.toString() : value), 2)

packages/nft-vite/src/components/Gallery.tsx

@@ -22,30 +22,25 @@ export type UserQuery<T extends Class> = Partial<{
 
 function NFTCard({ nft }: { nft: NFT }) {
   return (
-    <div className="w-full max-w-80 bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700 mb-4">
-      <Link
-        to={`/objects/${nft._id}`}
-        className="block font-medium text-blue-600 dark:text-blue-500 w-full"
-      >
-        <div className="w-full h-64 bg-gray-200 flex items-center justify-center">
-          <img className="max-h-full max-w-full object-contain" src={nft.url} alt="" />
-        </div>
-        <div className="p-5">
+    <>
+      <div className="bg-white border border-gray-200 rounded-lg shadow dark:bg-gray-800 dark:border-gray-700 mb-4">
+        <img className="h-auto rounded-t-lg max-w-full" src={nft.url} alt="" />
+        <div className="p-4 border-t">
           <h5
-            className="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white truncate"
+            className="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white break-words"
             title={nft.name}
           >
             {nft.name}
           </h5>
           <p
-            className="mb-3 font-normal text-gray-700 dark:text-gray-400 truncate"
+            className="mb-3 font-normal text-gray-700 dark:text-gray-400 break-words"
             title={nft.artist}
           >
             {nft.artist}
           </p>
         </div>
-      </Link>
-    </div>
+      </div>
+    </>
   )
 }
 
@@ -112,14 +107,65 @@ function ValueComponent({ rev, computer }: { rev: string; computer: Computer })
 }
 
 function FromRevs({ revs, computer }: { revs: string[]; computer: any }) {
+  const cols: string[][] = [[], [], [], []]
+
+  revs.forEach((rev, index) => {
+    const colNumber = index % 4
+    cols[colNumber].push(rev)
+  })
   return (
-    <div className="flex flex-wrap gap-4 mb-4 mt-4">
-      {revs.map((rev) => (
-        <div key={rev}>
-          <ValueComponent rev={rev} computer={computer} />
+    <>
+      <div className="grid grid-cols-1 md:grid-cols-4 gap-4">
+        <div className="grid gap-4">
+          {cols[0].map((rev) => (
+            <div key={rev}>
+              <Link
+                to={`/objects/${rev}`}
+                className="block font-medium text-blue-600 dark:text-blue-500"
+              >
+                <ValueComponent rev={rev} computer={computer} />
+              </Link>
+            </div>
+          ))}
         </div>
-      ))}
-    </div>
+        <div className="grid gap-4">
+          {cols[1].map((rev) => (
+            <div key={rev}>
+              <Link
+                to={`/objects/${rev}`}
+                className="block font-medium text-blue-600 dark:text-blue-500"
+              >
+                <ValueComponent rev={rev} computer={computer} />
+              </Link>
+            </div>
+          ))}
+        </div>
+        <div className="grid gap-4">
+          {cols[2].map((rev) => (
+            <div key={rev}>
+              <Link
+                to={`/objects/${rev}`}
+                className="block font-medium text-blue-600 dark:text-blue-500 w-full"
+              >
+                <ValueComponent rev={rev} computer={computer} />
+              </Link>
+            </div>
+          ))}
+        </div>
+        <div className="grid gap-4">
+          {cols[3].map((rev) => (
+            <div key={rev}>
+              <Link
+                to={`/objects/${rev}`}
+                className="block font-medium text-blue-600 dark:text-blue-500 w-full"
+              >
+                <ValueComponent rev={rev} computer={computer} />
+              </Link>
+            </div>
+          ))}
+        </div>
+      </div>
+    </>
   )
 }
 

packages/swap/build/src/buy.d.ts

@@ -1,6 +1,5 @@
 import { Transaction } from '@bitcoin-computer/nakamotojs';
 import { StaticSwapHelper } from './static-swap.js';
-declare const Contract: typeof import("@bitcoin-computer/lib/computer.js").Contract;
 export declare class Buy extends Contract {
     amount: number;
     constructor(price: number, amount: number, tokenRoot: string);
@@ -24,4 +23,3 @@ export declare class BuyHelper {
     isOpen(buy: Buy): Promise<boolean>;
     settleBuyOrder(swapTx: Transaction): Promise<string>;
 }
-export {};

packages/swap/build/src/buy.js

@@ -1,5 +1,4 @@
 import { StaticSwapHelper } from './static-swap.js';
-const { Contract } = await import('@bitcoin-computer/lib');
 export class Buy extends Contract {
     constructor(price, amount, tokenRoot) {
         super({ _amount: price, amount, tokenRoot });

packages/swap/src/buy.ts

@@ -2,8 +2,6 @@
 import { Transaction } from '@bitcoin-computer/nakamotojs'
 import { StaticSwapHelper } from './static-swap.js'
 
-const { Contract } = await import('@bitcoin-computer/lib')
-
 export class Buy extends Contract {
   amount: number
 

packages/wallet-vite/src/config.ts

@@ -0,0 +1,3 @@
+export const explorerURL = import.meta.env.VITE_EXPLORER_URL
+  ? import.meta.env.VITE_EXPLORER_URL
+  : ""