Merge pull request #2161 from 5idereal/patch-1

Update zh-tw translation

.dockerignore

@@ -1,6 +1,7 @@
 /.idea
 /node_modules
 /data
+/cypress
 /out
 /test
 /kubernetes

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,4 +1,8 @@
-👉 Delete this line if you have read and agree our pull request rules and guidelines: https://github.com/louislam/uptime-kuma/blob/master/CONTRIBUTING.md#can-i-create-a-pull-request-for-uptime-kuma
+⚠️⚠️⚠️ Since we do not accept all types of pull requests and do not want to waste your time. Please be sure that you have read pull request rules:
+https://github.com/louislam/uptime-kuma/blob/master/CONTRIBUTING.md#can-i-create-a-pull-request-for-uptime-kuma
+
+Tick the checkbox if you understand [x]: 
+- [ ] I have read and understand the pull request rules.
 
 # Description
 

.github/workflows/auto-test.yml

@@ -50,3 +50,19 @@ jobs:
         cache: 'npm'
     - run: npm install
     - run: npm run lint
+
+  e2e-tests:
+    needs: [ check-linters ]
+    runs-on: ubuntu-latest
+    steps:
+    - run: git config --global core.autocrlf false  # Mainly for Windows
+    - uses: actions/checkout@v3
+
+    - name: Use Node.js 14
+      uses: actions/setup-node@v3
+      with:
+        node-version: 14
+        cache: 'npm'
+    - run: npm install
+    - run: npm run build
+    - run: npm run cy:test

.github/workflows/stale-bot.yml

@@ -0,0 +1,24 @@
+name: 'Automatically close stale issues and PRs'
+on:
+  workflow_dispatch:
+  schedule:
+    - cron: '0 */6 * * *'
+#Run every 6 hours 
+
+jobs:
+  stale:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/stale@v5
+        with:
+          stale-issue-message: 'We are clearing up our old issues and your ticket has been open for 3 months with no activity. Remove stale label or comment or this will be closed in 2 days.'
+          stale-pr-message: 'We are clearing up our old Pull Requests and yours has been open for 3 months with no activity. Remove stale label or comment or this will be closed in 2 days.'
+          close-issue-message: 'This issue was closed because it has been stalled for 2 days with no activity.'
+          close-pr-message: 'This PR was closed because it has been stalled for 2 days with no activity.'
+          days-before-stale: 90
+          days-before-close: 2
+          exempt-issue-labels: 'News,Medium,High,discussion,bug,doc,feature-request'
+          exempt-pr-labels: 'awaiting-approval,work-in-progress,enhancement,feature-request'
+          exempt-issue-assignees: 'louislam'
+          exempt-pr-assignees: 'louislam'
+          operations-per-run: 200

.gitignore

@@ -13,3 +13,6 @@ dist-ssr
 /out
 /tmp
 .env
+
+cypress/videos
+cypress/screenshots

.stylelintrc

@@ -8,6 +8,7 @@
         "declaration-empty-line-before": null,
         "alpha-value-notation": "number",
         "color-function-notation": "legacy",
-        "shorthand-property-no-redundant-values": null
+        "shorthand-property-no-redundant-values": null,
+        "color-hex-length": null,
     }
 }

CONTRIBUTING.md

@@ -27,13 +27,11 @@ The frontend code build into "dist" directory. The server (express.js) exposes t
 
 ## Can I create a pull request for Uptime Kuma?
 
-Yes, you can. However, since I don't want to waste your time, be sure to **create empty draft pull request, so we can discuss first** if it is a large pull request or you don't know it will be merged or not.
+Yes or no, it depends on what you will try to do. Since I don't want to waste your time, be sure to **create an empty draft pull request or open an issue, so we can discuss first**. Especially for a large pull request or you don't know it will be merged or not.
 
-Also, please don't rush or ask for ETA, because I have to understand the pull request, make sure it is no breaking changes and stick to my vision of this project, especially for large pull requests.
+Here are some references:
 
