Möglichkeit, in die Artikel-Details zu springen implementiert, ohne einen extra URL Pfad zu benötigen.

src/components/routes/Content.svelte

@@ -1,17 +1,19 @@
 <script lang="ts">
     import { _ } from "svelte-i18n"
-    import { getContent } from "../../api"
+    import { getContent, getArticles } from "../../api"
     import { generalInfo, currentLang, location } from "../../store"
     import { navigate } from "svelte-routing"
 
     import Image from "../widgets/Image.svelte"
     import ArticlesList from "../widgets/ArticlesList.svelte"
-    // import Article from "../widgets/Article.svelte"
+    import Article from "../widgets/Article.svelte"
 
     export let path: string
+    let oldPath: string = null
 
     let loading = true
     let content: Content
+    let article: TibiArticle
     let connectedContentNotFound: boolean = false
     $: currentDomain = window.location.protocol + "//" + window.location.host
 
@@ -40,6 +42,7 @@
         let apiParams: APIParams = {
             filter,
         }
+
         loading = true
         getContent(apiParams)
             .then((c) => {
@@ -60,6 +63,8 @@
                     content = null
                 }
 
+                oldPath = path
+
                 // Redirect to HOME if no content has been found. So the page 404 content will never shown.
                 if (!content) {
                     navigate("/")
@@ -70,13 +75,59 @@
             })
     }
 
+    const loadArticle = (type?: string) => {
+        let pathParts = path.split("/")
+        let slug = pathParts[pathParts.length - 1]
+
+        // Set default API call filter
+        let filter = {
+            "article.general.locale": $currentLang,
+            "article.content.slug": slug,
+        }
+
+        // Changed filter to find simmilar content for changed language
+        if (type === "changedLanguage") {
+            // filter = {
+            //     tags: { $in: content?.tags },
+            //     locale: $currentLang,
+            // }
+            // delete filter["article.general.locale"]
+            // delete filter["article.content.slug"]
+        }
+
+        // Get content by API call
+        let apiParams: APIParams = {
+            filter,
+        }
+        loading = true
+        getArticles("articles", apiParams)
+            .then((respoonse) => {
+                article = respoonse[0]
+                oldPath = path
+            })
+            .finally(() => {
+                loading = false
+            })
+    }
+
     currentLang.subscribe(() => {
         if (content) {
             loadContent("changedLanguage")
+        } else if (article) {
+            loadArticle("changedLanguage")
         }
     })
 
-    $: if (path) loadContent()
+    $: if (path) {
+        content = null
+        article = null
+
+        if (window.location.pathname.endsWith("/")) {
+            loadContent()
+        } else {
+            loadArticle()
+        }
+    }
 </script>
 
 <svelte:head>
@@ -114,12 +165,9 @@
 
 {#if loading}
     <!-- Loader -->
+{:else if article}
+    <Article entry="{article}" showDetails />
 {:else if content}
-    <!-- 
-    {#each content.blocks || [] as b}
-        {JSON.stringify(b)}
-    {/each}
-    -->
     <ArticlesList path="{path}" tags="{content?.tags}" />
 {:else}
     <div class="page-404">