{Header &&
}
@@ -80,6 +85,7 @@ export default function Login ({ providers, callbackUrl, error, text, Header, Fo
)
case 'Lightning':
case 'Slashtags':
+ case 'Nostr':
return (
+ error: {message}
+ {details}
+
+ )
+}
+
+function NostrExplainer ({ text }) {
+ return (
+ <>
+
+
+
+
+
+
+ -
+ Alby
+ available for: chrome, firefox, and safari
+
+ -
+ Flamingo
+ available for: chrome
+
+ -
+ nos2x
+ available for: chrome
+
+ -
+ nos2x-fox
+ available for: firefox
+
+ -
+ horse
+ available for: chrome
+ supports hardware signing
+
+
+
+
+
+ }
+ />
+
+
+ )
+}
+
+export function NostrAuth ({ text, callbackUrl }) {
+ const [createAuth, { data, error }] = useMutation(gql`
+ mutation createAuth {
+ createAuth {
+ k1
+ }
+ }`)
+ const [hasExtension, setHasExtension] = useState(undefined)
+ const [extensionError, setExtensionError] = useState(null)
+
+ useEffect(() => {
+ createAuth()
+ }, [])
+
+ const k1 = data?.createAuth.k1
+
+ useEffect(() => {
+ if (!k1) return
+ setHasExtension(!!window.nostr)
+ if (!window.nostr) {
+ const err = { message: 'nostr extension not found' }
+ console.error(err.message)
+ return
+ }
+ console.info('nostr extension detected')
+ let mounted = true;
+ (async function () {
+ try {
+ // have them sign a message with the challenge
+ let event
+ try {
+ event = await window.nostr.signEvent({
+ kind: 22242,
+ created_at: Math.floor(Date.now() / 1000),
+ tags: [['challenge', k1]],
+ content: 'Stacker News Authentication'
+ })
+ if (!event) throw new Error('extension returned empty event')
+ } catch (e) {
+ if (e.message === 'window.nostr call already executing') return
+ setExtensionError({ message: 'nostr extension failed to sign event', details: e.message })
+ return
+ }
+
+ // sign them in
+ try {
+ const { error, ok } = await signIn('nostr', {
+ event: JSON.stringify(event),
+ callbackUrl
+ })
+
+ if (error) {
+ throw new Error(error)
+ }
+ if (!ok) {
+ throw new Error('auth failed')
+ }
+ } catch (e) {
+ throw new Error('authorization failed', e)
+ }
+ } catch (e) {
+ if (!mounted) return
+ setExtensionError({ message: `${text} failed`, details: e.message })
+ }
+ })()
+ return () => { mounted = false }
+ }, [k1, hasExtension])
+
+ if (error) return error
+
+ return (
+ <>
+ {hasExtension === false && }
+ {extensionError && }
+ {hasExtension && !extensionError &&
+ <>
+ nostr extension found
+ authorize event signature in extension
+ }
+
+ )
+}
+
+export default function NostrAuthWithExplainer ({ text, callbackUrl }) {
+ const router = useRouter()
+ return (
+
+
+
router.back()}>
+
{text || 'Login'} with Nostr
+
+
+
+
)
+
+ return (
+
+ )
+}
+
function UnlinkObstacle ({ onClose, type, unlinkAuth }) {
const router = useRouter()
@@ -341,6 +359,7 @@ function AuthMethods ({ methods }) {
email
twitter
github
+ nostr
}
}`, {
update (cache, { data: { unlinkAuth } }) {
@@ -416,6 +435,8 @@ function AuthMethods ({ methods }) {
status={methods[provider]} unlink={async () => await unlink(provider)}
/>
)
+ } else if (provider === 'nostr') {
+ return await unlink(provider)} />
} else {
return (
+
+
\ No newline at end of file
diff --git a/sw/index.js b/sw/index.js
index c8796442..654caeb6 100644
--- a/sw/index.js
+++ b/sw/index.js
@@ -5,6 +5,11 @@ import { setDefaultHandler } from 'workbox-routing'
import { NetworkOnly } from 'workbox-strategies'
import { enable } from 'workbox-navigation-preload'
import manifest from './precache-manifest.json'
+import ServiceWorkerStorage from 'serviceworker-storage'
+
+self.__WB_DISABLE_DEV_LOGS = true
+
+const storage = new ServiceWorkerStorage('sw:storage', 1)
// preloading improves startup performance
// https://developer.chrome.com/docs/workbox/modules/workbox-navigation-preload/
@@ -80,35 +85,54 @@ self.addEventListener('notificationclick', (event) => {
event.notification.close()
})
-self.addEventListener('pushsubscriptionchange', (event) => {
+// https://medium.com/@madridserginho/how-to-handle-webpush-api-pushsubscriptionchange-event-in-modern-browsers-6e47840d756f
+self.addEventListener('message', (event) => {
+ if (event.data.action === 'STORE_SUBSCRIPTION') {
+ return event.waitUntil(storage.setItem('subscription', event.data.subscription))
+ }
+ if (event.data.action === 'SYNC_SUBSCRIPTION') {
+ return event.waitUntil(handlePushSubscriptionChange())
+ }
+})
+
+async function handlePushSubscriptionChange (oldSubscription, newSubscription) {
// https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerGlobalScope/pushsubscriptionchange_event
+ // fallbacks since browser may not set oldSubscription and newSubscription
+ oldSubscription ??= await storage.getItem('subscription')
+ newSubscription ??= await self.registration.pushManager.getSubscription()
+ if (!newSubscription) {
+ // no subscription exists at the moment
+ return
+ }
+ if (oldSubscription?.endpoint === newSubscription.endpoint) {
+ // subscription did not change. no need to sync with server
+ return
+ }
+ // convert keys from ArrayBuffer to string
+ newSubscription = JSON.parse(JSON.stringify(newSubscription))
+ const variables = {
+ endpoint: newSubscription.endpoint,
+ p256dh: newSubscription.keys.p256dh,
+ auth: newSubscription.keys.auth,
+ oldEndpoint: oldSubscription?.endpoint
+ }
const query = `
mutation savePushSubscription($endpoint: String!, $p256dh: String!, $auth: String!, $oldEndpoint: String!) {
savePushSubscription(endpoint: $endpoint, p256dh: $p256dh, auth: $auth, oldEndpoint: $oldEndpoint) {
id
}
}`
+ const body = JSON.stringify({ query, variables })
+ await fetch('/api/graphql', {
+ method: 'POST',
+ headers: {
+ 'Content-type': 'application/json'
+ },
+ body
+ })
+ await storage.setItem('subscription', JSON.parse(JSON.stringify(newSubscription)))
+}
- const subscription = self.registration.pushManager
- .subscribe(event.oldSubscription.options)
- .then((subscription) => {
- // convert keys from ArrayBuffer to string
- subscription = JSON.parse(JSON.stringify(subscription))
- const variables = {
- endpoint: subscription.endpoint,
- p256dh: subscription.keys.p256dh,
- auth: subscription.keys.auth,
- oldEndpoint: event.oldSubscription.endpoint
- }
- const body = JSON.stringify({ query, variables })
- return fetch('/api/graphql', {
- method: 'POST',
- headers: {
- 'Content-type': 'application/json'
- },
- body
- })
- })
-
- event.waitUntil(subscription)
+self.addEventListener('pushsubscriptionchange', (event) => {
+ event.waitUntil(handlePushSubscriptionChange(event.oldSubscription, event.newSubscription))
}, false)