* nwc wallet logs
* persist logs in IndexedDB
* Potential fix for empty error message
* load logs limited to 5m ago from IDB
* load logs from past via query param
* Add 5m, 1h, 6h links for earlier logs
* Show end of log
* Clamp to logStart
* Add log.module.css
* Remove TODO about persistence
* Use table for logs
* <table> fixes bad format with fixed width and message overflow into start of next row
* also using ---start of log--- instead of ---end of log--- now
* removed time string in header nav
* Rename .header to .logNav
* Simply load all logs and remove navigation
I realized the code for navigation was most likely premature optimization which even resulted in worse UX:
Using the buttons to load logs from 5m, 1h, 6h ago sometimes meant that nothing happened at all since there were no logs from 5m, 1h, 6h ago.
That's why I added a time string as "start of logs" so it's at least visible that it changed but that looked bad so I removed it.
But all of this was not necessary: I can simply load all logs at once and then the user can scroll around however they like.
I was worried that it would be bad for performance to load all logs at once since we might store a lot of logs but as mentioned, that's probably premature optimization.
WHEN a lot of logs are stored AND this becomes a problem (What problem even? Slow page load?), THEN we can think about this.
If page load ever becomes slow because of loading logs, we could probably simply not load the logs at page load but only when /wallet/logs is visited.
But for now, this works fine.
* Add follow checkbox
* Create WalletLogs component
* Embed wallet logs
* Remove test error
* Fix level padding
* Add LNbits logs
* Add logs for attaching LND and lnAddr
* Use err.message || err.toString?.() consistently
* Autowithdrawal logs
* Use details from LND error
* Don't log test invoice individually
* Also refetch logs on error
* Remove obsolete and annoying toasts
* Replace scrollIntoView with scroll
* Use constant embedded max-height
* Fix missing width: 100% for embedded logs
* Show full payment hash and preimage in logs
* Also parse details from LND errors on autowithdrawal failures
* Remove TODO
* Fix accidental removal of wss:// check
* Fix alignment of start marker and show empty if empty
* Fix sendPayment loop
* Split context in two
* Only close notifications manually on iOS
* Use function instead of hardcoded string
---------
Co-authored-by: ekzyis <ek@stacker.news>
Co-authored-by: Keyan <34140557+huumn@users.noreply.github.com>
* refactor: Use log function in service worker
* Add verbose logging on push listener
* Fix TypeError: Cannot read properties of null (reading 'postMessage')
navigator.serviceWorker.controller is null on forced refreshes:
"""
This property returns null if the request is a force refresh (Shift + refresh) or if there is no active worker.
"""
-- https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/controller
This means when we unregister a service worker manually (like I do for debugging purposes) and then reload the page, there is no service worker available when this code is run.
Adding a check with a more helpful error message should improve UX.
This error might also happen in other cases where a page refresh should also help.
---------
Co-authored-by: ekzyis <ek@stacker.news>
* * add error boundary immediately above page component
* send error logs to server via LoggerContext
* display error stack and component stack in copyable text area
* wrap every context provider in an error boundary
* memoize context values to fix error boundary propagation issue
* Wrap page component in an error boundary so we can use our context utilities
for a better experience, like toast and logger
Still have a top-level error boundary that catches things from the context providers,
just in case.
Don't display the whole error stack, just because it's ugly, but make it copyable
* Also delete push subscription in IndexedDB
* Fix pushsubscriptionchange function signature
* Send SYNC_SUBSCRIPTION after successful registration
* Resubscribe if service worker lost subscription
---------
Co-authored-by: ekzyis <ek@stacker.news>
* Add diagnostics settings & endpoint
Stackers can now help us to identify and fix bugs by enabling diagnostics.
This will send anonymized data to us.
For now, this is only used to send events around push notifications.
* Send diagnostics to slack
* Detect OS
* Diagnostics data is only pseudonymous, not anonymous
It's only pseudonymous since with additional knowledge (which stacker uses which fancy name), we could trace the events back to individual stackers.
Data is only anonymous if this is not possible - it must be irreversible.
* Check if window.navigator is defined
* Use Slack SDK
* Catch errors of slack requests
---------
Co-authored-by: ekzyis <ek@stacker.news>
Co-authored-by: Keyan <34140557+huumn@users.noreply.github.com>
Most browsers don't support the pushsubscriptionchange event.
We workaround this by saving the current push subscription in IndexedDB so we can check during every page load if the push subscription changed.
If that is the case, we manually sync the push subscription with the server.
However, this solution is not perfect as mentioned in https://medium.com/@madridserginho/how-to-handle-webpush-api-pushsubscriptionchange-event-in-modern-browsers-6e47840d756f which was used for reference:
> This solution is not perfect, the user could lose some push notifications if he doesn’t open the webapp for a long time.
Co-authored-by: ekzyis <ek@stacker.news>
* npm uninstall next-pwa
next-pwa was last updated in August 2022.
There is also an issue which mentions that next-pwa is abandoned (?): https://github.com/shadowwalker/next-pwa/issues/482
But the main reason for me uninstalling it is that it adds a lot of preconfigured stuff which is not necessary for us.
It even lead to a bug since pages were cached without our knowledge.
So I will go with a different PWA approach. This different approach should do the following:
- make it more transparent what the service worker is doing
- gives us more control to configure the service worker and thus making it easier
* Use workbox-webpack-plugin
Every other plugin (`next-offline`, `next-workbox-webpack-plugin`, `next-with-workbox`, ...) added unnecessary configuration which felt contrary to how PWAs should be built.
(PWAs should progressivly enhance the website in small steps, see https://web.dev/learn/pwa/getting-started/#focus-on-a-feature)
These default configurations even lead to worse UX since they made invalid assumptions about stacker.news:
We _do not_ want to cache our start url and we _do not_ want to cache anything unless explicitly told to.
Almost every page on SN should be fresh for the best UX.
To achieve this, by default, the service worker falls back to the network (as if the service worker wasn't there).
Therefore, this should be the simplest configuration with a valid precache and cache busting support.
In the future, we can try to use prefetching to improve performance of navigation requests.
* Add support for Web Share Target API
See https://developer.chrome.com/articles/web-share-target/
* Use Web Push API for push notifications
I followed this (very good!) guide: https://web.dev/notifications/
* Refactor code related to Web Push
* Send push notification to users on events
* Merge notifications
* Send notification to author of every parent recursively
* Remove unused userId param in savePushSubscription
As it should be, the user id is retrieved from the authenticated user in the backend.
* Resubscribe user if push subscription changed
* Update old subscription if oldEndpoint was given
* Allow users to unsubscribe
* Use LTREE operator instead of recursive query
* Always show checkbox for push notifications
* Justify checkbox to end
* Update title of first push notification
* Fix warning from uncontrolled to controlled
* Add comment about Notification.requestPermission
* Fix timestamp
* Catch error on push subscription toggle
* Wrap function bodies in try/catch
* Use Promise.allSettled
* Filter subscriptions by user notification settings
* Fix user notification filter
* Use skipWaiting
---------
Co-authored-by: ekzyis <ek@stacker.news>
ekzyis
ekzyis
SatsAllDay
keyan