Skip to content

Commit 03e43af

Browse files
ZYJLiuZYJLiu
committed
refactor
1 parent 558bd09 commit 03e43af

File tree

16 files changed

+458
-276
lines changed

16 files changed

+458
-276
lines changed

‎frontend/anchor-idl/idl.json‎

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
{
2+
"address": "8PY1q5J3Aq2z7TBDLBrVjv77mYzjXSCz6iHQaFEFw9hY",
3+
"metadata": {
4+
"name": "counter",
5+
"version": "0.1.0",
6+
"spec": "0.1.0",
7+
"description": "Created with Anchor"
8+
},
9+
"instructions": [
10+
{
11+
"name": "decrement",
12+
"discriminator": [106, 227, 168, 59, 248, 27, 150, 101],
13+
"accounts": [
14+
{
15+
"name": "user",
16+
"writable": true,
17+
"signer": true
18+
},
19+
{
20+
"name": "counter",
21+
"writable": true,
22+
"pda": {
23+
"seeds": [
24+
{
25+
"kind": "const",
26+
"value": [99, 111, 117, 110, 116, 101, 114]
27+
}
28+
]
29+
}
30+
},
31+
{
32+
"name": "vault",
33+
"writable": true,
34+
"pda": {
35+
"seeds": [
36+
{
37+
"kind": "const",
38+
"value": [118, 97, 117, 108, 116]
39+
},
40+
{
41+
"kind": "account",
42+
"path": "user"
43+
}
44+
]
45+
}
46+
},
47+
{
48+
"name": "system_program",
49+
"address": "11111111111111111111111111111111"
50+
}
51+
],
52+
"args": []
53+
},
54+
{
55+
"name": "increment",
56+
"discriminator": [11, 18, 104, 9, 104, 174, 59, 33],
57+
"accounts": [
58+
{
59+
"name": "user",
60+
"writable": true,
61+
"signer": true
62+
},
63+
{
64+
"name": "counter",
65+
"writable": true,
66+
"pda": {
67+
"seeds": [
68+
{
69+
"kind": "const",
70+
"value": [99, 111, 117, 110, 116, 101, 114]
71+
}
72+
]
73+
}
74+
},
75+
{
76+
"name": "vault",
77+
"writable": true,
78+
"pda": {
79+
"seeds": [
80+
{
81+
"kind": "const",
82+
"value": [118, 97, 117, 108, 116]
83+
},
84+
{
85+
"kind": "account",
86+
"path": "user"
87+
}
88+
]
89+
}
90+
},
91+
{
92+
"name": "system_program",
93+
"address": "11111111111111111111111111111111"
94+
}
95+
],
96+
"args": []
97+
}
98+
],
99+
"accounts": [
100+
{
101+
"name": "Counter",
102+
"discriminator": [255, 176, 4, 245, 188, 253, 124, 25]
103+
}
104+
],
105+
"errors": [
106+
{
107+
"code": 6000,
108+
"name": "UnderflowError",
109+
"msg": "Counter cannot be decremented below zero"
110+
}
111+
],
112+
"types": [
113+
{
114+
"name": "Counter",
115+
"type": {
116+
"kind": "struct",
117+
"fields": [
118+
{
119+
"name": "count",
120+
"type": "u64"
121+
}
122+
]
123+
}
124+
}
125+
]
126+
}

‎frontend/anchor-idl/idl.ts‎

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
/**
2+
* Program IDL in camelCase format in order to be used in JS/TS.
3+
*
4+
* Note that this is only a type helper and is not the actual IDL. The original
5+
* IDL can be found at `target/idl/counter.json`.
6+
*/
7+
export type Counter = {
8+
address: "8PY1q5J3Aq2z7TBDLBrVjv77mYzjXSCz6iHQaFEFw9hY";
9+
metadata: {
10+
name: "counter";
11+
version: "0.1.0";
12+
spec: "0.1.0";
13+
description: "Created with Anchor";
14+
};
15+
instructions: [
16+
{
17+
name: "decrement";
18+
discriminator: [106, 227, 168, 59, 248, 27, 150, 101];
19+
accounts: [
20+
{
21+
name: "user";
22+
writable: true;
23+
signer: true;
24+
},
25+
{
26+
name: "counter";
27+
writable: true;
28+
pda: {
29+
seeds: [
30+
{
31+
kind: "const";
32+
value: [99, 111, 117, 110, 116, 101, 114];
33+
}
34+
];
35+
};
36+
},
37+
{
38+
name: "vault";
39+
writable: true;
40+
pda: {
41+
seeds: [
42+
{
43+
kind: "const";
44+
value: [118, 97, 117, 108, 116];
45+
},
46+
{
47+
kind: "account";
48+
path: "user";
49+
}
50+
];
51+
};
52+
},
53+
{
54+
name: "systemProgram";
55+
address: "11111111111111111111111111111111";
56+
}
57+
];
58+
args: [];
59+
},
60+
{
61+
name: "increment";
62+
discriminator: [11, 18, 104, 9, 104, 174, 59, 33];
63+
accounts: [
64+
{
65+
name: "user";
66+
writable: true;
67+
signer: true;
68+
},
69+
{
70+
name: "counter";
71+
writable: true;
72+
pda: {
73+
seeds: [
74+
{
75+
kind: "const";
76+
value: [99, 111, 117, 110, 116, 101, 114];
77+
}
78+
];
79+
};
80+
},
81+
{
82+
name: "vault";
83+
writable: true;
84+
pda: {
85+
seeds: [
86+
{
87+
kind: "const";
88+
value: [118, 97, 117, 108, 116];
89+
},
90+
{
91+
kind: "account";
92+
path: "user";
93+
}
94+
];
95+
};
96+
},
97+
{
98+
name: "systemProgram";
99+
address: "11111111111111111111111111111111";
100+
}
101+
];
102+
args: [];
103+
}
104+
];
105+
accounts: [
106+
{
107+
name: "counter";
108+
discriminator: [255, 176, 4, 245, 188, 253, 124, 25];
109+
}
110+
];
111+
errors: [
112+
{
113+
code: 6000;
114+
name: "underflowError";
115+
msg: "Counter cannot be decremented below zero";
116+
}
117+
];
118+
types: [
119+
{
120+
name: "counter";
121+
type: {
122+
kind: "struct";
123+
fields: [
124+
{
125+
name: "count";
126+
type: "u64";
127+
}
128+
];
129+
};
130+
}
131+
];
132+
};

