From 2c410306bf5481ad79663abfae4adc4569cfba8f Mon Sep 17 00:00:00 2001
From: Jesse Winton <jesse@appwrite.io>
Date: Wed, 26 Mar 2025 10:40:05 -0400
Subject: [PATCH 1/2] move event listener to svelte window

---
 src/lib/components/blog/table-of-contents.svelte | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/blog/table-of-contents.svelte b/src/lib/components/blog/table-of-contents.svelte
index c7dee57f9..9f30d15c7 100644
--- a/src/lib/components/blog/table-of-contents.svelte
+++ b/src/lib/components/blog/table-of-contents.svelte
@@ -9,14 +9,16 @@
 
     let isScrolled: boolean = false;
 
-    window.addEventListener('scroll', () => {
+    const handleIsScrolled = () => {
         isScrolled = !!window.scrollY;
-    });
+    };
 
     export let toc: Array<TocItem> = [];
     export let heading: string = 'Table of Contents';
 </script>
 
+<svelte:window on:scroll={handleIsScrolled} />
+
 <nav class="sticky top-32 col-span-3 mt-2 -ml-4 hidden h-[800px] flex-col gap-6 lg:flex">
     <span class="text-micro tracking-loose text-primary font-aeonik-fono ps-6 uppercase"
         >{heading}</span

From 8f215a56cd2c4a6057cd31e29368da9cd4e2c522 Mon Sep 17 00:00:00 2001
From: Jesse Winton <jesse@appwrite.io>
Date: Wed, 26 Mar 2025 10:40:53 -0400
Subject: [PATCH 2/2] localize type

---
 .../components/blog/table-of-contents.svelte    | 17 ++++++++++++++++-
 src/lib/layouts/DocsArticle.svelte              |  1 -
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/blog/table-of-contents.svelte b/src/lib/components/blog/table-of-contents.svelte
index 9f30d15c7..2520f59e3 100644
--- a/src/lib/components/blog/table-of-contents.svelte
+++ b/src/lib/components/blog/table-of-contents.svelte
@@ -1,5 +1,20 @@
+<script lang="ts" context="module">
+    export type TocItem = {
+        title: string;
+        href: string;
+        step?: number;
+        selected?: boolean;
+        level?: number;
+        children?: Array<{
+            title: string;
+            href: string;
+            selected: boolean;
+            level?: number;
+        }>;
+    };
+</script>
+
 <script lang="ts">
-    import type { TocItem } from '$lib/layouts/DocsArticle.svelte';
     import { classNames } from '$lib/utils/classnames';
     import { fade } from 'svelte/transition';
 
diff --git a/src/lib/layouts/DocsArticle.svelte b/src/lib/layouts/DocsArticle.svelte
index cde10b75e..bac1a99c3 100644
--- a/src/lib/layouts/DocsArticle.svelte
+++ b/src/lib/layouts/DocsArticle.svelte
@@ -18,7 +18,6 @@
     import { setContext } from 'svelte';
     import { writable } from 'svelte/store';
     import { Feedback } from '$lib/components';
-    import { scrollToTop } from '$lib/actions/scrollToTop';
     import TableOfContents from '$lib/components/blog/table-of-contents.svelte';
 
     export let title: string;