Mainnet readiness (#77)

* Add DemoEnvironment type

* More informative response for user-funds query

* Show real Ada balance and collateral UTxOs in frontend

* Fixes building the frontend

* Add missing adaOnlyOutputs

* Label

* Complete parameterisation

* Fix npm export

* Cosmetic changes

* Move compiled scripts to generated folder

* ?

* Update compiled scripts

* Fix CI

---------

Co-authored-by: Christian Hoener zu Siederdissen <[email protected]>

Author: j-mueller

.github/workflows/ci-compiled-scripts.yaml

@@ -44,6 +44,8 @@ jobs:
       - name: check compiled scripts are consistent
         # git diff --quiet implies --exit-code
         run: |
-          cabal run export-smart-tokens 08a8d0bb8717839931b0a594f7c28b0a3b7c78f6e9172e977e250eab7637d879.0 '"addr_test1qq986m3uel86pl674mkzneqtycyg7csrdgdxj6uf7v7kd857kquweuh5kmrj28zs8czrwkl692jm67vna2rf7xtafhpqk3hecm"'
+          cabal run export-smart-tokens ./generated/scripts/unapplied
+          cabal run export-smart-tokens ./generated/scripts/preview 08a8d0bb8717839931b0a594f7c28b0a3b7c78f6e9172e977e250eab7637d879.0 '"addr_test1qq986m3uel86pl674mkzneqtycyg7csrdgdxj6uf7v7kd857kquweuh5kmrj28zs8czrwkl692jm67vna2rf7xtafhpqk3hecm"'
+          cabal run export-smart-tokens ./generated/scripts/mainnet b1977c1eb33590ca1311384ab68cd36209832213ad4483feb8a1b7cb64828946.0 '"addr_test1qq986m3uel86pl674mkzneqtycyg7csrdgdxj6uf7v7kd857kquweuh5kmrj28zs8czrwkl692jm67vna2rf7xtafhpqk3hecm"'
           cabal run write-openapi-schema -- generated/openapi/schema.json
           git diff --quiet

.github/workflows/ci-nix.yaml

@@ -54,9 +54,3 @@ jobs:
       run: nix build --accept-flake-config .#wst-poc-cli
     - name: nix flake check
       run: nix flake --accept-flake-config check
-    - name: check compiled scripts are consistent
-      # git diff --quiet implies --exit-code
-      run: |
-        nix run --accept-flake-config .#export-smart-tokens 08a8d0bb8717839931b0a594f7c28b0a3b7c78f6e9172e977e250eab7637d879.0 '"addr_test1qq986m3uel86pl674mkzneqtycyg7csrdgdxj6uf7v7kd857kquweuh5kmrj28zs8czrwkl692jm67vna2rf7xtafhpqk3hecm"'
-        git diff --quiet
-

.gitignore

@@ -32,3 +32,4 @@ get-protocol-parameters.sh
 protocol-parameters-mainnet.json
 .pre-commit-config.yaml
 tags
+/mainnet

fix-cabal-fmt.sh

@@ -0,0 +1,3 @@
+#! /bin/bash
+
+fd --extension cabal --exclude 'dist-newstyle/*' --exclude 'dist/*' --exclude '.stack-work/*' --exec bash -c "cabal-fmt --inplace {}"

fix-fourmolu.sh

@@ -0,0 +1,3 @@
+#! /bin/bash
+
+fd --extension hs --exclude 'dist-newstyle/*' --exclude 'dist/*' --exclude '.stack-work/*' --exec bash -c "fourmolu --quiet --mode inplace {}"

frontend/src/app/[username]/index.tsx

@@ -1,6 +1,6 @@
 'use client';
 //React imports
-import React, { useEffect, useState } from 'react';
+import React, { useContext, useEffect, useState } from 'react';
 
 //Axios imports
 import axios from 'axios';
@@ -15,11 +15,13 @@ import { getWalletBalance, signAndSentTx } from '../utils/walletUtils';
 import WalletCard from '../components/Card';
 import WSTTextField from '../components/WSTTextField';
 import CopyTextField from '../components/CopyTextField';
+import DemoEnvironmentContext from '../context/demoEnvironmentContext';
 
 export default function Profile() {
   const { lucid, currentUser, mintAccount, changeAlertInfo, changeWalletAccountDetails } = useStore();
   const accounts = useStore((state) => state.accounts);
   const [overrideTx, setOverrideTx] = useState<boolean>(false);
+  const demoEnv = useContext(DemoEnvironmentContext);
 
   useEffect(() => {
     useStore.getState();
@@ -34,6 +36,16 @@ export default function Profile() {
     };
   };
 
+  const getUserMnemonic = () => {
+    switch (currentUser) {
+      case "Alice": return demoEnv.user_a;
+      case "Bob": return demoEnv.user_b;
+      case "Mint Authority": return demoEnv.mint_authority;
+      case "Connected Wallet": return ""; //TODO: this seems to be broken
+    };
+
+  }
+
   // temp state for each text field
   const [sendTokenAmount, setMintTokens] = useState(0);
   const [sendRecipientAddress, setsendRecipientAddress] = useState('address');
@@ -55,13 +67,14 @@ export default function Profile() {
       console.error("No valid send address found! Cannot send.");
       return;
     }
-    lucid.selectWallet.fromSeed(accountInfo.mnemonic);
+    lucid.selectWallet.fromSeed(getUserMnemonic());
+    lucid.wallet().address().then(console.log);
     const requestData = {
       asset_name: Buffer.from('WST', 'utf8').toString('hex'), // Convert "WST" to hex
-      issuer: mintAccount.address,
+      issuer: mintAccount.regular_address,
       quantity: sendTokenAmount,
       recipient: sendRecipientAddress,
-      sender: accountInfo.address,
+      sender: accountInfo.regular_address,
       submit_failing_tx: overrideTx
     };
     try {
@@ -78,17 +91,17 @@ export default function Profile() {
       const tx = await lucid.fromTx(response.data.cborHex);
       const txId = await signAndSentTx(lucid, tx);
       await updateAccountBalance(sendRecipientAddress);
-      await updateAccountBalance(accountInfo.address);
-      changeAlertInfo({severity: 'success', message: 'Transaction sent successfully!', open: true, link: `https://preview.cexplorer.io/tx/${txId}`});
+      await updateAccountBalance(accountInfo.regular_address);
+      changeAlertInfo({severity: 'success', message: 'Transaction sent successfully!', open: true, link: `${demoEnv.explorer_url}/${txId}`});
     } catch (error) {
       console.error('Send failed:', error);
     }
   };
 
   const updateAccountBalance = async (address: string) => {
-    const newAccountBalance = await getWalletBalance(address);
+    const newAccountBalance = await getWalletBalance(demoEnv, address);
       const walletKey = (Object.keys(accounts) as (keyof Accounts)[]).find(
-        (key) => accounts[key].address === address
+        (key) => accounts[key].regular_address === address
       );
       if (walletKey) {
         changeWalletAccountDetails(walletKey, {
@@ -123,9 +136,9 @@ export default function Profile() {
 
   const receiveContent =  <Box>
     <CopyTextField 
-      value={getUserAccountDetails()?.address ?? ''}
+      value={getUserAccountDetails()?.regular_address ?? ''}
       fullWidth={true}
-      label="Your Address"
+      label="Regular Address"
       />
   </Box>;
 
@@ -135,9 +148,9 @@ export default function Profile() {
         <Box>
           <Typography variant='h4'>Address Balance</Typography>
           <Typography variant='h1'>{getUserAccountDetails()?.balance.wst} WST</Typography>
-          <Typography variant='h5'>{getUserAccountDetails()?.balance.ada} Ada</Typography>
+          <Typography variant='h5'>{getUserAccountDetails()?.balance.ada} Ada { (getUserAccountDetails()?.balance.adaOnlyOutputs === 0) && (<span>({getUserAccountDetails()?.balance.adaOnlyOutputs} collateral UTxOs)</span>)}</Typography>
         </Box>
-        <Typography variant='h5'>{getUserAccountDetails()?.address.slice(0,15)}</Typography>
+        <Typography variant='h5'>{getUserAccountDetails()?.regular_address.slice(0,15)}</Typography>
         </Box>
         <div className="cardWrapperParent">
           <WalletCard tabs={[

frontend/src/app/clientLayout.tsx

@@ -1,6 +1,6 @@
 "use client";
 //React imports 
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 
 //Mui imports
 import { AppRouterCacheProvider } from '@mui/material-nextjs/v15-appRouter';
@@ -13,24 +13,56 @@ import { makeLucid, getWalletFromSeed } from "./utils/walletUtils";
 import useStore from './store/store'; 
 import WSTAppBar from "./components/WSTAppBar";
 import AlertBar from './components/AlertBar';
+import { DemoEnvironment, previewEnv } from "./store/types";
+import axios from "axios";
+import DemoEnvironmentContext from "./context/demoEnvironmentContext";
+
+async function loadDemoEnvironment(): Promise<DemoEnvironment> {
+  const response = await axios.get<DemoEnvironment>("/api/v1/demo-environment",
+    {
+      headers: {
+        'Content-Type': 'application/json;charset=utf-8', 
+      },
+    });
+  return response?.data;
+}
+
+async function getProgrammableTokenAddress(regular_address: string) {
+  const response = await axios.get<string>(`/api/v1/query/address/${regular_address}`,
+    {
+      headers: {
+        'Content-Type': 'application/json;charset=utf-8', 
+      },
+    });
+  return response?.data;
+}
+
 
 export default function ClientLayout({ children }: { children: React.ReactNode }) {
     const { mintAccount, accounts, changeMintAccountDetails, changeWalletAccountDetails, setLucidInstance } = useStore();
+    const [demoEnv, setDemoEnv] = useState<DemoEnvironment>(previewEnv);
 
     useEffect(() => {
         const fetchUserWallets = async () => {
           try {
+            const demoEnv = await loadDemoEnvironment();
+            console.log("DemoEnvironment:", demoEnv);
+            setDemoEnv(demoEnv);
+
             // retrieve wallet info
-            const mintAuthorityWallet = await getWalletFromSeed(mintAccount.mnemonic);
-            const walletA = await getWalletFromSeed(accounts.alice.mnemonic);
-            const walletB = await getWalletFromSeed(accounts.bob.mnemonic);
+            const mintAuthorityWallet = await getWalletFromSeed(demoEnv, demoEnv.mint_authority);
+            const walletA = await getWalletFromSeed(demoEnv, demoEnv.user_a);
+            const walletB = await getWalletFromSeed(demoEnv, demoEnv.user_b);
+            const walletATokenAddr = await getProgrammableTokenAddress(walletA.address);
+            const walletBTokenAddr = await getProgrammableTokenAddress(walletB.address);
+            const mintAuthorityTokenAddr = await getProgrammableTokenAddress(mintAuthorityWallet.address);
 
             // Update Zustand store with the initialized wallet information
-            changeMintAccountDetails({ ...mintAccount, address: mintAuthorityWallet.address});
-            changeWalletAccountDetails('alice', { ...accounts.alice, address: walletA.address},);
-            changeWalletAccountDetails('bob', { ...accounts.bob, address: walletB.address});
+            changeMintAccountDetails({ ...mintAccount, regular_address: mintAuthorityWallet.address, programmable_token_address: mintAuthorityTokenAddr});
+            changeWalletAccountDetails('alice', { ...accounts.alice, regular_address: walletA.address, programmable_token_address: walletATokenAddr},);
+            changeWalletAccountDetails('bob', { ...accounts.bob, regular_address: walletB.address, programmable_token_address: walletBTokenAddr});
 
-            const initialLucid = await makeLucid();
+            const initialLucid = await makeLucid(demoEnv);
             setLucidInstance(initialLucid);
             console.log('Wallets initialized');
           } catch (error) {
@@ -41,7 +73,7 @@ export default function ClientLayout({ children }: { children: React.ReactNode }
         fetchUserWallets();
       },[]);
 
-  if(accounts.bob.address === '') {
+  if(accounts.bob.regular_address === '') {
     return <div className="mainLoadingContainer">
     <div className="mainLoader" />
   </div>;
@@ -50,12 +82,14 @@ export default function ClientLayout({ children }: { children: React.ReactNode }
   return (
     <AppRouterCacheProvider>
       <ThemeModeProvider>
+      <DemoEnvironmentContext.Provider value={demoEnv}>
         <main>
           <WSTAppBar />
           <NavDrawer />
           <div className="contentSection">{children}</div>
           <AlertBar/>
         </main>
+        </DemoEnvironmentContext.Provider>
       </ThemeModeProvider>
     </AppRouterCacheProvider>
   );

frontend/src/app/components/ProfileSwitcher.tsx

@@ -16,13 +16,15 @@ import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
 import useStore from '../store/store'; 
 import { UserName } from '../store/types';
 import { selectLucidWallet, getWalletBalance } from '../utils/walletUtils';
+import DemoEnvironmentContext from '../context/demoEnvironmentContext';
 
 export default function ProfileSwitcher() {
   const [anchorEl, setAnchorEl] = React.useState<HTMLElement | null>(null);
   const { currentUser, accounts, changeWalletAccountDetails } = useStore();
   const lucid = useStore(state => state.lucid);
   const changeUserAccount = useStore(state => state.changeUserAccount);
   const router = useRouter();
+  const demoContext = React.useContext(DemoEnvironmentContext);
 
   React.useEffect(() => {
     // Check the current path and redirect if the currentUser doesn't match
@@ -62,10 +64,10 @@ export default function ProfileSwitcher() {
   const handleWalletConnect = async (user: UserName) => {
     await selectLucidWallet(lucid, "Lace");
     const userAddress = await lucid.wallet().address();
-    const userBalance = await getWalletBalance(userAddress);
+    const userBalance = await getWalletBalance(demoContext, userAddress);
     changeWalletAccountDetails('walletUser', {
       ...accounts.walletUser,
-      address: userAddress,
+      regular_address: userAddress,
       balance: userBalance,
     });
     handleSelect(user);

frontend/src/app/components/WSTAppBar.tsx

@@ -19,9 +19,9 @@ export default function WSTAppBar() {
                 src="/assets/WST_logo.png"
                 width={53}
                 height={39}
-                alt="Logo for Wyoming Stable Token"
+                alt="Logo for WST"
                 />
-                <Typography variant='h3'>Wyoming Stable Token</Typography>
+                <Typography variant='h3'>CIP-0143 Progammable Token Demo</Typography>
             </Box>
             <ProfileSwitcher />
         </Toolbar>

frontend/src/app/components/WSTTable.tsx

@@ -16,20 +16,22 @@ import ContentCopyIcon from '@mui/icons-material/ContentCopy';
 
 //Local Imports
 import useStore from '../store/store'; 
-import { useEffect } from "react";
+import { useContext, useEffect } from "react";
 import IconButton from './WSTIconButton';
+import DemoEnvironmentContext from "../context/demoEnvironmentContext";
 
-const progLogicBase : LucidCredential = {
-  type: "Script",
-  hash: "fca77bcce1e5e73c97a0bfa8c90f7cd2faff6fd6ed5b6fec1c04eefa"
-}
-
-const stableCoin : Unit = toUnit("b34a184f1f2871aa4d33544caecefef5242025f45c3fa5213d7662a9", "575354")
 
 
 export default function WSTTable() {
   const { lucid, accounts } = useStore();
   const accountArray = Object.values(accounts);
+  const demoEnv = useContext(DemoEnvironmentContext);
+  const stableCoin : Unit = toUnit(demoEnv.minting_policy, demoEnv.token_name);
+  
+  const progLogicBase : LucidCredential = {
+    type: "Script",
+    hash: demoEnv.prog_logic_base_hash
+  }
 
   const getAccounts = async () => {
     const progUTxOs : UTxO[] = await lucid.utxosAtWithUnit(progLogicBase, stableCoin);
@@ -55,18 +57,23 @@ export default function WSTTable() {
       <Table size="small" aria-label="simple table" stickyHeader>
       <TableHead>
         <TableRow>
-          <TableCell>Address</TableCell>
+          <TableCell>Regular Address</TableCell>
+          <TableCell>Programmable Address</TableCell>
           <TableCell>Address Status</TableCell>
           <TableCell align="right">Address Balance</TableCell>
         </TableRow>
       </TableHead>
       <TableBody>
         {
-          accountArray.filter((acct) => acct.address !== "").map((acct, i) => (
+          accountArray.filter((acct) => acct.regular_address !== "").map((acct, i) => (
             <TableRow key={i}>
               <TableCell>
-                  {`${acct?.address.slice(0,15)}...${acct?.address.slice(104,108)}`}
-                  <IconButton onClick={() => copyToClipboard(acct.address)} icon={<ContentCopyIcon />}/>
+                  {`${acct?.regular_address.slice(0,15)}...${acct?.regular_address.slice(104,108)}`}
+                  <IconButton onClick={() => copyToClipboard(acct.regular_address)} icon={<ContentCopyIcon />}/>
+              </TableCell>
+              <TableCell>
+                  {`${acct?.programmable_token_address.slice(0,15)}...${acct?.programmable_token_address.slice(104,108)}`}
+                  <IconButton onClick={() => copyToClipboard(acct.programmable_token_address)} icon={<ContentCopyIcon />}/>
               </TableCell>
               <TableCell sx={{color: acct.status === 'Frozen' ? 'error.main' : 'success.main', fontWeight: '500'}}>
                   {acct.status}

frontend/src/app/context/demoEnvironmentContext.ts

@@ -0,0 +1,6 @@
+import { createContext } from "react";
+import { DemoEnvironment, previewEnv } from "../store/types";
+
+const DemoEnvironmentContext = createContext<DemoEnvironment>(previewEnv);
+
+export default DemoEnvironmentContext;

frontend/src/app/layout.tsx

@@ -6,7 +6,7 @@ import "./styles/globals.css";
 import ClientLayout from "./clientLayout";
 
 export const metadata: Metadata = {
-  title: "Wyoming Stable Token",
+  title: "WST - Programmable token demonstration",
   description: "Created by the djed team at IOG",
 };