From c51a0b1e5def05fa7cf0870107b804e7eacbd9de Mon Sep 17 00:00:00 2001
From: mae taylor <mae@mae.wtf>
Date: Tue, 15 Jul 2025 15:08:37 +0100
Subject: [PATCH 1/5] feat: local and federated timelines

---
 src/lib/api.js          |  4 ++-
 src/lib/timeline.js     | 10 ++++---
 src/routes/+page.svelte | 61 +++++++++++++++++++++++++++++++++++++----
 3 files changed, 64 insertions(+), 11 deletions(-)

diff --git a/src/lib/api.js b/src/lib/api.js
index 07644a3..4fc3606 100644
--- a/src/lib/api.js
+++ b/src/lib/api.js
@@ -243,11 +243,13 @@ export async function rejectFollowRequest(host, token, account_id) {
  * @param {string} timeline - The name of the timeline to pull (default "home").
  * @param {string} max_id - If provided, only shows posts after this ID.
  */
-export async function getTimeline(host, token, timeline, max_id) {
+export async function getTimeline(host, token, timeline, max_id, local_only, remote_only) {
     let url = `https://${host}/api/v1/timelines/${timeline || "home"}`;
 
     let params = new URLSearchParams();
     if (max_id) params.append("max_id", max_id);
+    if (remote_only) params.append("remote", remote_only);
+    if (local_only) params.append("local", local_only);
     const params_string = params.toString();
     if (params_string) url += '?' + params_string;
     
diff --git a/src/lib/timeline.js b/src/lib/timeline.js
index 66db44d..b5f8c2e 100644
--- a/src/lib/timeline.js
+++ b/src/lib/timeline.js
@@ -11,7 +11,7 @@ const lang = Lang();
 
 let loading = false;
 
-export async function getTimeline(clean) {
+export async function getTimeline(timelineType = "home", clean, localOnly = false, remoteOnly = false) {
     if (loading) return; // no spamming!!
     loading = true;
 
@@ -22,9 +22,11 @@ export async function getTimeline(clean) {
     const timeline_data = await api.getTimeline(
         get(server).host,
         get(app).token,
-        "home",
-        last_post
-    );
+        timelineType,
+        last_post,
+        localOnly,
+        remoteOnly
+);
 
     if (!timeline_data) {
         console.error(lang.string('logs.timeline_fetch_failed'));
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 766a6a4..3375ab4 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -2,6 +2,7 @@
     import { page } from '$app/stores';
     import { account } from '$lib/stores/account.js';
     import { timeline, getTimeline } from '$lib/timeline.js';
+    import { app_name } from '$lib/config.js';
     import Lang from '$lib/lang';
 
     import LoginForm from '$lib/ui/LoginForm.svelte';
@@ -11,23 +12,71 @@
 
     const lang = Lang();
 
+    // TODO: refactor to enum when moving to TS
+    let timelineType = localStorage.getItem(app_name + '_selected_timeline') || "home";
+
+    $: {
+        // awful hack to update timeline fresh
+        // when timelineType is updated
+        //
+        // TODO: migrate to $effect when migrating to svelte 5
+        timelineType = timelineType
+
+        // set in localStorage
+        localStorage.setItem(app_name + '_selected_timeline', timelineType);
+     
+        // erase the timeline here so the ui reacts instantly
+        // mae: i could write an awesome undertale reference here
+        timeline.set([]);
+
+        getCurrentTimeline()
+    }
+
+    function getCurrentTimeline(clean = false) {
+        switch(timelineType) {
+            case "home":
+                getTimeline("home", clean);
+                break;
+
+            case "local":
+                getTimeline("public", clean, true)
+                break;
+
+            case "federated":
+                getTimeline("public", clean, false, true)
+                break;
+        }
+    }
+
     account.subscribe(account => {
-        if (account) getTimeline();
+        if (account) getCurrentTimeline();
     });
 
     document.addEventListener('scroll', () => {
         if ($account && $page.url.pathname !== "/") return;
         if (window.innerHeight + window.scrollY >= document.body.offsetHeight - 2048) {
-            getTimeline();
+            getCurrentTimeline();
         }
     });
 </script>
 
 {#if $account}
-    <PageHeader title={lang.string('timeline.home')}>
-        <Button centered active>{lang.string('timeline.home')}</Button>
-        <Button centered disabled>{lang.string('timeline.local')}</Button>
-        <Button centered disabled>{lang.string('timeline.federated')}</Button>
+    <PageHeader title={lang.string(`timeline.${timelineType}`)}>
+        <Button centered 
+        active={(timelineType == "home")} 
+        on:click={() => timelineType = "home"}>
+            {lang.string('timeline.home')}
+        </Button>
+        <Button centered 
+        active={(timelineType == "local")} 
+        on:click={() => timelineType = "local"}>
+            {lang.string('timeline.local')}
+        </Button>
+                <Button centered 
+        active={(timelineType == "federated")} 
+        on:click={() => timelineType = "federated"}>
+            {lang.string('timeline.federated')}
+        </Button>
     </PageHeader>
 
     <div id="feed" role="feed">

From 99def58c8b1799ad4f18c0e8f8752259d1fc4f15 Mon Sep 17 00:00:00 2001
From: mae taylor <mae@mae.wtf>
Date: Tue, 15 Jul 2025 15:37:03 +0100
Subject: [PATCH 2/5] feat: partial favourites

---
 src/lib/api.js                     | 24 ++++++++++++++++++++
 src/lib/timeline.js                | 29 +++++++++++++++++-------
 src/routes/favourites/+page.svelte | 36 ++++++++++++++++++++++++++++++
 3 files changed, 81 insertions(+), 8 deletions(-)
 create mode 100644 src/routes/favourites/+page.svelte

diff --git a/src/lib/api.js b/src/lib/api.js
index 4fc3606..4c8c38c 100644
--- a/src/lib/api.js
+++ b/src/lib/api.js
@@ -242,6 +242,8 @@ export async function rejectFollowRequest(host, token, account_id) {
  * @param {string} token - The application token.
  * @param {string} timeline - The name of the timeline to pull (default "home").
  * @param {string} max_id - If provided, only shows posts after this ID.
+ * @param {boolean} local_only - If provided, only shows posts from the local instance
+ * @param {boolean} remote_only - If provided, only shows posts from other instances
  */
 export async function getTimeline(host, token, timeline, max_id, local_only, remote_only) {
     let url = `https://${host}/api/v1/timelines/${timeline || "home"}`;
@@ -558,3 +560,25 @@ export async function getUserPinnedPosts(host, token, user_id) {
 
     return data;
 }
+
+/**
+ * GET /api/v1/favourites
+ * @param {string} host - The domain of the target server.
+ * @param {string} token - The application token.
+ * @param {string} max_id - If provided, only shows posts after this ID.
+ */
+export async function getFavourites(host, token, timeline, max_id) {
+    let url = `https://${host}/api/v1/favourites`;
+
+    let params = new URLSearchParams();
+    if (max_id) params.append("max_id", max_id);
+    const params_string = params.toString();
+    if (params_string) url += '?' + params_string;
+    
+    const data = await fetch(url, {
+        method: 'GET',
+        headers: { "Authorization": token ? `Bearer ${token}` : null }
+    }).then(res => res.json());
+
+    return data;
+}
diff --git a/src/lib/timeline.js b/src/lib/timeline.js
index b5f8c2e..0f54e91 100644
--- a/src/lib/timeline.js
+++ b/src/lib/timeline.js
@@ -19,14 +19,27 @@ export async function getTimeline(timelineType = "home", clean, localOnly = fals
     if (!clean && get(timeline).length > 0)
         last_post = get(timeline)[get(timeline).length - 1].id;
 
-    const timeline_data = await api.getTimeline(
-        get(server).host,
-        get(app).token,
-        timelineType,
-        last_post,
-        localOnly,
-        remoteOnly
-);
+    let timeline_data;
+    switch(timelineType) {
+        case "favourites":
+            timeline_data = await api.getFavourites(
+                get(server).host,
+                get(app).token,
+                last_post,
+            )
+            break;
+            
+        default:
+            timeline_data = await api.getTimeline(
+                get(server).host,
+                get(app).token,
+                timelineType,
+                last_post,
+                localOnly,
+                remoteOnly
+            );
+            break;
+    }
 
     if (!timeline_data) {
         console.error(lang.string('logs.timeline_fetch_failed'));
diff --git a/src/routes/favourites/+page.svelte b/src/routes/favourites/+page.svelte
new file mode 100644
index 0000000..0fa8d44
--- /dev/null
+++ b/src/routes/favourites/+page.svelte
@@ -0,0 +1,36 @@
+<script>
+    import { page } from '$app/stores';
+    import { account } from '@cf/store/account.js';
+    import { timeline, getTimeline } from '$lib/timeline.js';
+
+    import Button from '@cf/ui/Button.svelte';
+    import Post from '@cf/ui/post/Post.svelte';
+    import PageHeader from '@cf/ui/core/PageHeader.svelte';
+
+    import Lang from '$lib/lang';
+
+    const lang = Lang();
+    if (!$account) goto("/");
+
+    getTimeline("favourites");
+
+    document.addEventListener('scroll', () => {
+        if ($account && $page.url.pathname !== "/favourites") return;
+        if (window.innerHeight + window.scrollY >= document.body.offsetHeight - 2048) {
+            getTimeline("favourites");
+        }
+    });
+</script>
+
+<PageHeader title={lang.string(`navigation.favourites`)}/>
+
+<div id="feed" role="feed">
+    {#if $timeline.length <= 0}
+        <div class="loading throb">
+            <span>{lang.string('timeline.fetching')}</span>
+        </div>
+    {/if}
+    {#each $timeline as post}
+        <Post post_data={post} />
+    {/each}
+</div>
\ No newline at end of file

From 3b8ca902f1457d2d2ea28c9af7ef99f2fc41643b Mon Sep 17 00:00:00 2001
From: mae taylor <mae@mae.wtf>
Date: Tue, 15 Jul 2025 16:34:23 +0100
Subject: [PATCH 3/5] refactor: use Link HTTP header for pagination

---
 src/lib/api.js      | 87 ++++++++++++++++++++++++++++++++-------------
 src/lib/timeline.js | 19 ++++++----
 2 files changed, 74 insertions(+), 32 deletions(-)

diff --git a/src/lib/api.js b/src/lib/api.js
index 4c8c38c..812ddd0 100644
--- a/src/lib/api.js
+++ b/src/lib/api.js
@@ -2,6 +2,31 @@ const errors = {
     AUTHENTICATION_FAILED: "AUTHENTICATION_FAILED",
 };
 
+/**
+ * Parses a HTTP Link header
+ * @param {string} header - the HTTP Link header string
+ */
+function _parseLinkHeader(header) {
+    // remove whitespace and split
+    let links = header.replace(/\ /g, "").split(",");
+
+    return links.map(l => {
+        let parts = l.split(";");
+
+        // assuming 0th is URL, removing <>
+        let url = new URL(parts[0].slice(1, -1));
+
+        // get rel inbetween double-quotes
+        let rel = parts[1].match(/"(.*?)"/g)[0].slice(1, -1);
+
+        return {
+            url, rel
+        }
+    })
+}
+
+_parseLinkHeader(`<https://wetdry.world/api/v1/timelines/home?max_id=114857293229157171>; rel="next", <https://wetdry.world/api/v1/timelines/home?min_id=114857736990577458>; rel="prev"`)
+
 /**
  * GET /api/v1/instance
  * @param {string} host - The domain of the target server.
@@ -258,9 +283,43 @@ export async function getTimeline(host, token, timeline, max_id, local_only, rem
     const data = await fetch(url, {
         method: 'GET',
         headers: { "Authorization": token ? `Bearer ${token}` : null }
-    }).then(res => res.json());
+    })
 
-    return data;
+    let links = _parseLinkHeader(data.headers.get("Link"));
+
+    return {
+        data: await data.json(),
+        prev: links.find(f=>f.rel=="prev"),
+        next: links.find(f=>f.rel=="next")
+    };
+}
+
+/**
+ * GET /api/v1/favourites
+ * @param {string} host - The domain of the target server.
+ * @param {string} token - The application token.
+ * @param {string} max_id - If provided, only shows posts after this ID.
+ */
+export async function getFavourites(host, token, max_id) {
+    let url = `https://${host}/api/v1/favourites`;
+
+    let params = new URLSearchParams();
+    if (max_id) params.append("max_id", max_id);
+    const params_string = params.toString();
+    if (params_string) url += '?' + params_string;
+    
+    const data = await fetch(url, {
+        method: 'GET',
+        headers: { "Authorization": token ? `Bearer ${token}` : null }
+    })
+
+    let links = _parseLinkHeader(data.headers.get("Link"));
+
+    return {
+        data: await data.json(),
+        prev: links.find(f=>f.rel=="prev"),
+        next: links.find(f=>f.rel=="next")
+    };
 }
 
 /**
@@ -559,26 +618,4 @@ export async function getUserPinnedPosts(host, token, user_id) {
     }).then(res => res.json());
 
     return data;
-}
-
-/**
- * GET /api/v1/favourites
- * @param {string} host - The domain of the target server.
- * @param {string} token - The application token.
- * @param {string} max_id - If provided, only shows posts after this ID.
- */
-export async function getFavourites(host, token, timeline, max_id) {
-    let url = `https://${host}/api/v1/favourites`;
-
-    let params = new URLSearchParams();
-    if (max_id) params.append("max_id", max_id);
-    const params_string = params.toString();
-    if (params_string) url += '?' + params_string;
-    
-    const data = await fetch(url, {
-        method: 'GET',
-        headers: { "Authorization": token ? `Bearer ${token}` : null }
-    }).then(res => res.json());
-
-    return data;
-}
+}
\ No newline at end of file
diff --git a/src/lib/timeline.js b/src/lib/timeline.js
index 0f54e91..6b6050f 100644
--- a/src/lib/timeline.js
+++ b/src/lib/timeline.js
@@ -10,14 +10,14 @@ export const timeline = writable([]);
 const lang = Lang();
 
 let loading = false;
+let last_post = false;
 
 export async function getTimeline(timelineType = "home", clean, localOnly = false, remoteOnly = false) {
     if (loading) return; // no spamming!!
     loading = true;
 
-    let last_post = false;
-    if (!clean && get(timeline).length > 0)
-        last_post = get(timeline)[get(timeline).length - 1].id;
+    // if (!clean && get(timeline).length > 0)
+    //     last_post = get(timeline)[get(timeline).length - 1].id;
 
     let timeline_data;
     switch(timelineType) {
@@ -25,7 +25,7 @@ export async function getTimeline(timelineType = "home", clean, localOnly = fals
             timeline_data = await api.getFavourites(
                 get(server).host,
                 get(app).token,
-                last_post,
+                last_post
             )
             break;
             
@@ -47,10 +47,15 @@ export async function getTimeline(timelineType = "home", clean, localOnly = fals
         return;
     }
 
-    if (clean) timeline.set([]);
+    if (clean) {
+        timeline.set([]);
+        last_post = false;
+    } else {
+        last_post = timeline_data.next.url.searchParams.get("max_id")
+    } 
 
-    for (let i in timeline_data) {
-        const post_data = timeline_data[i];
+    for (let i in timeline_data.data) {
+        const post_data = timeline_data.data[i];
         const post = await parsePost(post_data, 1);
         if (!post) {
             if (post === null || post === undefined) {

From ea1a492dc0e83aa44ffd9e5aa90abb1a0aa22b22 Mon Sep 17 00:00:00 2001
From: mae taylor <mae@mae.wtf>
Date: Tue, 15 Jul 2025 16:42:21 +0100
Subject: [PATCH 4/5] fix: timing update on timeline fetcher

---
 src/lib/timeline.js                | 11 +++++------
 src/lib/ui/Navigation.svelte       |  5 ++++-
 src/routes/favourites/+page.svelte |  2 +-
 3 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/lib/timeline.js b/src/lib/timeline.js
index 6b6050f..68aa2b2 100644
--- a/src/lib/timeline.js
+++ b/src/lib/timeline.js
@@ -16,8 +16,10 @@ export async function getTimeline(timelineType = "home", clean, localOnly = fals
     if (loading) return; // no spamming!!
     loading = true;
 
-    // if (!clean && get(timeline).length > 0)
-    //     last_post = get(timeline)[get(timeline).length - 1].id;
+    if(clean) {
+        timeline.set([]);
+        last_post = false;
+    }
 
     let timeline_data;
     switch(timelineType) {
@@ -47,10 +49,7 @@ export async function getTimeline(timelineType = "home", clean, localOnly = fals
         return;
     }
 
-    if (clean) {
-        timeline.set([]);
-        last_post = false;
-    } else {
+    if (!clean) {
         last_post = timeline_data.next.url.searchParams.get("max_id")
     } 
 
diff --git a/src/lib/ui/Navigation.svelte b/src/lib/ui/Navigation.svelte
index 384450d..b0fa105 100644
--- a/src/lib/ui/Navigation.svelte
+++ b/src/lib/ui/Navigation.svelte
@@ -124,7 +124,10 @@
         </Button>
 
         <div class="flex-row">
-            <Button centered label="{lang.string('navigation.favourites')}" disabled>
+            <Button centered 
+            label="{lang.string('navigation.favourites')}" 
+            href="/favourites"}
+            active={$page.url.pathname === "/favourites"}>
                 <svelte:fragment slot="icon">
                     <FavouritesIcon/>
                 </svelte:fragment>
diff --git a/src/routes/favourites/+page.svelte b/src/routes/favourites/+page.svelte
index 0fa8d44..0bd0331 100644
--- a/src/routes/favourites/+page.svelte
+++ b/src/routes/favourites/+page.svelte
@@ -12,7 +12,7 @@
     const lang = Lang();
     if (!$account) goto("/");
 
-    getTimeline("favourites");
+    getTimeline("favourites", true);
 
     document.addEventListener('scroll', () => {
         if ($account && $page.url.pathname !== "/favourites") return;

From daaa819e6cdafd79eb86448682cc404dd5ead7a6 Mon Sep 17 00:00:00 2001
From: mae taylor <mae@mae.wtf>
Date: Tue, 15 Jul 2025 16:51:55 +0100
Subject: [PATCH 5/5] refactor: update icon imports to @cf/icons

---
 src/lib/ui/Navigation.svelte            | 24 ++++++++++++------------
 src/lib/ui/Notification.svelte          |  8 ++++----
 src/lib/ui/post/ActionBar.svelte        | 14 +++++++-------
 src/routes/follow-requests/+page.svelte |  4 ++--
 4 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/src/lib/ui/Navigation.svelte b/src/lib/ui/Navigation.svelte
index b0fa105..abfacf8 100644
--- a/src/lib/ui/Navigation.svelte
+++ b/src/lib/ui/Navigation.svelte
@@ -14,18 +14,18 @@
     import Logo from '$lib/../img/campfire-logo.svg';
     import Button from './Button.svelte';
 
-    import TimelineIcon from '../../img/icons/timeline.svg';
-    import NotificationsIcon from '../../img/icons/notifications.svg';
-    import ExploreIcon from '../../img/icons/explore.svg';
-    import ListIcon from '../../img/icons/lists.svg';
-    import FavouritesIcon from '../../img/icons/like_fill.svg';
-    import BookmarkIcon from '../../img/icons/bookmark.svg';
-    import HashtagIcon from '../../img/icons/hashtag.svg';
-    import PostIcon from '../../img/icons/post.svg';
-    import InfoIcon from '../../img/icons/info.svg';
-    import SettingsIcon from '../../img/icons/settings.svg';
-    import LogoutIcon from '../../img/icons/logout.svg';
-    import FollowersIcon from '../../img/icons/followers.svg';
+    import TimelineIcon from '@cf/icons/timeline.svg';
+    import NotificationsIcon from '@cf/icons/notifications.svg';
+    import ExploreIcon from '@cf/icons/explore.svg';
+    import ListIcon from '@cf/icons/lists.svg';
+    import FavouritesIcon from '@cf/icons/like_fill.svg';
+    import BookmarkIcon from '@cf/icons/bookmark.svg';
+    import HashtagIcon from '@cf/icons/hashtag.svg';
+    import PostIcon from '@cf/icons/post.svg';
+    import InfoIcon from '@cf/icons/info.svg';
+    import SettingsIcon from '@cf/icons/settings.svg';
+    import LogoutIcon from '@cf/icons/logout.svg';
+    import FollowersIcon from '@cf/icons/followers.svg';
 
     const VERSION = APP_VERSION;
     const lang = Lang();
diff --git a/src/lib/ui/Notification.svelte b/src/lib/ui/Notification.svelte
index e23a28d..0e5477a 100644
--- a/src/lib/ui/Notification.svelte
+++ b/src/lib/ui/Notification.svelte
@@ -2,10 +2,10 @@
     import { server } from '$lib/client/server';
     import { goto } from '$app/navigation';
 
-    import ReplyIcon from '$lib/../img/icons/reply.svg';
-    import RepostIcon from '$lib/../img/icons/repost.svg';
-    import FavouriteIcon from '$lib/../img/icons/like.svg';
-    import ReactIcon from '$lib/../img/icons/react.svg';
+    import ReplyIcon from '@cf/icons/reply.svg';
+    import RepostIcon from '@cf/icons/repost.svg';
+    import FavouriteIcon from '@cf/icons/like.svg';
+    import ReactIcon from '@cf/icons/react.svg';
     // import QuoteIcon from '$lib/../img/icons/quote.svg';
     import ReactionBar from '$lib/ui/post/ReactionBar.svelte';
     import ActionBar from '$lib/ui/post/ActionBar.svelte';
diff --git a/src/lib/ui/post/ActionBar.svelte b/src/lib/ui/post/ActionBar.svelte
index 52ab7eb..baf82c4 100644
--- a/src/lib/ui/post/ActionBar.svelte
+++ b/src/lib/ui/post/ActionBar.svelte
@@ -10,13 +10,13 @@
 
     import ActionButton from './ActionButton.svelte';
 
-    import ReplyIcon from '../../../img/icons/reply.svg';
-    import RepostIcon from '../../../img/icons/repost.svg';
-    import FavouriteIcon from '../../../img/icons/like.svg';
-    import FavouriteIconFill from '../../../img/icons/like_fill.svg';
-    import QuoteIcon from '../../../img/icons/quote.svg';
-    import MoreIcon from '../../../img/icons/more.svg';
-    import DeleteIcon from '../../../img/icons/bin.svg';
+    import ReplyIcon from '@cf/icons/reply.svg';
+    import RepostIcon from '@cf/icons/repost.svg';
+    import FavouriteIcon from '@cf/icons/like.svg';
+    import FavouriteIconFill from '@cf/icons/like_fill.svg';
+    import QuoteIcon from '@cf/icons/quote.svg';
+    import MoreIcon from '@cf/icons/more.svg';
+    import DeleteIcon from '@cf/icons/bin.svg';
 
     export let post;
 
diff --git a/src/routes/follow-requests/+page.svelte b/src/routes/follow-requests/+page.svelte
index c6e62fb..f37a69a 100644
--- a/src/routes/follow-requests/+page.svelte
+++ b/src/routes/follow-requests/+page.svelte
@@ -7,8 +7,8 @@
     import Button from '../../lib/ui/Button.svelte';
     import * as api from '$lib/api'
 
-    import TickIcon from '../../img/icons/tick.svg'
-    import CrossIcon from '../../img/icons/cross.svg'
+    import TickIcon from '@cf/icons/tick.svg'
+    import CrossIcon from '@cf/icons/cross.svg'
     import { get } from 'svelte/store';
 
     const lang = Lang();