Skip to content

Commit 80b38da

Browse files
alpha912alpha912
committed
feat(website): add global styles, API live tester, expanded Developers page, nav update
1 parent fe4bd63 commit 80b38da

4 files changed

Lines changed: 141 additions & 12 deletions

File tree

‎app/api/page.tsx‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
"use client";
2+
3+
import { useState } from 'react';
4+
5+
export default function ApiPage() {
6+
const [baseUrl, setBaseUrl] = useState<string>(
7+
process.env.NEXT_PUBLIC_API_BASE || 'http://localhost:8000'
8+
);
9+
const [query, setQuery] = useState<string>('/collections/addresses/items?limit=5');
10+
const [resp, setResp] = useState<any>(null);
11+
const [loading, setLoading] = useState(false);
12+
const [error, setError] = useState<string | null>(null);
13+
14+
const run = async () => {
15+
setLoading(true);
16+
setError(null);
17+
setResp(null);
18+
try {
19+
const url = new URL(query, baseUrl).toString();
20+
const r = await fetch(url);
21+
const data = await r.json();
22+
if (!r.ok) throw new Error(data?.error || `HTTP ${r.status}`);
23+
setResp(data);
24+
} catch (e: any) {
25+
setError(e.message || String(e));
26+
} finally {
27+
setLoading(false);
28+
}
29+
};
30+
31+
return (
32+
<section>
33+
<h1>API</h1>
34+
<p>Try the reference API endpoints.</p>
35+
36+
<div style={{ display: 'grid', gap: 8, maxWidth: 720 }}>
37+
<label>
38+
API Base URL
39+
<input
40+
style={{ width: '100%', padding: 8, marginTop: 4 }}
41+
value={baseUrl}
42+
onChange={(e) => setBaseUrl(e.target.value)}
43+
placeholder="https://api.example.org"
44+
/>
45+
</label>
46+
<label>
47+
Path/Query
48+
<input
49+
style={{ width: '100%', padding: 8, marginTop: 4 }}
50+
value={query}
51+
onChange={(e) => setQuery(e.target.value)}
52+
placeholder="/collections/addresses/items?limit=5"
53+
/>
54+
</label>
55+
<div>
56+
<button className="btn" onClick={run} disabled={loading}>
57+
{loading ? 'Fetching…' : 'Fetch'}
58+
</button>
59+
</div>
60+
</div>
61+
62+
<div style={{ marginTop: 24 }}>
63+
{error && <div style={{ color: 'crimson' }}>Error: {error}</div>}
64+
{resp && (
65+
<div>
66+
<div>Type: {resp.type || '—'}</div>
67+
{Array.isArray(resp.features) && (
68+
<div>Features: {resp.features.length}</div>
69+
)}
70+
<pre style={{ background: '#f6f8fa', padding: 12, borderRadius: 8, overflowX: 'auto' }}>
71+
{JSON.stringify(resp, null, 2)}
72+
</pre>
73+
</div>
74+
)}
75+
</div>
76+
77+
<h2>Usage</h2>
78+
<p>JavaScript:</p>
79+
<pre style={{ background: '#f6f8fa', padding: 12, borderRadius: 8, overflowX: 'auto' }}>
80+
{`const url = 'https://bharataddress.github.io/collections/addresses/items?limit=5';
81+
const resp = await fetch(url);
82+
const data = await resp.json();`}
83+
</pre>
84+
85+
<p>Python (requests):</p>
86+
<pre style={{ background: '#f6f8fa', padding: 12, borderRadius: 8, overflowX: 'auto' }}>
87+
{`import requests
88+
url = 'https://bharataddress.github.io/collections/addresses/items?limit=5'
89+
r = requests.get(url, timeout=30)
90+
r.raise_for_status()
91+
data = r.json()`}
92+
</pre>
93+
</section>
94+
);
95+
}
96+

‎app/developers/page.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,13 @@ export default function DevelopersPage() {
2424
civic-tech groups, and developers.
2525
</p>
2626

27+
<h3>How to Join</h3>
28+
<ul>
29+
<li>Review the <a href="https://github.com/BharatAddress/governance/blob/main/charter.md">charter</a> and <a href="https://github.com/BharatAddress/governance/blob/main/decision-rules.md">decision rules</a>.</li>
30+
<li>Sign the <a href="https://github.com/BharatAddress/governance/blob/main/DCO">Developer Certificate of Origin (DCO)</a> in your PRs.</li>
31+
<li>Open an issue in the relevant repository to discuss features or integrations.</li>
32+
</ul>
33+
2734
<h2>API Quickstart</h2>
2835
<pre>
2936
uvicorn main:app --reload
@@ -37,4 +44,3 @@ uvicorn main:app --reload
3744
</section>
3845
);
3946
}
40-

‎app/globals.css‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
:root {
2+
--brand: #0366d6;
3+
}
4+
5+
html, body {
6+
font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Helvetica, Arial, sans-serif;
7+
margin: 0;
8+
color: #111;
9+
}
10+
11+
header, footer {
12+
padding: 16px 24px;
13+
border-bottom: 1px solid #eee;
14+
}
15+
16+
footer { border-top: 1px solid #eee; border-bottom: none; color: #666; text-align: center; }
17+
18+
main { max-width: 960px; margin: 0 auto; padding: 40px 24px; }
19+
20+
a { color: var(--brand); text-decoration: none; }
21+
a:hover { text-decoration: underline; }
22+
23+
.btn { display: inline-block; background: var(--brand); color: #fff; padding: 10px 14px; border-radius: 6px; text-decoration: none; }
24+
.btn.outline { background: #fff; border: 1px solid var(--brand); color: var(--brand); }
25+
26+
.nav a { margin-right: 16px; }
27+

‎app/layout.tsx‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import './globals.css'
2+
13
export const metadata = {
24
title: 'Bharat Address',
35
description: 'Open-source specs, API, clients, and tools for Bharat Address',
@@ -6,21 +8,19 @@ export const metadata = {
68
export default function RootLayout({ children }: { children: React.ReactNode }) {
79
return (
810
<html lang="en">
9-
<body style={{ fontFamily: 'system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Helvetica, Arial, sans-serif', margin: 0 }}>
10-
<header style={{ padding: '16px 24px', borderBottom: '1px solid #eee' }}>
11-
<a href="/" style={{ fontWeight: 700, fontSize: 18, color: '#111', textDecoration: 'none' }}>Bharat Address</a>
12-
<nav style={{ float: 'right' }}>
13-
<a href="/docs/" style={{ marginRight: 16 }}>Docs</a>
14-
<a href="/developers/" style={{ marginRight: 16 }}>Developers</a>
11+
<body>
12+
<header>
13+
<a href="/" style={{ fontWeight: 700, fontSize: 18 }}>Bharat Address</a>
14+
<nav className="nav" style={{ float: 'right' }}>
15+
<a href="/docs/">Docs</a>
16+
<a href="/developers/">Developers</a>
17+
<a href="/api/">API</a>
1518
<a href="https://github.com/BharatAddress" target="_blank" rel="noreferrer">GitHub</a>
1619
</nav>
1720
</header>
18-
<main style={{ maxWidth: 960, margin: '0 auto', padding: '40px 24px' }}>{children}</main>
19-
<footer style={{ borderTop: '1px solid #eee', padding: '16px 24px', textAlign: 'center', color: '#666' }}>
20-
© {new Date().getFullYear()} Bharat Address
21-
</footer>
21+
<main>{children}</main>
22+
<footer>© {new Date().getFullYear()} Bharat Address</footer>
2223
</body>
2324
</html>
2425
);
2526
}
26-

0 commit comments

Comments
 (0)