Simplify notification badges, improve performance (#57)
Co-authored-by: Jon Staab <shtaab@gmail.com>
This commit is contained in:
@@ -142,12 +142,15 @@
|
||||
// History, navigation, application data
|
||||
unsubscribers.push(setupHistory(), setupAnalytics(), syncApplicationData())
|
||||
|
||||
// Subscribe to badge count for changes
|
||||
unsubscribers.push(notifications.syncBadges)
|
||||
|
||||
// Initialize keyboard state tracking
|
||||
unsubscribers.push(syncKeyboard())
|
||||
|
||||
// Subscribe to badge count for changes
|
||||
unsubscribers.push(notifications.syncBadges())
|
||||
|
||||
// Subscribe to page history to update checked state
|
||||
unsubscribers.push(notifications.syncChecked())
|
||||
|
||||
// Initialize background notifications
|
||||
unsubscribers.push(notifications.Push.sync())
|
||||
|
||||
|
||||
@@ -1,6 +1,4 @@
|
||||
<script lang="ts">
|
||||
import {page} from "$app/stores"
|
||||
import {onDestroy} from "svelte"
|
||||
import InfoCircle from "@assets/icons/info-circle.svg?dataurl"
|
||||
import Magnifier from "@assets/icons/magnifier.svg?dataurl"
|
||||
import MenuDots from "@assets/icons/menu-dots.svg?dataurl"
|
||||
@@ -13,7 +11,6 @@
|
||||
import ChatMenu from "@app/components/ChatMenu.svelte"
|
||||
import {chatSearch} from "@app/core/state"
|
||||
import {pushModal} from "@app/util/modal"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
|
||||
let term = $state("")
|
||||
|
||||
@@ -22,10 +19,6 @@
|
||||
const openMenu = () => pushModal(ChatMenu)
|
||||
|
||||
const chats = $derived($chatSearch.searchOptions(term))
|
||||
|
||||
onDestroy(() => {
|
||||
setChecked($page.url.pathname)
|
||||
})
|
||||
</script>
|
||||
|
||||
<div class="hidden min-h-screen md:hero">
|
||||
|
||||
@@ -4,18 +4,10 @@
|
||||
import {append, uniq} from "@welshman/lib"
|
||||
import {pubkey} from "@welshman/app"
|
||||
import Chat from "@app/components/Chat.svelte"
|
||||
import {notifications, setChecked} from "@app/util/notifications"
|
||||
import {splitChatId} from "@app/core/state"
|
||||
|
||||
const {chat} = $page.params as MakeNonOptional<typeof $page.params>
|
||||
const pubkeys = uniq(append($pubkey!, splitChatId(chat)))
|
||||
|
||||
// We have to watch this one, since on mobile the badge will be visible when active
|
||||
$effect(() => {
|
||||
if ($notifications.has($page.url.pathname)) {
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<Chat {pubkeys} />
|
||||
|
||||
@@ -8,10 +8,8 @@
|
||||
import SpaceAuthError from "@app/components/SpaceAuthError.svelte"
|
||||
import SpaceTrustRelay from "@app/components/SpaceTrustRelay.svelte"
|
||||
import {pushModal} from "@app/util/modal"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
import {decodeRelay, relaysPendingTrust} from "@app/core/state"
|
||||
import {deriveRelayAuthError} from "@app/core/commands"
|
||||
import {notifications} from "@app/util/notifications"
|
||||
|
||||
type Props = {
|
||||
children?: Snippet
|
||||
@@ -29,13 +27,6 @@
|
||||
|
||||
const showPendingTrust = once(() => pushModal(SpaceTrustRelay, {url}, {noEscape: true}))
|
||||
|
||||
// We have to watch this one, since on mobile the badge will be visible when active
|
||||
$effect(() => {
|
||||
if ($notifications.has($page.url.pathname)) {
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
|
||||
// Watch for relay errors and notify the user
|
||||
$effect(() => {
|
||||
if ($authError) {
|
||||
|
||||
@@ -45,7 +45,7 @@
|
||||
MESSAGE_KINDS,
|
||||
userSettingsValues,
|
||||
} from "@app/core/state"
|
||||
import {setChecked, checked} from "@app/util/notifications"
|
||||
import {checked} from "@app/util/notifications"
|
||||
import {canEnforceNip70, prependParent, publishDelete} from "@app/core/commands"
|
||||
import {makeFeed} from "@app/core/requests"
|
||||
import {popKey} from "@lib/implicit"
|
||||
@@ -318,11 +318,6 @@
|
||||
|
||||
onDestroy(() => {
|
||||
cleanup?.()
|
||||
|
||||
// Sveltekit calls onDestroy at the beginning of the page load for some reason
|
||||
setTimeout(() => {
|
||||
setChecked($page.url.pathname)
|
||||
}, 800)
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
@@ -21,7 +21,6 @@
|
||||
import {pushModal} from "@app/util/modal"
|
||||
import {decodeRelay, makeCommentFilter} from "@app/core/state"
|
||||
import {makeCalendarFeed} from "@app/core/requests"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
|
||||
const url = decodeRelay($page.params.relay!)
|
||||
|
||||
@@ -108,7 +107,6 @@
|
||||
|
||||
return () => {
|
||||
feed.cleanup()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -25,7 +25,6 @@
|
||||
import CalendarEventDate from "@app/components/CalendarEventDate.svelte"
|
||||
import EventReply from "@app/components/EventReply.svelte"
|
||||
import {deriveEvent, decodeRelay} from "@app/core/state"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
|
||||
const {relay, address} = $page.params as MakeNonOptional<typeof $page.params>
|
||||
const url = decodeRelay(relay)
|
||||
@@ -57,7 +56,6 @@
|
||||
|
||||
return () => {
|
||||
controller.abort()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -17,7 +17,6 @@
|
||||
import ClassifiedItem from "@app/components/ClassifiedItem.svelte"
|
||||
import ClassifiedCreate from "@app/components/ClassifiedCreate.svelte"
|
||||
import {decodeRelay} from "@app/core/state"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
import {makeCommentFilter} from "@app/core/state"
|
||||
import {makeFeed} from "@app/core/requests"
|
||||
import {pushModal} from "@app/util/modal"
|
||||
@@ -59,7 +58,6 @@
|
||||
|
||||
return () => {
|
||||
feed.cleanup()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -22,7 +22,6 @@
|
||||
import CommentActions from "@app/components/CommentActions.svelte"
|
||||
import EventReply from "@app/components/EventReply.svelte"
|
||||
import {deriveEvent, decodeRelay} from "@app/core/state"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
|
||||
const {relay, address} = $page.params as MakeNonOptional<typeof $page.params>
|
||||
const url = decodeRelay(relay)
|
||||
@@ -54,7 +53,6 @@
|
||||
|
||||
return () => {
|
||||
controller.abort()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -17,7 +17,6 @@
|
||||
import GoalItem from "@app/components/GoalItem.svelte"
|
||||
import GoalCreate from "@app/components/GoalCreate.svelte"
|
||||
import {decodeRelay, makeCommentFilter} from "@app/core/state"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
import {makeFeed} from "@app/core/requests"
|
||||
import {pushModal} from "@app/util/modal"
|
||||
|
||||
@@ -58,7 +57,6 @@
|
||||
|
||||
return () => {
|
||||
feed.cleanup()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -22,7 +22,6 @@
|
||||
import CommentActions from "@app/components/CommentActions.svelte"
|
||||
import EventReply from "@app/components/EventReply.svelte"
|
||||
import {deriveEvent, decodeRelay} from "@app/core/state"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
|
||||
const {relay, id} = $page.params as MakeNonOptional<typeof $page.params>
|
||||
const url = decodeRelay(relay)
|
||||
@@ -55,7 +54,6 @@
|
||||
|
||||
return () => {
|
||||
controller.abort()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -17,7 +17,6 @@
|
||||
import ThreadItem from "@app/components/ThreadItem.svelte"
|
||||
import ThreadCreate from "@app/components/ThreadCreate.svelte"
|
||||
import {decodeRelay} from "@app/core/state"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
import {makeCommentFilter} from "@app/core/state"
|
||||
import {makeFeed} from "@app/core/requests"
|
||||
import {pushModal} from "@app/util/modal"
|
||||
@@ -59,7 +58,6 @@
|
||||
|
||||
return () => {
|
||||
feed.cleanup()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -22,7 +22,6 @@
|
||||
import CommentActions from "@app/components/CommentActions.svelte"
|
||||
import EventReply from "@app/components/EventReply.svelte"
|
||||
import {deriveEvent, decodeRelay} from "@app/core/state"
|
||||
import {setChecked} from "@app/util/notifications"
|
||||
|
||||
const {relay, id} = $page.params as MakeNonOptional<typeof $page.params>
|
||||
const url = decodeRelay(relay)
|
||||
@@ -54,7 +53,6 @@
|
||||
|
||||
return () => {
|
||||
controller.abort()
|
||||
setChecked($page.url.pathname)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user