louislam/uptime-kuma

Support URL parameters so we can link directly to filtered dashboard view

Open

#3672 opened on Sep 1, 2023

View on GitHub
 (7 comments) (2 reactions) (0 assignees)JavaScript (86,760 stars) (7,844 forks)batch import
A:dashboardfeature-requestgood first issue

Description

⚠️ Please verify that this feature request has NOT been suggested before.

  • I checked and didn't find similar feature request

🏷️ Feature Request Type

UI Feature

🔖 Feature description

Usually when I go to UptimeKuma it's to check on down monitors. So I end up clicking the little filter bubble, status -> down. It would be very handy to be able to "bookmark" that filter setting directly e.g. something like:

https://my-uptime-kuma?filter=true&status=down

I am sorry if there is already a request or PR for this functionality. I did some basic searching and couldn't find it, although it is somewhat a little bit similar to https://github.com/louislam/uptime-kuma/issues/2787.

Thank you 🙏

Contributor guide

Tech stack
javascriptvue
Domain
frontend
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
fresh
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Basic knowledge of Vue.jsFamiliarity with URL parameters
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
60
Research direction
Investigate the current filtering implementation in the dashboard component (likely in src/components/Dashboard.vue) and the Vue Router configuration. The goal is to sync the filter state (e.g., status filter) with URL query parameters like ?filter=true&status=down. You can look at how the filter dropdowns update a reactive state and then use Vue Router's push or replace to update the query. Also check if there are any existing utilities for reading query parameters. Test by adding ?status=down to the URL and ensuring the filter is applied on page load.