From 1e5bd7e21f8fef80aaf47637b25c97dbb4929ccf Mon Sep 17 00:00:00 2001
From: Ren Amamiya <123083837+reyamir@users.noreply.github.com>
Date: Tue, 30 May 2023 15:33:27 +0700
Subject: [PATCH] wip: native notification

---
 src/app/channel/pages/index.page.tsx  |  2 ++
 src/app/chat/pages/index.page.tsx     |  4 +++-
 src/app/index/pages/index.page.tsx    |  8 ++++---
 src/app/prefetch/pages/index.page.tsx | 20 +++++++---------
 src/shared/accounts/active.tsx        | 34 ++++++++++++++++++++++++++-
 src/stores/accounts.tsx               |  7 +++++-
 src/utils/notification.tsx            |  2 +-
 7 files changed, 59 insertions(+), 18 deletions(-)

diff --git a/src/app/channel/pages/index.page.tsx b/src/app/channel/pages/index.page.tsx
index c8b9ad15..30be6026 100644
--- a/src/app/channel/pages/index.page.tsx
+++ b/src/app/channel/pages/index.page.tsx
@@ -96,6 +96,8 @@ export function Page() {
 		},
 	);
 
+	if (!account) return <div>Fuck SSR</div>;
+
 	return (
 		<div className="h-full w-full grid grid-cols-3">
 			<div className="col-span-2 flex flex-col justify-between border-r border-zinc-900">
diff --git a/src/app/chat/pages/index.page.tsx b/src/app/chat/pages/index.page.tsx
index 51d01d74..f13facf9 100644
--- a/src/app/chat/pages/index.page.tsx
+++ b/src/app/chat/pages/index.page.tsx
@@ -24,7 +24,7 @@ export function Page() {
 	]);
 	const addMessage = useChatMessages((state: any) => state.add);
 
