Add icons to search query

nuxt.config.ts

@@ -1,3 +1,5 @@
+import { IconsCollection } from './types/types'
+
 export default defineNuxtConfig({
   future: { compatibilityVersion: 4 },
 
@@ -43,7 +45,7 @@ export default defineNuxtConfig({
 
   // Nuxt Icon
   icon: {
-    serverBundle: ['ph', 'heroicons', 'vscode-icons', 'simple-icons'],
+    serverBundle: IconsCollection,
   },
 
   // Nuxt Color Mode

server/api/icons/search.get.ts

@@ -1,11 +1,12 @@
+import { IconsCollection } from '~~/types/types'
+
 export default defineEventHandler(async (event) => {
-  const collections = ['ph', 'heroicons']
   const { query } = getQuery(event)
 
   const response = await $fetch('https://api.iconify.design/search', {
     params: {
       query,
-      prefixes: collections.join(','),
+      prefixes: IconsCollection.join(','),
     },
   })
 

types/types.ts

@@ -4,6 +4,13 @@ export const COLORS = ['gray', 'slate', 'zinc', 'neutral', 'stone', 'red', 'oran
 
 export const Subscription = ['free', 'paid'] as const
 
+export const IconsCollection = [
+  'ph',
+  'heroicons',
+  'vscode-icons',
+  'simple-icons',
+] as const
+
 // Category
 export const CreateCategorySchema = z.object({
   name: z.string().min(4).max(20),