From 0c02458e537c4e594931842472aefefe61ae0f10 Mon Sep 17 00:00:00 2001
From: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de>
Date: Fri, 17 Nov 2023 11:41:42 +0100
Subject: [PATCH] lint .storybook

---
 .gitignore                               |  1 +
 .storybook/StoryWrapper.vue              |  8 ++++++--
 .storybook/main.ts                       | 19 ++++++++++---------
 .storybook/preview.ts                    | 22 ++++++++++++----------
 .storybook/withVuetifyTheme.decorator.ts | 18 ++++++++----------
 README.md                                |  2 +-
 6 files changed, 38 insertions(+), 32 deletions(-)

diff --git a/.gitignore b/.gitignore
index eb7b4d4..632de73 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 node_modules/
 build/
 coverage/
+!.storybook/
\ No newline at end of file
diff --git a/.storybook/StoryWrapper.vue b/.storybook/StoryWrapper.vue
index 82e96b4..4311beb 100644
--- a/.storybook/StoryWrapper.vue
+++ b/.storybook/StoryWrapper.vue
@@ -8,11 +8,15 @@
 </template>
 
 <script>
+export const DEFAULT_THEME = 'light'
 export default {
   props: {
-    themeName: String,
+    themeName: {
+      default: DEFAULT_THEME,
+      type: String,
+    },
   },
-};
+}
 </script>
 
 <style>
diff --git a/.storybook/main.ts b/.storybook/main.ts
index ddb11c6..508b3bc 100644
--- a/.storybook/main.ts
+++ b/.storybook/main.ts
@@ -1,21 +1,22 @@
-import type { StorybookConfig } from "@storybook/vue3-vite";
+import type { StorybookConfig } from '@storybook/vue3-vite'
 
 const config: StorybookConfig = {
-  stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
   addons: [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/addon-interactions",
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-interactions',
   ],
   framework: {
-    name: "@storybook/vue3-vite",
+    name: '@storybook/vue3-vite',
     options: {},
   },
   docs: {
-    autodocs: "tag",
+    autodocs: 'tag',
   },
   core: {
     disableTelemetry: true, // 👈 Disables telemetry
   },
-};
-export default config;
+}
+
+export default config
diff --git a/.storybook/preview.ts b/.storybook/preview.ts
index eb8cc52..ee63b23 100644
--- a/.storybook/preview.ts
+++ b/.storybook/preview.ts
@@ -1,12 +1,14 @@
-import type { Preview } from "@storybook/vue3";
+import { setup } from '@storybook/vue3'
 import { createPinia } from 'pinia'
 
-import { withVuetifyTheme } from './withVuetifyTheme.decorator';
+// eslint-disable-next-line  import/no-relative-parent-imports
 import i18n from '../renderer/i18n'
+// eslint-disable-next-line  import/no-relative-parent-imports
 import CreateVuetify from '../renderer/vuetify'
-// .storybook/preview.js
 
-import { setup } from '@storybook/vue3';
+import { withVuetifyTheme } from './withVuetifyTheme.decorator'
+
+import type { Preview } from '@storybook/vue3'
 
 setup((app) => {
   // Registers your app's plugins into Storybook
@@ -15,9 +17,9 @@ setup((app) => {
   app.use(pinia)
   app.use(i18n)
   app.use(CreateVuetify(i18n))
-});
+})
 
-export const decorators = [withVuetifyTheme];
+export const decorators = [withVuetifyTheme]
 
 export const globalTypes = {
   theme: {
@@ -35,11 +37,11 @@ export const globalTypes = {
       dynamicTitle: true,
     },
   },
-};
+}
 
 const preview: Preview = {
   parameters: {
-    actions: { argTypesRegex: "^on[A-Z].*" },
+    actions: { argTypesRegex: '^on[A-Z].*' },
     controls: {
       matchers: {
         color: /(background|color)$/i,
@@ -47,6 +49,6 @@ const preview: Preview = {
       },
     },
   },
-};
+}
 
-export default preview;
+export default preview
diff --git a/.storybook/withVuetifyTheme.decorator.ts b/.storybook/withVuetifyTheme.decorator.ts
index 5da21cc..dba956b 100644
--- a/.storybook/withVuetifyTheme.decorator.ts
+++ b/.storybook/withVuetifyTheme.decorator.ts
@@ -1,13 +1,11 @@
-// .storybook/withVeutifyTheme.decorator.js
-import { h } from 'vue';
-import StoryWrapper from './StoryWrapper.vue';
+import { h } from 'vue'
 
-export const DEFAULT_THEME = 'light';
+import StoryWrapper, { DEFAULT_THEME } from './StoryWrapper.vue'
 
 export const withVuetifyTheme = (storyFn, context) => {
   // Pull our global theme variable, fallback to DEFAULT_THEME
-  const themeName = context.globals.theme || DEFAULT_THEME;
-  const story = storyFn();
+  const themeName = context.globals.theme || DEFAULT_THEME
+  const story = storyFn()
 
   return () => {
     return h(
@@ -16,7 +14,7 @@ export const withVuetifyTheme = (storyFn, context) => {
       {
         // Puts your story into StoryWrapper's "story" slot with your story args
         story: () => h(story, { ...context.args }),
-      }
-    );
-  };
-};
\ No newline at end of file
+      },
+    )
+  }
+}
diff --git a/README.md b/README.md
index ee815a7..77f123e 100644
--- a/README.md
+++ b/README.md
@@ -77,10 +77,10 @@ The following endpoints are provided given the right command is executed:
 - [x] eslint
 - [x] vitest
 - [x] vue-i18n
+- [x] docker
 - [ ] figma
 - [ ] chromatic
 - [ ] documentation?
-- [ ] docker
 - [ ] github actions
 
 ## Known Problems