feat: move packages to biome (#1518)

apps/docs/.vitepress/config.hub.ts

@@ -1,7 +1,7 @@
 import { CmsBaseReference } from "./theme/typer/cms-base-plugin";
+import { ComposablesBuilder } from "./theme/typer/composables-builder";
 import { ReadmeBasedReference } from "./theme/typer/plugin";
 import { ReadmeLoader } from "./theme/typer/readme-loader";
-import { ComposablesBuilder } from "./theme/typer/composables-builder";
 
 /**
  * This file extends the DevHub VitePress configuration.

apps/docs/.vitepress/config.ts

@@ -1,11 +1,11 @@
+import { resolve } from "node:path";
+import { baseConfig } from "@shopware-docs/vitepress";
 import { defineConfigWithTheme } from "vitepress";
+import { SearchPlugin } from "vitepress-plugin-search";
 import type { Config as ThemeConfig } from "vitepress-shopware-docs";
-import { baseConfig } from "@shopware-docs/vitepress";
+import sharedConfig from "./config.hub";
 import nav from "./navigation";
-import { resolve } from "path";
 import { sidebar } from "./sidebar";
-import sharedConfig from "./config.hub";
-import { SearchPlugin } from "vitepress-plugin-search";
 
 interface ThemeConfigExtended extends ThemeConfig {
   ai: {
@@ -113,7 +113,7 @@ export default defineConfigWithTheme<ThemeConfigExtended>(
       vite: {
         build: {
           minify: "terser",
-          chunkSizeWarningLimit: Infinity,
+          chunkSizeWarningLimit: Number.POSITIVE_INFINITY,
           ssr: false,
           rollupOptions: {
             output: {

apps/docs/.vitepress/data/composables.data.ts

@@ -1,7 +1,7 @@
-import { defineLoader } from "vitepress";
-import { resolve, dirname } from "path";
+import { readdirSync } from "node:fs";
+import { dirname, resolve } from "node:path";
 import { extract } from "ts-dox";
-import { readdirSync } from "fs";
+import { defineLoader } from "vitepress";
 export interface Data {
   composablesList: { text: string; link: string; category: string }[];
 }

apps/docs/.vitepress/navigation.ts

@@ -18,7 +18,7 @@ const nav = [
   },
   {
     text: "Resources",
-    activeMatch: `^/(api)`,
+    activeMatch: "^/(api)",
     items: [
       {
         text: "HTTP APIs",

apps/docs/.vitepress/theme/components/AI.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, reactive } from "vue";
+import { reactive, ref } from "vue";
 import { useAi } from "../composables/useAi";
 import AIAnswer from "./AIAnswer.vue";
 

apps/docs/.vitepress/theme/components/AIAnswer.vue

@@ -1,6 +1,6 @@
 <script setup>
-import { useAi } from "../composables/useAi";
 import { ref } from "vue";
+import { useAi } from "../composables/useAi";
 
 const props = defineProps({
   answer: Object,

apps/docs/.vitepress/theme/components/ComposablesList.vue

@@ -34,17 +34,17 @@ import { normalizeAnchorText } from "../typer/utils";
 const categoryTreeData = computed(() => {
   const categoryTree: { [key: string]: string[] } = {};
 
-  data.composablesList.forEach((composable) => {
+  for (const composable of data.composablesList) {
     const categories = composable.category.split(",");
 
-    categories.forEach((category) => {
+    for (const category of categories) {
       if (!categoryTree[category]) {
         categoryTree[category] = [];
       }
 
       categoryTree[category].push(composable.text);
-    });
-  });
+    }
+  }
 
   return categoryTree;
 });

apps/docs/.vitepress/theme/components/PageRef.vue

@@ -22,21 +22,21 @@
 </template>
 
 <script>
-import { useAttrs, ref } from "vue";
+import { ref, useAttrs } from "vue";
 
 export default {
   setup() {
-    let attrs = useAttrs();
+    const attrs = useAttrs();
 
-    let title = ref(attrs.title);
+    const title = ref(attrs.title);
 
-    let page = ref(attrs.page);
+    const page = ref(attrs.page);
 
-    let icon = ref(attrs.icon || "");
+    const icon = ref(attrs.icon || "");
 
-    let sub = ref(attrs.sub || "");
+    const sub = ref(attrs.sub || "");
 
-    let target = ref(attrs.target || "");
+    const target = ref(attrs.target || "");
 
     return {
       title,

apps/docs/.vitepress/theme/composables/useAi.ts

@@ -1,5 +1,5 @@
 import { useData } from "vitepress";
-import { QueryResponse, Answer } from "../types";
+import type { Answer, QueryResponse } from "../types";
 
 type UseAiReturn = {
   sendQueryRequest: (query: string) => Promise<QueryResponse>;
@@ -83,18 +83,12 @@ export function useAi(): UseAiReturn {
     let text = answer.context;
     let offset = 0;
 
-    answer.offsets_in_context.forEach((element) => {
-      text =
-        text.slice(0, element.start + offset) +
-        "<mark>" +
-        text.slice(element.start + offset);
+    for (const element of answer.offsets_in_context) {
+      text = `${text.slice(0, element.start + offset)}<mark>${text.slice(element.start + offset)}`;
       offset += 6;
-      text =
-        text.slice(0, element.end + offset) +
-        "</mark>" +
-        text.slice(element.end + offset);
+      text = `${text.slice(0, element.end + offset)}</mark>${text.slice(element.end + offset)}`;
       offset += 7;
-    });
+    }
 
     return text;
   };

apps/docs/.vitepress/theme/index.ts

@@ -1,6 +1,6 @@
-// import './styles/index.css'
-import { App } from "vue";
 import { SWAGTheme } from "vitepress-shopware-docs";
+// import './styles/index.css'
+import type { App } from "vue";
 // Ai component
 // import AI from "./components/AI.vue";
 import "./custom.css";

apps/docs/.vitepress/theme/typer/cms-base-plugin.ts

@@ -1,15 +1,15 @@
+import { resolve } from "node:path";
+import { findSync } from "find-in-files";
 // @ts-nocheck
 import type { Plugin } from "vite";
-import { resolve } from "path";
-import { findSync } from "find-in-files";
 
+import { readFileSync, readdirSync } from "node:fs";
 import {
   getToggleContainer,
   getWrappedCodeBlock,
   prepareGithubPermalink,
   replacer,
 } from "./utils";
-import { readdirSync, readFileSync } from "node:fs";
 
 export async function CmsBaseReference({
   projectRootDir,
@@ -26,8 +26,10 @@ export async function CmsBaseReference({
       const [pkg, fileName] = id.split("/").slice(-2);
       const packageName = fileName.replace(/\.md$/, "");
 
+      let transformedCode = code;
+
       if (pkg !== "packages" || packageName !== "cms-base") {
-        return code;
+        return transformedCode;
       }
 
       let API = "\n\n## Available components\n\n";
@@ -42,7 +44,7 @@ export async function CmsBaseReference({
 
         API += `### \`${component.name.replace(".vue", "")}\`\n`;
         API += prepareGithubPermalink({
-          label: `source code`,
+          label: "source code",
           path: `${component.path.split("frontends/").pop().replace("/vercel/path0/", "")}/${component.name}`,
           project: "shopware/frontends",
         });
@@ -64,9 +66,9 @@ export async function CmsBaseReference({
       API += "\n\n";
 
       // place it before the changelog
-      code = replacer(code, API, "", "tail");
+      transformedCode = replacer(transformedCode, API, "", "tail");
 
-      return code;
+      return transformedCode;
     },
   };
 }

apps/docs/.vitepress/theme/typer/composables-builder.ts

@@ -1,18 +1,18 @@
-// @ts-nocheck
-import type { Plugin } from "vite";
-import { resolve, dirname } from "path";
+import { existsSync, readFileSync, readdirSync } from "node:fs";
+import { dirname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
 import { findSync } from "find-in-files";
 import { extract } from "ts-dox";
+// @ts-nocheck
+import type { Plugin } from "vite";
 import {
   getToggleContainer,
   getWrappedCodeBlock,
+  normalizeAnchorText,
+  normalizeString,
   prepareGithubPermalink,
   replacer,
-  normalizeString,
-  normalizeAnchorText,
 } from "./utils";
-import { readdirSync, readFileSync, existsSync } from "node:fs";
-import { fileURLToPath } from "url";
 
 export async function ComposablesBuilder({
   projectRootDir,
@@ -26,19 +26,20 @@ export async function ComposablesBuilder({
   return {
     name: "composables-builder",
     enforce: "pre",
-    async transform(code, id) {
+    async transform(sourceCode, id) {
       if (!id.match(/\.md\b/)) return null;
 
+      let transformedCode = sourceCode;
       const [pkg, type, fileName] = id.split("/").slice(-3);
 
       const composableName = fileName.replace(".md", "");
 
       if (pkg !== "packages" || type !== "composables") {
-        return code;
+        return transformedCode;
       }
 
       if (composableName === "index") {
-        code = code.replace(
+        transformedCode = transformedCode.replace(
           "{{INTRO}}",
           normalizeString(
             readFileSync(
@@ -48,10 +49,10 @@ export async function ComposablesBuilder({
           ),
         );
 
-        return code;
+        return transformedCode;
       }
       // Build name
-      code = code.replace("{{NAME}}", composableName);
+      transformedCode = transformedCode.replace("{{NAME}}", composableName);
 
       let astJson = "";
 
@@ -63,7 +64,7 @@ export async function ComposablesBuilder({
         );
       } catch (e) {
         console.error(e);
-        return code;
+        return transformedCode;
       }
 
       const description = astJson?.functions[composableName]?.summary || "";
@@ -76,44 +77,44 @@ export async function ComposablesBuilder({
         astJson?.functions[`${composableName}Function`]?.docs?.category;
 
       if (category) {
-        code = code.replace(
+        transformedCode = transformedCode.replace(
           "{{META}}",
           `<div>Category:</div> <a href="${mountPoint}/packages/composables/#${normalizeAnchorText(category)}"><div class="bg-red">${category}</div></a>`,
         );
       }
 
       // Building interfaces block
 
-      let interfacesBlock = ``;
+      let interfacesBlock = "";
       for (const key of Object.keys(astJson.functions)) {
         interfacesBlock += getWrappedCodeBlock(
           normalizeString(`${astJson?.functions[key]?.signature || ""}`),
         );
 
         interfacesBlock += prepareGithubPermalink({
-          label: `source code`,
+          label: "source code",
           path: `${relativeDir}/${composableName}/${composableName}.ts`,
           project: "shopware/frontends",
           line: astJson?.functions[key]?.location?.line + 1,
         });
       }
 
       // Building types block
-      let typesBlock = ``;
+      let typesBlock = "";
       for (const key of Object.keys(astJson.types)) {
         typesBlock += getWrappedCodeBlock(
           normalizeString(`${astJson?.types[key]?.signature || ""}`),
         );
 
         typesBlock += prepareGithubPermalink({
-          label: `source code`,
+          label: "source code",
           path: `${relativeDir}/${composableName}/${composableName}.ts`,
           project: "shopware/frontends",
           line: astJson?.types[key]?.location?.line + 1,
         });
       }
 
-      code = code
+      transformedCode = transformedCode
         .replace("{{DESCRIPTION}}", description)
         .replace("{{RETURN_TYPES_CONTENT}}", typesBlock)
         .replace("{{INTERFACE_CONTENT}}", interfacesBlock);
@@ -126,9 +127,12 @@ export async function ComposablesBuilder({
           ),
           "utf8",
         );
-        code = code.replace("{{ADDITIONAL_README}}", additionalMd);
+        transformedCode = transformedCode.replace(
+          "{{ADDITIONAL_README}}",
+          additionalMd,
+        );
       } catch (e) {
-        code = code.replace("{{ADDITIONAL_README}}", "");
+        transformedCode = transformedCode.replace("{{ADDITIONAL_README}}", "");
       }
 
       // Demo static
@@ -140,7 +144,7 @@ export async function ComposablesBuilder({
           "utf8",
         );
 
-        code = code.replace(
+        transformedCode = transformedCode.replace(
           "{{DEMO_BLOCK}}",
           `
 ## Demo
@@ -150,9 +154,9 @@ ${codeBlock}
           `,
         );
       } catch (e) {
-        code = code.replace("{{DEMO_BLOCK}}", "");
+        transformedCode = transformedCode.replace("{{DEMO_BLOCK}}", "");
       }
-      return code;
+      return transformedCode;
     },
   };
 }