-I will mark your pull request in the [milestones](https://github.com/louislam/uptime-kuma/milestones), if I am plan to review and merge it.
-
-✅ Accept:
+✅ Usually Accept:
 - Bug/Security fix
 - Translations
 - Adding notification providers
@@ -47,8 +45,14 @@ I will mark your pull request in the [milestones](https://github.com/louislam/up
 - Any breaking changes
 - Duplicated pull request
 - Buggy
+- UI/UX is not close to Uptime Kuma 
 - Existing logic is completely modified or deleted for no reason
 - A function that is completely out of scope
+- Unnecessary large code changes (Hard to review, causes code conflicts to other pull requests)
+
+I will mark your pull request in the [milestones](https://github.com/louislam/uptime-kuma/milestones), if I am plan to review and merge it.
+
+Also, please don't rush or ask for ETA, because I have to understand the pull request, make sure it is no breaking changes and stick to my vision of this project, especially for large pull requests.
 
 
 ### Recommended Pull Request Guideline
@@ -86,8 +90,8 @@ I personally do not like something need to learn so much and need to config so m
 ## Name convention
 
 - Javascript/Typescript: camelCaseType
-- SQLite: underscore_type
-- CSS/SCSS: dash-type
+- SQLite: snake_case (Underscore)
+- CSS/SCSS: kebab-case (Dash)
 
 ## Tools
 
@@ -177,7 +181,18 @@ npm test
 
 By default, the Chromium window will be shown up during the test. Specifying `HEADLESS_TEST=1` for terminal environments.
 
-## Update Dependencies
+## Dependencies
+
+Both frontend and backend share the same package.json. However, the frontend dependencies are eventually not used in the production environment, because it is usually also baked into dist files. So:
+
+- Frontend dependencies = "devDependencies"
+  - Examples: vue, chart.js
+- Backend dependencies = "dependencies"
+  - Examples: socket.io, sqlite3
+- Development dependencies = "devDependencies"
+  - Examples: eslint, sass
+
+### Update Dependencies
 
 Install `ncu`
 https://github.com/raineorshine/npm-check-updates

README.md

@@ -23,7 +23,7 @@ VPS is sponsored by Uptime Kuma sponsors on [Open Collective](https://opencollec
 
 ## ⭐ Features
 
-* Monitoring uptime for HTTP(s) / TCP / HTTP(s) Keyword / Ping / DNS Record / Push / Steam Game Server.
+* Monitoring uptime for HTTP(s) / TCP / HTTP(s) Keyword / Ping / DNS Record / Push / Steam Game Server / Docker Containers.
 * Fancy, Reactive, Fast UI/UX.
 * Notifications via Telegram, Discord, Gotify, Slack, Pushover, Email (SMTP), and [90+ notification services, click here for the full list](https://github.com/louislam/uptime-kuma/tree/master/src/components/notifications).
 * 20 second intervals.
@@ -106,7 +106,7 @@ https://github.com/louislam/uptime-kuma/milestones
 
 Project Plan:
 
-https://github.com/louislam/uptime-kuma/projects/1
+https://github.com/users/louislam/projects/4/views/1
 
 ## ❤️ Sponsors
 
@@ -151,13 +151,20 @@ You can discuss or ask for help in [issues](https://github.com/louislam/uptime-k
 
 ### Subreddit
 
-My Reddit account: louislamlam
+My Reddit account: [u/louislamlam](https://reddit.com/u/louislamlam).  
 You can mention me if you ask a question on Reddit.
-https://www.reddit.com/r/UptimeKuma/
+[r/Uptime kuma](https://www.reddit.com/r/UptimeKuma/)
 
 ## Contribute
 
-### Beta Version
+### Test Pull Requests
+
+There are a lot of pull requests right now, but I don't have time to test them all.
+
+If you want to help, you can check this:
+https://github.com/louislam/uptime-kuma/wiki/Test-Pull-Requests
+
+### Test Beta Version
 
 Check out the latest beta release here: https://github.com/louislam/uptime-kuma/releases
 
@@ -169,5 +176,5 @@ If you want to translate Uptime Kuma into your language, please read: https://gi
 
 Feel free to correct my grammar in this README, source code, or wiki, as my mother language is not English and my grammar is not that great.
 
-### Pull Requests
-If you want to modify Uptime Kuma, this guideline may be useful for you: https://github.com/louislam/uptime-kuma/blob/master/CONTRIBUTING.md
+### Create Pull Requests
+If you want to modify Uptime Kuma, please read this guide and follow the rules here: https://github.com/louislam/uptime-kuma/blob/master/CONTRIBUTING.md

config/vite.config.js

@@ -11,11 +11,16 @@ const viteCompressionFilter = /\.(js|mjs|json|css|html|svg)$/i;
 
 // https://vitejs.dev/config/
 export default defineConfig({
+    server: {
+        port: 3000,
+    },
+    define: {
+        "FRONTEND_VERSION": JSON.stringify(process.env.npm_package_version),
+    },
     plugins: [
         vue(),
         legacy({
-            targets: [ "ie > 11" ],
-            additionalLegacyPolyfills: [ "regenerator-runtime/runtime" ]
+            targets: [ "since 2015" ],
         }),
         visualizer({
             filename: "tmp/dist-stats.html"

cypress.config.ts

@@ -0,0 +1,15 @@
+import { defineConfig } from "cypress";
+
+export default defineConfig({
+    e2e: {
+        baseUrl: "http://localhost:3002",
+        defaultCommandTimeout: 10000,
+        pageLoadTimeout: 60000,
+        viewportWidth: 1920,
+        viewportHeight: 1080,
+        specPattern: ["cypress/e2e/setup.cy.ts", "cypress/e2e/**/*.ts"],
+    },
+    env: {
+        baseUrl: "http://localhost:3002",
+    },
+});

cypress/e2e/setup.cy.ts

@@ -0,0 +1,24 @@
+import { actor } from "../support/actors/actor";
+import { DEFAULT_USER_DATA } from "../support/const/user-data";
+import { DashboardPage } from "../support/pages/dasboard-page";
+import { SetupPage } from "../support/pages/setup-page";
+
+describe("user can create a new account on setup page", () => {
+    before(() => {
+        cy.visit("/setup");
+    });
+
+    it("user can create new account", () => {
+        cy.url().should("be.equal", SetupPage.url);
+        actor.setupTask.fillAndSubmitSetupForm(
+            DEFAULT_USER_DATA.username,
+            DEFAULT_USER_DATA.password,
+            DEFAULT_USER_DATA.password
+        );
+
+        cy.url().should("be.equal", DashboardPage.url);
+        cy.get('[role="alert"]')
+            .should("be.visible")
+            .and("contain.text", "Added Successfully.");
+    });
+});

cypress/support/actors/actor.ts

@@ -0,0 +1,8 @@
+import { SetupTask } from "../tasks/setup-task";
+
+class Actor {
+    setupTask: SetupTask = new SetupTask();
+}
+
+const actor = new Actor();
+export { actor };

cypress/support/const/user-data.ts

@@ -0,0 +1,4 @@
+export const DEFAULT_USER_DATA = {
+    username: "testuser",
+    password: "testuser123",
+};

cypress/support/e2e.ts

@@ -0,0 +1 @@
+import "./commands";

cypress/support/pages/dasboard-page.ts

@@ -0,0 +1,3 @@
+export const DashboardPage = {
+    url: Cypress.env("baseUrl") + "/dashboard",
+};

cypress/support/pages/setup-page.ts

@@ -0,0 +1,7 @@
+export const SetupPage = {
+    url: Cypress.env("baseUrl") + "/setup",
+    usernameInput: '[data-cy="username-input"]',
+    passWordInput: '[data-cy="password-input"]',
+    passwordRepeatInput: '[data-cy="password-repeat-input"]',
+    submitSetupForm: '[data-cy="submit-setup-form"]',
+};

cypress/support/tasks/setup-task.ts

@@ -0,0 +1,15 @@
+import { SetupPage } from "../pages/setup-page";
+
+export class SetupTask {
+    fillAndSubmitSetupForm(
+        username: string,
+        password: string,
+        passwordRepeat: string
+    ) {
+        cy.get(SetupPage.usernameInput).type(username);
+        cy.get(SetupPage.passWordInput).type(password);
+        cy.get(SetupPage.passwordRepeatInput).type(passwordRepeat);
+
+        cy.get(SetupPage.submitSetupForm).click();
+    }
+}

db/patch-add-clickable-status-page-link.sql

@@ -0,0 +1,5 @@
+-- You should not modify if this have pushed to Github, unless it does serious wrong with the db.
+BEGIN TRANSACTION;
+ALTER TABLE monitor_group
+    ADD send_url BOOLEAN DEFAULT 0 NOT NULL;
+COMMIT;

db/patch-add-docker-columns.sql

@@ -0,0 +1,18 @@
+-- You should not modify if this have pushed to Github, unless it does serious wrong with the db.
+BEGIN TRANSACTION;
+
+CREATE TABLE docker_host (
+	id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT,
+	user_id INT NOT NULL,
+	docker_daemon VARCHAR(255),
+	docker_type VARCHAR(255),
+	name VARCHAR(255)
+);
+
+ALTER TABLE monitor
+	ADD docker_host INTEGER REFERENCES docker_host(id);
+
+ALTER TABLE monitor
+	ADD docker_container VARCHAR(255);
+
+COMMIT;

db/patch-add-radius-monitor.sql

@@ -0,0 +1,18 @@
+BEGIN TRANSACTION;
+
+ALTER TABLE monitor
+    ADD radius_username VARCHAR(255);
+
+ALTER TABLE monitor
+    ADD radius_password VARCHAR(255);
+
+ALTER TABLE monitor
+    ADD radius_calling_station_id VARCHAR(50);
+
+ALTER TABLE monitor
+    ADD radius_called_station_id VARCHAR(50);
+
+ALTER TABLE monitor
+    ADD radius_secret VARCHAR(255);
+
+COMMIT

db/patch-monitor-add-resend-interval.sql

@@ -0,0 +1,10 @@
+-- You should not modify if this have pushed to Github, unless it does serious wrong with the db.
+BEGIN TRANSACTION;
+
+ALTER TABLE monitor
+    ADD resend_interval INTEGER default 0 not null;
+
+ALTER TABLE heartbeat
+    ADD down_count INTEGER default 0 not null;
+
+COMMIT;

docker/alpine-base.dockerfile

@@ -4,5 +4,5 @@ WORKDIR /app
 
 # Install apprise, iputils for non-root ping, setpriv
 RUN apk add --no-cache iputils setpriv dumb-init python3 py3-cryptography py3-pip py3-six py3-yaml py3-click py3-markdown py3-requests py3-requests-oauthlib && \
-    pip3 --no-cache-dir install apprise==0.9.8.3 && \
+    pip3 --no-cache-dir install apprise==1.0.0 && \
     rm -rf /root/.cache

docker/debian-base.dockerfile

@@ -11,8 +11,9 @@ WORKDIR /app
 RUN apt update && \
     apt --yes --no-install-recommends install python3 python3-pip python3-cryptography python3-six python3-yaml python3-click python3-markdown python3-requests python3-requests-oauthlib \
         sqlite3 iputils-ping util-linux dumb-init && \
-    pip3 --no-cache-dir install apprise==0.9.8.3 && \
-    rm -rf /var/lib/apt/lists/*
+    pip3 --no-cache-dir install apprise==1.0.0 && \
+    rm -rf /var/lib/apt/lists/* && \
+    apt --yes autoremove
 
 # Install cloudflared
 # dpkg --add-architecture arm: cloudflared do not provide armhf, this is workaround. Read more: https://github.com/cloudflare/cloudflared/issues/583
@@ -22,5 +23,6 @@ RUN node ./extra/download-cloudflared.js $TARGETPLATFORM && \
     apt update && \
     apt --yes --no-install-recommends install ./cloudflared.deb && \
     rm -rf /var/lib/apt/lists/* && \
-    rm -f cloudflared.deb
+    rm -f cloudflared.deb && \
+    apt --yes autoremove
 

docker/docker-compose.yml

@@ -1,4 +1,4 @@
-# Simple docker-composer.yml
+# Simple docker-compose.yml
 # You can change your port or volume location
 
 version: '3.3'

docker/dockerfile

@@ -24,6 +24,36 @@ CMD ["node", "server/server.js"]
 FROM release AS nightly
 RUN npm run mark-as-nightly
 
+# Build an image for testing pr
+FROM louislam/uptime-kuma:base-debian AS pr-test
+
+WORKDIR /app
+
+ENV PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1
+
+## Install Git
+RUN apt update \
+    && apt --yes --no-install-recommends install curl \
+    && curl -fsSL https://cli.github.com/packages/githubcli-archive-keyring.gpg | dd of=/usr/share/keyrings/githubcli-archive-keyring.gpg \
+    && chmod go+r /usr/share/keyrings/githubcli-archive-keyring.gpg \
+    && echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/githubcli-archive-keyring.gpg] https://cli.github.com/packages stable main" | tee /etc/apt/sources.list.d/github-cli.list > /dev/null \
+    && apt update \
+    && apt --yes --no-install-recommends  install git
+
+## Empty the directory, because we have to clone the Git repo.
+RUN rm -rf ./* && chown node /app
+
+USER node
+RUN git config --global user.email "no-reply@no-reply.com"
+RUN git config --global user.name "PR Tester"
+RUN git clone https://github.com/louislam/uptime-kuma.git .
+RUN npm ci
+
+EXPOSE 3000 3001
+VOLUME ["/app/data"]
+HEALTHCHECK --interval=60s --timeout=30s --start-period=180s --retries=5 CMD node extra/healthcheck.js
+CMD ["npm", "run", "start-pr-test"]
+
 
 # Upload the artifact to Github
 FROM louislam/uptime-kuma:base-debian AS upload-artifact

extra/checkout-pr.js

@@ -0,0 +1,33 @@
+const childProcess = require("child_process");
+
+if (!process.env.UPTIME_KUMA_GH_REPO) {
+    console.error("Please set a repo to the environment variable 'UPTIME_KUMA_GH_REPO' (e.g. mhkarimi1383:goalert-notification)");
+    process.exit(1);
+}
+
+let inputArray = process.env.UPTIME_KUMA_GH_REPO.split(":");
+
+if (inputArray.length !== 2) {
+    console.error("Invalid format. Please set a repo to the environment variable 'UPTIME_KUMA_GH_REPO' (e.g. mhkarimi1383:goalert-notification)");
+}
+
+let name = inputArray[0];
+let branch = inputArray[1];
+
+console.log("Checkout pr");
+
+// Checkout the pr
+let result = childProcess.spawnSync("git", [ "remote", "add", name, `https://github.com/${name}/uptime-kuma` ]);
+
+console.log(result.stdout.toString());
+console.error(result.stderr.toString());
+
+result = childProcess.spawnSync("git", [ "fetch", name, branch ]);
+
+console.log(result.stdout.toString());
+console.error(result.stderr.toString());
+
+result = childProcess.spawnSync("git", [ "checkout", `${name}/${branch}`, "--force" ]);
+
+console.log(result.stdout.toString());
+console.error(result.stderr.toString());

extra/update-wiki-version.js

@@ -41,7 +41,7 @@ function updateWiki(newVersion) {
 
 function safeDelete(dir) {
     if (fs.existsSync(dir)) {
-        fs.rmdirSync(dir, {
+        fs.rm(dir, {
             recursive: true,
         });
     }

package.json

@@ -1,6 +1,6 @@
 {
     "name": "uptime-kuma",
-    "version": "1.17.0-beta.0",
+    "version": "1.18.0",
     "license": "MIT",
     "repository": {
         "type": "git",
@@ -38,8 +38,9 @@
         "build-docker-nightly": "npm run build && docker buildx build -f docker/dockerfile --platform linux/amd64,linux/arm64,linux/arm/v7 -t louislam/uptime-kuma:nightly --target nightly . --push",
         "build-docker-nightly-alpine": "docker buildx build -f docker/dockerfile-alpine --platform linux/amd64,linux/arm64,linux/arm/v7 -t louislam/uptime-kuma:nightly-alpine --target nightly . --push",
         "build-docker-nightly-amd64": "docker buildx build -f docker/dockerfile --platform linux/amd64 -t louislam/uptime-kuma:nightly-amd64 --target nightly . --push --progress plain",
+        "build-docker-pr-test": "docker buildx build -f docker/dockerfile --platform linux/amd64,linux/arm64 -t louislam/uptime-kuma:pr-test --target pr-test . --push",
         "upload-artifacts": "docker buildx build -f docker/dockerfile --platform linux/amd64 -t louislam/uptime-kuma:upload-artifact --build-arg VERSION --build-arg GITHUB_TOKEN --target upload-artifact . --progress plain",
-        "setup": "git checkout 1.16.1 && npm ci --production && npm run download-dist",
+        "setup": "git checkout 1.18.0 && npm ci --production && npm run download-dist",
         "download-dist": "node extra/download-dist.js",
         "mark-as-nightly": "node extra/mark-as-nightly.js",
         "reset-password": "node extra/reset-password.js",
@@ -58,26 +59,21 @@
         "release-final": "node extra/update-version.js && npm run build-docker && node ./extra/press-any-key.js && npm run upload-artifacts && node ./extra/update-wiki-version.js",
         "release-beta": "node extra/beta/update-version.js && npm run build && node ./extra/env2arg.js docker buildx build -f docker/dockerfile --platform linux/amd64,linux/arm64,linux/arm/v7 -t louislam/uptime-kuma:$VERSION -t louislam/uptime-kuma:beta .  --target release --push && node ./extra/press-any-key.js && npm run upload-artifacts",
         "git-remove-tag": "git tag -d",
-        "build-dist-and-restart": "npm run build && npm run start-server-dev"
+        "build-dist-and-restart": "npm run build && npm run start-server-dev",
+        "start-pr-test": "node extra/checkout-pr.js && npm install && npm run dev",
+        "cy:test": "node test/prepare-test-server.js && node server/server.js --port=3002 --data-dir=./data/test/ --e2e",
+        "cy:run": "npx cypress run --browser chrome --headless"
     },
     "dependencies": {
-        "@fortawesome/fontawesome-svg-core": "~1.2.36",
-        "@fortawesome/free-regular-svg-icons": "~5.15.4",
-        "@fortawesome/free-solid-svg-icons": "~5.15.4",
-        "@fortawesome/vue-fontawesome": "~3.0.0-5",
         "@louislam/sqlite3": "~15.0.6",
-        "@popperjs/core": "~2.10.2",
         "args-parser": "~1.3.0",
-        "axios": "~0.26.1",
-        "axios-cached-dns-resolve": "^3.0.6",
+        "axios": "~0.27.0",
         "axios-ntlm": "^1.3.0",
         "badge-maker": "^3.3.1",
         "bcryptjs": "~2.4.3",
-        "bootstrap": "5.1.3",
         "bree": "~7.1.5",
+        "cacheable-lookup": "~6.0.4",
         "chardet": "^1.3.0",
-        "chart.js": "~3.6.2",
-        "chartjs-adapter-dayjs": "~1.0.0",
         "check-password-strength": "^2.0.5",
         "cheerio": "^1.0.0-rc.10",
         "chroma-js": "^2.1.2",
@@ -85,11 +81,9 @@
         "compare-versions": "~3.6.0",
         "compression": "^1.7.4",
         "dayjs": "^1.11.0",
-        "esm-wallaby": "^3.2.26",
         "express": "~4.17.3",
         "express-basic-auth": "~1.2.1",
         "express-static-gzip": "^2.1.7",
-        "favico.js": "^0.3.10",
         "form-data": "~4.0.0",
         "http-graceful-shutdown": "~3.1.7",
         "http-proxy-agent": "^5.0.0",
@@ -101,24 +95,67 @@
         "mqtt": "^4.2.8",
         "mssql": "^8.1.0",
         "node-cloudflared-tunnel": "~1.0.9",
+        "node-radius-client": "^1.0.0",
         "nodemailer": "~6.6.5",
         "notp": "~2.0.3",
         "password-hash": "~1.2.2",
-        "postcss-rtlcss": "~3.4.1",
-        "postcss-scss": "~4.0.3",
-        "prismjs": "^1.27.0",
+        "pg": "^8.7.3",
+        "pg-connection-string": "^2.5.0",
         "prom-client": "~13.2.0",
         "prometheus-api-metrics": "~3.2.1",
-        "qrcode": "~1.5.0",
         "redbean-node": "0.1.4",
         "socket.io": "~4.4.1",
         "socket.io-client": "~4.4.1",
-        "socks-proxy-agent": "^6.1.1",
+        "socks-proxy-agent": "6.1.1",
         "tar": "^6.1.11",
         "tcp-ping": "~0.1.1",
-        "thirty-two": "~1.0.2",
+        "thirty-two": "~1.0.2"
+    },
+    "devDependencies": {
+        "@actions/github": "~5.0.1",
+        "@babel/eslint-parser": "~7.17.0",
+        "@babel/preset-env": "^7.15.8",
+        "@fortawesome/fontawesome-svg-core": "~1.2.36",
+        "@fortawesome/free-regular-svg-icons": "~5.15.4",
+        "@fortawesome/free-solid-svg-icons": "~5.15.4",
+        "@fortawesome/vue-fontawesome": "~3.0.0-5",
+        "@popperjs/core": "~2.10.2",
+        "@types/bootstrap": "~5.1.9",
+        "@vitejs/plugin-legacy": "~2.1.0",
+        "@vitejs/plugin-vue": "~3.1.0",
+        "@vue/compiler-sfc": "~3.2.36",
+        "aedes": "^0.46.3",
+        "babel-plugin-rewire": "~1.2.0",
+        "bootstrap": "5.1.3",
+        "chart.js": "~3.6.2",
+        "chartjs-adapter-dayjs": "~1.0.0",
+        "concurrently": "^7.1.0",
+        "core-js": "~3.18.3",
+        "cross-env": "~7.0.3",
+        "cypress": "^10.1.0",
+        "delay": "^5.0.0",
+        "dns2": "~2.0.1",
+        "eslint": "~8.14.0",
+        "eslint-plugin-vue": "~8.7.1",
+        "favico.js": "^0.3.10",
+        "jest": "~27.2.5",
+        "jest-puppeteer": "~6.0.3",
+        "postcss-html": "~1.5.0",
+        "postcss-rtlcss": "~3.7.2",
+        "postcss-scss": "~4.0.4",
+        "prismjs": "^1.27.0",
+        "puppeteer": "~13.1.3",
+        "qrcode": "~1.5.0",
+        "rollup-plugin-visualizer": "^5.6.0",
+        "sass": "~1.42.1",
+        "stylelint": "~14.7.1",
+        "stylelint-config-standard": "~25.0.0",
+        "terser": "^5.15.0",
         "timezones-list": "~3.0.1",
+        "typescript": "~4.4.4",
         "v-pagination-3": "~0.1.7",
+        "vite": "~3.1.0",
+        "vite-plugin-compression": "^0.5.1",
         "vue": "next",
         "vue-chart-3": "3.0.9",
         "vue-confirm-dialog": "~1.0.2",
@@ -130,38 +167,7 @@
         "vue-qrcode": "~1.0.0",
         "vue-router": "~4.0.14",
         "vue-toastification": "~2.0.0-rc.5",
-        "vuedraggable": "~4.1.0"
-    },
-    "devDependencies": {
-        "@actions/github": "~5.0.1",
-        "@babel/eslint-parser": "~7.17.0",
-        "@babel/preset-env": "^7.15.8",
-        "@types/bootstrap": "~5.1.9",
-        "@vitejs/plugin-legacy": "~1.8.2",
-        "@vitejs/plugin-vue": "~2.3.3",
-        "@vue/compiler-sfc": "~3.2.36",
-        "aedes": "^0.46.3",
-        "babel-plugin-rewire": "~1.2.0",
-        "concurrently": "^7.1.0",
-        "core-js": "~3.18.3",
-        "cross-env": "~7.0.3",
-        "delay": "^5.0.0",
-        "dns2": "~2.0.1",
-        "eslint": "~8.14.0",
-        "eslint-plugin-vue": "~8.7.1",
-        "jest": "~27.2.5",
-        "jest-puppeteer": "~6.0.3",
-        "lru-cache": "^7.7.1",
-        "npm-check-updates": "^12.5.9",
-        "postcss-html": "^1.3.1",
-        "puppeteer": "~13.1.3",
-        "rollup-plugin-visualizer": "^5.6.0",
-        "sass": "~1.42.1",
-        "stylelint": "~14.7.1",
-        "stylelint-config-standard": "~25.0.0",
-        "typescript": "~4.4.4",
-        "vite": "~2.9.9",
-        "vite-plugin-compression": "^0.5.1",
+        "vuedraggable": "~4.1.0",
         "wait-on": "^6.0.1"
     }
 }

server/cacheable-dns-http-agent.js

@@ -0,0 +1,54 @@
+const https = require("https");
+const http = require("http");
+const CacheableLookup = require("cacheable-lookup");
+
+class CacheableDnsHttpAgent {
+
+    static cacheable = new CacheableLookup();
+
+    static httpAgentList = {};
+    static httpsAgentList = {};
+
+    /**
+     * Register cacheable to global agents
+     */
+    static registerGlobalAgent() {
+        this.cacheable.install(http.globalAgent);
+        this.cacheable.install(https.globalAgent);
+    }
+
+    static install(agent) {
+        this.cacheable.install(agent);
+    }
+
+    /**
+     * @var {https.AgentOptions} agentOptions
+     * @return {https.Agent}
+     */
+    static getHttpsAgent(agentOptions) {
+        let key = JSON.stringify(agentOptions);
+        if (!(key in this.httpsAgentList)) {
+            this.httpsAgentList[key] = new https.Agent(agentOptions);
+            this.cacheable.install(this.httpsAgentList[key]);
+        }
+        return this.httpsAgentList[key];
+    }
+
+    /**
+     * @var {http.AgentOptions} agentOptions
+     * @return {https.Agents}
+     */
+    static getHttpAgent(agentOptions) {
+        let key = JSON.stringify(agentOptions);
+        if (!(key in this.httpAgentList)) {
+            this.httpAgentList[key] = new http.Agent(agentOptions);
+            this.cacheable.install(this.httpAgentList[key]);
+        }
+        return this.httpAgentList[key];
+    }
+
+}
+
+module.exports = {
+    CacheableDnsHttpAgent,
+};

server/client.js

@@ -22,7 +22,10 @@ async function sendNotificationList(socket) {
     ]);
 
     for (let bean of list) {
-        result.push(bean.export());
+        let notificationObject = bean.export();
+        notificationObject.isDefault = (notificationObject.isDefault === 1);
+        notificationObject.active = (notificationObject.active === 1);
+        result.push(notificationObject);
     }
 
     io.to(socket.userID).emit("notificationList", result);
@@ -122,10 +125,35 @@ async function sendInfo(socket) {
     });
 }
 
+/**
+ * Send list of docker hosts to client
+ * @param {Socket} socket Socket.io socket instance
+ * @returns {Promise<Bean[]>}
+ */
+async function sendDockerHostList(socket) {
+    const timeLogger = new TimeLogger();
+
+    let result = [];
+    let list = await R.find("docker_host", " user_id = ? ", [
+        socket.userID,
+    ]);
+
+    for (let bean of list) {
+        result.push(bean.toJSON());
+    }
+
+    io.to(socket.userID).emit("dockerHostList", result);
+
+    timeLogger.print("Send Docker Host List");
+
+    return list;
+}
+
 module.exports = {
     sendNotificationList,
     sendImportantHeartbeatList,
     sendHeartbeatList,
     sendProxyList,
     sendInfo,
+    sendDockerHostList
 };

server/database.js

@@ -53,13 +53,17 @@ class Database {
         "patch-2fa-invalidate-used-token.sql": true,
         "patch-notification_sent_history.sql": true,
         "patch-monitor-basic-auth.sql": true,
+        "patch-add-docker-columns.sql": true,
         "patch-status-page.sql": true,
         "patch-proxy.sql": true,
         "patch-monitor-expiry-notification.sql": true,
         "patch-status-page-footer-css.sql": true,
         "patch-added-mqtt-monitor.sql": true,
+        "patch-add-clickable-status-page-link.sql": true,
         "patch-add-sqlserver-monitor.sql": true,
         "patch-add-other-auth.sql": { parents: [ "patch-monitor-basic-auth.sql" ] },
+        "patch-add-radius-monitor.sql": true,
+        "patch-monitor-add-resend-interval.sql": true,
     };
 
     /**
@@ -146,6 +150,9 @@ class Database {
         await R.exec("PRAGMA cache_size = -12000");
         await R.exec("PRAGMA auto_vacuum = FULL");
 
+        // Avoid error "SQLITE_BUSY: database is locked" by allowing SQLITE to wait up to 5 seconds to do a write
+        await R.exec("PRAGMA busy_timeout = 5000");
+
         // This ensures that an operating system crash or power failure will not corrupt the database.
         // FULL synchronous is very safe, but it is also slower.
         // Read more: https://sqlite.org/pragma.html#pragma_synchronous
@@ -177,7 +184,13 @@ class Database {
         } else {
             log.info("db", "Database patch is needed");
 
-            this.backup(version);
+            try {
+                this.backup(version);
+            } catch (e) {
+                log.error("db", e);
+                log.error("db", "Unable to create a backup before patching the database. Please make sure you have enough space and permission.");
+                process.exit(1);
+            }
 
             // Try catch anything here, if gone wrong, restore the backup
             try {
@@ -445,6 +458,23 @@ class Database {
                 this.backupWalPath = walPath + ".bak" + version;
                 fs.copyFileSync(walPath, this.backupWalPath);
             }
+
+            // Double confirm if all files actually backup
+            if (!fs.existsSync(this.backupPath)) {
+                throw new Error("Backup failed! " + this.backupPath);
+            }
+
+            if (fs.existsSync(shmPath)) {
+                if (!fs.existsSync(this.backupShmPath)) {
+                    throw new Error("Backup failed! " + this.backupShmPath);
+                }
+            }
+
+            if (fs.existsSync(walPath)) {
+                if (!fs.existsSync(this.backupWalPath)) {
+                    throw new Error("Backup failed! " + this.backupWalPath);
+                }
+            }
         }
     }
 

server/docker.js

@@ -0,0 +1,106 @@
+const axios = require("axios");
+const { R } = require("redbean-node");
+const version = require("../package.json").version;
+const https = require("https");
+
+class DockerHost {
+    /**
+     * Save a docker host
+     * @param {Object} dockerHost Docker host to save
+     * @param {?number} dockerHostID ID of the docker host to update
+     * @param {number} userID ID of the user who adds the docker host
+     * @returns {Promise<Bean>}
+     */
+    static async save(dockerHost, dockerHostID, userID) {
+        let bean;
+
+        if (dockerHostID) {
+            bean = await R.findOne("docker_host", " id = ? AND user_id = ? ", [ dockerHostID, userID ]);
+
+            if (!bean) {
+                throw new Error("docker host not found");
+            }
+
+        } else {
+            bean = R.dispense("docker_host");
+        }
+
+        bean.user_id = userID;
+        bean.docker_daemon = dockerHost.dockerDaemon;
+        bean.docker_type = dockerHost.dockerType;
+        bean.name = dockerHost.name;
+
+        await R.store(bean);
+
+        return bean;
+    }
+
+    /**
+     * Delete a Docker host
+     * @param {number} dockerHostID ID of the Docker host to delete
+     * @param {number} userID ID of the user who created the Docker host
+     * @returns {Promise<void>}
+     */
+    static async delete(dockerHostID, userID) {
+        let bean = await R.findOne("docker_host", " id = ? AND user_id = ? ", [ dockerHostID, userID ]);
+
+        if (!bean) {
+            throw new Error("docker host not found");
+        }
+
+        // Delete removed proxy from monitors if exists
+        await R.exec("UPDATE monitor SET docker_host = null WHERE docker_host = ?", [ dockerHostID ]);
+
+        await R.trash(bean);
+    }
+
+    /**
+     * Fetches the amount of containers on the Docker host
+     * @param {Object} dockerHost Docker host to check for
+     * @returns {number} Total amount of containers on the host
+     */
+    static async testDockerHost(dockerHost) {
+        const options = {
+            url: "/containers/json?all=true",
+            headers: {
+                "Accept": "*/*",
+                "User-Agent": "Uptime-Kuma/" + version
+            },
+            httpsAgent: new https.Agent({
+                maxCachedSessions: 0,      // Use Custom agent to disable session reuse (https://github.com/nodejs/node/issues/3940)
+                rejectUnauthorized: false,
+            }),
+        };
+
+        if (dockerHost.dockerType === "socket") {
+            options.socketPath = dockerHost.dockerDaemon;
+        } else if (dockerHost.dockerType === "tcp") {
+            options.baseURL = dockerHost.dockerDaemon;
+        }
+
+        let res = await axios.request(options);
+
+        if (Array.isArray(res.data)) {
+
+            if (res.data.length > 1) {
+
+                if ("ImageID" in res.data[0]) {
+                    return res.data.length;
+                } else {
+                    throw new Error("Invalid Docker response, is it Docker really a daemon?");
+                }
+
+            } else {
+                return res.data.length;
+            }
+
+        } else {
+            throw new Error("Invalid Docker response, is it Docker really a daemon?");
+        }
+
+    }
+}
+
+module.exports = {
+    DockerHost,
+};

server/model/docker_host.js

@@ -0,0 +1,19 @@
+const { BeanModel } = require("redbean-node/dist/bean-model");
+
+class DockerHost extends BeanModel {
+    /**
+     * Returns an object that ready to parse to JSON
+     * @returns {Object}
+     */
+    toJSON() {
+        return {
+            id: this.id,
+            userID: this.user_id,
+            dockerDaemon: this.docker_daemon,
+            dockerType: this.docker_type,
+            name: this.name,
+        };
+    }
+}
+
+module.exports = DockerHost;

server/model/group.js

@@ -31,7 +31,7 @@ class Group extends BeanModel {
      */
     async getMonitorList() {
         return R.convertToBeans("monitor", await R.getAll(`
-            SELECT monitor.* FROM monitor, monitor_group
+            SELECT monitor.*, monitor_group.send_url FROM monitor, monitor_group
             WHERE monitor.id = monitor_group.monitor_id
             AND group_id = ?
             ORDER BY monitor_group.weight

server/model/monitor.js

@@ -7,7 +7,7 @@ dayjs.extend(timezone);
 const axios = require("axios");
 const { Prometheus } = require("../prometheus");
 const { log, UP, DOWN, PENDING, flipStatus, TimeLogger } = require("../../src/util");
-const { tcping, ping, dnsResolve, checkCertificate, checkStatusCode, getTotalClientInRoom, setting, mssqlQuery, mqttAsync, setSetting, httpNtlm } = require("../util-server");
+const { tcping, ping, dnsResolve, checkCertificate, checkStatusCode, getTotalClientInRoom, setting, mssqlQuery, postgresQuery, mqttAsync, setSetting, httpNtlm, radius } = require("../util-server");
 const { R } = require("redbean-node");
 const { BeanModel } = require("redbean-node/dist/bean-model");
 const { Notification } = require("../notification");
@@ -16,12 +16,7 @@ const { demoMode } = require("../config");
 const version = require("../../package.json").version;
 const apicache = require("../modules/apicache");
 const { UptimeKumaServer } = require("../uptime-kuma-server");
-
-const axiosCachedDnsResolve = require("esm-wallaby")(module)("axios-cached-dns-resolve");
-
-// create an axios client instance with the cached DNS resolve interceptor
-const axiosClient = axios.create();
-axiosCachedDnsResolve.registerInterceptor(axiosClient);
+const { CacheableDnsHttpAgent } = require("../cacheable-dns-http-agent");
 
 /**
  * status:
@@ -40,7 +35,13 @@ class Monitor extends BeanModel {
         let obj = {
             id: this.id,
             name: this.name,
+            sendUrl: this.sendUrl,
         };
+
+        if (this.sendUrl) {
+            obj.url = this.url;
+        }
+
         if (showTags) {
             obj.tags = await this.getTags();
         }
@@ -78,6 +79,7 @@ class Monitor extends BeanModel {
             type: this.type,
             interval: this.interval,
             retryInterval: this.retryInterval,
+            resendInterval: this.resendInterval,
             keyword: this.keyword,
             expiryNotification: this.isEnabledExpiryNotification(),
             ignoreTls: this.getIgnoreTls(),
@@ -87,6 +89,9 @@ class Monitor extends BeanModel {
             dns_resolve_type: this.dns_resolve_type,
             dns_resolve_server: this.dns_resolve_server,
             dns_last_result: this.dns_last_result,
+            pushToken: this.pushToken,
+            docker_container: this.docker_container,
+            docker_host: this.docker_host,
             proxyId: this.proxy_id,
             notificationIDList,
             tags: tags,
@@ -99,6 +104,11 @@ class Monitor extends BeanModel {
             authMethod: this.authMethod,
             authWorkstation: this.authWorkstation,
             authDomain: this.authDomain,
+            radiusUsername: this.radiusUsername,
+            radiusPassword: this.radiusPassword,
+            radiusCalledStationId: this.radiusCalledStationId,
+            radiusCallingStationId: this.radiusCallingStationId,
+            radiusSecret: this.radiusSecret,
         };
 
         if (includeSensitiveData) {
@@ -205,6 +215,7 @@ class Monitor extends BeanModel {
             bean.monitor_id = this.id;
             bean.time = R.isoDateTimeMillis(dayjs.utc());
             bean.status = DOWN;
+            bean.downCount = previousBeat?.downCount || 0;
 
             if (this.isUpsideDown()) {
                 bean.status = flipStatus(bean.status);
@@ -283,11 +294,11 @@ class Monitor extends BeanModel {
                             username: this.basic_auth_user,
                             password: this.basic_auth_pass,
                             domain: this.authDomain,
-                            workstation: this.authWorkstation,
+                            workstation: this.authWorkstation ? this.authWorkstation : undefined
                         });
 
                     } else {
-                        res = await axiosClient.request(options);
+                        res = await axios.request(options);
                     }
 
                     bean.msg = `${res.status} - ${res.statusText}`;
@@ -406,7 +417,7 @@ class Monitor extends BeanModel {
 
                         // If the previous beat was down or pending we use the regular
                         // beatInterval/retryInterval in the setTimeout further below
-                        if (previousBeat.status !== UP || msSinceLastBeat > beatInterval * 1000 + bufferTime) {
+                        if (previousBeat.status !== (this.isUpsideDown() ? DOWN : UP) || msSinceLastBeat > beatInterval * 1000 + bufferTime) {
                             throw new Error("No heartbeat in the time window");
                         } else {
                             let timeout = beatInterval * 1000 - msSinceLastBeat;
@@ -434,16 +445,19 @@ class Monitor extends BeanModel {
                         throw new Error("Steam API Key not found");
                     }
 
-                    let res = await axiosClient.get(steamApiUrl, {
+                    let res = await axios.get(steamApiUrl, {
                         timeout: this.interval * 1000 * 0.8,
                         headers: {
                             "Accept": "*/*",
                             "User-Agent": "Uptime-Kuma/" + version,
                         },
-                        httpsAgent: new https.Agent({
+                        httpsAgent: CacheableDnsHttpAgent.getHttpsAgent({
                             maxCachedSessions: 0,      // Use Custom agent to disable session reuse (https://github.com/nodejs/node/issues/3940)
                             rejectUnauthorized: !this.getIgnoreTls(),
                         }),
+                        httpAgent: CacheableDnsHttpAgent.getHttpAgent({
+                            maxCachedSessions: 0,
+                        }),
                         maxRedirects: this.maxredirects,
                         validateStatus: (status) => {
                             return checkStatusCode(status, this.getAcceptedStatuscodes());
@@ -464,6 +478,35 @@ class Monitor extends BeanModel {
                     } else {
                         throw new Error("Server not found on Steam");
                     }
+                } else if (this.type === "docker") {
+                    log.debug(`[${this.name}] Prepare Options for Axios`);
+
+                    const dockerHost = await R.load("docker_host", this.docker_host);
+
+                    const options = {
+                        url: `/containers/${this.docker_container}/json`,
+                        headers: {
+                            "Accept": "*/*",
+                            "User-Agent": "Uptime-Kuma/" + version,
+                        },
+                        httpsAgent: new https.Agent({
+                            maxCachedSessions: 0,      // Use Custom agent to disable session reuse (https://github.com/nodejs/node/issues/3940)
+                            rejectUnauthorized: ! this.getIgnoreTls(),
+                        }),
+                    };
+
+                    if (dockerHost._dockerType === "socket") {
+                        options.socketPath = dockerHost._dockerDaemon;
+                    } else if (dockerHost._dockerType === "tcp") {
+                        options.baseURL = dockerHost._dockerDaemon;
+                    }
+
+                    log.debug(`[${this.name}] Axios Request`);
+                    let res = await axios.request(options);
+                    if (res.data.State.Running) {
+                        bean.status = UP;
+                        bean.msg = "";
+                    }
                 } else if (this.type === "mqtt") {
                     bean.msg = await mqttAsync(this.hostname, this.mqttTopic, this.mqttSuccessMessage, {
                         port: this.port,
@@ -480,6 +523,38 @@ class Monitor extends BeanModel {
                     bean.msg = "";
                     bean.status = UP;
                     bean.ping = dayjs().valueOf() - startTime;
+                } else if (this.type === "postgres") {
+                    let startTime = dayjs().valueOf();
+
+                    await postgresQuery(this.databaseConnectionString, this.databaseQuery);
+
+                    bean.msg = "";
+                    bean.status = UP;
+                    bean.ping = dayjs().valueOf() - startTime;
+                } else if (this.type === "radius") {
+                    let startTime = dayjs().valueOf();
+                    try {
+                        const resp = await radius(
+                            this.hostname,
+                            this.radiusUsername,
+                            this.radiusPassword,
+                            this.radiusCalledStationId,
+                            this.radiusCallingStationId,
+                            this.radiusSecret
+                        );
+                        if (resp.code) {
+                            bean.msg = resp.code;
+                        }
+                        bean.status = UP;
+                    } catch (error) {
+                        bean.status = DOWN;
+                        if (error.response?.code) {
+                            bean.msg = error.response.code;
+                        } else {
+                            bean.msg = error.message;
+                        }
+                    }
+                    bean.ping = dayjs().valueOf() - startTime;
                 } else {
                     bean.msg = "Unknown Monitor Type";
                     bean.status = PENDING;
@@ -521,12 +596,27 @@ class Monitor extends BeanModel {
                 log.debug("monitor", `[${this.name}] sendNotification`);
                 await Monitor.sendNotification(isFirstBeat, this, bean);
 
+                // Reset down count
+                bean.downCount = 0;
+
                 // Clear Status Page Cache
                 log.debug("monitor", `[${this.name}] apicache clear`);
                 apicache.clear();
 
             } else {
                 bean.important = false;
+
+                if (bean.status === DOWN && this.resendInterval > 0) {
+                    ++bean.downCount;
+                    if (bean.downCount >= this.resendInterval) {
+                        // Send notification again, because we are still DOWN
+                        log.debug("monitor", `[${this.name}] sendNotification again: Down Count: ${bean.downCount} | Resend Interval: ${this.resendInterval}`);
+                        await Monitor.sendNotification(isFirstBeat, this, bean);
+
+                        // Reset down count
+                        bean.downCount = 0;
+                    }
+                }
             }
 
             if (bean.status === UP) {
@@ -537,7 +627,7 @@ class Monitor extends BeanModel {
                 }
                 log.warn("monitor", `Monitor #${this.id} '${this.name}': Pending: ${bean.msg} | Max retries: ${this.maxretries} | Retry: ${retries} | Retry Interval: ${beatInterval} seconds | Type: ${this.type}`);
             } else {
-                log.warn("monitor", `Monitor #${this.id} '${this.name}': Failing: ${bean.msg} | Interval: ${beatInterval} seconds | Type: ${this.type}`);
+                log.warn("monitor", `Monitor #${this.id} '${this.name}': Failing: ${bean.msg} | Interval: ${beatInterval} seconds | Type: ${this.type} | Down Count: ${bean.downCount} | Resend Interval: ${this.resendInterval}`);
             }
 
             log.debug("monitor", `[${this.name}] Send to socket`);

server/model/status_page.js

@@ -45,6 +45,8 @@ class StatusPage extends BeanModel {
             $("link[rel=icon]")
                 .attr("href", statusPage.icon)
                 .removeAttr("type");
+
+            $("link[rel=apple-touch-icon]").remove();
         }
 
         const head = $("head");
@@ -61,6 +63,9 @@ class StatusPage extends BeanModel {
             </script>
         `);
 
+        // manifest.json
+        $("link[rel=manifest]").attr("href", `/api/status-page/${statusPage.slug}/manifest.json`);
+
         return $.root().html();
     }
 

server/notification-providers/alertnow.js

@@ -0,0 +1,50 @@
+const NotificationProvider = require("./notification-provider");
+const axios = require("axios");
+const { setting } = require("../util-server");
+const { getMonitorRelativeURL, UP, DOWN } = require("../../src/util");
+
+class AlertNow extends NotificationProvider {
+
+    name = "AlertNow";
+
+    async send(notification, msg, monitorJSON = null, heartbeatJSON = null) {
+        let okMsg = "Sent Successfully.";
+        try {
+            let textMsg = "";
+            let status = "open";
+            let eventType = "ERROR";
+            let eventId = new Date().toISOString().slice(0, 10).replace(/-/g, "");
+
+            if (heartbeatJSON && heartbeatJSON.status === UP) {
+                textMsg = `[${heartbeatJSON.name}] ✅ Application is back online`;
+                status = "close";
+                eventType = "INFO";
+                eventId += `_${heartbeatJSON.name.replace(/\s/g, "")}`;
+            } else if (heartbeatJSON && heartbeatJSON.status === DOWN) {
+                textMsg = `[${heartbeatJSON.name}] 🔴 Application went down`;
+            }
+
+            textMsg += ` - ${msg}`;
+
+            const baseURL = await setting("primaryBaseURL");
+            if (baseURL && monitorJSON) {
+                textMsg += ` >> ${baseURL + getMonitorRelativeURL(monitorJSON.id)}`;
+            }
+
+            const data = {
+                "summary": textMsg,
+                "status": status,
+                "event_type": eventType,
+                "event_id": eventId,
+            };
+
+            await axios.post(notification.alertNowWebhookURL, data);
+            return okMsg;
+        } catch (error) {
+            this.throwGeneralAxiosError(error);
+        }
+
+    }
+}
+
+module.exports = AlertNow;

server/notification-providers/bark.js

@@ -12,9 +12,7 @@ const { default: axios } = require("axios");
 
 // bark is an APN bridge that sends notifications to Apple devices.
 
-const barkNotificationGroup = "UptimeKuma";
 const barkNotificationAvatar = "https://github.com/louislam/uptime-kuma/raw/master/public/icon.png";
-const barkNotificationSound = "telegraph";
 const successMessage = "Successes!";
 
 class Bark extends NotificationProvider {
@@ -30,17 +28,17 @@ class Bark extends NotificationProvider {
 
         if (msg != null && heartbeatJSON != null && heartbeatJSON["status"] === UP) {
             let title = "UptimeKuma Monitor Up";
-            return await this.postNotification(title, msg, barkEndpoint);
+            return await this.postNotification(notification, title, msg, barkEndpoint);
         }
 
         if (msg != null && heartbeatJSON != null && heartbeatJSON["status"] === DOWN) {
             let title = "UptimeKuma Monitor Down";
-            return await this.postNotification(title, msg, barkEndpoint);
+            return await this.postNotification(notification, title, msg, barkEndpoint);
         }
 
         if (msg != null) {
             let title = "UptimeKuma Message";
-            return await this.postNotification(title, msg, barkEndpoint);
+            return await this.postNotification(notification, title, msg, barkEndpoint);
         }
     }
 
@@ -50,13 +48,23 @@ class Bark extends NotificationProvider {
      * @param {string} postUrl URL to append parameters to
      * @returns {string}
      */
-    appendAdditionalParameters(postUrl) {
-        // grouping all our notifications
-        postUrl += "?group=" + barkNotificationGroup;
+    appendAdditionalParameters(notification, postUrl) {
         // set icon to uptime kuma icon, 11kb should be fine
-        postUrl += "&icon=" + barkNotificationAvatar;
+        postUrl += "?icon=" + barkNotificationAvatar;
+        // grouping all our notifications
+        if (notification.barkGroup != null) {
+            postUrl += "&group=" + notification.barkGroup;
+        } else {
+            // default name
+            postUrl += "&group=" + "UptimeKuma";
+        }
         // picked a sound, this should follow system's mute status when arrival
-        postUrl += "&sound=" + barkNotificationSound;
+        if (notification.barkSound != null) {
+            postUrl += "&sound=" + notification.barkSound;
+        } else {
+            // default sound
+            postUrl += "&sound=" + "telegraph";
+        }
         return postUrl;
     }
 
@@ -81,12 +89,12 @@ class Bark extends NotificationProvider {
      * @param {string} endpoint Endpoint to send request to
      * @returns {string}
      */
-    async postNotification(title, subtitle, endpoint) {
+    async postNotification(notification, title, subtitle, endpoint) {
         // url encode title and subtitle
         title = encodeURIComponent(title);
         subtitle = encodeURIComponent(subtitle);
         let postUrl = endpoint + "/" + title + "/" + subtitle;
-        postUrl = this.appendAdditionalParameters(postUrl);
+        postUrl = this.appendAdditionalParameters(notification, postUrl);
         let result = await axios.get(postUrl);
         this.checkResult(result);
         if (result.statusText != null) {

server/notification-providers/goalert.js

@@ -0,0 +1,35 @@
+const NotificationProvider = require("./notification-provider");
+const axios = require("axios");
+const { UP } = require("../../src/util");
+
+class GoAlert extends NotificationProvider {
+
+    name = "GoAlert";
+
+    async send(notification, msg, monitorJSON = null, heartbeatJSON = null) {
+        let okMsg = "Sent Successfully.";
+        try {
+            let closeAction = "close";
+            let data = {
+                summary: msg,
+            };
+            if (heartbeatJSON != null && heartbeatJSON["status"] === UP) {
+                data["action"] = closeAction;
+            }
+            let headers = {
+                "Content-Type": "multipart/form-data",
+            };
+            let config = {
+                headers: headers
+            };
+            await axios.post(`${notification.goAlertBaseURL}/api/v2/generic/incoming?token=${notification.goAlertToken}`, data, config);
+            return okMsg;
+
+        } catch (error) {
+            let msg = (error.response.data) ? error.response.data : "Error without response";
+            throw new Error(msg);
+        }
+    }
+}
+
+module.exports = GoAlert;

server/notification-providers/home-assistant.js

@@ -0,0 +1,38 @@
+const NotificationProvider = require("./notification-provider");
+const axios = require("axios");
+
+const defaultNotificationService = "notify";
+
+class HomeAssistant extends NotificationProvider {
+    name = "HomeAssistant";
+
+    async send(notification, message, monitor = null, heartbeat = null) {
+        const notificationService = notification?.notificationService || defaultNotificationService;
+
+        try {
+            await axios.post(
+                `${notification.homeAssistantUrl}/api/services/notify/${notificationService}`,
+                {
+                    title: "Uptime Kuma",
+                    message,
+                    ...(notificationService !== "persistent_notification" && { data: {
+                        name: monitor?.name,
+                        status: heartbeat?.status,
+                    } }),
+                },
+                {
+                    headers: {
+                        Authorization: `Bearer ${notification.longLivedAccessToken}`,
+                        "Content-Type": "application/json",
+                    },
+                }
+            );
+
+            return "Sent Successfully.";
+        } catch (error) {
+            this.throwGeneralAxiosError(error);
+        }
+    }
+}
+
+module.exports = HomeAssistant;

server/notification-providers/linenotify.js

@@ -0,0 +1,43 @@
+const NotificationProvider = require("./notification-provider");
+const axios = require("axios");
+const qs = require("qs");
+const { DOWN, UP } = require("../../src/util");
+
+class LineNotify extends NotificationProvider {
+
+    name = "LineNotify";
+
+    async send(notification, msg, monitorJSON = null, heartbeatJSON = null) {
+        let okMsg = "Sent Successfully.";
+        try {
+            let lineAPIUrl = "https://notify-api.line.me/api/notify";
+            let config = {
+                headers: {
+                    "Content-Type": "application/x-www-form-urlencoded",
+                    "Authorization": "Bearer " + notification.lineNotifyAccessToken
+                }
+            };
+            if (heartbeatJSON == null) {
+                let testMessage = {
+                    "message": msg,
+                };
+                await axios.post(lineAPIUrl, qs.stringify(testMessage), config);
+            } else if (heartbeatJSON["status"] === DOWN) {
+                let downMessage = {
+                    "message": "\n[🔴 Down]\n" + "Name: " + monitorJSON["name"] + " \n" + heartbeatJSON["msg"] + "\nTime (UTC): " + heartbeatJSON["time"]
+                };
+                await axios.post(lineAPIUrl, qs.stringify(downMessage), config);
+            } else if (heartbeatJSON["status"] === UP) {
+                let upMessage = {
+                    "message": "\n[✅ Up]\n" + "Name: " + monitorJSON["name"] + " \n" + heartbeatJSON["msg"] + "\nTime (UTC): " + heartbeatJSON["time"]
+                };
+                await axios.post(lineAPIUrl, qs.stringify(upMessage), config);
+            }
+            return okMsg;
+        } catch (error) {
+            this.throwGeneralAxiosError(error);
+        }
+    }
+}
+
+module.exports = LineNotify;

server/notification-providers/lunasea.js

@@ -14,7 +14,7 @@ class LunaSea extends NotificationProvider {
             if (heartbeatJSON == null) {
                 let testdata = {
                     "title": "Uptime Kuma Alert",
-                    "body": "Testing Successful.",
+                    "body": msg,
                 };
                 await axios.post(lunaseadevice, testdata);
                 return okMsg;

server/notification-providers/ntfy.js

@@ -8,12 +8,19 @@ class Ntfy extends NotificationProvider {
     async send(notification, msg, monitorJSON = null, heartbeatJSON = null) {
         let okMsg = "Sent Successfully.";
         try {
-            await axios.post(`${notification.ntfyserverurl}`, {
+            let headers = {};
+            if (notification.ntfyusername.length > 0) {
+                headers = {
+                    "Authorization": "Basic " + Buffer.from(notification.ntfyusername + ":" + notification.ntfypassword).toString("base64"),
+                };
+            }
+            let data = {
                 "topic": notification.ntfytopic,
                 "message": msg,
                 "priority": notification.ntfyPriority || 4,
                 "title": "Uptime-Kuma",
-            });
+            };
+            await axios.post(`${notification.ntfyserverurl}`, data, { headers: headers });
 
             return okMsg;
 

server/notification-providers/octopush.js

@@ -10,7 +10,7 @@ class Octopush extends NotificationProvider {
 
         try {
         // Default - V2
-            if (notification.octopushVersion === 2 || !notification.octopushVersion) {
+            if (notification.octopushVersion === "2" || !notification.octopushVersion) {
                 let config = {
                     headers: {
                         "api-key": notification.octopushAPIKey,
@@ -31,7 +31,7 @@ class Octopush extends NotificationProvider {
                     "sender": notification.octopushSenderName
                 };
                 await axios.post("https://api.octopush.com/v1/public/sms-campaign/send", data, config);
-            } else if (notification.octopushVersion === 1) {
+            } else if (notification.octopushVersion === "1") {
                 let data = {
                     "user_login": notification.octopushDMLogin,
                     "api_key": notification.octopushDMAPIKey,
@@ -49,7 +49,15 @@ class Octopush extends NotificationProvider {
                     },
                     params: data
                 };
-                await axios.post("https://www.octopush-dm.com/api/sms/json", {}, config);
+
+                // V1 API returns 200 even on error so we must check
+                // response data
+                let response = await axios.post("https://www.octopush-dm.com/api/sms/json", {}, config);
+                if ("error_code" in response.data) {
+                    if (response.data.error_code !== "000") {
+                        this.throwGeneralAxiosError(`Octopush error ${JSON.stringify(response.data)}`);
+                    }
+                }
             } else {
                 throw new Error("Unknown Octopush version!");
             }

server/notification-providers/serverchan.js

@@ -0,0 +1,36 @@
+const NotificationProvider = require("./notification-provider");
+const axios = require("axios");
+const { DOWN, UP } = require("../../src/util");
+
+class ServerChan extends NotificationProvider {
+
+    name = "ServerChan";
+
+    async send(notification, msg, monitorJSON = null, heartbeatJSON = null) {
+        let okMsg = "Sent Successfully.";
+        try {
+            await axios.post(`https://sctapi.ftqq.com/${notification.serverChanSendKey}.send`, {
+                "title": this.checkStatus(heartbeatJSON, monitorJSON),
+                "desp": msg,
+            });
+
+            return okMsg;
+
+        } catch (error) {
+            this.throwGeneralAxiosError(error);
+        }
+    }
+
+    checkStatus(heartbeatJSON, monitorJSON) {
+        let title = "UptimeKuma Message";
+        if (heartbeatJSON != null && heartbeatJSON["status"] === UP) {
+            title = "UptimeKuma Monitor Up " + monitorJSON["name"];
+        }
+        if (heartbeatJSON != null && heartbeatJSON["status"] === DOWN) {
+            title = "UptimeKuma Monitor Down " + monitorJSON["name"];
+        }
+        return title;
+    }
+}
+
+module.exports = ServerChan;

server/notification-providers/smsmanager.js

@@ -0,0 +1,25 @@
+const NotificationProvider = require("./notification-provider");
+const axios = require("axios");
+
+class SMSManager extends NotificationProvider {
+
+    name = "SMSManager";
+
+    async send(notification, msg, monitorJSON = null, heartbeatJSON = null) {
+        try {
+            let data = {
+                apikey: notification.smsmanagerApiKey,
+                endpoint: "https://http-api.smsmanager.cz/Send",
+                message: msg.replace(/[^\x00-\x7F]/g, ""),
+                to: notification.numbers,
+                messageType: notification.messageType,
+            };
+            await axios.get(`${data.endpoint}?apikey=${data.apikey}&message=${data.message}&number=${data.to}&gateway=${data.messageType}`);
+            return "SMS sent sucessfully.";
+        } catch (error) {
+            this.throwGeneralAxiosError(error);
+        }
+    }
+}
+
+module.exports = SMSManager;

server/notification-providers/squadcast.js

@@ -0,0 +1,76 @@
+const NotificationProvider = require("./notification-provider");
+const axios = require("axios");
+const { DOWN } = require("../../src/util");
+
+class Squadcast extends NotificationProvider {
+
+    name = "squadcast";
+
+    async send(notification, msg, monitorJSON = null, heartbeatJSON = null) {
+        let okMsg = "Sent Successfully.";
+
+        try {
+
+            let config = {};
+            let data = {
+                message: msg,
+                description: "",
+                tags: {},
+                heartbeat: heartbeatJSON,
+                source: "uptime-kuma"
+            };
+
+            if (heartbeatJSON !== null) {
+                data.description = heartbeatJSON["msg"];
+                data.event_id = heartbeatJSON["monitorID"];
+
+                if (heartbeatJSON["status"] === DOWN) {
+                    data.message = `${monitorJSON["name"]} is DOWN`;
+                    data.status = "trigger";
+                } else {
+                    data.message = `${monitorJSON["name"]} is UP`;
+                    data.status = "resolve";
+                }
+
+                let address;
+                switch (monitorJSON["type"]) {
+                    case "ping":
+                        address = monitorJSON["hostname"];
+                        break;
+                    case "port":
+                    case "dns":
+                    case "steam":
+                        address = monitorJSON["hostname"];
+                        if (monitorJSON["port"]) {
+                            address += ":" + monitorJSON["port"];
+                        }
+                        break;
+                    default:
+                        address = monitorJSON["url"];
+                        break;
+                }
+
+                data.tags["AlertAddress"] = address;
+
+                monitorJSON["tags"].forEach(tag => {
+                    data.tags[tag["name"]] = {
+                        value: tag["value"]
+                    };
+                    if (tag["color"] !== null) {
+                        data.tags[tag["name"]]["color"] = tag["color"];
+                    }
+                });
+            }
+
+            await axios.post(notification.squadcastWebhookURL, data, config);
+            return okMsg;
+
+        } catch (error) {
+            this.throwGeneralAxiosError(error);
+        }
+
+    }
+
+}
+
+module.exports = Squadcast;

server/notification-providers/teams.js

@@ -63,7 +63,7 @@ class Teams extends NotificationProvider {
             });
         }
 
-        if (monitorUrl) {
+        if (monitorUrl && monitorUrl !== "https://") {
             facts.push({
                 name: "URL",
                 value: monitorUrl,
@@ -127,13 +127,17 @@ class Teams extends NotificationProvider {
 
             let url;
 
-            if (monitorJSON["type"] === "port") {
-                url = monitorJSON["hostname"];
-                if (monitorJSON["port"]) {
-                    url += ":" + monitorJSON["port"];
-                }
-            } else {
-                url = monitorJSON["url"];
+            switch (monitorJSON["type"]) {
+                case "http":
+                case "keywork":
+                    url = monitorJSON["url"];
+                    break;
+                case "docker":
+                    url = monitorJSON["docker_host"];
+                    break;
+                default:
+                    url = monitorJSON["hostname"];
+                    break;
             }
 
             const payload = this._notificationPayloadFactory({

server/notification.js

@@ -1,40 +1,47 @@
 const { R } = require("redbean-node");
+const { log } = require("../src/util");
+const Alerta = require("./notification-providers/alerta");
+const AlertNow = require("./notification-providers/alertnow");
+const AliyunSms = require("./notification-providers/aliyun-sms");
 const Apprise = require("./notification-providers/apprise");
-const Discord = require("./notification-providers/discord");
-const Gotify = require("./notification-providers/gotify");
-const Ntfy = require("./notification-providers/ntfy");
-const Line = require("./notification-providers/line");
-const LunaSea = require("./notification-providers/lunasea");
-const Mattermost = require("./notification-providers/mattermost");
-const Matrix = require("./notification-providers/matrix");
-const Octopush = require("./notification-providers/octopush");
-const PromoSMS = require("./notification-providers/promosms");
+const Bark = require("./notification-providers/bark");
 const ClickSendSMS = require("./notification-providers/clicksendsms");
+const DingDing = require("./notification-providers/dingding");
+const Discord = require("./notification-providers/discord");
+const Feishu = require("./notification-providers/feishu");
+const GoogleChat = require("./notification-providers/google-chat");
+const Gorush = require("./notification-providers/gorush");
+const Gotify = require("./notification-providers/gotify");
+const HomeAssistant = require("./notification-providers/home-assistant");
+const Line = require("./notification-providers/line");
+const LineNotify = require("./notification-providers/linenotify");
+const LunaSea = require("./notification-providers/lunasea");
+const Matrix = require("./notification-providers/matrix");
+const Mattermost = require("./notification-providers/mattermost");
+const Ntfy = require("./notification-providers/ntfy");
+const Octopush = require("./notification-providers/octopush");
+const OneBot = require("./notification-providers/onebot");
+const PagerDuty = require("./notification-providers/pagerduty");
+const PromoSMS = require("./notification-providers/promosms");
 const Pushbullet = require("./notification-providers/pushbullet");
+const PushDeer = require("./notification-providers/pushdeer");
 const Pushover = require("./notification-providers/pushover");
 const Pushy = require("./notification-providers/pushy");
-const TechulusPush = require("./notification-providers/techulus-push");
 const RocketChat = require("./notification-providers/rocket-chat");
+const SerwerSMS = require("./notification-providers/serwersms");
 const Signal = require("./notification-providers/signal");
 const Slack = require("./notification-providers/slack");
 const SMTP = require("./notification-providers/smtp");
+const Squadcast = require("./notification-providers/squadcast");
+const Stackfield = require("./notification-providers/stackfield");
 const Teams = require("./notification-providers/teams");
+const TechulusPush = require("./notification-providers/techulus-push");
 const Telegram = require("./notification-providers/telegram");
 const Webhook = require("./notification-providers/webhook");
-const Feishu = require("./notification-providers/feishu");
-const AliyunSms = require("./notification-providers/aliyun-sms");
-const DingDing = require("./notification-providers/dingding");
-const Bark = require("./notification-providers/bark");
-const { log } = require("../src/util");
-const SerwerSMS = require("./notification-providers/serwersms");
-const Stackfield = require("./notification-providers/stackfield");
 const WeCom = require("./notification-providers/wecom");
-const GoogleChat = require("./notification-providers/google-chat");
-const PagerDuty = require("./notification-providers/pagerduty");
-const Gorush = require("./notification-providers/gorush");
-const Alerta = require("./notification-providers/alerta");
-const OneBot = require("./notification-providers/onebot");
-const PushDeer = require("./notification-providers/pushdeer");
+const GoAlert = require("./notification-providers/goalert");
+const SMSManager = require("./notification-providers/smsmanager");
+const ServerChan = require("./notification-providers/serverchan");
 
 class Notification {
 
@@ -47,41 +54,48 @@ class Notification {
         this.providerList = {};
 
         const list = [
-            new Apprise(),
+            new Alerta(),
+            new AlertNow(),
             new AliyunSms(),
+            new Apprise(),
+            new Bark(),
+            new ClickSendSMS(),
             new DingDing(),
             new Discord(),
-            new Teams(),
-            new Gotify(),
-            new Ntfy(),
-            new Line(),
-            new LunaSea(),
             new Feishu(),
-            new Mattermost(),
+            new GoogleChat(),
+            new Gorush(),
+            new Gotify(),
+            new HomeAssistant(),
+            new Line(),
+            new LineNotify(),
+            new LunaSea(),
             new Matrix(),
+            new Mattermost(),
+            new Ntfy(),
             new Octopush(),
+            new OneBot(),
+            new PagerDuty(),
             new PromoSMS(),
-            new ClickSendSMS(),
             new Pushbullet(),
+            new PushDeer(),
             new Pushover(),
             new Pushy(),
-            new TechulusPush(),
             new RocketChat(),
+            new ServerChan(),
+            new SerwerSMS(),
             new Signal(),
+            new SMSManager(),
             new Slack(),
             new SMTP(),
+            new Squadcast(),
+            new Stackfield(),
+            new Teams(),
+            new TechulusPush(),
             new Telegram(),
             new Webhook(),
-            new Bark(),
-            new SerwerSMS(),
-            new Stackfield(),
             new WeCom(),
-            new GoogleChat(),
-            new PagerDuty(),
-            new Gorush(),
-            new Alerta(),
-            new OneBot(),
-            new PushDeer(),
+            new GoAlert(),
         ];
 
         for (let item of list) {

server/routers/api-router.js

@@ -136,6 +136,7 @@ router.get("/api/badge/:id/status", cache("5 minutes"), async (request, response
             const heartbeat = await Monitor.getPreviousHeartbeat(requestedMonitorId);
             const state = overrideValue !== undefined ? overrideValue : heartbeat.status === 1;
 
+            badgeValues.label = label ? label : "";
             badgeValues.color = state ? upColor : downColor;
             badgeValues.message = label ?? state ? upLabel : downLabel;
         }

server/routers/status-page-router.js

@@ -107,4 +107,42 @@ router.get("/api/status-page/heartbeat/:slug", cache("1 minutes"), async (reques
     }
 });
 
+// Status page's manifest.json
+router.get("/api/status-page/:slug/manifest.json", cache("1440 minutes"), async (request, response) => {
+    allowDevAllOrigin(response);
+    let slug = request.params.slug;
+
+    try {
+        // Get Status Page
+        let statusPage = await R.findOne("status_page", " slug = ? ", [
+            slug
+        ]);
+
+        if (!statusPage) {
+            response.statusCode = 404;
+            response.json({
+                msg: "Not Found"
+            });
+            return;
+        }
+
+        // Response
+        response.json({
+            "name": statusPage.title,
+            "start_url": "/status/" + statusPage.slug,
+            "display": "standalone",
+            "icons": [
+                {
+                    "src": statusPage.icon,
+                    "sizes": "128x128",
+                    "type": "image/png"
+                }
+            ]
+        });
+
+    } catch (error) {
+        send403(response, error.message);
+    }
+});
+
 module.exports = router;

server/server.js

@@ -61,7 +61,7 @@ log.info("server", "Importing this project modules");
 log.debug("server", "Importing Monitor");
 const Monitor = require("./model/monitor");
 log.debug("server", "Importing Settings");
-const { getSettings, setSettings, setting, initJWTSecret, checkLogin, startUnitTest, FBSD, doubleCheckPassword } = require("./util-server");
+const { getSettings, setSettings, setting, initJWTSecret, checkLogin, startUnitTest, FBSD, doubleCheckPassword, startE2eTests } = require("./util-server");
 
 log.debug("server", "Importing Notification");
 const { Notification } = require("./notification");
@@ -112,19 +112,21 @@ const twoFAVerifyOptions = {
  * @type {boolean}
  */
 const testMode = !!args["test"] || false;
+const e2eTestMode = !!args["e2e"] || false;
 
 if (config.demoMode) {
     log.info("server", "==== Demo Mode ====");
 }
 
 // Must be after io instantiation
-const { sendNotificationList, sendHeartbeatList, sendImportantHeartbeatList, sendInfo, sendProxyList } = require("./client");
+const { sendNotificationList, sendHeartbeatList, sendImportantHeartbeatList, sendInfo, sendProxyList, sendDockerHostList } = require("./client");
 const { statusPageSocketHandler } = require("./socket-handlers/status-page-socket-handler");
 const databaseSocketHandler = require("./socket-handlers/database-socket-handler");
 const TwoFA = require("./2fa");
 const StatusPage = require("./model/status_page");
 const { cloudflaredSocketHandler, autoStart: cloudflaredAutoStart, stop: cloudflaredStop } = require("./socket-handlers/cloudflared-socket-handler");
 const { proxySocketHandler } = require("./socket-handlers/proxy-socket-handler");
+const { dockerSocketHandler } = require("./socket-handlers/docker-socket-handler");
 
 app.use(express.json());
 
@@ -164,12 +166,20 @@ let needSetup = false;
 
     // Entry Page
     app.get("/", async (request, response) => {
-        log.debug("entry", `Request Domain: ${request.hostname}`);
+        let hostname = request.hostname;
+        if (await setting("trustProxy")) {
+            const proxy = request.headers["x-forwarded-host"];
+            if (proxy) {
+                hostname = proxy;
+            }
+        }
 
-        if (request.hostname in StatusPage.domainMappingList) {
+        log.debug("entry", `Request Domain: ${hostname}`);
+
+        if (hostname in StatusPage.domainMappingList) {
             log.debug("entry", "This is a status page domain");
 
-            let slug = StatusPage.domainMappingList[request.hostname];
+            let slug = StatusPage.domainMappingList[hostname];
             await StatusPage.handleStatusPageResponse(response, server.indexHTML, slug);
 
         } else if (exports.entryPage && exports.entryPage.startsWith("statusPage-")) {
@@ -246,7 +256,9 @@ let needSetup = false;
         // ***************************
 
         socket.on("loginByToken", async (token, callback) => {
-            log.info("auth", `Login by token. IP=${getClientIp(socket)}`);
+            const clientIP = await server.getClientIP(socket);
+
+            log.info("auth", `Login by token. IP=${clientIP}`);
 
             try {
                 let decoded = jwt.verify(token, jwtSecret);
@@ -262,14 +274,14 @@ let needSetup = false;
                     afterLogin(socket, user);
                     log.debug("auth", "afterLogin ok");
 
-                    log.info("auth", `Successfully logged in user ${decoded.username}. IP=${getClientIp(socket)}`);
+                    log.info("auth", `Successfully logged in user ${decoded.username}. IP=${clientIP}`);
 
                     callback({
                         ok: true,
                     });
                 } else {
 
-                    log.info("auth", `Inactive or deleted user ${decoded.username}. IP=${getClientIp(socket)}`);
+                    log.info("auth", `Inactive or deleted user ${decoded.username}. IP=${clientIP}`);
 
                     callback({
                         ok: false,
@@ -278,7 +290,7 @@ let needSetup = false;
                 }
             } catch (error) {
 
-                log.error("auth", `Invalid token. IP=${getClientIp(socket)}`);
+                log.error("auth", `Invalid token. IP=${clientIP}`);
 
                 callback({
                     ok: false,
@@ -289,7 +301,9 @@ let needSetup = false;
         });
 
         socket.on("login", async (data, callback) => {
-            log.info("auth", `Login by username + password. IP=${getClientIp(socket)}`);
+            const clientIP = await server.getClientIP(socket);
+
+            log.info("auth", `Login by username + password. IP=${clientIP}`);
 
             // Checking
             if (typeof callback !== "function") {
@@ -302,7 +316,7 @@ let needSetup = false;
 
             // Login Rate Limit
             if (! await loginRateLimiter.pass(callback)) {
-                log.info("auth", `Too many failed requests for user ${data.username}. IP=${getClientIp(socket)}`);
+                log.info("auth", `Too many failed requests for user ${data.username}. IP=${clientIP}`);
                 return;
             }
 
@@ -312,7 +326,7 @@ let needSetup = false;
                 if (user.twofa_status === 0) {
                     afterLogin(socket, user);
 
-                    log.info("auth", `Successfully logged in user ${data.username}. IP=${getClientIp(socket)}`);
+                    log.info("auth", `Successfully logged in user ${data.username}. IP=${clientIP}`);
 
                     callback({
                         ok: true,
@@ -324,7 +338,7 @@ let needSetup = false;
 
                 if (user.twofa_status === 1 && !data.token) {
 
-                    log.info("auth", `2FA token required for user ${data.username}. IP=${getClientIp(socket)}`);
+                    log.info("auth", `2FA token required for user ${data.username}. IP=${clientIP}`);
 
                     callback({
                         tokenRequired: true,
@@ -342,7 +356,7 @@ let needSetup = false;
                             socket.userID,
                         ]);
 
-                        log.info("auth", `Successfully logged in user ${data.username}. IP=${getClientIp(socket)}`);
+                        log.info("auth", `Successfully logged in user ${data.username}. IP=${clientIP}`);
 
                         callback({
                             ok: true,
@@ -352,7 +366,7 @@ let needSetup = false;
                         });
                     } else {
 
-                        log.warn("auth", `Invalid token provided for user ${data.username}. IP=${getClientIp(socket)}`);
+                        log.warn("auth", `Invalid token provided for user ${data.username}. IP=${clientIP}`);
 
                         callback({
                             ok: false,
@@ -362,7 +376,7 @@ let needSetup = false;
                 }
             } else {
 
-                log.warn("auth", `Incorrect username or password for user ${data.username}. IP=${getClientIp(socket)}`);
+                log.warn("auth", `Incorrect username or password for user ${data.username}. IP=${clientIP}`);
 
                 callback({
                     ok: false,
@@ -434,6 +448,8 @@ let needSetup = false;
         });
 
         socket.on("save2FA", async (currentPassword, callback) => {
+            const clientIP = await server.getClientIP(socket);
+
             try {
                 if (! await twoFaRateLimiter.pass(callback)) {
                     return;
@@ -446,7 +462,7 @@ let needSetup = false;
                     socket.userID,
                 ]);
 
-                log.info("auth", `Saved 2FA token. IP=${getClientIp(socket)}`);
+                log.info("auth", `Saved 2FA token. IP=${clientIP}`);
 
                 callback({
                     ok: true,
@@ -454,7 +470,7 @@ let needSetup = false;
                 });
             } catch (error) {
 
-                log.error("auth", `Error changing 2FA token. IP=${getClientIp(socket)}`);
+                log.error("auth", `Error changing 2FA token. IP=${clientIP}`);
 
                 callback({
                     ok: false,
@@ -464,6 +480,8 @@ let needSetup = false;
         });
 
         socket.on("disable2FA", async (currentPassword, callback) => {
+            const clientIP = await server.getClientIP(socket);
+
             try {
                 if (! await twoFaRateLimiter.pass(callback)) {
                     return;
@@ -473,7 +491,7 @@ let needSetup = false;
                 await doubleCheckPassword(socket, currentPassword);
                 await TwoFA.disable2FA(socket.userID);
 
-                log.info("auth", `Disabled 2FA token. IP=${getClientIp(socket)}`);
+                log.info("auth", `Disabled 2FA token. IP=${clientIP}`);
 
                 callback({
                     ok: true,
@@ -481,7 +499,7 @@ let needSetup = false;
                 });
             } catch (error) {
 
-                log.error("auth", `Error disabling 2FA token. IP=${getClientIp(socket)}`);
+                log.error("auth", `Error disabling 2FA token. IP=${clientIP}`);
 
                 callback({
                     ok: false,
@@ -652,9 +670,10 @@ let needSetup = false;
                 bean.basic_auth_pass = monitor.basic_auth_pass;
                 bean.interval = monitor.interval;
                 bean.retryInterval = monitor.retryInterval;
+                bean.resendInterval = monitor.resendInterval;
                 bean.hostname = monitor.hostname;
                 bean.maxretries = monitor.maxretries;
-                bean.port = monitor.port;
+                bean.port = parseInt(monitor.port);
                 bean.keyword = monitor.keyword;
                 bean.ignoreTls = monitor.ignoreTls;
                 bean.expiryNotification = monitor.expiryNotification;
@@ -664,6 +683,8 @@ let needSetup = false;
                 bean.dns_resolve_type = monitor.dns_resolve_type;
                 bean.dns_resolve_server = monitor.dns_resolve_server;
                 bean.pushToken = monitor.pushToken;
+                bean.docker_container = monitor.docker_container;
+                bean.docker_host = monitor.docker_host;
                 bean.proxyId = Number.isInteger(monitor.proxyId) ? monitor.proxyId : null;
                 bean.mqttUsername = monitor.mqttUsername;
                 bean.mqttPassword = monitor.mqttPassword;
@@ -674,6 +695,11 @@ let needSetup = false;
                 bean.authMethod = monitor.authMethod;
                 bean.authWorkstation = monitor.authWorkstation;
                 bean.authDomain = monitor.authDomain;
+                bean.radiusUsername = monitor.radiusUsername;
+                bean.radiusPassword = monitor.radiusPassword;
+                bean.radiusCalledStationId = monitor.radiusCalledStationId;
+                bean.radiusCallingStationId = monitor.radiusCallingStationId;
+                bean.radiusSecret = monitor.radiusSecret;
 
                 await R.store(bean);
 
@@ -1254,6 +1280,7 @@ let needSetup = false;
                                 authDomain: monitorListData[i].authDomain,
                                 interval: monitorListData[i].interval,
                                 retryInterval: retryInterval,
+                                resendInterval: monitorListData[i].resendInterval || 0,
                                 hostname: monitorListData[i].hostname,
                                 maxretries: monitorListData[i].maxretries,
                                 port: monitorListData[i].port,
@@ -1422,6 +1449,7 @@ let needSetup = false;
         cloudflaredSocketHandler(socket);
         databaseSocketHandler(socket);
         proxySocketHandler(socket);
+        dockerSocketHandler(socket);
 
         log.debug("server", "added all socket handlers");
 
@@ -1459,6 +1487,10 @@ let needSetup = false;
         if (testMode) {
             startUnitTest();
         }
+
+        if (e2eTestMode) {
+            startE2eTests();
+        }
     });
 
     initBackgroundJobs(args);
@@ -1522,6 +1554,7 @@ async function afterLogin(socket, user) {
     let monitorList = await server.sendMonitorList(socket);
     sendNotificationList(socket);
     sendProxyList(socket);
+    sendDockerHostList(socket);
 
     await sleep(500);
 
@@ -1676,10 +1709,6 @@ async function shutdownFunction(signal) {
     await cloudflaredStop();
 }
 
-function getClientIp(socket) {
-    return socket.client.conn.remoteAddress.replace(/^.*:/, "");
-}
-
 /** Final function called before application exits */
 function finalFunction() {
     log.info("server", "Graceful shutdown successful!");

server/settings.js

@@ -0,0 +1,165 @@
+const { R } = require("redbean-node");
+const { log } = require("../src/util");
+
+class Settings {
+
+    /**
+     *  Example:
+     *      {
+     *         key1: {
+     *             value: "value2",
+     *             timestamp: 12345678
+     *         },
+     *         key2: {
+     *             value: 2,
+     *             timestamp: 12345678
+     *         },
+     *     }
+     * @type {{}}
+     */
+    static cacheList = {
+
+    };
+
+    static cacheCleaner = null;
+
+    /**
+     * Retrieve value of setting based on key
+     * @param {string} key Key of setting to retrieve
+     * @returns {Promise<any>} Value
+     */
+    static async get(key) {
+
+        // Start cache clear if not started yet
+        if (!Settings.cacheCleaner) {
+            Settings.cacheCleaner = setInterval(() => {
+                log.debug("settings", "Cache Cleaner is just started.");
+                for (key in Settings.cacheList) {
+                    if (Date.now() - Settings.cacheList[key].timestamp > 60 * 1000) {
+                        log.debug("settings", "Cache Cleaner deleted: " + key);
+                        delete Settings.cacheList[key];
+                    }
+                }
+
+            }, 60 * 1000);
+        }
+
+        // Query from cache
+        if (key in Settings.cacheList) {
+            const v = Settings.cacheList[key].value;
+            log.debug("settings", `Get Setting (cache): ${key}: ${v}`);
+            return v;
+        }
+
+        let value = await R.getCell("SELECT `value` FROM setting WHERE `key` = ? ", [
+            key,
+        ]);
+
+        try {
+            const v = JSON.parse(value);
+            log.debug("settings", `Get Setting: ${key}: ${v}`);
+
+            Settings.cacheList[key] = {
+                value: v,
+                timestamp: Date.now()
+            };
+
+            return v;
+        } catch (e) {
+            return value;
+        }
+    }
+
+    /**
+     * Sets the specified setting to specified value
+     * @param {string} key Key of setting to set
+     * @param {any} value Value to set to
+     * @param {?string} type Type of setting
+     * @returns {Promise<void>}
+     */
+    static async set(key, value, type = null) {
+
+        let bean = await R.findOne("setting", " `key` = ? ", [
+            key,
+        ]);
+        if (!bean) {
+            bean = R.dispense("setting");
+            bean.key = key;
+        }
+        bean.type = type;
+        bean.value = JSON.stringify(value);
+        await R.store(bean);
+
+        Settings.deleteCache([ key ]);
+    }
+
+    /**
+     * Get settings based on type
+     * @param {string} type The type of setting
+     * @returns {Promise<Bean>}
+     */
+    static async getSettings(type) {
+        let list = await R.getAll("SELECT `key`, `value` FROM setting WHERE `type` = ? ", [
+            type,
+        ]);
+
+        let result = {};
+
+        for (let row of list) {
+            try {
+                result[row.key] = JSON.parse(row.value);
+            } catch (e) {
+                result[row.key] = row.value;
+            }
+        }
+
+        return result;
+    }
+
+    /**
+     * Set settings based on type
+     * @param {string} type Type of settings to set
+     * @param {Object} data Values of settings
+     * @returns {Promise<void>}
+     */
+    static async setSettings(type, data) {
+        let keyList = Object.keys(data);
+
+        let promiseList = [];
+
+        for (let key of keyList) {
+            let bean = await R.findOne("setting", " `key` = ? ", [
+                key
+            ]);
+
+            if (bean == null) {
+                bean = R.dispense("setting");
+                bean.type = type;
+                bean.key = key;
+            }
+
+            if (bean.type === type) {
+                bean.value = JSON.stringify(data[key]);
+                promiseList.push(R.store(bean));
+            }
+        }
+
+        await Promise.all(promiseList);
+
+        Settings.deleteCache(keyList);
+    }
+
+    /**
+     *
+     * @param {string[]} keyList
+     */
+    static deleteCache(keyList) {
+        for (let key of keyList) {
+            delete Settings.cacheList[key];
+        }
+    }
+}
+
+module.exports = {
+    Settings,
+};

server/socket-handlers/cloudflared-socket-handler.js

@@ -63,7 +63,10 @@ module.exports.cloudflaredSocketHandler = (socket) => {
     socket.on(prefix + "stop", async (currentPassword, callback) => {
         try {
             checkLogin(socket);
-            await doubleCheckPassword(socket, currentPassword);
+            const disabledAuth = await setting("disableAuth");
+            if (!disabledAuth) {
+                await doubleCheckPassword(socket, currentPassword);
+            }
             cloudflared.stop();
         } catch (error) {
             callback({

server/socket-handlers/docker-socket-handler.js

@@ -0,0 +1,79 @@
+const { sendDockerHostList } = require("../client");
+const { checkLogin } = require("../util-server");
+const { DockerHost } = require("../docker");
+const { log } = require("../../src/util");
+
+/**
+ * Handlers for docker hosts
+ * @param {Socket} socket Socket.io instance
+ */
+module.exports.dockerSocketHandler = (socket) => {
+    socket.on("addDockerHost", async (dockerHost, dockerHostID, callback) => {
+        try {
+            checkLogin(socket);
+
+            let dockerHostBean = await DockerHost.save(dockerHost, dockerHostID, socket.userID);
+            await sendDockerHostList(socket);
+
+            callback({
+                ok: true,
+                msg: "Saved",
+                id: dockerHostBean.id,
+            });
+
+        } catch (e) {
+            callback({
+                ok: false,
+                msg: e.message,
+            });
+        }
+    });
+
+    socket.on("deleteDockerHost", async (dockerHostID, callback) => {
+        try {
+            checkLogin(socket);
+
+            await DockerHost.delete(dockerHostID, socket.userID);
+            await sendDockerHostList(socket);
+
+            callback({
+                ok: true,
+                msg: "Deleted",
+            });
+
+        } catch (e) {
+            callback({
+                ok: false,
+                msg: e.message,
+            });
+        }
+    });
+
+    socket.on("testDockerHost", async (dockerHost, callback) => {
+        try {
+            checkLogin(socket);
+
+            let amount = await DockerHost.testDockerHost(dockerHost);
+            let msg;
+
+            if (amount > 1) {
+                msg = "Connected Successfully. Amount of containers: " + amount;
+            } else {
+                msg = "Connected Successfully, but there are no containers?";
+            }
+
+            callback({
+                ok: true,
+                msg,
+            });
+
+        } catch (e) {
+            log.error("docker", e);
+
+            callback({
+                ok: false,
+                msg: e.message,
+            });
+        }
+    });
+};

server/socket-handlers/status-page-socket-handler.js

@@ -202,6 +202,11 @@ module.exports.statusPageSocketHandler = (socket) => {
                     relationBean.weight = monitorOrder++;
                     relationBean.group_id = groupBean.id;
                     relationBean.monitor_id = monitor.id;
+
+                    if (monitor.sendUrl !== undefined) {
+                        relationBean.send_url = monitor.sendUrl;
+                    }
+
                     await R.store(relationBean);
                 }
 

server/uptime-kuma-server.js

@@ -7,6 +7,8 @@ const { R } = require("redbean-node");
 const { log } = require("../src/util");
 const Database = require("./database");
 const util = require("util");
+const { CacheableDnsHttpAgent } = require("./cacheable-dns-http-agent");
+const { Settings } = require("./settings");
 
 /**
  * `module.exports` (alias: `server`) should be inside this class, in order to avoid circular dependency issue.
@@ -49,7 +51,6 @@ class UptimeKumaServer {
 
         log.info("server", "Creating express and socket.io instance");
         this.app = express();
-
         if (sslKey && sslCert) {
             log.info("server", "Server Type: HTTPS");
             this.httpServer = https.createServer({
@@ -71,6 +72,8 @@ class UptimeKumaServer {
             }
         }
 
+        CacheableDnsHttpAgent.registerGlobalAgent();
+
         this.io = new Server(this.httpServer);
     }
 
@@ -126,6 +129,22 @@ class UptimeKumaServer {
 
         errorLogStream.end();
     }
+
+    async getClientIP(socket) {
+        let clientIP = socket.client.conn.remoteAddress;
+
+        if (clientIP === undefined) {
+            clientIP = "";
+        }
+
+        if (await Settings.get("trustProxy")) {
+            return socket.client.conn.request.headers["x-forwarded-for"]
+                || socket.client.conn.request.headers["x-real-ip"]
+                || clientIP.replace(/^.*:/, "");
+        } else {
+            return clientIP.replace(/^.*:/, "");
+        }
+    }
 }
 
 module.exports = {

server/util-server.js

@@ -11,7 +11,16 @@ const mqtt = require("mqtt");
 const chroma = require("chroma-js");
 const { badgeConstants } = require("./config");
 const mssql = require("mssql");
+const { Client } = require("pg");
+const postgresConParse = require("pg-connection-string").parse;
 const { NtlmClient } = require("axios-ntlm");
+const { Settings } = require("./settings");
+const radiusClient = require("node-radius-client");
+const {
+    dictionaries: {
+        rfc2865: { file, attributes },
+    },
+} = require("node-radius-utils");
 
 // From ping-lite
 exports.WIN = /^win/.test(process.platform);
@@ -237,10 +246,6 @@ exports.dnsResolve = function (hostname, resolverServer, resolverPort, rrtype) {
  */
 exports.mssqlQuery = function (connectionString, query) {
     return new Promise((resolve, reject) => {
-        mssql.on("error", err => {
-            reject(err);
-        });
-
         mssql.connect(connectionString).then(pool => {
             return pool.request()
                 .query(query);
@@ -254,23 +259,70 @@ exports.mssqlQuery = function (connectionString, query) {
     });
 };
 
+/**
+ * Run a query on Postgres
+ * @param {string} connectionString The database connection string
+ * @param {string} query The query to validate the database with
+ * @returns {Promise<(string[]|Object[]|Object)>}
+ */
+exports.postgresQuery = function (connectionString, query) {
+    return new Promise((resolve, reject) => {
+        const config = postgresConParse(connectionString);
+
+        if (config.password === "") {
+            // See https://github.com/brianc/node-postgres/issues/1927
+            return reject(new Error("Password is undefined."));
+        }
+
+        const client = new Client({ connectionString });
+
+        client.connect();
+
+        return client.query(query)
+            .then(res => {
+                resolve(res);
+            })
+            .catch(err => {
+                reject(err);
+            })
+            .finally(() => {
+                client.end();
+            });
+    });
+};
+
+exports.radius = function (
+    hostname,
+    username,
+    password,
+    calledStationId,
+    callingStationId,
+    secret,
+) {
+    const client = new radiusClient({
+        host: hostname,
+        dictionaries: [ file ],
+    });
+
+    return client.accessRequest({
+        secret: secret,
+        attributes: [
+            [ attributes.USER_NAME, username ],
+            [ attributes.USER_PASSWORD, password ],
+            [ attributes.CALLING_STATION_ID, callingStationId ],
+            [ attributes.CALLED_STATION_ID, calledStationId ],
+        ],
+    });
+};
+
 /**
  * Retrieve value of setting based on key
  * @param {string} key Key of setting to retrieve
  * @returns {Promise<any>} Value
+ * @deprecated Use await Settings.get(key)
  */
 exports.setting = async function (key) {
-    let value = await R.getCell("SELECT `value` FROM setting WHERE `key` = ? ", [
-        key,
-    ]);
-
-    try {
-        const v = JSON.parse(value);
-        log.debug("util", `Get Setting: ${key}: ${v}`);
-        return v;
-    } catch (e) {
-        return value;
-    }
+    return await Settings.get(key);
 };
 
 /**
@@ -281,70 +333,26 @@ exports.setting = async function (key) {
  * @returns {Promise<void>}
  */
 exports.setSetting = async function (key, value, type = null) {
-    let bean = await R.findOne("setting", " `key` = ? ", [
-        key,
-    ]);
-    if (!bean) {
-        bean = R.dispense("setting");
-        bean.key = key;
-    }
-    bean.type = type;
-    bean.value = JSON.stringify(value);
-    await R.store(bean);
+    await Settings.set(key, value, type);
 };
 
 /**
  * Get settings based on type
- * @param {?string} type The type of setting
+ * @param {string} type The type of setting
  * @returns {Promise<Bean>}
  */
 exports.getSettings = async function (type) {
-    let list = await R.getAll("SELECT `key`, `value` FROM setting WHERE `type` = ? ", [
-        type,
-    ]);
-
-    let result = {};
-
-    for (let row of list) {
-        try {
-            result[row.key] = JSON.parse(row.value);
-        } catch (e) {
-            result[row.key] = row.value;
-        }
-    }
-
-    return result;
+    return await Settings.getSettings(type);
 };
 
 /**
  * Set settings based on type
- * @param {?string} type Type of settings to set
+ * @param {string} type Type of settings to set
  * @param {Object} data Values of settings
  * @returns {Promise<void>}
  */
 exports.setSettings = async function (type, data) {
-    let keyList = Object.keys(data);
-
-    let promiseList = [];
-
-    for (let key of keyList) {
-        let bean = await R.findOne("setting", " `key` = ? ", [
-            key
-        ]);
-
-        if (bean == null) {
-            bean = R.dispense("setting");
-            bean.type = type;
-            bean.key = key;
-        }
-
-        if (bean.type === type) {
-            bean.value = JSON.stringify(data[key]);
-            promiseList.push(R.store(bean));
-        }
-    }
-
-    await Promise.all(promiseList);
+    await Settings.setSettings(type, data);
 };
 
 // ssl-checker by @dyaa
@@ -437,7 +445,7 @@ exports.checkCertificate = function (res) {
 
 /**
  * Check if the provided status code is within the accepted ranges
- * @param {string} status The status code to check
+ * @param {number} status The status code to check
  * @param {string[]} acceptedCodes An array of accepted status codes
  * @returns {boolean} True if status code within range, false otherwise
  * @throws {Error} Will throw an error if the provided status code is not a valid range string or code string
@@ -565,6 +573,26 @@ exports.startUnitTest = async () => {
     });
 };
 
+/** Start end-to-end tests */
+exports.startE2eTests = async () => {
+    console.log("Starting unit test...");
+    const npm = /^win/.test(process.platform) ? "npm.cmd" : "npm";
+    const child = childProcess.spawn(npm, [ "run", "cy:run" ]);
+
+    child.stdout.on("data", (data) => {
+        console.log(data.toString());
+    });
+
+    child.stderr.on("data", (data) => {
+        console.log(data.toString());
+    });
+
+    child.on("close", function (code) {
+        console.log("Jest exit code: " + code);
+        process.exit(code);
+    });
+};
+
 /**
  * Convert unknown string to UTF8
  * @param {Uint8Array} body Buffer

src/assets/app.scss

@@ -34,6 +34,25 @@ textarea.form-control {
     }
 }
 
+
+// optgroup
+optgroup {
+    color: #b1b1b1;
+    option {
+        color: #212529;
+    }
+}
+
+.dark {
+    optgroup {
+        color: #535864;
+        option {
+            color: $dark-font-color;
+        }
+    }
+}
+
+// Scrollbar
 ::-webkit-scrollbar-thumb {
     background: #ccc;
     border-radius: 20px;
@@ -364,6 +383,12 @@ textarea.form-control {
         height: calc(100% - 65px);
     }
 
+    @media (max-width: 770px) {
+        &.scrollbar {
+            height: calc(100% - 40px);
+        }
+    }
+
     .item {
         display: block;
         text-decoration: none;
@@ -378,7 +403,6 @@ textarea.form-control {
         .info {
             white-space: nowrap;
             overflow: hidden;
-            text-overflow: ellipsis;
         }
 
         &:hover {
@@ -473,6 +497,14 @@ textarea.form-control {
     outline: none !important;
 }
 
+h5.settings-subheading::after {
+    content: "";
+    display: block;
+    width: 50%;
+    padding-top: 8px;
+    border-bottom: 1px solid $dark-border-color;
+}
+
 // Localization
 
 @import "localization.scss";

src/components/CertificateInfo.vue

@@ -25,10 +25,12 @@ export default {
         CertificateInfoRow,
     },
     props: {
+        /** Object representing certificate */
         certInfo: {
             type: Object,
             required: true,
         },
+        /** Is the TLS certificate valid? */
         valid: {
             type: Boolean,
             required: true,

src/components/CertificateInfoRow.vue

@@ -56,12 +56,19 @@ export default {
         Datetime,
     },
     props: {
+        /** Object representing certificate */
         cert: {
             type: Object,
             required: true,
         },
     },
     methods: {
+        /**
+         * Format the subject of the certificate
+         * @param {Object} subject Object representing the certificates
+         * subject
+         * @returns {string}
+         */
         formatSubject(subject) {
             if (subject.O && subject.CN && subject.C) {
                 return `${subject.CN} - ${subject.O} (${subject.C})`;

src/components/Confirm.vue

@@ -29,14 +29,17 @@ import { Modal } from "bootstrap";
 
 export default {
     props: {
+        /** Style of button */
         btnStyle: {
             type: String,
             default: "btn-primary",
         },
+        /** Text to use as yes */
         yesText: {
             type: String,
             default: "Yes",     // TODO: No idea what to translate this
         },
+        /** Text to use as no */
         noText: {
             type: String,
             default: "No",
@@ -50,9 +53,13 @@ export default {
         this.modal = new Modal(this.$refs.modal);
     },
     methods: {
+        /** Show the confirm dialog */
         show() {
             this.modal.show();
         },
+        /**
+         * @emits string "yes" Notify the parent when Yes is pressed
+         */
         yes() {
             this.$emit("yes");
         },

src/components/CopyableInput.vue

@@ -25,33 +25,41 @@ let timeout;
 
 export default {
     props: {
+        /** ID of this input */
         id: {
             type: String,
             default: ""
         },
+        /** Type of input */
         type: {
             type: String,
             default: "text"
         },
+        /** The value of the input */
         modelValue: {
             type: String,
             default: ""
         },
+        /** A placeholder to use */
         placeholder: {
             type: String,
             default: ""
         },
+        /** Should the field auto complete */
         autocomplete: {
             type: String,
             default: undefined,
         },
+        /** Is the input required? */
         required: {
             type: Boolean
         },
+        /** Should the input be read only? */
         readonly: {
             type: String,
             default: undefined,
         },
+        /** Is the input disabled? */
         disabled: {
             type: String,
             default: undefined,
@@ -79,14 +87,21 @@ export default {
     },
     methods: {
 
+        /** Show the input */
         showInput() {
             this.visibility = "text";
         },
 
+        /** Hide the input */
         hideInput() {
             this.visibility = "password";
         },
 
+        /**
+         * Copy the provided text to the users clipboard
+         * @param {string} textToCopy
+         * @returns {Promise<void>}
+         */
         copyToClipboard(textToCopy) {
             this.icon = "check";
 

src/components/CountUp.vue

@@ -10,6 +10,7 @@ import { sleep } from "../util.ts";
 export default {
 
     props: {
+        /** Value to count */
         value: {
             type: [ String, Number ],
             default: 0,
@@ -18,6 +19,7 @@ export default {
             type: Number,
             default: 0.3,
         },
+        /** Unit of the value */
         unit: {
             type: String,
             default: "ms",
@@ -43,9 +45,7 @@ export default {
             let frames = 12;
             let step = Math.floor(diff / frames);
 
-            if (isNaN(step) || ! this.isNum || (diff > 0 && step < 1) || (diff < 0 && step > 1) || diff === 0) {
-                // Lazy to NOT this condition, hahaha.
-            } else {
+            if (! (isNaN(step) || ! this.isNum || (diff > 0 && step < 1) || (diff < 0 && step > 1) || diff === 0)) {
                 for (let i = 1; i < frames; i++) {
                     this.output += step;
                     await sleep(15);

src/components/Datetime.vue

@@ -13,10 +13,12 @@ dayjs.extend(relativeTime);
 
 export default {
     props: {
+        /** Value of date time */
         value: {
             type: String,
             default: null,
         },
+        /** Should only the date be displayed? */
         dateOnly: {
             type: Boolean,
             default: false,

src/components/DockerHostDialog.vue

@@ -0,0 +1,177 @@
+<template>
+    <form @submit.prevent="submit">
+        <div ref="modal" class="modal fade" tabindex="-1" data-bs-backdrop="static">
+            <div class="modal-dialog">
+                <div class="modal-content">
+                    <div class="modal-header">
+                        <h5 id="exampleModalLabel" class="modal-title">
+                            {{ $t("Setup Docker Host") }}
+                        </h5>
+                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" />
+                    </div>
+                    <div class="modal-body">
+                        <div class="mb-3">
+                            <label for="docker-name" class="form-label">{{ $t("Friendly Name") }}</label>
+                            <input id="docker-name" v-model="dockerHost.name" type="text" class="form-control" required>
+                        </div>
+
+                        <div class="mb-3">
+                            <label for="docker-type" class="form-label">{{ $t("Connection Type") }}</label>
+                            <select id="docker-type" v-model="dockerHost.dockerType" class="form-select">
+                                <option v-for="type in connectionTypes" :key="type" :value="type">{{ $t(type) }}</option>
+                            </select>
+                        </div>
+
+                        <div class="mb-3">
+                            <label for="docker-daemon" class="form-label">{{ $t("Docker Daemon") }}</label>
+                            <input id="docker-daemon" v-model="dockerHost.dockerDaemon" type="text" class="form-control" required>
+
+                            <div class="form-text">
+                                {{ $t("Examples") }}:
+                                <ul>
+                                    <li>/var/run/docker.sock</li>
+                                    <li>tcp://localhost:2375</li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="modal-footer">
+                        <button v-if="id" type="button" class="btn btn-danger" :disabled="processing" @click="deleteConfirm">
+                            {{ $t("Delete") }}
+                        </button>
+                        <button type="button" class="btn btn-warning" :disabled="processing" @click="test">
+                            {{ $t("Test") }}
+                        </button>
+                        <button type="submit" class="btn btn-primary" :disabled="processing">
+                            <div v-if="processing" class="spinner-border spinner-border-sm me-1"></div>
+                            {{ $t("Save") }}
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </form>
+
+    <Confirm ref="confirmDelete" btn-style="btn-danger" :yes-text="$t('Yes')" :no-text="$t('No')" @yes="deleteDockerHost">
+        {{ $t("deleteDockerHostMsg") }}
+    </Confirm>
+</template>
+
+<script lang="ts">
+import { Modal } from "bootstrap";
+import Confirm from "./Confirm.vue";
+import { useToast } from "vue-toastification";
+const toast = useToast();
+
+export default {
+    components: {
+        Confirm,
+    },
+    props: {},
+    emits: [ "added" ],
+    data() {
+        return {
+            model: null,
+            processing: false,
+            id: null,
+            connectionTypes: [ "socket", "tcp" ],
+            dockerHost: {
+                name: "",
+                dockerDaemon: "",
+                dockerType: "",
+                // Do not set default value here, please scroll to show()
+            }
+        };
+    },
+
+    mounted() {
+        this.modal = new Modal(this.$refs.modal);
+    },
+    methods: {
+
+        deleteConfirm() {
+            this.modal.hide();
+            this.$refs.confirmDelete.show();
+        },
+
+        show(dockerHostID) {
+            if (dockerHostID) {
+                let found = false;
+
+                this.id = dockerHostID;
+
+                for (let n of this.$root.dockerHostList) {
+                    if (n.id === dockerHostID) {
+                        this.dockerHost = n;
+                        found = true;
+                        break;
+                    }
+                }
+
+                if (!found) {
+                    toast.error("Docker Host not found!");
+                }
+
+            } else {
+                this.id = null;
+                this.dockerHost = {
+                    name: "",
+                    dockerType: "socket",
+                    dockerDaemon: "/var/run/docker.sock",
+                };
+            }
+
+            this.modal.show();
+        },
+
+        submit() {
+            this.processing = true;
+            this.$root.getSocket().emit("addDockerHost", this.dockerHost, this.id, (res) => {
+                this.$root.toastRes(res);
+                this.processing = false;
+
+                if (res.ok) {
+                    this.modal.hide();
+
+                    // Emit added event, doesn't emit edit.
+                    if (! this.id) {
+                        this.$emit("added", res.id);
+                    }
+
+                }
+            });
+        },
+
+        test() {
+            this.processing = true;
+            this.$root.getSocket().emit("testDockerHost", this.dockerHost, (res) => {
+                this.$root.toastRes(res);
+                this.processing = false;
+            });
+        },
+
+        deleteDockerHost() {
+            this.processing = true;
+            this.$root.getSocket().emit("deleteDockerHost", this.id, (res) => {
+                this.$root.toastRes(res);
+                this.processing = false;
+
+                if (res.ok) {
+                    this.modal.hide();
+                }
+            });
+        },
+    },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "../assets/vars.scss";
+
+.dark {
+    .modal-dialog .form-text, .modal-dialog p {
+        color: $dark-font-color;
+    }
+}
+</style>

src/components/HeartbeatBar.vue

@@ -17,14 +17,17 @@
 
 export default {
     props: {
+        /** Size of the heartbeat bar */
         size: {
             type: String,
             default: "big",
         },
+        /** ID of the monitor */
         monitorId: {
             type: Number,
             required: true,
         },
+        /** Array of the monitors heartbeats */
         heartbeatList: {
             type: Array,
             default: null,
@@ -160,12 +163,19 @@ export default {
         this.resize();
     },
     methods: {
+        /** Resize the heartbeat bar */
         resize() {
             if (this.$refs.wrap) {
                 this.maxBeat = Math.floor(this.$refs.wrap.clientWidth / (this.beatWidth + this.beatMargin * 2));
             }
         },
 
+        /**
+         * Get the title of the beat.
+         * Used as the hover tooltip on the heartbeat bar.
+         * @param {Object} beat Beat to get title from
+         * @returns {string}
+         */
         getBeatTitle(beat) {
             return `${this.$root.datetime(beat.time)}` + ((beat.msg) ? ` - ${beat.msg}` : "");
         },

src/components/HiddenInput.vue

@@ -24,25 +24,31 @@
 <script>
 export default {
     props: {
+        /** The value of the input */
         modelValue: {
             type: String,
             default: ""
         },
+        /** A placeholder to use */
         placeholder: {
             type: String,
             default: ""
         },
+        /** Maximum length of the input */
         maxlength: {
             type: Number,
             default: 255
         },
+        /** Should the field auto complete */
         autocomplete: {
             type: String,
             default: undefined,
         },
+        /** Is the input required? */
         required: {
             type: Boolean
         },
+        /** Should the input be read only? */
         readonly: {
             type: String,
             default: undefined,
@@ -68,9 +74,11 @@ export default {
 
     },
     methods: {
+        /** Show users input in plain text */
         showInput() {
             this.visibility = "text";
         },
+        /** Censor users input */
         hideInput() {
             this.visibility = "password";
         },

src/components/Login.vue

@@ -54,7 +54,17 @@ export default {
             tokenRequired: false,
         };
     },
+
+    mounted() {
+        document.title += " - Login";
+    },
+
+    unmounted() {
+        document.title = document.title.replace(" - Login", "");
+    },
+
     methods: {
+        /** Submit the user details and attempt to log in */
         submit() {
             this.processing = true;
 

src/components/MonitorList.vue

@@ -58,6 +58,7 @@ export default {
         Tag,
     },
     props: {
+        /** Should the scrollbar be shown */
         scrollbar: {
             type: Boolean,
         },
@@ -69,10 +70,22 @@ export default {
         };
     },
     computed: {
+        /**
+         * Improve the sticky appearance of the list by increasing its
+         * height as user scrolls down.
+         * Not used on mobile.
+         */
         boxStyle() {
-            return {
-                height: `calc(100vh - 160px + ${this.windowTop}px)`,
-            };
+            if (window.innerWidth > 550) {
+                return {
+                    height: `calc(100vh - 160px + ${this.windowTop}px)`,
+                };
+            } else {
+                return {
+                    height: "calc(100vh - 160px)",
+                };
+            }
+
         },
 
         sortedMonitorList() {
@@ -124,6 +137,7 @@ export default {
         window.removeEventListener("scroll", this.onScroll);
     },
     methods: {
+        /** Handle user scroll */
         onScroll() {
             if (window.top.scrollY <= 133) {
                 this.windowTop = window.top.scrollY;
@@ -131,9 +145,15 @@ export default {
                 this.windowTop = 133;
             }
         },
+        /**
+         * Get URL of monitor
+         * @param {number} id ID of monitor
+         * @returns {string} Relative URL of monitor
+         */
         monitorURL(id) {
             return getMonitorRelativeURL(id);
         },
+        /** Clear the search bar */
         clearSearchText() {
             this.searchText = "";
         }

src/components/NotificationDialog.vue

@@ -125,11 +125,16 @@ export default {
     },
     methods: {
 
+        /** Show dialog to confirm deletion */
         deleteConfirm() {
             this.modal.hide();
             this.$refs.confirmDelete.show();
         },
 
+        /**
+         * Show settings for specified notification
+         * @param {number} notificationID ID of notification to show
+         */
         show(notificationID) {
             if (notificationID) {
                 this.id = notificationID;
@@ -152,6 +157,7 @@ export default {
             this.modal.show();
         },
 
+        /** Submit the form to the server */
         submit() {
             this.processing = true;
             this.$root.getSocket().emit("addNotification", this.notification, this.id, (res) => {
@@ -170,6 +176,7 @@ export default {
             });
         },
 
+        /** Test the notification endpoint */
         test() {
             this.processing = true;
             this.$root.getSocket().emit("testNotification", this.notification, (res) => {
@@ -178,6 +185,7 @@ export default {
             });
         },
 
+        /** Delete the notification endpoint */
         deleteNotification() {
             this.processing = true;
             this.$root.getSocket().emit("deleteNotification", this.id, (res) => {
@@ -190,6 +198,7 @@ export default {
             });
         },
         /**
+         * Get a unique default name for the notification
          * @param {keyof NotificationFormList} notificationKey
          * @return {string}
          */

src/components/PingChart.vue

@@ -35,6 +35,7 @@ Chart.register(LineController, BarController, LineElement, PointElement, TimeSca
 export default {
     components: { LineChart },
     props: {
+        /** ID of monitor */
         monitorId: {
             type: Number,
             required: true,

src/components/ProxyDialog.vue

@@ -130,11 +130,16 @@ export default {
     },
 
     methods: {
+        /** Show dialog to confirm deletion */
         deleteConfirm() {
             this.modal.hide();
             this.$refs.confirmDelete.show();
         },
 
+        /**
+         * Show settings for specified proxy
+         * @param {number} proxyID ID of proxy to show
+         */
         show(proxyID) {
             if (proxyID) {
                 this.id = proxyID;
@@ -163,6 +168,7 @@ export default {
             this.modal.show();
         },
 
+        /** Submit form data for saving */
         submit() {
             this.processing = true;
             this.$root.getSocket().emit("addProxy", this.proxy, this.id, (res) => {
@@ -180,6 +186,7 @@ export default {
             });
         },
 
+        /** Delete this proxy */
         deleteProxy() {
             this.processing = true;
             this.$root.getSocket().emit("deleteProxy", this.id, (res) => {

src/components/PublicGroupList.vue

@@ -39,7 +39,28 @@
                                             <font-awesome-icon v-if="editMode" icon="times" class="action remove me-3" @click="removeMonitor(group.index, monitor.index)" />
 
                                             <Uptime :monitor="monitor.element" type="24" :pill="true" />
-                                            {{ monitor.element.name }}
+                                            <a
+                                                v-if="showLink(monitor)"
+                                                :href="monitor.element.url"
+                                                class="item-name"
+                                                target="_blank"
+                                                rel="noopener noreferrer"
+                                            >
+                                                {{ monitor.element.name }}
+                                            </a>
+                                            <p v-else class="item-name"> {{ monitor.element.name }} </p>
+                                            <span
+                                                v-if="showLink(monitor, true)"
+                                                title="Toggle Clickable Link"
+                                            >
+                                                <font-awesome-icon
+                                                    v-if="editMode"
+                                                    :class="{'link-active': monitor.element.sendUrl, 'btn-link': true}"
+                                                    icon="link" class="action me-3"
+
+                                                    @click="toggleLink(group.index, monitor.index)"
+                                                />
+                                            </span>
                                         </div>
                                         <div v-if="showTags" class="tags">
                                             <Tag v-for="tag in monitor.element.tags" :key="tag" :item="tag" :size="'sm'" />
@@ -72,10 +93,12 @@ export default {
         Tag,
     },
     props: {
+        /** Are we in edit mode? */
         editMode: {
             type: Boolean,
             required: true,
         },
+        /** Should tags be shown? */
         showTags: {
             type: Boolean,
         }
@@ -94,13 +117,50 @@ export default {
 
     },
     methods: {
+        /**
+         * Remove the specified group
+         * @param {number} index Index of group to remove
+         */
         removeGroup(index) {
             this.$root.publicGroupList.splice(index, 1);
         },
 
+        /**
+         * Remove a monitor from a group
+         * @param {number} groupIndex Index of group to remove monitor
+         * from
+         * @param {number} index Index of monitor to remove
+         */
         removeMonitor(groupIndex, index) {
             this.$root.publicGroupList[groupIndex].monitorList.splice(index, 1);
         },
+
+        /**
+         * Toggle the value of sendUrl
+         * @param {number} groupIndex Index of group monitor is member of
+         * @param {number} index Index of monitor within group
+         */
+        toggleLink(groupIndex, index) {
+            this.$root.publicGroupList[groupIndex].monitorList[index].sendUrl = !this.$root.publicGroupList[groupIndex].monitorList[index].sendUrl;
+        },
+
+        /**
+         * Should a link to the monitor be shown?
+         * Attempts to guess if a link should be shown based upon if
+         * sendUrl is set and if the URL is default or not.
+         * @param {Object} monitor Monitor to check
+         * @param {boolean} [ignoreSendUrl=false] Should the presence of the sendUrl
+         * property be ignored. This will only work in edit mode.
+         * @returns {boolean}
+         */
+        showLink(monitor, ignoreSendUrl = false) {
+            // We must check if there are any elements in monitorList to
+            // prevent undefined errors if it hasn't been loaded yet
+            if (this.$parent.editMode && ignoreSendUrl && Object.keys(this.$root.monitorList).length) {
+                return this.$root.monitorList[monitor.element.id].type === "http" || this.$root.monitorList[monitor.element.id].type === "keyword";
+            }
+            return monitor.element.sendUrl && monitor.element.url && monitor.element.url !== "https://" && !this.editMode;
+        },
     }
 };
 </script>
@@ -119,6 +179,22 @@ export default {
     min-height: 46px;
 }
 
+.item-name {
+    padding-left: 5px;
+    padding-right: 5px;
+    margin: 0;
+    display: inline-block;
+}
+
+.btn-link {
+    color: #bbbbbb;
+    margin-left: 5px;
+}
+
+.link-active {
+    color: $primary;
+}
+
 .flip-list-move {
     transition: transform 0.5s;
 }

src/components/Status.vue

@@ -5,6 +5,7 @@
 <script>
 export default {
     props: {
+        /** Current status of monitor */
         status: {
             type: Number,
             default: 0,

src/components/Tag.vue

@@ -20,14 +20,20 @@
 <script>
 export default {
     props: {
+        /** Object representing tag */
         item: {
             type: Object,
             required: true,
         },
+        /** Function to remove tag */
         remove: {
             type: Function,
             default: null,
         },
+        /**
+         * Size of tag
+         * @values normal, small
+         */
         size: {
             type: String,
             default: "normal",

src/components/TagsManager.vue

@@ -139,6 +139,7 @@ export default {
         VueMultiselect,
     },
     props: {
+        /** Array of tags to be pre-selected */
         preSelectedTags: {
             type: Array,
             default: () => [],
@@ -241,9 +242,11 @@ export default {
         this.getExistingTags();
     },
     methods: {
+        /** Show the add tag dialog */
         showAddDialog() {
             this.modal.show();
         },
+        /** Get all existing tags */
         getExistingTags() {
             this.$root.getSocket().emit("getTags", (res) => {
                 if (res.ok) {
@@ -253,6 +256,10 @@ export default {
                 }
             });
         },
+        /**
+         * Delete the specified tag
+         * @param {Object} tag Object representing tag to delete
+         */
         deleteTag(item) {
             if (item.new) {
                 // Undo Adding a new Tag
@@ -262,6 +269,13 @@ export default {
                 this.deleteTags.push(item);
             }
         },
+        /**
+         * Get colour of text inside the tag
+         * @param {Object} option The tag that needs to be displayed.
+         * Defaults to "white" unless the tag has no color, which will
+         * then return the body color (based on application theme)
+         * @returns string
+         */
         textColor(option) {
             if (option.color) {
                 return "white";
@@ -269,6 +283,7 @@ export default {
                 return this.$root.theme === "light" ? "var(--bs-body-color)" : "inherit";
             }
         },
+        /** Add a draft tag */
         addDraftTag() {
             console.log("Adding Draft Tag: ", this.newDraftTag);
             if (this.newDraftTag.select != null) {
@@ -296,6 +311,7 @@ export default {
             }
             this.clearDraftTag();
         },
+        /** Remove a draft tag */
         clearDraftTag() {
             this.newDraftTag = {
                 name: null,
@@ -307,26 +323,51 @@ export default {
             };
             this.modal.hide();
         },
+        /**
+         * Add a tag asynchronously
+         * @param {Object} newTag Object representing new tag to add
+         * @returns {Promise<void>}
+         */
         addTagAsync(newTag) {
             return new Promise((resolve) => {
                 this.$root.getSocket().emit("addTag", newTag, resolve);
             });
         },
+        /**
+         * Add a tag to a monitor asynchronously
+         * @param {number} tagId ID of tag to add
+         * @param {number} monitorId ID of monitor to add tag to
+         * @param {string} value Value of tag
+         * @returns {Promise<void>}
+         */
         addMonitorTagAsync(tagId, monitorId, value) {
             return new Promise((resolve) => {
                 this.$root.getSocket().emit("addMonitorTag", tagId, monitorId, value, resolve);
             });
         },
+        /**
+         * Delete a tag from a monitor asynchronously
+         * @param {number} tagId ID of tag to remove
+         * @param {number} monitorId ID of monitor to remove tag from
+         * @param {string} value Value of tag
+         * @returns {Promise<void>}
+         */
         deleteMonitorTagAsync(tagId, monitorId, value) {
             return new Promise((resolve) => {
                 this.$root.getSocket().emit("deleteMonitorTag", tagId, monitorId, value, resolve);
             });
         },
+        /** Handle pressing Enter key when inside the modal */
         onEnter() {
             if (!this.validateDraftTag.invalid) {
                 this.addDraftTag();
             }
         },
+        /**
+         * Submit the form data
+         * @param {number} monitorId ID of monitor this change affects
+         * @returns {void}
+         */
         async submit(monitorId) {
             console.log(`Submitting tag changes for monitor ${monitorId}...`);
             this.processing = true;

src/components/ToggleSection.vue

@@ -29,10 +29,12 @@
 <script>
 export default {
     props: {
+        /** Heading of the section */
         heading: {
             type: String,
             default: "",
         },
+        /** Should the section be open by default? */
         defaultOpen: {
             type: Boolean,
             default: false,

src/components/TwoFADialog.vue

@@ -100,18 +100,22 @@ export default {
         this.getStatus();
     },
     methods: {
+        /** Show the dialog */
         show() {
             this.modal.show();
         },
 
+        /** Show dialog to confirm enabling 2FA */
         confirmEnableTwoFA() {
             this.$refs.confirmEnableTwoFA.show();
         },
 
+        /** Show dialog to confirm disabling 2FA */
         confirmDisableTwoFA() {
             this.$refs.confirmDisableTwoFA.show();
         },
 
+        /** Prepare 2FA configuration */
         prepare2FA() {
             this.processing = true;
 
@@ -126,6 +130,7 @@ export default {
             });
         },
 
+        /** Save the current 2FA configuration */
         save2FA() {
             this.processing = true;
 
@@ -143,6 +148,7 @@ export default {
             });
         },
 
+        /** Disable 2FA for this user */
         disable2FA() {
             this.processing = true;
 
@@ -160,6 +166,7 @@ export default {
             });
         },
 
+        /** Verify the token generated by the user */
         verifyToken() {
             this.$root.getSocket().emit("verifyToken", this.token, this.currentPassword, (res) => {
                 if (res.ok) {
@@ -170,6 +177,7 @@ export default {
             });
         },
 
+        /** Get current status of 2FA */
         getStatus() {
             this.$root.getSocket().emit("twoFAStatus", (res) => {
                 if (res.ok) {

src/components/Uptime.vue

@@ -5,14 +5,17 @@
 <script>
 export default {
     props: {
+        /** Monitor this represents */
         monitor: {
             type: Object,
             default: null,
         },
+        /** Type of monitor */
         type: {
             type: String,
             default: null,
         },
+        /** Is this a pill? */
         pill: {
             type: Boolean,
             default: false,

src/components/notifications/AlertNow.vue

@@ -0,0 +1,13 @@
+<template>
+    <div class="mb-3">
+        <label for="alertnow-webhook-url" class="form-label">{{ $t("Webhook URL") }}<span style="color: red;"><sup>*</sup></span></label>
+        <input id="alertnow-webhook-url" v-model="$parent.notification.alertNowWebhookURL" type="text" class="form-control" required>
+
+        <div class="form-text">
+            <span style="color: red;"><sup>*</sup></span>{{ $t("Required") }}
+            <i18n-t tag="p" keypath="aboutWebhooks" style="margin-top: 8px;">
+                <a href="https://service.opsnow.com/docs/alertnow/en/user-guide-alertnow-en.html#standard" target="_blank">{{ $t("here") }}</a>
+            </i18n-t>
+        </div>
+    </div>
+</template>

src/components/notifications/Bark.vue

@@ -2,9 +2,6 @@
     <div class="mb-3">
         <label for="Bark Endpoint" class="form-label">{{ $t("Bark Endpoint") }}<span style="color: red;"><sup>*</sup></span></label>
         <input id="Bark Endpoint" v-model="$parent.notification.barkEndpoint" type="text" class="form-control" required>
-        <div class="form-text">
-            <p><span style="color: red;"><sup>*</sup></span>{{ $t("Required") }}</p>
-        </div>
         <i18n-t tag="div" keypath="wayToGetTeamsURL" class="form-text">
             <a
                 href="https://github.com/Finb/Bark"
@@ -12,4 +9,45 @@
             >{{ $t("here") }}</a>
         </i18n-t>
     </div>
+    <div class="mb-3">
+        <label for="Bark Group" class="form-label">{{ $t("Bark Group") }}</label>
+        <input id="Bark Group" v-model="$parent.notification.barkGroup" type="text" class="form-control" required>
+    </div>
+    <div class="mb-3">
+        <label for="Bark Sound" class="form-label">{{ $t("Bark Sound") }}</label>
+        <select id="Bark Sound" v-model="$parent.notification.barkSound" class="form-select" required>
+            <option value="alarm">alarm</option>
+            <option value="anticipate">anticipate</option>
+            <option value="bell">bell</option>
+            <option value="birdsong">birdsong</option>
+            <option value="bloom">bloom</option>
+            <option value="calypso">calypso</option>
+            <option value="chime">chime</option>
+            <option value="choo">choo</option>
+            <option value="descent">descent</option>
+            <option value="electronic">electronic</option>
+            <option value="fanfare">fanfare</option>
+            <option value="glass">glass</option>
+            <option value="gotosleep">gotosleep</option>
+            <option value="healthnotification">healthnotification</option>
+            <option value="horn">horn</option>
+            <option value="ladder">ladder</option>
+            <option value="mailsent">mailsent</option>
+            <option value="minuet">minuet</option>
+            <option value="multiwayinvitation">multiwayinvitation</option>
+            <option value="newmail">newmail</option>
+            <option value="newsflash">newsflash</option>
+            <option value="noir">noir</option>
+            <option value="paymentsuccess">paymentsuccess</option>
+            <option value="shake">shake</option>
+            <option value="sherwoodforest">sherwoodforest</option>
+            <option value="silence">silence</option>
+            <option value="spell">spell</option>
+            <option value="suspense">suspense</option>
+            <option value="telegraph">telegraph</option>
+            <option value="tiptoes">tiptoes</option>
+            <option value="typewriters">typewriters</option>
+            <option value="update">update</option>
+        </select>
+    </div>
 </template>

src/components/notifications/GoAlert.vue

@@ -0,0 +1,30 @@
+<template>
+    <div class="mb-3">
+        <label for="goalert-base-url" class="form-label">{{ $t("Base URL") }}</label>
+        <div class="input-group mb-3">
+            <input id="goalert-base-url" v-model="$parent.notification.goAlertBaseURL" type="text" class="form-control" required>
+        </div>
+        <i18n-t tag="div" keypath="goAlertInfo" class="form-text">
+            <a href="https://goalert.me" target="_blank">https://goalert.me</a>
+        </i18n-t>
+    </div>
+
+    <div class="mb-3">
+        <label for="goalert-token" class="form-label">{{ $t("Token") }}</label>
+        <HiddenInput id="goalert-token" v-model="$parent.notification.goAlertToken" autocomplete="one-time-code" :required="true"></HiddenInput>
+
+        <div class="form-text">
+            {{ $t("goAlertIntegrationKeyInfo") }}
+        </div>
+    </div>
+</template>
+
+<script>
+import HiddenInput from "../HiddenInput.vue";
+
+export default {
+    components: {
+        HiddenInput,
+    },
+};
+</script>

src/components/notifications/HomeAssistant.vue

@@ -0,0 +1,40 @@
+<template>
+    <div class="mb-3">
+        <label for="homeAssistantUrl" class="form-label">{{ $t("Home Assistant URL") }}<span style="color: red;"><sup>*</sup></span></label>
+        <input id="homeAssistantUrl" v-model="$parent.notification.homeAssistantUrl" type="url" class="form-control" required>
+    </div>
+
+    <div class="mb-3">
+        <label for="longLivedAccessToken" class="form-label">{{ $t("Long-Lived Access Token") }}<span style="color: red;"><sup>*</sup></span></label>
+        <input id="longLivedAccessToken" v-model="$parent.notification.longLivedAccessToken" type="text" class="form-control" required>
+
+        <div class="form-text">
+            <p>{{ $t("Long-Lived Access Token can be created by clicking on your profile name (bottom left) and scrolling to the bottom then click Create Token. ") }}</p>
+        </div>
+    </div>
+
+    <div class="mb-3">
+        <label for="notificationService" class="form-label">{{ $t("Notification Service") }}</label>
+        <input id="notificationService" v-model="$parent.notification.notificationService" type="text" :placeholder="$t('default: notify all devices')" class="form-control">
+
+        <div class="form-text">
+            <p>{{ $t("A list of Notification Services can be found in Home Assistant under \"Developer Tools > Services\" search for \"notification\" to find your device/phone name.") }}</p>
+            <p>{{ $t("Automations can optionally be triggered in Home Assistant:") }}</p>
+            <p>
+                {{ $t("Trigger type:") }} <code>Event</code><br />
+                {{ $t("Event type:") }} <code>call_service</code><br />
+                {{ $t("Event data:") }}
+            </p>
+            <pre>domain: notify
+service: mobile_app_my_phone # change to your device name
+service_data:
+  title: Uptime Kuma
+  data:
+    status: 0 # 0=down 1=up
+    # name: Optional Uptime Kuma Monitor Name to filter by</pre>
+            <p>
+                {{ $t("Then choose an action, for example switch the scene to where an RGB light is red.") }}
+            </p>
+        </div>
+    </div>
+</template>

src/components/notifications/LineNotify.vue

@@ -0,0 +1,9 @@
+<template>
+    <div class="mb-3">
+        <label for="line-notify-access-token" class="form-label">{{ $t("Access Token") }}</label>
+        <input id="line-notify-access-token" v-model="$parent.notification.lineNotifyAccessToken" type="text" class="form-control" :required="true">
+    </div>
+    <i18n-t tag="div" keypath="wayToGetLineNotifyToken" class="form-text" style="margin-top: 8px;">
+        <a href="https://notify-bot.line.me/" target="_blank">https://notify-bot.line.me/</a>
+    </i18n-t>
+</template>

src/components/notifications/Ntfy.vue

@@ -11,15 +11,31 @@
             <input id="ntfy-server-url" v-model="$parent.notification.ntfyserverurl" type="text" class="form-control" required>
         </div>
     </div>
-
     <div class="mb-3">
         <label for="ntfy-priority" class="form-label">{{ $t("Priority") }}</label>
         <input id="ntfy-priority" v-model="$parent.notification.ntfyPriority" type="number" class="form-control" required min="1" max="5" step="1">
     </div>
+    <div class="mb-3">
+        <label for="ntfy-username" class="form-label">{{ $t("Username") }} ({{ $t("Optional") }})</label>
+        <div class="input-group mb-3">
+            <input id="ntfy-username" v-model="$parent.notification.ntfyusername" type="text" class="form-control" required>
+        </div>
+    </div>
+    <div class="mb-3">
+        <label for="ntfy-password" class="form-label">{{ $t("Password") }} ({{ $t("Optional") }})</label>
+        <div class="input-group mb-3">
+            <HiddenInput id="ntfy-password" v-model="$parent.notification.ntfypassword" autocomplete="new-password"></HiddenInput>
+        </div>
+    </div>
 </template>
 
 <script>
+import HiddenInput from "../HiddenInput.vue";
+
 export default {
+    components: {
+        HiddenInput,
+    },
     mounted() {
         if (typeof this.$parent.notification.ntfyPriority === "undefined") {
             this.$parent.notification.ntfyserverurl = "https://ntfy.sh";

src/components/notifications/SMSManager.vue

@@ -0,0 +1,31 @@
+<template>
+    <div class="mb-3">
+        <label for="smsmanager-key" class="form-label">API Key</label>
+        <div class="form-text">
+            {{ $t("SMSManager API Docs ") }}
+            <a href="https://smsmanager.cz/api/http#send" target="_blank">{{ $t("here") }}</a>
+        </div>
+        <input id="smsmanager-key" v-model="$parent.notification.smsmanagerApiKey" type="text" class="form-control">
+    </div>
+    <div class="mb-3">
+        <label for="smsmanager-numbers" class="form-label"> {{ $t("Recipients") }}</label>
+        <div class="form-text">
+            {{ $t("You can divide numbers with") }} <b>,</b> {{ $t("or") }} <b>;</b>
+        </div>
+        <input id="smsmanager-numbers" v-model="$parent.notification.numbers" type="text" class="form-control">
+    </div>
+    <div class="mb-3">
+        <label for="smsmanager-messageType" class="form-label">{{ $t("Gateway Type") }}</label>
+        <select id="smsmanager-messageType" v-model="$parent.notification.messageType" class="form-select">
+            <option value="economy">Economy</option>
+            <option value="lowcost">Lowcost</option>
+            <option value="high" selected>High</option>
+        </select>
+    </div>
+    <div class="mb-3">
+        <div class="form-text">
+            {{ $t("checkPrice", [$t("SMSManager")]) }}
+            <a href="https://smsmanager.cz/rozesilani-sms/ceny/ceska-republika/" target="_blank">{{ $t("here") }}</a>
+        </div>
+    </div>
+</template>

src/components/notifications/ServerChan.vue

@@ -0,0 +1,16 @@
+<template>
+    <div class="mb-3">
+        <label for="serverchan-sendkey" class="form-label">{{ $t("SendKey") }}</label>
+        <HiddenInput id="serverchan-sendkey" v-model="$parent.notification.serverChanSendKey" :required="true" autocomplete="one-time-code"></HiddenInput>
+    </div>
+</template>
+
+<script>
+import HiddenInput from "../HiddenInput.vue";
+
+export default {
+    components: {
+        HiddenInput,
+    },
+};
+</script>

src/components/notifications/Squadcast.vue

@@ -0,0 +1,6 @@
+<template>
+    <div class="mb-3">
+        <label for="webhook-url" class="form-label">{{ $t("Post URL") }}</label>
+        <input id="webhook-url" v-model="$parent.notification.squadcastWebhookURL" type="url" pattern="https?://.+" class="form-control" required>
+    </div>
+</template>

src/components/notifications/index.js

@@ -1,38 +1,45 @@
-import STMP from "./SMTP.vue";
-import Telegram from "./Telegram.vue";
+import Alerta from "./Alerta.vue";
+import AlertNow from "./AlertNow.vue";
+import AliyunSMS from "./AliyunSms.vue";
+import Apprise from "./Apprise.vue";
+import Bark from "./Bark.vue";
+import ClickSendSMS from "./ClickSendSMS.vue";
+import DingDing from "./DingDing.vue";
 import Discord from "./Discord.vue";
-import Webhook from "./Webhook.vue";
-import Signal from "./Signal.vue";
+import Feishu from "./Feishu.vue";
+import GoogleChat from "./GoogleChat.vue";
+import Gorush from "./Gorush.vue";
 import Gotify from "./Gotify.vue";
+import HomeAssistant from "./HomeAssistant.vue";
+import Line from "./Line.vue";
+import LineNotify from "./LineNotify.vue";
+import LunaSea from "./LunaSea.vue";
+import Matrix from "./Matrix.vue";
+import Mattermost from "./Mattermost.vue";
 import Ntfy from "./Ntfy.vue";
-import Slack from "./Slack.vue";
-import RocketChat from "./RocketChat.vue";
-import Teams from "./Teams.vue";
+import Octopush from "./Octopush.vue";
+import OneBot from "./OneBot.vue";
+import PagerDuty from "./PagerDuty.vue";
+import PromoSMS from "./PromoSMS.vue";
+import Pushbullet from "./Pushbullet.vue";
+import PushDeer from "./PushDeer.vue";
 import Pushover from "./Pushover.vue";
 import Pushy from "./Pushy.vue";
-import TechulusPush from "./TechulusPush.vue";
-import Octopush from "./Octopush.vue";
-import PromoSMS from "./PromoSMS.vue";
-import ClickSendSMS from "./ClickSendSMS.vue";
-import LunaSea from "./LunaSea.vue";
-import Feishu from "./Feishu.vue";
-import Apprise from "./Apprise.vue";
-import Pushbullet from "./Pushbullet.vue";
-import Line from "./Line.vue";
-import Mattermost from "./Mattermost.vue";
-import Matrix from "./Matrix.vue";
-import AliyunSMS from "./AliyunSms.vue";
-import DingDing from "./DingDing.vue";
-import Bark from "./Bark.vue";
+import RocketChat from "./RocketChat.vue";
+import ServerChan from "./ServerChan.vue";
 import SerwerSMS from "./SerwerSMS.vue";
+import Signal from "./Signal.vue";
+import SMSManager from "./SMSManager.vue";
+import Slack from "./Slack.vue";
+import Squadcast from "./Squadcast.vue";
 import Stackfield from "./Stackfield.vue";
+import STMP from "./SMTP.vue";
+import Teams from "./Teams.vue";
+import TechulusPush from "./TechulusPush.vue";
+import Telegram from "./Telegram.vue";
+import Webhook from "./Webhook.vue";
 import WeCom from "./WeCom.vue";
-import GoogleChat from "./GoogleChat.vue";
-import PagerDuty from "./PagerDuty.vue";
-import Gorush from "./Gorush.vue";
-import Alerta from "./Alerta.vue";
-import OneBot from "./OneBot.vue";
-import PushDeer from "./PushDeer.vue";
+import GoAlert from "./GoAlert.vue";
 
 /**
  * Manage all notification form.
@@ -40,41 +47,48 @@ import PushDeer from "./PushDeer.vue";
  * @type { Record<string, any> }
  */
 const NotificationFormList = {
-    "telegram": Telegram,
-    "webhook": Webhook,
-    "smtp": STMP,
-    "discord": Discord,
-    "teams": Teams,
-    "signal": Signal,
-    "gotify": Gotify,
-    "ntfy": Ntfy,
-    "slack": Slack,
-    "rocket.chat": RocketChat,
-    "pushover": Pushover,
-    "pushy": Pushy,
-    "PushByTechulus": TechulusPush,
-    "octopush": Octopush,
-    "promosms": PromoSMS,
-    "clicksendsms": ClickSendSMS,
-    "lunasea": LunaSea,
-    "Feishu": Feishu,
+    "alerta": Alerta,
+    "AlertNow": AlertNow,
     "AliyunSMS": AliyunSMS,
     "apprise": Apprise,
-    "pushbullet": Pushbullet,
-    "line": Line,
-    "mattermost": Mattermost,
-    "matrix": Matrix,
-    "DingDing": DingDing,
     "Bark": Bark,
-    "serwersms": SerwerSMS,
-    "stackfield": Stackfield,
-    "WeCom": WeCom,
+    "clicksendsms": ClickSendSMS,
+    "DingDing": DingDing,
+    "discord": Discord,
+    "Feishu": Feishu,
     "GoogleChat": GoogleChat,
-    "PagerDuty": PagerDuty,
     "gorush": Gorush,
-    "alerta": Alerta,
+    "gotify": Gotify,
+    "HomeAssistant": HomeAssistant,
+    "line": Line,
+    "LineNotify": LineNotify,
+    "lunasea": LunaSea,
+    "matrix": Matrix,
+    "mattermost": Mattermost,
+    "ntfy": Ntfy,
+    "octopush": Octopush,
     "OneBot": OneBot,
+    "PagerDuty": PagerDuty,
+    "promosms": PromoSMS,
+    "pushbullet": Pushbullet,
+    "PushByTechulus": TechulusPush,
     "PushDeer": PushDeer,
+    "pushover": Pushover,
+    "pushy": Pushy,
+    "rocket.chat": RocketChat,
+    "serwersms": SerwerSMS,
+    "signal": Signal,
+    "SMSManager": SMSManager,
+    "slack": Slack,
+    "squadcast": Squadcast,
+    "smtp": STMP,
+    "stackfield": Stackfield,
+    "teams": Teams,
+    "telegram": Telegram,
+    "webhook": Webhook,
+    "WeCom": WeCom,
+    "GoAlert": GoAlert,
+    "ServerChan": ServerChan,
 };
 
 export default NotificationFormList;

src/components/settings/About.vue

@@ -4,6 +4,11 @@
             <object class="my-4" width="200" height="200" data="/icon.svg" />
             <div class="fs-4 fw-bold">Uptime Kuma</div>
             <div>{{ $t("Version") }}: {{ $root.info.version }}</div>
+            <div class="frontend-version">{{ $t("Frontend Version") }}: {{ $root.frontendVersion }}</div>
+
+            <div v-if="!$root.isFrontendBackendVersionMatched" class="alert alert-warning mt-4" role="alert">
+                ⚠️ {{ $t("Frontend Version do not match backend version!") }}
+            </div>
 
             <div class="my-3 update-link"><a href="https://github.com/louislam/uptime-kuma/releases" target="_blank" rel="noopener">{{ $t("Check Update On GitHub") }}</a></div>
 
@@ -46,6 +51,16 @@ export default {
 }
 
 .update-link {
-    font-size: 0.9em;
+    font-size: 0.8em;
 }
+
+.frontend-version {
+    font-size: 0.9em;
+    color: #cccccc;
+
+    .dark & {
+        color: #333333;
+    }
+}
+
 </style>

src/components/settings/Backup.vue

@@ -1,6 +1,12 @@
 <template>
     <div>
         <div class="my-4">
+            <div class="alert alert-warning" role="alert" style="border-radius: 15px;">
+                {{ $t("backupOutdatedWarning") }}<br />
+                <br />
+                {{ $t("backupRecommend") }}
+            </div>
+
             <h4 class="mt-4 mb-2">{{ $t("Export Backup") }}</h4>
 
             <p>
@@ -133,10 +139,15 @@ export default {
     },
 
     methods: {
+        /**
+         * Show the confimation dialog confirming the configuration
+         * be imported
+         */
         confirmImport() {
             this.$refs.confirmImport.show();
         },
 
+        /** Download a backup of the configuration */
         downloadBackup() {
             let time = dayjs().format("YYYY_MM_DD-hh_mm_ss");
             let fileName = `Uptime_Kuma_Backup_${time}.json`;
@@ -157,6 +168,10 @@ export default {
             downloadItem.click();
         },
 
+        /**
+         * Import the specified backup file
+         * @returns {?string}
+         */
         importBackup() {
             this.processing = true;
             let uploadItem = document.getElementById("import-backend").files;

src/components/settings/Docker.vue

@@ -0,0 +1,48 @@
+<template>
+    <div>
+        <div class="dockerHost-list my-4">
+            <p v-if="$root.dockerHostList.length === 0">
+                {{ $t("Not available, please setup.") }}
+            </p>
+
+            <ul class="list-group mb-3" style="border-radius: 1rem;">
+                <li v-for="(dockerHost, index) in $root.dockerHostList" :key="index" class="list-group-item">
+                    {{ dockerHost.name }}<br>
+                    <a href="#" @click="$refs.dockerHostDialog.show(dockerHost.id)">{{ $t("Edit") }}</a>
+                </li>
+            </ul>
+
+            <button class="btn btn-primary me-2" type="button" @click="$refs.dockerHostDialog.show()">
+                {{ $t("Setup Docker Host") }}
+            </button>
+        </div>
+
+        <DockerHostDialog ref="dockerHostDialog" />
+    </div>
+</template>
+
+<script>
+import DockerHostDialog from "../../components/DockerHostDialog.vue";
+
+export default {
+    components: {
+        DockerHostDialog,
+    },
+
+    data() {
+        return {};
+    },
+
+    computed: {
+        settings() {
+            return this.$parent.$parent.$parent.settings;
+        },
+        saveSettings() {
+            return this.$parent.$parent.$parent.saveSettings;
+        },
+        settingsLoaded() {
+            return this.$parent.$parent.$parent.settingsLoaded;
+        },
+    }
+};
+</script>

src/components/settings/General.vue

@@ -178,10 +178,12 @@ export default {
     },
 
     methods: {
+        /** Save the settings */
         saveGeneral() {
             localStorage.timezone = this.$root.userTimezone;
             this.saveSettings();
         },
+        /** Get the base URL of the application */
         autoGetPrimaryBaseURL() {
             this.settings.primaryBaseURL = location.protocol + "//" + location.host;
         },

src/components/settings/MonitorHistory.vue

@@ -90,6 +90,7 @@ export default {
     },
 
     methods: {
+        /** Get the current size of the database */
         loadDatabaseSize() {
             log.debug("monitorhistory", "load database size");
             this.$root.getSocket().emit("getDatabaseSize", (res) => {
@@ -102,6 +103,7 @@ export default {
             });
         },
 
+        /** Request that the database is shrunk */
         shrinkDatabase() {
             this.$root.getSocket().emit("shrinkDatabase", (res) => {
                 if (res.ok) {
@@ -113,10 +115,12 @@ export default {
             });
         },
 
+        /** Show the dialog to confirm clearing stats */
         confirmClearStatistics() {
             this.$refs.confirmClearStatistics.show();
         },
 
+        /** Send the request to clear stats */
         clearStatistics() {
             this.$root.clearStatistics((res) => {
                 if (res.ok) {

src/components/settings/Notifications.vue

@@ -20,10 +20,11 @@
             </button>
         </div>
 
-        <div class="my-4">
-            <h4>{{ $t("settingsCertificateExpiry") }}</h4>
+        <div class="my-4 pt-4">
+            <h5 class="my-4 settings-subheading">{{ $t("settingsCertificateExpiry") }}</h5>
             <p>{{ $t("certificationExpiryDescription") }}</p>
-            <div class="mt-2 mb-4 ps-2 cert-exp-days col-12 col-xl-6">
+            <p>{{ $t("notificationDescription") }}</p>
+            <div class="mt-1 mb-3 ps-2 cert-exp-days col-12 col-xl-6">
                 <div v-for="day in settings.tlsExpiryNotifyDays" :key="day" class="d-flex align-items-center justify-content-between cert-exp-day-row py-2">
                     <span>{{ day }} {{ $tc("day", day) }}</span>
                     <button type="button" class="btn-rm-expiry btn btn-outline-danger ms-2 py-1" @click="removeExpiryNotifDay(day)">