Skip to content

Commit 5df05c2

Browse files
zeativezeative
committed
feat(docs): auto-derived sitemap (fix 5 missing pages), branded 404, StackBlitz runnable examples
1 parent e13271c commit 5df05c2

7 files changed

Lines changed: 148 additions & 28 deletions

File tree

‎docs/app/components/stackblitz.jsx‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
'use client'
2+
3+
import sdk from '@stackblitz/sdk'
4+
5+
const PKG = (deps) =>
6+
JSON.stringify(
7+
{
8+
name: 'zaileys-example',
9+
type: 'module',
10+
scripts: { start: 'tsx index.ts' },
11+
dependencies: { zaileys: 'latest', tsx: 'latest', ...deps },
12+
},
13+
null,
14+
2,
15+
) + '\n'
16+
17+
const README = `# Zaileys example
18+
19+
Runs in StackBlitz WebContainer (Node). Pure-JS paths (connect, events, text)
20+
work here; media/sticker features need native ffmpeg and won't run in-browser —
21+
use them locally instead. Docs: https://zeative.github.io/zaileys
22+
`
23+
24+
export default function StackBlitz({ code, title = 'Zaileys example', description = 'Runnable Zaileys snippet', deps, label = 'Open in StackBlitz' }) {
25+
const open = () =>
26+
sdk.openProject(
27+
{
28+
title,
29+
description,
30+
template: 'node',
31+
files: {
32+
'index.ts': code.trim() + '\n',
33+
'package.json': PKG(deps),
34+
'README.md': README,
35+
},
36+
},
37+
{ newWindow: true, openFile: 'index.ts' },
38+
)
39+
40+
return (
41+
<button
42+
onClick={open}
43+
title="Open this example in StackBlitz"
44+
style={{
45+
display: 'inline-flex',
46+
alignItems: 'center',
47+
gap: '0.5rem',
48+
padding: '0.45rem 0.85rem',
49+
marginTop: '0.5rem',
50+
fontSize: '0.85rem',
51+
fontWeight: 600,
52+
color: '#fff',
53+
background: '#1389fd',
54+
border: 'none',
55+
borderRadius: 8,
56+
cursor: 'pointer',
57+
}}
58+
>
59+
<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor" aria-hidden>
60+
<path d="M10.797 14.182H3.635L16.728 0l-3.525 9.818h7.162L7.272 24l3.525-9.818z" />
61+
</svg>
62+
{label}
63+
</button>
64+
)
65+
}

‎docs/app/not-found.jsx‎

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,44 @@
11
import { NotFoundPage } from 'nextra-theme-docs'
22

3+
const basePath = process.env.NEXT_PUBLIC_BASE_PATH ?? ''
4+
5+
const links = [
6+
{ href: '/', label: 'Introduction' },
7+
{ href: '/getting-started', label: 'Getting Started' },
8+
{ href: '/sending-messages', label: 'Sending Messages' },
9+
{ href: '/api-reference', label: 'API Reference' },
10+
{ href: '/troubleshooting', label: 'Troubleshooting & FAQ' },
11+
]
12+
313
export default function NotFound() {
414
return (
515
<NotFoundPage content="Report a broken link" labels="broken-link">
6-
<h1>404 — Page not found</h1>
16+
<div style={{ textAlign: 'center', maxWidth: 560, margin: '0 auto' }}>
17+
<div style={{ fontSize: '5rem', fontWeight: 800, lineHeight: 1, letterSpacing: '-0.04em', opacity: 0.9 }}>404</div>
18+
<h1 style={{ marginTop: '0.5rem' }}>This page got disconnected</h1>
19+
<p style={{ opacity: 0.7, marginTop: '0.5rem' }}>
20+
The page you’re looking for doesn’t exist or was moved. Try the search above, or jump to a popular page:
21+
</p>
22+
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.5rem', justifyContent: 'center', marginTop: '1.25rem' }}>
23+
{links.map((l) => (
24+
<a
25+
key={l.href}
26+
href={`${basePath}${l.href === '/' ? '' : l.href}`}
27+
style={{
28+
padding: '0.4rem 0.85rem',
29+
fontSize: '0.85rem',
30+
fontWeight: 500,
31+
borderRadius: 999,
32+
border: '1px solid light-dark(rgba(0,0,0,0.14), rgba(255,255,255,0.16))',
33+
textDecoration: 'none',
34+
color: 'inherit',
35+
}}
36+
>
37+
{l.label}
38+
</a>
39+
))}
40+
</div>
41+
</div>
742
</NotFoundPage>
843
)
944
}