‎frontend/app/layout.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1-
import type { Metadata } from "next";
2-
import { Geist, Geist_Mono } from "next/font/google";
3-
import { SolanaProvider } from "@/lib/solana-provider";
41
import "./globals.css";
52
import "@solana/wallet-adapter-react-ui/styles.css";
3+
4+
import { Geist, Geist_Mono } from "next/font/google";
5+
6+
import type { Metadata } from "next";
7+
import { SolanaProvider } from "@/components/counter/provider/Solana";
68
import { Toaster } from "sonner";
79

810
const geistSans = Geist({

‎frontend/app/page.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import SolanaCounter from "@/components/counter";
1+
import { CounterCard } from "@/components/counter/CounterCard";
22

33
export default function Home() {
44
return (
@@ -10,12 +10,12 @@ export default function Home() {
1010
Solana Counter App
1111
</h1>
1212
<p className="text-gray-400">
13-
A minimal dApp built with Anchor & Shadcn UI
13+
A minimal dApp built with Anchor & Next.js
1414
</p>
1515
</div>
1616

1717
<div className="relative z-10">
18-
<SolanaCounter />
18+
<CounterCard />
1919
</div>
2020

2121
<footer className="mt-20 text-center text-sm text-gray-500 relative z-10">

‎frontend/components/counter/SolanaCounter.tsx‎ renamed to ‎frontend/components/counter/CounterCard.tsx‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,27 @@
11
"use client";
2-
import React from "react";
2+
33
import { Card, CardContent } from "@/components/ui/card";
4-
import { WalletButton } from "./WalletButton";
4+
55
import { CounterDisplay } from "./CounterDisplay";
6+
import { DecrementButton } from "./DecrementButton";
67
import { IncrementButton } from "./IncrementButton";
8+
import React from "react";
9+
import { WalletButton } from "./WalletButton";
710

811
/**
9-
* SolanaCounter is the main component for the Counter dApp.
12+
* CounterCard is the main component for the Counter dApp.
1013
* It provides a user interface for interacting with a Solana counter program.
11-
*
12-
* In this refactored version, each component is responsible for its own
13-
* functionality:
14-
* - WalletConnectSection: Handles wallet connection UI
15-
* - CounterDisplay: Fetches and displays the counter value
16-
* - IncrementButton: Handles transactions to increment the counter
1714
*/
18-
export function SolanaCounter() {
15+
export function CounterCard() {
1916
return (
2017
<Card className="w-[350px] mx-auto border-gray-800 bg-gray-900/70 backdrop-blur-sm shadow-xl shadow-purple-900/10">
2118
<CardContent className="flex flex-col items-center py-6 space-y-6">
2219
<WalletButton />
2320
<CounterDisplay />
24-
<IncrementButton />
21+
<div className="flex flex-col w-full items-center space-y-3">
22+
<IncrementButton />
23+
<DecrementButton />
24+
</div>
2525
</CardContent>
2626
</Card>
2727
);

‎frontend/components/counter/CounterDisplay.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,22 @@
11
"use client";
2-
import React, { useState, useEffect, useCallback } from "react";
3-
import { useSolanaCounter } from "./useSolanaCounter";
2+
3+
import React, { useCallback, useEffect, useState } from "react";
4+
5+
import { useProgram } from "./hooks/useProgram";
46

57
/**
68
* CounterDisplay component that displays the current counter value
79
* and handles its own data fetching logic.
810
*/
911
export function CounterDisplay() {
1012
// Get program information from the hook
11-
const { program, counterAddress, connection } = useSolanaCounter();
13+
const { program, counterAddress, connection } = useProgram();
1214

1315
// Local state
1416
const [counterValue, setCounterValue] = useState<number | null>(null);
1517
const [isFetchingCounter, setIsFetchingCounter] = useState(true);
1618

17-
// Fetch counter value from the chain
19+
// Fetch counter account to get the count value
1820
const fetchCounterValue = useCallback(async () => {
1921
if (!connection || !program) return;
2022

@@ -68,7 +70,7 @@ export function CounterDisplay() {
6870
};
6971
} catch (err) {
7072
console.error("Error setting up account subscription:", err);
71-
return () => {}; // Empty cleanup function
73+
return () => {};
7274
}
7375
}, [connection, counterAddress, program]);
7476

0 commit comments

Comments
 (0)