feat(useSidebar): methodAliases option to customize method bag (#121)

enzonotario · Nov 15, 2024 · 50d1883 · 50d1883
1 parent 4636f94
commit 50d1883
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 1 deletion.
diff --git a/docs/layouts/sidebar.md b/docs/layouts/sidebar.md
@@ -56,3 +56,25 @@ module.exports = {
     },
 }
 ```
+
+## Method Aliases
+
+By default, the methods are displayed in uppercase.
+
+You can specify aliases for the methods by passing the `methodAliases` option to the `useSidebar` composable.
+
+```ts
+const sidebar = useSidebar({ 
+    spec,
+    methodAliases: {
+        get: 'GE',
+        post: 'PO',
+        put: 'PU',
+        delete: 'DE',
+        patch: 'PA',
+        options: 'OP',
+        head: 'HE',
+    },
+})
+```
+
diff --git a/src/composables/useSidebar.ts b/src/composables/useSidebar.ts
@@ -27,11 +27,13 @@ export function useSidebar({
   linkPrefix,
   tagLinkPrefix,
   defaultTag,
+  methodAliases,
 }: {
   spec?: OpenAPI
   linkPrefix?: string
   tagLinkPrefix?: string
   defaultTag?: string
+  methodAliases?: Record<string, string>
 } = {
   ...defaultOptions,
 }) {
@@ -53,8 +55,10 @@ export function useSidebar({
   })
 
   function sidebarItemTemplate(method: string, title: string) {
+    const resolvedMethod = methodAliases?.[method] || method.toUpperCase()
+
     return `<span class="OASidebarItem group/oaSidebarItem">
-        <span class="OASidebarItem-badge OAMethodBadge--${method.toLowerCase()}">${method.toUpperCase()}</span>
+        <span class="OASidebarItem-badge OAMethodBadge--${method.toLowerCase()}">${resolvedMethod}</span>
         <span class="OASidebarItem-text text">${title}</span>
       </span>`
   }