Project initialised with AlgoKit CLI using template: https://github.com/algorandfoundation/algokit-fullstack-template.git

2025-12-30 13:07:28 +00:00
commit 93e3f09667
95 changed files with 20233 additions and 0 deletions
--- a/projects/TokenizeRWATemplate-frontend/src/Home.tsx
+++ b/projects/TokenizeRWATemplate-frontend/src/Home.tsx
@ -0,0 +1,76 @@
+// src/components/Home.tsx
+import { useWallet } from '@txnlab/use-wallet-react'
+import React, { useState } from 'react'
+import ConnectWallet from './components/ConnectWallet'
+import Transact from './components/Transact'
+import AppCalls from './components/AppCalls'
+
+interface HomeProps {}
+
+const Home: React.FC<HomeProps> = () => {
+  const [openWalletModal, setOpenWalletModal] = useState<boolean>(false)
+  const [openDemoModal, setOpenDemoModal] = useState<boolean>(false)
+  const [appCallsDemoModal, setAppCallsDemoModal] = useState<boolean>(false)
+  const { activeAddress } = useWallet()
+
+  const toggleWalletModal = () => {
+    setOpenWalletModal(!openWalletModal)
+  }
+
+  const toggleDemoModal = () => {
+    setOpenDemoModal(!openDemoModal)
+  }
+
+  const toggleAppCallsModal = () => {
+    setAppCallsDemoModal(!appCallsDemoModal)
+  }
+
+  return (
+    <div className="hero min-h-screen bg-teal-400">
+      <div className="hero-content text-center rounded-lg p-6 max-w-md bg-white mx-auto">
+        <div className="max-w-md">
+          <h1 className="text-4xl">
+            Welcome to <div className="font-bold">AlgoKit 🙂</div>
+          </h1>
+          <p className="py-6">
+            This starter has been generated using official AlgoKit React template. Refer to the resource below for next steps.
+          </p>
+
+          <div className="grid">
+            <a
+              data-test-id="getting-started"
+              className="btn btn-primary m-2"
+              target="_blank"
+              href="https://github.com/algorandfoundation/algokit-cli"
+            >
+              Getting started
+            </a>
+
+            <div className="divider" />
+            <button data-test-id="connect-wallet" className="btn m-2" onClick={toggleWalletModal}>
+              Wallet Connection
+            </button>
+
+            {activeAddress && (
+              <button data-test-id="transactions-demo" className="btn m-2" onClick={toggleDemoModal}>
+                Transactions Demo
+              </button>
+            )}
+
+            {activeAddress && (
+              <button data-test-id="appcalls-demo" className="btn m-2" onClick={toggleAppCallsModal}>
+                Contract Interactions Demo
+              </button>
+            )}
+          </div>
+
+          <ConnectWallet openModal={openWalletModal} closeModal={toggleWalletModal} />
+          <Transact openModal={openDemoModal} setModalState={setOpenDemoModal} />
+          <AppCalls openModal={appCallsDemoModal} setModalState={setAppCallsDemoModal} />
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default Home