From 4d4f9bc828344600d5cbd648ed8d9755af714ba6 Mon Sep 17 00:00:00 2001
From: Romain Lenzotti <rom.lenzotti@gmail.com>
Date: Mon, 28 Oct 2024 08:13:04 +0100
Subject: [PATCH] fix(theme): use ApiAnchor directly to render Api organism

---
 packages/theme/organisms/api/Api.vue | 14 ++++++++++----
 vitest.config.ts                     |  8 ++++----
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/packages/theme/organisms/api/Api.vue b/packages/theme/organisms/api/Api.vue
index 82c8fac..59bfd86 100644
--- a/packages/theme/organisms/api/Api.vue
+++ b/packages/theme/organisms/api/Api.vue
@@ -1,20 +1,20 @@
 <script setup lang="ts">
 
 import {computed, ref} from "vue";
-import ApiList from "../../molecules/api-list/ApiList.vue";
 import LightBanner from "../../molecules/banner/LightBanner.vue";
 import {Search} from "lucide-vue-next";
 import ButtonBoxes from "../../molecules/button-boxes/ButtonBoxes.vue";
 import type {ApiResponse, ApiSymbol} from "../../composables/api/interfaces/Api";
+import ApiAnchor from "../../molecules/api-anchor/ApiAnchor.vue";
 
-interface Props extends ApiResponse {}
+interface Props extends ApiResponse {
+}
 
 const {symbolTypes, modules: initialModules} = withDefaults(defineProps<Props>(), {});
 
 const q = ref("");
 const category = ref("");
 const categoriesChoices = computed(() => [{label: "All", value: ""}].concat(symbolTypes || []));
-let timeout: NodeJS.Timeout | null = null;
 
 const modules = computed<Record<string, { name: string; symbols: ApiSymbol[]; }>>(() => {
   return Object.entries(initialModules).reduce((acc, [key, value]) => {
@@ -74,7 +74,13 @@ const modules = computed<Record<string, { name: string; symbols: ApiSymbol[]; }>
            class="transition-opacity duration-500">
         <h2 class="font-bold text-xl">{{ module.name }}</h2>
 
-        <ApiList class="mt-4" :items="module.symbols"></ApiList>
+        <div class="bg-gray-100 dark:bg-gray-900 pb-4 p-5 mt-4 mb-10 rounded-sm">
+          <div class="grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-4 gap-4">
+            <div v-for="item in module.symbols" :key="item.symbolName">
+              <ApiAnchor class="w-full px-2 py-1" v-bind="item" theme="list"/>
+            </div>
+          </div>
+        </div>
       </div>
     </template>
   </div>
diff --git a/vitest.config.ts b/vitest.config.ts
index 57936c3..c47990b 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -19,10 +19,10 @@ export default defineConfig({
       enabled: true,
       thresholds: {
         autoUpdate: true,
-        statements: 64.74,
-        branches: 80.31,
-        functions: 69.81,
-        lines: 64.74
+        statements: 64.61,
+        branches: 80,
+        functions: 67.92,
+        lines: 64.61
       },
       include: ["**/*.{ts,vue}"],
       exclude: [