move types to own folder types

src/components/ContentComponent.vue

@@ -1,85 +1,84 @@
 <script lang="ts">
-import type { Content } from '../stores/content'
-    export default {
-        props:['jsonContent'],
-        data: () => {
-            const rawHtml: string = ""
-            return{
-              rawHtml
-            }
-        },
-        setup(props){
-            return{
-                props
-            }
+import type { Content } from '../types/content'
+export default {
+    props:['jsonContent'],
+    data: () => {
+        const rawHtml: string = ""
+        return{
+          rawHtml
+        }
+    },
+    setup(props){
+        return{
+            props
+        }
 
-        },
-        methods: {
-            reloadContent(el: HTMLElement, jsonContent : Array<Content>){
-                if(jsonContent && jsonContent.length > 0){
-                    for(const contentItem of jsonContent){
-                        let itemEl:HTMLElement | null = null
-                        switch(contentItem?.type){
-                            case "text":
-                                let contentText = contentItem?.text
-                                if(!contentText){
-                                    contentText = ""
-                                }
-                                contentText = contentText.replace(/\n/g, "<br />");
-                                if(contentItem.bold){
-                                    const bold =  document.createElement("b")
-                                    bold.insertAdjacentHTML("beforeend", contentText)
-                                    el.append(bold)
-                                }else{
-                                    el.insertAdjacentHTML("beforeend", contentText)
-                                }
+    },
+    methods: {
+        reloadContent(el: HTMLElement, jsonContent : Array<Content>){
+            if(jsonContent && jsonContent.length > 0){
+                for(const contentItem of jsonContent){
+                    let itemEl:HTMLElement | null = null
+                    switch(contentItem?.type){
+                        case "text":
+                            let contentText = contentItem?.text
+                            if(!contentText){
+                                contentText = ""
+                            }
+                            contentText = contentText.replace(/\n/g, "<br />");
+                            if(contentItem.bold){
+                                const bold =  document.createElement("b")
+                                bold.insertAdjacentHTML("beforeend", contentText)
+                                el.append(bold)
+                            }else{
+                                el.insertAdjacentHTML("beforeend", contentText)
+                            }
 
-                                break
-                            case "paragraph":
-                                itemEl = document.createElement("p")
-                                el.append(itemEl)
+                            break
+                        case "paragraph":
+                            itemEl = document.createElement("p")
+                            el.append(itemEl)
 
-                                break
-                            case "heading":
-                                itemEl = document.createElement("h"+contentItem.level)
-                                el.append(itemEl)
-                                break
-                            case "list":
-                                itemEl = document.createElement("ul")
-                                el.append(itemEl)
-                                break
-                            case "list-item":
-                                itemEl = document.createElement("li")
-                                el.append(itemEl)
-                                break
-                            case "link":
-                                itemEl = document.createElement("a")
-                                itemEl.setAttribute("href", contentItem.url || "#")
-                                el.append(itemEl!)
-                                break
+                            break
+                        case "heading":
+                            itemEl = document.createElement("h"+contentItem.level)
+                            el.append(itemEl)
+                            break
+                        case "list":
+                            itemEl = document.createElement("ul")
+                            el.append(itemEl)
+                            break
+                        case "list-item":
+                            itemEl = document.createElement("li")
+                            el.append(itemEl)
+                            break
+                        case "link":
+                            itemEl = document.createElement("a")
+                            itemEl.setAttribute("href", contentItem.url || "#")
+                            el.append(itemEl!)
+                            break
 
 
-                        }
-                        if(contentItem.children && contentItem.children.length > 0){
-                          this.reloadContent(itemEl!, contentItem.children)
-                        }
+                    }
+                    if(contentItem.children && contentItem.children.length > 0){
+                      this.reloadContent(itemEl!, contentItem.children)
                     }
                 }
-            },
-            updateContent(){
-                const div =  document.createElement("div")
-                this.reloadContent(div, this.props.jsonContent)
-                this.rawHtml = div.innerHTML
             }
         },
-        mounted () {
-            this.updateContent()
-        },
-        updated(){
-            this.updateContent()
+        updateContent(){
+            const div =  document.createElement("div")
+            this.reloadContent(div, this.props.jsonContent)
+            this.rawHtml = div.innerHTML
         }
+    },
+    mounted () {
+        this.updateContent()
+    },
+    updated(){
+        this.updateContent()
     }
-
+}
 </script>
 
 <template >

src/stores/component.ts

@@ -1,18 +1,8 @@
 import { defineStore } from 'pinia'
 import axios from 'axios'
-import type { Content } from './content'
+import type { Component } from '../types/component'
 
 
-export interface Component {
-  id: string;
-  documentId: string;
-  label: string;
-  content: Array<Content>;
-  bg: boolean
-  type: "component-dark" | "component-light";
-  locale: string;
-
-}
 
 
 

src/stores/footer-content-pages.ts

@@ -1,46 +1,38 @@
 import { defineStore } from 'pinia'
 import axios from 'axios'
+import type { FooterLink } from '../types/footer-link'
 
-export interface FooterLink {
-  id: string;
-  Label: string;
-  page: {
-    path: string;
-  };
-}
-
-
-export const useFooterLinksStore = defineStore('footerLinks',{
+export const useFooterLinksStore = defineStore('footerLinks', {
   state: () => ({
-                locale:  (localStorage.getItem('lang') || 'de'),
-                links: [] as Array<FooterLink>
-              }),
+    locale: (localStorage.getItem('lang') || 'de'),
+    links: [] as Array<FooterLink>
+  }),
 
   actions: {
-    async getLinks(locale:string){
+    async getLinks(locale: string) {
       await this.setLocale(locale)
       return this.links
 
     },
-    getLinkByLabel(oldLabel:string){
-      return this.links.find((link:FooterLink) => (link.Label as string) == oldLabel)
+    getLinkByLabel(oldLabel: string) {
+      return this.links.find((link: FooterLink) => (link.Label as string) == oldLabel)
 
     },
 
-    async setLocale(locale:string){
-      if (this.links.length == 0 || this.locale != locale){
+    async setLocale(locale: string) {
+      if (this.links.length == 0 || this.locale != locale) {
         this.locale = locale
         await this.fetchLinks()
       }
     },
 
-      async fetchLinks(){
-            const response = await axios.get('https://strapi.kornblum.one/api/footer-content-pages?&populate[localizations][fields][0]=Label&populate[page][fields][1]=path&locale='+this.locale, {
-            headers: {
-                Authorization: "Bearer " + import.meta.env.VITE_STRAPI_TOKEN,
-            },
-            })
-            this.links = response.data.data
+    async fetchLinks() {
+      const response = await axios.get('https://strapi.kornblum.one/api/footer-content-pages?&populate[localizations][fields][0]=Label&populate[page][fields][1]=path&locale=' + this.locale, {
+        headers: {
+          Authorization: "Bearer " + import.meta.env.VITE_STRAPI_TOKEN,
         },
-    }
- })
+      })
+      this.links = response.data.data
+    },
+  }
+})

src/stores/pages.ts

@@ -1,12 +1,7 @@
 import { defineStore } from 'pinia'
 import axios from 'axios'
 
-import type { Content } from './content'
-
-interface Page {
-  Title: string;
-  Content: Array<Content>;
-}
+import type { Page } from '../types/page'
 
 export const usePageStore = defineStore('pages',{
   state: () => ({

src/stores/timeline.ts

@@ -1,17 +1,7 @@
 import { defineStore } from 'pinia'
 import axios from 'axios'
 
-import type { Content } from './content'
-
-interface Timeline {
-  id: string;
-  label: string;
-  discription: string;
-  date: string;
-  content: Array<Content>;
-  posittion: "left" | "right";
-  mapQuery?: string;
-}
+import type { Timeline } from '../types/timeline'
 
 
 export const useTimelineStore = defineStore('timelines',{

src/types/component.ts

@@ -0,0 +1,12 @@
+import type { Content } from "./content";
+
+export interface Component {
+  id: string;
+  documentId: string;
+  label: string;
+  content: Array<Content>;
+  bg: boolean
+  type: "component-dark" | "component-light";
+  locale: string;
+
+}

src/types/footer-link.ts

@@ -0,0 +1,7 @@
+export interface FooterLink {
+  id: string;
+  Label: string;
+  page: {
+    path: string;
+  };
+}

src/types/page.ts

@@ -0,0 +1,6 @@
+import type { Content } from './content'
+
+export interface Page {
+  Title: string;
+  Content: Array<Content>;
+}

src/types/timeline.ts

@@ -0,0 +1,11 @@
+import type { Content } from './content'
+
+export interface Timeline {
+  id: string;
+  label: string;
+  discription: string;
+  date: string;
+  content: Array<Content>;
+  posittion: "left" | "right";
+  mapQuery?: string;
+}