From fd92bd61127dab34c13ec787492a7f58259075e4 Mon Sep 17 00:00:00 2001
From: Florian <45694132+flo-bit@users.noreply.github.com>
Date: Thu, 15 May 2025 15:44:26 +0200
Subject: [PATCH] fix?

---
 README.md                | 135 ++-------------------------------------
 package.json             |   2 +-
 src/routes/+layout.ts    |   2 +
 src/routes/Search.svelte |  12 +++-
 4 files changed, 19 insertions(+), 132 deletions(-)

diff --git a/README.md b/README.md
index f2633a3..7e5868f 100644
--- a/README.md
+++ b/README.md
@@ -1,136 +1,11 @@
-# svelte atproto client oauth demo
+# search bluesky likes
 
-this is a scaffold for how to get client side oauth working with sveltekit and atproto 
-using the [`@atcute/oauth-browser-client`](https://github.com/mary-ext/atcute) library.
+static client side app that allows you to search your bluesky likes
 
-useful when you want people to login to your static sveltekit site.
-
-## how to install
-
-### either clone this repo
-
-1. clone this repo
-2. run `npm install`
-3. run `npm run dev`
-4. go to `http://127.0.0.1:5179`
-5. for deployment change the `SITE_URL` variable in `src/lib/oauth/const.ts` 
-(e.g. for github pages: `https://your-username.github.io`) and set your base in `svelte.config.js` 
-(e.g. for github pages: `base: '/your-repo-name/'`) while keeping it as `''` in development.
-
-```
-const config = {
-	// ...
-
-	kit: {
-		// ...
-
-		paths: {
-			base: process.env.NODE_ENV === 'development' ? '' : '/svelte-atproto-client-oauth'
-		}
-	}
-};
-```
-
-### or manually install in your own project
-
-1. copy the `src/lib/oauth` folder into your own project
-2. also copy the `src/routes/client-metadata.json` folder into your project
-3. add the following to your `src/routes/+layout.svelte`
-
-```svelte
-<script>
-	import { initClient } from '$lib/oauth';
-
-	onMount(() => {
-		initClient();
-	});
-</script>
-
-{@render children()}
-```
-
-4. add server and port to your `vite.config.ts`
-
-```js
-export default defineConfig({
-	server: {
-		host: '127.0.0.1',
-		port: 5179
-	}
-});
-```
-
-5. install the dependencies
+## how to run
 
 ```bash
-npm install @atcute/oauth-browser-client @atcute/client
-```
-
-6. for deployment change the `SITE_URL` variable in `src/lib/oauth/const.ts` 
-(e.g. for github pages: `https://your-username.github.io`) and set your base in `svelte.config.js` 
-(e.g. for github pages: `base: '/your-repo-name/'`) while keeping it as `''` in development.
-
+npm install
+npm run dev
 ```
-const config = {
-	// ...
 
-	kit: {
-		// ...
-
-		paths: {
-			base: process.env.NODE_ENV === 'development' ? '' : '/svelte-atproto-client-oauth'
-		}
-	}
-};
-```
-
-
-## how to use
-
-### login flow
-
-Either use the `LoginModal` component to render a login modal or use the `client` object to handle the login flow yourself.
-
-```ts
-// handlin login flow yourself
-import { client } from '$lib/oauth';
-
-// methods:
-client.login(handle); // login the user
-client.isLoggedIn; // check if the user is logged in
-client.logout(); // logout the user
-```
-
-LoginModal is a component that renders a login modal, add it for a quick login flow. 
-(copy the `src/lib/UI` folder into your projects `src/lib` folder)
-
-```svelte
-<script>
-	import { LoginModal, loginModalState } from '$lib/oauth';
-</script>
-
-<LoginModal />
-
-<button onclick={() => loginModalState.show()}>Show Login Modal</button>
-```
-
-### make requests
-
-Get the user's profile and make requests with the `client.rpc` object.
-
-```ts
-import { client } from '$lib/oauth';
-
-// get the user's profile
-const profile = client.profile;
-
-// make requests with the client.rpc object
-const response = await client.rpc.request({
-	type: 'get',
-	nsid: 'app.bsky.feed.getActorLikes',
-	params: {
-		actor: client.profile?.did,
-		limit: 10
-	}
-});
-```
diff --git a/package.json b/package.json
index b6f5a65..634c238 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-	"name": "svelte-atproto-client-oauth",
+	"name": "search-bluesky-likes",
 	"private": true,
 	"version": "0.0.1",
 	"type": "module",
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index 189f71e..1078156 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -1 +1,3 @@
 export const prerender = true;
+
+export const ssr = false;
\ No newline at end of file
diff --git a/src/routes/Search.svelte b/src/routes/Search.svelte
index 62b4b4a..a400c13 100644
--- a/src/routes/Search.svelte
+++ b/src/routes/Search.svelte
@@ -10,10 +10,14 @@
 
 	let loading = $state(true);
 
+	let count = $state(0);
+
 	function addLikeId(id: string) {
 		likesIds.add(id);
 		// save in local storage
 		localStorage.setItem('likes-ids', Array.from(likesIds).join(','));
+
+		count = likesIds.size;
 	}
 
 	function getLikesIds() {
@@ -21,11 +25,15 @@
 		if (ids) {
 			likesIds = new Set(ids.split(','));
 		}
+
+		count = likesIds.size;
 	}
 
 	function clearLikesIds() {
 		likesIds.clear();
 		localStorage.removeItem('likes-ids');
+
+		count = 0;
 	}
 
 	async function clearIndex() {
@@ -35,6 +43,8 @@
 		index.clear();
 
 		await index.commit();
+
+		count = 0;
 	}
 
 	onMount(async () => {
@@ -172,7 +182,7 @@
 />
 
 {#if loading}
-	<Heading>Loading your likes...</Heading>
+	<Heading>Loading your likes... ({count})</Heading>
 {:else}
 	<Navbar class="mx-2 max-w-xl sm:mx-auto md:top-10">
 		<Input
-- 
2.51.2