From 714208bc1268dda4986fc4239766042447684f4d Mon Sep 17 00:00:00 2001 From: Rayan Date: Mon, 23 Mar 2026 09:41:31 +0000 Subject: [PATCH 1/4] feat: add treasury dashboard with summary stats and donation feed --- src/App.tsx | 28 +++++++++++----- src/pages/Treasury.tsx | 73 ++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 93 insertions(+), 8 deletions(-) create mode 100644 src/pages/Treasury.tsx diff --git a/src/App.tsx b/src/App.tsx index 7fcb2be0..a890d8ef 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -5,12 +5,14 @@ import ConnectAccount from "./components/ConnectAccount" import { labPrefix } from "./contracts/util" import Debug from "./pages/Debug" import Home from "./pages/Home" +import Treasury from "./pages/Treasury" function App() { return ( }> } /> + } /> } /> } /> @@ -21,11 +23,27 @@ function App() { const AppLayout: React.FC = () => (
+ + {({ isActive }) => ( + + )} + + + {({ isActive }) => ( + + )} + {({ isActive }) => ( )} - - - } contentRight={} diff --git a/src/pages/Treasury.tsx b/src/pages/Treasury.tsx new file mode 100644 index 00000000..04bd7e8b --- /dev/null +++ b/src/pages/Treasury.tsx @@ -0,0 +1,73 @@ +import React, { useState, useEffect } from "react"; +import { Layout, Button, Icon } from "@stellar/design-system"; + +export default function Treasury() { + const [stats, setStats] = useState({ + totalTreasury: "125,000", + totalDisbursed: "45,000", + scholarsFunded: 120, + donorsCount: 85, + }); + + const [donations, setDonations] = useState([ + { id: 1, donor: "0xABC...123", amount: "500 USDC", time: "2 mins ago" }, + { id: 2, donor: "0xDEF...456", amount: "1,200 USDC", time: "15 mins ago" }, + { id: 3, donor: "0xGHI...789", amount: "250 USDC", time: "1 hour ago" }, + ]); + + return ( +
+

Community Treasury Dashboard

+ + {/* Summary Stats */} +
+ } /> + } /> + } /> + } /> +
+ +
+ {/* Recent Donations */} +
+

Recent Donations

+
+ {donations.map((d) => ( +
+ {d.donor} + {d.amount} + {d.time} +
+ ))} +
+
+ + {/* Treasury Health Chart Placeholder */} +
+

Treasury Health

+
+ [ Treasury Health Chart (Inflows vs Outflows) ] +
+
+
+ +
+ +
+
+ ); +} + +function StatCard({ title, value, icon }: { title: string; value: string | number; icon: React.ReactNode }) { + return ( +
+
+ {icon} + {title} +
+
{value}
+
+ ); +} From d3fbb16adcbb03e987098838eb95d568fceda995 Mon Sep 17 00:00:00 2001 From: Rayan Date: Mon, 23 Mar 2026 09:42:39 +0000 Subject: [PATCH 2/4] feat: add milestone progress tracker with on-chain status --- src/components/MilestoneTracker.tsx | 97 ++++++++++++++++++++++ src/pages/Home.tsx | 120 ++++++++++++++++------------ 2 files changed, 167 insertions(+), 50 deletions(-) create mode 100644 src/components/MilestoneTracker.tsx diff --git a/src/components/MilestoneTracker.tsx b/src/components/MilestoneTracker.tsx new file mode 100644 index 00000000..d636f561 --- /dev/null +++ b/src/components/MilestoneTracker.tsx @@ -0,0 +1,97 @@ +import React, { useState, useEffect } from "react"; +import { Icon, Button, Card, Badge } from "@stellar/design-system"; + +interface Milestone { + id: number; + label: string; + lrnReward: number; + status: "completed" | "in-progress" | "locked"; + txHash?: string; +} + +interface MilestoneTrackerProps { + courseId: string; + milestones: Milestone[]; +} + +export const MilestoneTracker: React.FC = ({ milestones }) => { + return ( +
+ {milestones.map((milestone, index) => ( +
+ {/* Progress Line */} + {index !== milestones.length - 1 && ( +
+ )} + + {/* Status Icon */} +
+
+ {milestone.status === "completed" ? ( + + ) : milestone.status === "in-progress" ? ( +
+ ) : ( + + )} +
+
+ + {/* Content Card */} + +
+

+ {milestone.label} +

+ + +{milestone.lrnReward} LRN + +
+ + {milestone.status === "completed" && milestone.txHash && ( + + )} + + {milestone.status === "in-progress" && ( +
+ +
+ )} + +
+ ))} +
+ ); +}; diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 11dd8982..86bd28ff 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -2,67 +2,87 @@ import { Button, Card, Icon } from "@stellar/design-system" import React from "react" import { Link } from "react-router-dom" import { GuessTheNumber } from "../components/GuessTheNumber" +import { MilestoneTracker } from "../components/MilestoneTracker" import { labPrefix } from "../contracts/util" import styles from "./Home.module.css" const Home: React.FC = () => (
-
-

Yay! You're on Stellar!

+
+
+

Yay! You're on Stellar!

-

- A local development template designed to help you build dApps on the - Stellar network. This environment lets you easily test wallet - connections, smart contract interactions, transaction verifications, - etc.{" "} - - View docs - -

-
+

+ A local development template designed to help you build dApps on the + Stellar network. This environment lets you easily test wallet + connections, smart contract interactions, transaction verifications, + etc.{" "} + + View docs + +

- -

- - Sample Contracts -

+
+

+ + Course Progress: Stellar Basics +

+ +
+
-

- Guess The Number: Interact with the sample contract - from the{" "} - - Scaffold Tutorial - {" "} - using an automatically generated contract client. -

+
+ +

+ + Sample Contracts +

- +

+ Guess The Number: Interact with the sample contract + from the{" "} + + Scaffold Tutorial + {" "} + using an automatically generated contract client. +

-

Or take a look at other sample contracts to get you started:

+ - - +

Or take a look at other sample contracts to get you started:

+ + + +
+

From 02d267609960ab8868a4013893a81c3975623850 Mon Sep 17 00:00:00 2001 From: Rayan Date: Mon, 23 Mar 2026 09:47:04 +0000 Subject: [PATCH 3/4] chore: revert projectID to Scaffold to match core repo --- src/App.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index a890d8ef..b90f23d1 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -23,8 +23,8 @@ function App() { const AppLayout: React.FC = () => (
From b60d53b54e59128b3024f5e8523da57a7e9d72cd Mon Sep 17 00:00:00 2001 From: Rayan Salhab Date: Wed, 25 Mar 2026 00:10:15 +0000 Subject: [PATCH 4/4] fix: add missing imports for Card, Layout, NavLink, ConnectAccount --- src/App.tsx | 5 ++++- src/pages/Home.tsx | 2 +- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index f6c58aef..749f787e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,4 +1,7 @@ -import { Routes, Route, Outlet } from "react-router-dom" +import { Button, Icon, Layout } from "@stellar/design-system" +import { Routes, Route, Outlet, NavLink } from "react-router-dom" +import styles from "./App.module.css" +import ConnectAccount from "./components/ConnectAccount" import ErrorBoundary from "./components/ErrorBoundary" import ComingSoon from "./components/ComingSoon" import Footer from "./components/Footer" diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 88780953..f5d52a0c 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -1,4 +1,4 @@ -import { Button, Icon } from "@stellar/design-system" +import { Button, Card, Icon } from "@stellar/design-system" import React from "react" import { useTranslation } from "react-i18next" import { Link } from "react-router-dom"