From 09336fa1e443e2103be4e251551f02654ae051a3 Mon Sep 17 00:00:00 2001 From: Philipp Heckel Date: Fri, 11 Mar 2022 15:17:12 -0500 Subject: [PATCH] Comments --- docs/releases.md | 10 ++++++++++ web/public/index.html | 2 +- web/public/static/css/home.css | 23 ----------------------- web/public/static/js/home.js | 8 -------- web/src/app/Connection.js | 6 ++++++ web/src/app/ConnectionManager.js | 6 ++++++ web/src/app/Notifier.js | 4 ++++ web/src/components/SubscribeDialog.js | 2 +- web/src/components/hooks.js | 4 ++++ 9 files changed, 32 insertions(+), 33 deletions(-) diff --git a/docs/releases.md b/docs/releases.md index 1dfc1232..b4793da9 100644 --- a/docs/releases.md +++ b/docs/releases.md @@ -2,6 +2,16 @@ Binaries for all releases can be found on the GitHub releases pages for the [ntfy server](https://github.com/binwiederhier/ntfy/releases) and the [ntfy Android app](https://github.com/binwiederhier/ntfy-android/releases). +## ntfy server v1.17.0 +Released Mar 11, 2022 + +**Features & bug fixes:** + +* Replace [web app](https://ntfy.sh/app) with a React/MUI-based web app from the 21st century (#111) +* Web UI broken with auth (#132, thanks for reporting @arminus) +* Send static web resources as `Content-Encoding: gzip`, i.e. docs and web app (no ticket) +* Add support for auth via `?auth=...` query param, used by WebSocket in web app (no ticket) + ## ntfy server v1.16.0 Released Feb 27, 2022 diff --git a/web/public/index.html b/web/public/index.html index 93aa4af5..2c9751f3 100644 --- a/web/public/index.html +++ b/web/public/index.html @@ -34,7 +34,7 @@
diff --git a/web/public/static/css/home.css b/web/public/static/css/home.css index 9ca00e52..a0451824 100644 --- a/web/public/static/css/home.css +++ b/web/public/static/css/home.css @@ -265,29 +265,6 @@ figcaption { text-decoration: underline; } -/* Subscribe box */ - -button { - background: #3a9784; - border: none; - border-radius: 3px; - padding: 3px 5px; - color: white; - cursor: pointer; -} - -button:hover { - background: #317f6f; - padding: 5px; -} - -ul { - padding-left: 1em; - list-style-type: circle; - padding-bottom: 0; - margin: 0; -} - li { padding: 4px 0; margin: 4px 0; diff --git a/web/public/static/js/home.js b/web/public/static/js/home.js index e867c459..80b14055 100644 --- a/web/public/static/js/home.js +++ b/web/public/static/js/home.js @@ -1,12 +1,4 @@ -/** - * Hello, dear curious visitor. I am not a web-guy, so please don't judge my horrible JS code. - * In fact, please do tell me about all the things I did wrong and that I could improve. I've been trying - * to read up on modern JS, but it's just a little much. - * - * Feel free to open tickets at https://github.com/binwiederhier/ntfy/issues. Thank you! - */ - /* All the things */ let currentUrl = window.location.hostname; diff --git a/web/src/app/Connection.js b/web/src/app/Connection.js index c8814897..55778023 100644 --- a/web/src/app/Connection.js +++ b/web/src/app/Connection.js @@ -2,6 +2,12 @@ import {basicAuth, encodeBase64Url, topicShortUrl, topicUrlWs} from "./utils"; const retryBackoffSeconds = [5, 10, 15, 20, 30]; +/** + * A connection contains a single WebSocket connection for one topic. It handles its connection + * status itself, including reconnect attempts and backoff. + * + * Incoming messages and state changes are forwarded via listeners. + */ class Connection { constructor(connectionId, subscriptionId, baseUrl, topic, user, since, onNotification, onStateChanged) { this.connectionId = connectionId; diff --git a/web/src/app/ConnectionManager.js b/web/src/app/ConnectionManager.js index 5b56e556..6e5037ce 100644 --- a/web/src/app/ConnectionManager.js +++ b/web/src/app/ConnectionManager.js @@ -1,6 +1,12 @@ import Connection from "./Connection"; import {sha256} from "./utils"; +/** + * The connection manager keeps track of active connections (WebSocket connections, see Connection). + * + * Its refresh() method reconciles state changes with the target state by closing/opening connections + * as required. This is done pretty much exactly the same way as in the Android app. + */ class ConnectionManager { constructor() { this.connections = new Map(); // ConnectionId -> Connection (hash, see below) diff --git a/web/src/app/Notifier.js b/web/src/app/Notifier.js index 3317a59b..3c4a5e0d 100644 --- a/web/src/app/Notifier.js +++ b/web/src/app/Notifier.js @@ -3,6 +3,10 @@ import prefs from "./Prefs"; import subscriptionManager from "./SubscriptionManager"; import logo from "../img/ntfy.png"; +/** + * The notifier is responsible for displaying desktop notifications. Note that not all modern browsers + * support this; most importantly, all iOS browsers do not support window.Notification. + */ class Notifier { async notify(subscriptionId, notification, onClickFallback) { if (!this.supported()) { diff --git a/web/src/components/SubscribeDialog.js b/web/src/components/SubscribeDialog.js index d7713ae7..4c37d0fc 100644 --- a/web/src/components/SubscribeDialog.js +++ b/web/src/components/SubscribeDialog.js @@ -85,7 +85,7 @@ const SubscribePage = (props) => { const isExistingTopicUrl = existingTopicUrls.includes(topicUrl(baseUrl, topic)); return validTopic(topic) && validUrl(baseUrl) && !isExistingTopicUrl; } else { - const isExistingTopicUrl = existingTopicUrls.includes(topicUrl(window.location.origin, topic)); // FIXME + const isExistingTopicUrl = existingTopicUrls.includes(topicUrl(window.location.origin, topic)); return validTopic(topic) && !isExistingTopicUrl; } })(); diff --git a/web/src/components/hooks.js b/web/src/components/hooks.js index f3299856..cb66cbe5 100644 --- a/web/src/components/hooks.js +++ b/web/src/components/hooks.js @@ -66,6 +66,10 @@ export const useAutoSubscribe = (subscriptions, selected) => { }, [params, subscriptions, selected, hasRun]); }; +/** + * Migrate the 'topics' item in localStorage to the subscriptionManager. This is only done once to migrate away + * from the old web UI. + */ export const useLocalStorageMigration = () => { const [hasRun, setHasRun] = useState(false); useEffect(() => {