feed mode should be per extension not website via localstorage actually, fix manual fetch

Author: hzoo

components/ManualFetchButton.tsx

@@ -1,51 +1,33 @@
 import { searchBskyPosts } from "@/lib/bsky";
 import { currentPosts, loading, error, contentSourceUrl } from "@/lib/signals";
-import { useRef, useEffect } from "react";
 
-export function ManualFetchButton() {
-  const controllerRef = useRef<AbortController | null>(null);
-
-  useEffect(() => {
-    return () => {
-      // Cleanup: abort any pending request when component unmounts
-      if (controllerRef.current) {
-        controllerRef.current.abort();
-      }
-    };
-  }, []);
+const handleFetch = () => {
+	loading.value = true;
+	error.value = "";
 
-  const handleFetch = async () => {
-    // Abort previous request if it exists
-    if (controllerRef.current) {
-      controllerRef.current.abort();
-    }
-    
-    loading.value = true;
-    error.value = '';
-    
-    controllerRef.current = new AbortController();
-    
-    try {
-      currentPosts.value = await searchBskyPosts(contentSourceUrl.value, controllerRef.current.signal) || [];
-      loading.value = false;
-    } catch (err: unknown) {
-      // Don't set error if it was just aborted
-      if (err instanceof Error && err.name !== 'AbortError') {
-        console.error('Error fetching posts:', err);
-        error.value = err.message || 'Failed to fetch Bluesky posts';
-      }
-      loading.value = false;
-    }
-  };
+	searchBskyPosts(contentSourceUrl.value)
+		.then((fetchedPosts) => {
+			if (fetchedPosts) {
+				currentPosts.value = fetchedPosts;
+				// console.log(currentPosts.value.slice(0, 3));
+			}
+			loading.value = false;
+		})
+		.catch((err) => {
+			error.value = err.message || "Failed to fetch Bluesky posts";
+			loading.value = false;
+		});
+};
 
-  return (
-    <button
-      className="flex items-center justify-center gap-1.5 px-3 py-1.5 bg-green-100 hover:bg-green-200 dark:bg-green-900/30 dark:hover:bg-green-800/40 text-green-700 dark:text-green-300 rounded-md text-sm font-medium transition-colors"
-      onClick={handleFetch}
-      aria-label="Search for Bluesky posts"
-    >
-      <Icon name="magnifying" className="h-4 w-4" />
-      Search Posts
-    </button>
-  );
-} 
+export function ManualFetchButton() {
+	return (
+		<button
+			className="flex items-center justify-center gap-1.5 px-3 py-1.5 bg-green-100 hover:bg-green-200 dark:bg-green-900/30 dark:hover:bg-green-800/40 text-green-700 dark:text-green-300 rounded-md text-sm font-medium transition-colors"
+			onClick={handleFetch}
+			aria-label="Search for Bluesky posts"
+		>
+			<Icon name="magnifying" className="h-4 w-4" />
+			Search Posts
+		</button>
+	);
+}

lib/signals.ts

@@ -1,14 +1,14 @@
 import type { PostView } from "@atproto/api/dist/client/types/app/bsky/feed/defs";
 import { signal } from "@preact/signals";
 
-import { signalL } from "@/lib/signal";
+import { signalBrowserLocal } from "@/lib/signal";
 
 export const currentPosts = signal<PostView[]>([]);
 export const loading = signal(false);
 export const error = signal<string | null>(null);
 export const contentSourceUrl = signal<string>("");
 
-export const mode = signalL<"full" | "compact">("mode", "full");
+export const mode = signalBrowserLocal<"full" | "compact">("mode", "full");
 
 // Search parameters
 export const searchSort = signal<'top' | 'latest'>('top');

package.json

@@ -1,6 +1,6 @@
 {
-  "name": "extension-atproto-annotations",
-  "description": "annotations using atproto",
+  "name": "extension-bluesky-annotations",
+  "description": "see posts from bluesky on your current page",
   "private": true,
   "version": "0.0.1",
   "type": "module",