From 8c68957df8751ce539fdf744a6c26124c65d0a08 Mon Sep 17 00:00:00 2001
From: Jesse Wierzbinski <contact@cpluspatch.com>
Date: Sun, 28 Apr 2024 16:59:28 -1000
Subject: [PATCH] feat: :sparkles: Add home timeline for logged-in users

---
 components/sidebars/navigation.vue |  8 +++++++-
 components/timelines/Home.vue      | 17 +++++++++++++++++
 composables/HomeTimeline.ts        | 23 +++++++++++++++++++++++
 pages/home.vue                     |  9 +++++++++
 4 files changed, 56 insertions(+), 1 deletion(-)
 create mode 100644 components/timelines/Home.vue
 create mode 100644 composables/HomeTimeline.ts
 create mode 100644 pages/home.vue

diff --git a/components/sidebars/navigation.vue b/components/sidebars/navigation.vue
index 9fe4658..901fa48 100644
--- a/components/sidebars/navigation.vue
+++ b/components/sidebars/navigation.vue
@@ -9,7 +9,7 @@
             <h3 class="font-semibold text-gray-300 text-xs uppercase opacity-0 group-hover:opacity-100 duration-200">
                 Timelines</h3>
             <NuxtLink v-for="timeline in timelines" :key="timeline.href" :to="timeline.href">
-                <ButtonsBase
+                <ButtonsBase v-if="!timeline.requiresAuth || (timeline.requiresAuth && tokenData)"
                     class="flex flex-row text-left items-center justify-start gap-3 text-lg hover:ring-1 ring-white/10 overflow-hidden h-12 w-full duration-200">
                     <Icon :name="timeline.icon" class="shrink-0 text-2xl" />
                     <span class="pr-28 line-clamp-1">{{ timeline.name }}</span>
@@ -54,6 +54,12 @@
 
 <script lang="ts" setup>
 const timelines = ref([
+    {
+        href: "/home",
+        name: "Home",
+        icon: "tabler:home",
+        requiresAuth: true,
+    },
     {
         href: "/public",
         name: "Public",
diff --git a/components/timelines/Home.vue b/components/timelines/Home.vue
new file mode 100644
index 0000000..9938ea7
--- /dev/null
+++ b/components/timelines/Home.vue
@@ -0,0 +1,17 @@
+<template>
+    <TimelinesTimeline :timeline="timeline" :load-next="loadNext" :load-prev="loadPrev" />
+</template>
+
+<script lang="ts" setup>
+const tokenData = useTokenData();
+const client = useMegalodon(tokenData);
+const timelineParameters = ref({});
+const { timeline, loadNext, loadPrev } = useHomeTimeline(
+    client.value,
+    timelineParameters,
+);
+
+useListen("note:delete", ({ id }) => {
+    timeline.value = timeline.value.filter((note) => note.id !== id);
+});
+</script>
\ No newline at end of file
diff --git a/composables/HomeTimeline.ts b/composables/HomeTimeline.ts
new file mode 100644
index 0000000..67d4e0c
--- /dev/null
+++ b/composables/HomeTimeline.ts
@@ -0,0 +1,23 @@
+import type { Mastodon } from "megalodon";
+import type { Status } from "~/types/mastodon/status";
+
+export const useHomeTimeline = (
+    client: Mastodon | null,
+    options: MaybeRef<{
+        local?: boolean;
+        limit?: number;
+        max_id?: string;
+        since_id?: string;
+        min_id?: string;
+    }>,
+): {
+    timeline: Ref<Status[]>;
+    loadNext: () => Promise<void>;
+    loadPrev: () => Promise<void>;
+} => {
+    return useTimeline(
+        client,
+        (client, options) => client?.getHomeTimeline(options),
+        options,
+    );
+};
diff --git a/pages/home.vue b/pages/home.vue
new file mode 100644
index 0000000..08130b4
--- /dev/null
+++ b/pages/home.vue
@@ -0,0 +1,9 @@
+<template>
+    <TimelinesHome />
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+    layout: "app",
+});
+</script>
\ No newline at end of file