From a17d3276d3a7aec25ddef68d7aa7cc69c2d67aa0 Mon Sep 17 00:00:00 2001
From: patak <matias.capeletto@gmail.com>
Date: Tue, 15 Nov 2022 14:50:41 +0100
Subject: [PATCH] feat: /public/local timeline and timeline header (#3)

Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com>
---
 components/main/MainContent.vue | 13 +++++++++++++
 layouts/default.vue             |  8 ++++++--
 pages/home.vue                  | 23 +++++++++++++++++++++++
 pages/index.vue                 |  8 ++++----
 pages/public.vue                |  8 --------
 pages/public/index.vue          | 18 ++++++++++++++++++
 pages/public/local.vue          | 23 +++++++++++++++++++++++
 7 files changed, 87 insertions(+), 14 deletions(-)
 create mode 100644 components/main/MainContent.vue
 create mode 100644 pages/home.vue
 delete mode 100644 pages/public.vue
 create mode 100644 pages/public/index.vue
 create mode 100644 pages/public/local.vue

diff --git a/components/main/MainContent.vue b/components/main/MainContent.vue
new file mode 100644
index 00000000..ea009277
--- /dev/null
+++ b/components/main/MainContent.vue
@@ -0,0 +1,13 @@
+<template>
+  <div flex flex-col>
+    <div flex justify-between>
+      <div p3 flex gap-1>
+        <slot name="title" />
+      </div>
+      <div p3 flex>
+        <slot name="actions" />
+      </div>
+    </div>
+    <slot />
+  </div>
+</template>
diff --git a/layouts/default.vue b/layouts/default.vue
index 670be664..f155eec2 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -2,12 +2,16 @@
   <div h-full of-hidden>
     <main grid="~ lg:cols-[1fr_40rem_1fr]" h-full>
       <div>
-        <NavTitle p4 />
+        <slot name="left">
+          <NavTitle p4 />
+        </slot>
       </div>
       <div h-full of-auto border="l r border">
         <slot />
       </div>
-      <div>Right</div>
+      <div>
+        <slot name="right" />
+      </div>
     </main>
   </div>
 </template>
diff --git a/pages/home.vue b/pages/home.vue
new file mode 100644
index 00000000..7c539dd3
--- /dev/null
+++ b/pages/home.vue
@@ -0,0 +1,23 @@
+<script setup lang="ts">
+const token = useCookie('nuxtodon-token')
+const router = useRouter()
+if (!token.value)
+  router.replace('/public')
+
+const masto = await useMasto()
+const paginator = masto.timelines.getHomeIterable()
+</script>
+
+<template>
+  <MainContent>
+    <template #title>
+      <div i-ri:home-fill h-6 mr-1 /><span>Home</span>
+    </template>
+    <template #actions>
+      <div color-gray i-ri:equalizer-fill mr-1 h-6 />
+    </template>
+    <slot>
+      <TimelinePaginator :timelines="paginator" />
+    </slot>
+  </MainContent>
+</template>
diff --git a/pages/index.vue b/pages/index.vue
index e29c477e..9bad4a71 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,14 +1,14 @@
 <script setup lang="ts">
 const token = useCookie('nuxtodon-token')
 const router = useRouter()
+
 // TODO: move to middleware
 if (!token.value)
   router.replace('/public')
-
-const masto = await useMasto()
-const paginator = masto.timelines.getHomeIterable()
+else
+  router.replace('/home')
 </script>
 
 <template>
-  <TimelinePaginator :paginator="paginator" />
+  <div />
 </template>
diff --git a/pages/public.vue b/pages/public.vue
deleted file mode 100644
index fe071209..00000000
--- a/pages/public.vue
+++ /dev/null
@@ -1,8 +0,0 @@
-<script setup lang="ts">
-const masto = await useMasto()
-const paginator = masto.timelines.getPublicIterable()
-</script>
-
-<template>
-  <TimelinePaginator :paginator="paginator" />
-</template>
diff --git a/pages/public/index.vue b/pages/public/index.vue
new file mode 100644
index 00000000..5807f39c
--- /dev/null
+++ b/pages/public/index.vue
@@ -0,0 +1,18 @@
+<script setup lang="ts">
+const masto = await useMasto()
+const { data: timelines } = await useAsyncData('timelines-public', () => masto.timelines.fetchPublic().then(r => r.value))
+</script>
+
+<template>
+  <MainContent>
+    <template #title>
+      <div i-ri:earth-fill h-6 mr-1 /><span>Federated Timeline</span>
+    </template>
+    <template #actions>
+      <div color-gray i-ri:equalizer-fill mr-1 h-6 />
+    </template>
+    <slot>
+      <TimelineList :timelines="timelines" />
+    </slot>
+  </MainContent>
+</template>
diff --git a/pages/public/local.vue b/pages/public/local.vue
new file mode 100644
index 00000000..e87ff527
--- /dev/null
+++ b/pages/public/local.vue
@@ -0,0 +1,23 @@
+<script setup lang="ts">
+const token = useCookie('nuxtodon-token')
+const router = useRouter()
+if (!token.value)
+  router.replace('/public')
+
+const masto = await useMasto()
+const { data: timelines } = await useAsyncData('timelines-home', () => masto.timelines.fetchPublic({ local: true }).then(r => r.value))
+</script>
+
+<template>
+  <MainContent>
+    <template #title>
+      <div i-ri:group-fill h-6 mr-1 /><span>Local timeline</span>
+    </template>
+    <template #actions>
+      <div color-gray i-ri:equalizer-fill mr-1 h-6 />
+    </template>
+    <slot>
+      <TimelineList :timelines="timelines" />
+    </slot>
+  </MainContent>
+</template>