-	useSWRSubscription(account ? ["chat", pubkey] : null, ([, key]) => {
+	useSWRSubscription(account && pubkey ? ["chat", pubkey] : null, ([, key]) => {
 		const unsubscribe = pool.subscribe(
 			[
 				{
@@ -59,6 +59,8 @@ export function Page() {
 		};
 	}, [pubkey]);
 
+	if (!account) return <div>Fuck SSR</div>;
+
 	return (
 		<div className="h-full w-full grid grid-cols-3">
 			<div className="col-span-2 flex flex-col justify-between border-r border-zinc-900">
diff --git a/src/app/index/pages/index.page.tsx b/src/app/index/pages/index.page.tsx
index 5c669d28..57d5393d 100644
--- a/src/app/index/pages/index.page.tsx
+++ b/src/app/index/pages/index.page.tsx
@@ -3,20 +3,22 @@ import { useEffect } from "react";
 import { navigate } from "vite-plugin-ssr/client/router";
 
 export function Page() {
+	const fetchLastLogin = useActiveAccount((state: any) => state.fetchLastLogin);
 	const fetchAccount = useActiveAccount((state: any) => state.fetch);
 	const account = useActiveAccount((state: any) => state.account);
 
-	if (!account) {
+	if (!account && typeof window !== "undefined") {
 		navigate("/app/auth", { overwriteLastHistoryEntry: true });
 	}
 
-	if (account) {
+	if (account && typeof window !== "undefined") {
 		navigate("/app/prefetch", { overwriteLastHistoryEntry: true });
 	}
 
 	useEffect(() => {
 		fetchAccount();
-	}, [fetchAccount]);
+		fetchLastLogin();
+	}, [fetchAccount, fetchLastLogin]);
 
 	return (
 		<div className="h-screen w-screen bg-zinc-50 text-zinc-900 dark:bg-black dark:text-white" />
diff --git a/src/app/prefetch/pages/index.page.tsx b/src/app/prefetch/pages/index.page.tsx
index 145f8c2d..a6f74526 100644
--- a/src/app/prefetch/pages/index.page.tsx
+++ b/src/app/prefetch/pages/index.page.tsx
@@ -8,24 +8,23 @@ import {
 	countTotalNotes,
 	createChat,
 	createNote,
-	getLastLogin,
 } from "@utils/storage";
 import { getParentID } from "@utils/transform";
 import { useCallback, useContext, useRef } from "react";
 import useSWRSubscription from "swr/subscription";
 import { navigate } from "vite-plugin-ssr/client/router";
 
-let lastLogin: string;
 let totalNotes: number;
-
 if (typeof window !== "undefined") {
-	lastLogin = await getLastLogin();
 	totalNotes = await countTotalNotes();
 }
 
 export function Page() {
 	const pool: any = useContext(RelayContext);
-	const account = useActiveAccount((state: any) => state.account);
+	const [account, lastLogin] = useActiveAccount((state: any) => [
+		state.account,
+		state.lastLogin,
+	]);
 
 	const now = useRef(new Date());
 	const eose = useRef(0);
@@ -33,15 +32,14 @@ export function Page() {
 	const getQuery = useCallback(() => {
 		const query = [];
 		const follows = JSON.parse(account.follows);
-		const last = parseInt(lastLogin);
 
 		let queryNoteSince: number;
 
 		if (totalNotes === 0) {
 			queryNoteSince = dateToUnix(getHourAgo(48, now.current));
 		} else {
-			if (parseInt(lastLogin) > 0) {
-				queryNoteSince = last;
+			if (lastLogin > 0) {
+				queryNoteSince = lastLogin;
 			} else {
 				queryNoteSince = dateToUnix(getHourAgo(48, now.current));
 			}
@@ -58,21 +56,21 @@ export function Page() {
 		query.push({
 			kinds: [4],
 			"#p": [account.pubkey],
-			since: last,
+			since: lastLogin,
 		});
 
 		// kind 4 (chats) query
 		query.push({
 			kinds: [4],
 			authors: [account.pubkey],
-			since: last,
+			since: lastLogin,
 		});
 
 		// kind 43, 43 (mute user, hide message) query
 		query.push({
 			authors: [account.pubkey],
 			kinds: [43, 44],
-			since: last,
+			since: lastLogin,
 		});
 
 		return query;
diff --git a/src/shared/accounts/active.tsx b/src/shared/accounts/active.tsx
index c36ff196..82fe1c7b 100644
--- a/src/shared/accounts/active.tsx
+++ b/src/shared/accounts/active.tsx
@@ -1,10 +1,42 @@
 import { Image } from "@shared/image";
-import { DEFAULT_AVATAR } from "@stores/constants";
+import { RelayContext } from "@shared/relayProvider";
+import { useActiveAccount } from "@stores/accounts";
+import { DEFAULT_AVATAR, READONLY_RELAYS } from "@stores/constants";
 import { useProfile } from "@utils/hooks/useProfile";
+import { sendNativeNotification } from "@utils/notification";
+import { useContext } from "react";
+import useSWRSubscription from "swr/subscription";
 
 export function ActiveAccount({ data }: { data: any }) {
+	const pool: any = useContext(RelayContext);
+	const lastLogin = useActiveAccount((state: any) => state.lastLogin);
+
 	const { user } = useProfile(data.pubkey);
 
+	useSWRSubscription(
+		user && lastLogin > 0 ? ["account", data.pubkey] : null,
+		([, key]) => {
+			// subscribe to channel
+			const unsubscribe = pool.subscribe(
+				[
+					{
+						"#p": [key],
+						since: lastLogin,
+						limit: 20,
+					},
+				],
+				READONLY_RELAYS,
+				(event) => {
+					sendNativeNotification(event.content);
+				},
+			);
+
+			return () => {
+				unsubscribe();
+			};
+		},
+	);
+
 	return (
 		<button type="button" className="relative h-11 w-11 overflow-hidden">
 			<Image
diff --git a/src/stores/accounts.tsx b/src/stores/accounts.tsx
index 0f220971..74aaaa87 100644
--- a/src/stores/accounts.tsx
+++ b/src/stores/accounts.tsx
@@ -1,12 +1,17 @@
-import { getActiveAccount } from "@utils/storage";
+import { getActiveAccount, getLastLogin } from "@utils/storage";
 import { create } from "zustand";
 
 export const useActiveAccount = create((set) => ({
 	account: null,
+	lastLogin: 0,
 	fetch: async () => {
 		const response = await getActiveAccount();
 		set({ account: response });
 	},
+	fetchLastLogin: async () => {
+		const response = await getLastLogin();
+		set({ lastLogin: parseInt(response) });
+	},
 	updateFollows: (list: any) => {
 		set((state: any) => ({ account: { ...state.account, follows: list } }));
 	},
diff --git a/src/utils/notification.tsx b/src/utils/notification.tsx
index 3df6bbca..2fc3906b 100644
--- a/src/utils/notification.tsx
+++ b/src/utils/notification.tsx
@@ -11,6 +11,6 @@ export async function sendNativeNotification(content: string) {
 		permissionGranted = permission === "granted";
 	}
 	if (permissionGranted) {
-		sendNotification({ title: "TAURI", body: content });
+		sendNotification({ title: "Lume", body: content });
 	}
 }