Skip to content

Commit 468a81b

Browse files
Kyle McLarenclaude
Kyle McLaren
and
claude
committed
Use data-method attrs for sidebar icons, collapse groups by default
- Switch from text badges to data-method attributes for proper SVG icon styling - Collapse nested groups by default (collapsed: true) - Add WSS method icon styles (lightning bolt) - Add CSS selectors to unbold nested group labels 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
1 parent 2d39324 commit 468a81b

File tree

3 files changed

+58
-183
lines changed

3 files changed

+58
-183
lines changed

‎scripts/generate-api-docs.ts‎

Lines changed: 7 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1196,21 +1196,8 @@ interface SidebarGroup {
11961196

11971197
type SidebarItem = SidebarLink | SidebarGroup;
11981198

1199-
function getMethodBadge(method: string): SidebarBadge {
1200-
// Icon characters matching MethodHeader component
1201-
const icons: Record<string, string> = {
1202-
GET: '↙',
1203-
POST: '↗',
1204-
PUT: '↗',
1205-
PATCH: '↗',
1206-
DELETE: '✕',
1207-
WSS: '⚡',
1208-
};
1209-
return {
1210-
text: icons[method.toUpperCase()] || method,
1211-
variant: 'default',
1212-
class: `sidebar-method-${method.toLowerCase()}`,
1213-
};
1199+
function getMethodAttrs(method: string): Record<string, string> {
1200+
return { 'data-method': method.toLowerCase() };
12141201
}
12151202

12161203
function slugifyEndpoint(title: string): string {
@@ -1236,11 +1223,11 @@ function generateSidebarItems(
12361223
const endpointItems: SidebarLink[] = page.endpoints.map((ep) => ({
12371224
label: ep.title,
12381225
link: `/api/${versionId}/${page.category}#${slugifyEndpoint(ep.title)}`,
1239-
badge: getMethodBadge(ep.method),
1226+
attrs: getMethodAttrs(ep.method),
12401227
}));
12411228
items.push({
12421229
label: page.title,
1243-
collapsed: false,
1230+
collapsed: true,
12441231
items: endpointItems,
12451232
});
12461233
} else {
@@ -1258,11 +1245,11 @@ function generateSidebarItems(
12581245
const endpointItems: SidebarLink[] = endpoints.map((ep) => ({
12591246
label: ep.name,
12601247
link: `/api/${versionId}/${category}#${slugifyEndpoint(ep.name)}`,
1261-
badge: getMethodBadge(ep.method),
1248+
attrs: getMethodAttrs(ep.method),
12621249
}));
12631250
items.push({
12641251
label: getCategoryTitle(category),
1265-
collapsed: false,
1252+
collapsed: true,
12661253
items: endpointItems,
12671254
});
12681255
} else {
@@ -1289,7 +1276,7 @@ function serializeSidebarItem(item: SidebarItem, indent: number): string {
12891276
.join(',\n');
12901277
return `${pad}{
12911278
${pad} label: '${group.label}',
1292-
${pad} collapsed: ${group.collapsed ?? false},
1279+
${pad} collapsed: ${group.collapsed ?? true},
12931280
${pad} items: [
12941281
${nestedItems}
12951282
${pad} ]

‎src/lib/sidebar.ts‎

Lines changed: 28 additions & 116 deletions
Original file line numberDiff line numberDiff line change
@@ -118,235 +118,147 @@ export const sidebarConfig: SidebarGroup[] = [
118118
{ label: 'Overview', slug: `api/${apiVersion}` },
119119
{
120120
label: 'Sprites',
121-
collapsed: false,
121+
collapsed: true,
122122
items: [
123123
{
124124
label: 'Create Sprite',
125125
link: `/api/${apiVersion}/sprites#create-sprite`,
126-
badge: {
127-
text: '↗',
128-
variant: 'default' as const,
129-
class: 'sidebar-method-post',
130-
},
126+
attrs: { 'data-method': 'post' },
131127
},
132128
{
133129
label: 'List Sprites',
134130
link: `/api/${apiVersion}/sprites#list-sprites`,
135-
badge: {
136-
text: '↙',
137-
variant: 'default' as const,
138-
class: 'sidebar-method-get',
139-
},
131+
attrs: { 'data-method': 'get' },
140132
},
141133
{
142134
label: 'Get Sprite',
143135
link: `/api/${apiVersion}/sprites#get-sprite`,
144-
badge: {
145-
text: '↙',
146-
variant: 'default' as const,
147-
class: 'sidebar-method-get',
148-
},
136+
attrs: { 'data-method': 'get' },
149137
},
150138
{
151139
label: 'Update Sprite',
152140
link: `/api/${apiVersion}/sprites#update-sprite`,
153-
badge: {
154-
text: '↗',
155-
variant: 'default' as const,
156-
class: 'sidebar-method-put',
157-
},
141+
attrs: { 'data-method': 'put' },
158142
},
159143
{
160144
label: 'Delete Sprite',
161145
link: `/api/${apiVersion}/sprites#delete-sprite`,
162-
badge: {
163-
text: '✕',
164-
variant: 'default' as const,
165-
class: 'sidebar-method-delete',
166-
},
146+
attrs: { 'data-method': 'delete' },
167147
},
168148
],
169149
},
170150
{
171151
label: 'Checkpoints',
172-
collapsed: false,
152+
collapsed: true,
173153
items: [
174154
{
175155
label: 'Create Checkpoint',
176156
link: `/api/${apiVersion}/checkpoints#create-checkpoint`,
177-
badge: {
178-
text: '↗',
179-
variant: 'default' as const,
180-
class: 'sidebar-method-post',
181-
},
157+
attrs: { 'data-method': 'post' },
182158
},
183159
{
184160
label: 'List Checkpoints',
185161
link: `/api/${apiVersion}/checkpoints#list-checkpoints`,
186-
badge: {
187-
text: '↙',
188-
variant: 'default' as const,
189-
class: 'sidebar-method-get',
190-
},
162+
attrs: { 'data-method': 'get' },
191163
},
192164
{
193165
label: 'Get Checkpoint',
194166
link: `/api/${apiVersion}/checkpoints#get-checkpoint`,
195-
badge: {
196-
text: '↙',
197-
variant: 'default' as const,
198-
class: 'sidebar-method-get',
199-
},
167+
attrs: { 'data-method': 'get' },
200168
},
201169
{
202170
label: 'Restore Checkpoint',
203171
link: `/api/${apiVersion}/checkpoints#restore-checkpoint`,
204-
badge: {
205-
text: '↗',
206-
variant: 'default' as const,
207-
class: 'sidebar-method-post',
208-
},
172+
attrs: { 'data-method': 'post' },
209173
},
210174
],
211175
},
212176
{
213177
label: 'Exec',
214-
collapsed: false,
178+
collapsed: true,
215179
items: [
216180
{
217181
label: 'Execute Command',
218182
link: `/api/${apiVersion}/exec#execute-command`,
219-
badge: {
220-
text: '⚡',
221-
variant: 'default' as const,
222-
class: 'sidebar-method-wss',
223-
},
183+
attrs: { 'data-method': 'wss' },
224184
},
225185
{
226186
label: 'List Exec Sessions',
227187
link: `/api/${apiVersion}/exec#list-exec-sessions`,
228-
badge: {
229-
text: '↙',
230-
variant: 'default' as const,
231-
class: 'sidebar-method-get',
232-
},
188+
attrs: { 'data-method': 'get' },
233189
},
234190
{
235191
label: 'Attach to Exec Session',
236192
link: `/api/${apiVersion}/exec#attach-to-exec-session`,
237-
badge: {
238-
text: '⚡',
239-
variant: 'default' as const,
240-
class: 'sidebar-method-wss',
241-
},
193+
attrs: { 'data-method': 'wss' },
242194
},
243195
{
244196
label: 'Kill Exec Session',
245197
link: `/api/${apiVersion}/exec#kill-exec-session`,
246-
badge: {
247-
text: '↗',
248-
variant: 'default' as const,
249-
class: 'sidebar-method-post',
250-
},
198+
attrs: { 'data-method': 'post' },
251199
},
252200
],
253201
},
254202
{
255203
label: 'Policy',
256-
collapsed: false,
204+
collapsed: true,
257205
items: [
258206
{
259207
label: 'Get Network Policy',
260208
link: `/api/${apiVersion}/policy#get-network-policy`,
261-
badge: {
262-
text: '↙',
263-
variant: 'default' as const,
264-
class: 'sidebar-method-get',
265-
},
209+
attrs: { 'data-method': 'get' },
266210
},
267211
{
268212
label: 'Set Network Policy',
269213
link: `/api/${apiVersion}/policy#set-network-policy`,
270-
badge: {
271-
text: '↗',
272-
variant: 'default' as const,
273-
class: 'sidebar-method-post',
274-
},
214+
attrs: { 'data-method': 'post' },
275215
},
276216
],
277217
},
278218
{
279219
label: 'HTTP Proxy',
280-
collapsed: false,
220+
collapsed: true,
281221
items: [
282222
{
283223
label: 'TCP Proxy',
284224
link: `/api/${apiVersion}/proxy#tcp-proxy`,
285-
badge: {
286-
text: '⚡',
287-
variant: 'default' as const,
288-
class: 'sidebar-method-wss',
289-
},
225+
attrs: { 'data-method': 'wss' },
290226
},
291227
],
292228
},
293229
{
294230
label: 'Services',
295-
collapsed: false,
231+
collapsed: true,
296232
items: [
297233
{
298234
label: 'List Services',
299235
link: `/api/${apiVersion}/services#list-services`,
300-
badge: {
301-
text: '↙',
302-
variant: 'default' as const,
303-
class: 'sidebar-method-get',
304-
},
236+
attrs: { 'data-method': 'get' },
305237
},
306238
{
307239
label: 'Get Service',
308240
link: `/api/${apiVersion}/services#get-service`,
309-
badge: {
310-
text: '↙',
311-
variant: 'default' as const,
312-
class: 'sidebar-method-get',
313-
},
241+
attrs: { 'data-method': 'get' },
314242
},
315243
{
316244
label: 'Create Service',
317245
link: `/api/${apiVersion}/services#create-service`,
318-
badge: {
319-
text: '↗',
320-
variant: 'default' as const,
321-
class: 'sidebar-method-put',
322-
},
246+
attrs: { 'data-method': 'put' },
323247
},
324248
{
325249
label: 'Start Service',
326250
link: `/api/${apiVersion}/services#start-service`,
327-
badge: {
328-
text: '↗',
329-
variant: 'default' as const,
330-
class: 'sidebar-method-post',
331-
},
251+
attrs: { 'data-method': 'post' },
332252
},
333253
{
334254
label: 'Stop Service',
335255
link: `/api/${apiVersion}/services#stop-service`,
336-
badge: {
337-
text: '↗',
338-
variant: 'default' as const,
339-
class: 'sidebar-method-post',
340-
},
256+
attrs: { 'data-method': 'post' },
341257
},
342258
{
343259
label: 'Get Service Logs',
344260
link: `/api/${apiVersion}/services#get-service-logs`,
345-
badge: {
346-
text: '↙',
347-
variant: 'default' as const,
348-
class: 'sidebar-method-get',
349-
},
261+
attrs: { 'data-method': 'get' },
350262
},
351263
],
352264
},

0 commit comments

Comments
 (0)