From e7995bc856d027ec33a95e3d1c4348d2ae5c214c Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 2 Feb 2025 21:19:45 +0330
Subject: [PATCH] Uodated

---
 frontend/components/home/LatestStories.vue | 59 ++++------------------
 1 file changed, 10 insertions(+), 49 deletions(-)

diff --git a/frontend/components/home/LatestStories.vue b/frontend/components/home/LatestStories.vue
index c1073cd..6425470 100644
--- a/frontend/components/home/LatestStories.vue
+++ b/frontend/components/home/LatestStories.vue
@@ -1,13 +1,15 @@
 <script setup lang="ts">
 
-// types
+// state
 
-type Props = {}
+import useGetArticles from "~/composables/api/blog/useGetArticles";
 
-// props
+const page = ref(1);
+const { data: articles, suspense } = useGetArticles(page);
 
-const props = defineProps<Props>();
-const {} = toRefs(props);
+// ssr
+
+await suspense();
 
 </script>
 
@@ -23,49 +25,8 @@ const {} = toRefs(props);
                 </Button>
             </NuxtLink>
         </div>
-        <div class="flex gap-12">
-            <div class="flex-1 flex flex-col gap-12">
-                <BlogPost
-                    image="/img/blog-1.jpeg"
-                    description="aaasd"
-                    title="asd"
-                    :comments="2"
-                    link="#"
-                    date="2020-06-10"
-                    tag="asdsa"
-                />
-                <BlogPost
-                    image="/img/blog-2.jpeg"
-                    description="aaasd"
-                    title="asd"
-                    :comments="2"
-                    link="#"
-                    date="2020-06-10"
-                    tag="asdsa"
-                />
-            </div>
-            <div class="flex-[0.8] flex flex-col">
-                <BlogPost
-                    image="/img/blog-3.jpeg"
-                    description="aaasd"
-                    title="asd"
-                    :comments="2"
-                    link="#"
-                    date="2020-06-10"
-                    tag="asdsa"
-                    variant="sm"
-                />
-                <BlogPost
-                    image="/img/blog-4.jpeg"
-                    description="aaasd"
-                    title="asd"
-                    :comments="2"
-                    link="#"
-                    date="2020-06-10"
-                    tag="asdsa"
-                    variant="sm"
-                />
-            </div>
-        </div>
+        <ClientOnly>
+            <ArticlesList :articles="articles!.results" />
+        </ClientOnly>
     </section>
 </template>
\ No newline at end of file