‎docs/app/sitemap.ts‎

Lines changed: 16 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,25 @@
11
import type { MetadataRoute } from 'next'
2+
import { readdirSync, statSync } from 'node:fs'
3+
import { join } from 'node:path'
24

35
const SITE_URL = process.env.DOCS_SITE_URL ?? 'https://zeative.github.io/zaileys'
6+
const contentDir = join(process.cwd(), 'content')
47

5-
const PAGES = [
6-
'',
7-
'installation',
8-
'getting-started',
9-
'configuration',
10-
'client',
11-
'events',
12-
'sending-messages',
13-
'media',
14-
'interactive',
15-
'rich-responses',
16-
'commands',
17-
'automation',
18-
'storage',
19-
'error-handling',
20-
'runtimes',
21-
'troubleshooting',
22-
'api-reference',
23-
'skill',
24-
]
8+
const HIGH = new Set(['getting-started', 'installation', 'configuration'])
259

2610
export const dynamic = 'force-static'
2711

2812
export default function sitemap(): MetadataRoute.Sitemap {
29-
const lastModified = new Date()
30-
return PAGES.map((slug) => ({
31-
url: slug ? `${SITE_URL}/${slug}/` : `${SITE_URL}/`,
32-
lastModified,
33-
changeFrequency: slug ? 'weekly' : 'daily',
34-
priority: slug ? (['getting-started', 'installation'].includes(slug) ? 0.9 : 0.8) : 1,
35-
}))
13+
const files = readdirSync(contentDir).filter((f) => f.endsWith('.mdx'))
14+
return files.map((file) => {
15+
const slug = file.replace(/\.mdx$/, '')
16+
const isHome = slug === 'index'
17+
const lastModified = statSync(join(contentDir, file)).mtime
18+
return {
19+
url: isHome ? `${SITE_URL}/` : `${SITE_URL}/${slug}/`,
20+
lastModified,
21+
changeFrequency: isHome ? 'daily' : 'weekly',
22+
priority: isHome ? 1 : HIGH.has(slug) ? 0.9 : 0.8,
23+
}
24+
})
3625
}

‎docs/content/getting-started.mdx‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,27 @@ client.on('text', async (msg) => {
7070
})
7171
```
7272

73+
<StackBlitz
74+
title="Zaileys — Echo Bot"
75+
description="Minimal Zaileys echo bot: connect, scan QR, reply to text."
76+
code={`import { Client } from 'zaileys'
77+
78+
const client = new Client()
79+
80+
client.on('qr', ({ qrString }) => console.log('Scan QR:', qrString))
81+
client.on('connect', ({ me }) => console.log('Connected as', me.id))
82+
83+
client.on('text', async (msg) => {
84+
await msg.reply(\`Echo: \${msg.text}\`)
85+
})`}
86+
/>
87+
88+
<Callout type="info">
89+
The StackBlitz sandbox runs in a browser WebContainer — connection, events, and
90+
text replies work there. Media and sticker features need native `ffmpeg`, so run
91+
those locally.
92+
</Callout>
93+
7394
### Run it and authenticate
7495

7596
Run the file with your runtime of choice, then link the device from your phone.

‎docs/mdx-components.jsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
import { useMDXComponents as getThemeComponents } from 'nextra-theme-docs'
22
import DocH1 from './app/components/doc-h1'
3+
import StackBlitz from './app/components/stackblitz'
34

45
export function useMDXComponents(components) {
56
return {
67
...getThemeComponents(),
78
h1: DocH1,
9+
StackBlitz,
810
...components,
911
}
1012
}

‎docs/package-lock.json‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
"start": "next start"
1313
},
1414
"dependencies": {
15+
"@stackblitz/sdk": "^1.11.0",
1516
"@theguild/remark-mermaid": "^0.3.0",
1617
"next": "^15.5.4",
1718
"nextra": "4.2.17",

0 commit comments

Comments
 (0)