Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat: Remove multiple monitors at once. #5481

Open
wants to merge 8 commits into
base: master
Choose a base branch
from

Conversation

homelab-alpha
Copy link
Contributor

@homelab-alpha homelab-alpha commented Dec 28, 2024

⚠️⚠️⚠️ 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.

NOTE: This is my first Pull Request. If I've made any mistakes, I apologize in advance. If you have any comments or feedback, I would love to hear them.

Description

This pull request introduces a new feature to Uptime Kuma that allows users to delete multiple monitors at once by selecting them. The changes include:

  1. New Delete Button:

    • A new button has been added to delete selected monitors. When clicked, it triggers a confirmation dialog to confirm the deletion action.
    • The button is styled with red (icon: Trashcan, text: Delete) to highlight its destructive nature.
    • It activates the deleteSelectedMonitorDialog method to display the confirmation dialog.
  2. Confirmation Dialog:

    • The dialog asks users to confirm the deletion of selected monitors. If the user confirms, the monitors are deleted.
  3. New Methods:

    • deleteSelectedMonitorDialog: Triggers the confirmation dialog for deleting selected monitors.
    • deleteSelectedMonitor: Handles the deletion process for the selected monitors and automatically refreshes after successful deletion.
  4. Confirmation Message for Deletion:

    • A new language key deleteSelectedMonitorMsg has been added to display the confirmation message for deleting selected monitors.
    • Translations for this message have been added in the following language files:
      • en.json (English)
    • The message format is consistent with existing text formatting standards across the application.

These changes provide users with a more efficient way to manage and delete multiple monitors, enhancing the overall user experience.

Type of change

  • New feature (non-breaking change which adds functionality)
  • User interface (UI)

Checklist

  • My code follows the style guidelines of this project
  • I ran ESLint and other linters for modified files
  • I have performed a self-review of my own code and tested it
  • I have commented my code, particularly in hard-to-understand areas (including JSDoc for methods)
  • My changes generates no new warnings
  • My code needed automated testing. I have added them (this is optional task)

Fix - Resolved Inconsistencies Caused by Previous Translation Updates

Restored the original translations to maintain consistency across files by reverting the translations for the following messages in the language files:

  • de-CH.json
  • de-DE.json
  • fr-FR.json
  • nl-NL.json

Screenshots (if any)

screencast_feat_remove_multiple_monitorsvat_once.mp4
video (OLD) (click to expand)

screencast_feat_remove_multiple_monitorsvat_once.mp4

- Added a delete button to the selection controls for deleting selected monitor(s).
- Integrated a confirmation dialog (`confirmDeleteSelected`) with the message `deleteSelectedMonitorMsg`.
- Implemented `deleteSelectedDialog` to trigger the confirmation dialog.
- Created `deleteSelected` method to handle monitor deletion and update the selection state.
- Implemented toast notifications for feedback on the deletion status.
- Added page reload mechanism to reflect the deletion of monitors after all selected monitors are removed.
- Ensured consistent functionality with existing selection and action methods.

modified: src/components/MonitorList.vue
- Added a new key `deleteSelectedMonitorMsg` for the confirmation message.
- Included translations for the message in the following files:
  - `de-CH.json`
  - `de-DE.json`
  - `en.json`
  - `fr-FR.json`
  - `nl-NL.json`
- The message prompts for confirmation when deleting one or more selected monitor(s).
- Ensured the message follows existing formatting standards.

modified: src/lang/de-CH.json
modified: src/lang/de-DE.json
modified: src/lang/en.json
modified: src/lang/fr-FR.json
modified: src/lang/nl-NL.json
@cyril59310
Copy link
Contributor

Only the en.json translation file should be modified to avoid any conflicts with the Weblate translation tool.

- Reverted translations for the message in the following language files:
  - `de-CH.json`
  - `de-DE.json`
  - `fr-FR.json`
  - `nl-NL.json`
- Restored the original translations to prevent file inconsistencies.
- Prevented inconsistencies caused by previous translation updates.

modified: src/lang/de-CH.json
modified: src/lang/de-DE.json
modified: src/lang/fr-FR.json
modified: src/lang/nl-NL.json
@homelab-alpha
Copy link
Contributor Author

@cyril59310, thanks for the tip; I have reversed the unnecessary translations.

- Added functionality to retrieve and display a toast message from localStorage
  after the page reloads, triggered by a successful monitor deletion.
- Modified the `deleteSelected` method to immediately refresh the page after
  deleting selected monitors and store the response for the toast notification.
- Cleaned up localStorage after showing the toast to avoid repeating the message.

modified: src/components/MonitorList.vue
- Replaced `window.location.reload()` with Vue Router navigation to a temporary route for smoother page reload.
- Added Vue Router redirection to `/dashboard` after monitor deletion for better user experience.
- Updated function documentation to clarify behavior and return type.

modified: src/components/MonitorList.vue
@homelab-alpha

This comment has been minimized.

- Removed JSDoc comment for the `deleteSelected` method `@returns {void}`.
- No functional changes made to the logic or behavior of the method.

modified: src/components/MonitorList.vue
- Renamed `deleteSelectedDialog` to `deleteSelectedMonitorDialog` for better clarity.
- Updated the corresponding method `deleteSelected` to `deleteSelectedMonitor` to reflect the new naming convention.
- Updated references in the template and JavaScript to match the new method names.
- Ensured consistency in naming to improve code readability and maintainability.

No functionality changes were made; only method names were modified for clarity.

modified: src/components/MonitorList.vue
@homelab-alpha homelab-alpha marked this pull request as ready for review January 2, 2025 05:11
- Changed the page redirect after monitor deletion to the home page ("/") for a proper UI refresh.
- Removed the temporary route ("/temp") to simplify the deletion process.
- Ensured that the UI reloads correctly after monitor deletions via a direct redirect to the home page.

modified: src/components/MonitorList.vue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants