feat(Add) : Add Settings Toggle for Pause confirmation dialogue

[Raj4478]

Add "Do not show again" checkbox to pause confirmation dialogs

Closes #5234

📋 Overview

• What problem does this pull request address?

  • Users are repeatedly prompted with confirmation dialogs when pausing monitors or maintenance windows, which can become repetitive and annoying for frequent users who are confident in their actions.
  • No option exists to skip future confirmation prompts for pause operations.

• What features or functionality does this pull request introduce or enhance?

  • Adds a "Do not show again" checkbox to pause confirmation dialogs
  • Implements localStorage persistence to remember user preference across sessions
  • Creates a dedicated PauseConfirm component with enhanced functionality
  • Updates monitor pause dialogs in MonitorList, Details page, and maintenance pause dialogs
  • Provides a way for users to reset the preference if needed

• Resolves: User experience improvement for pause operations

• Feature type: UI Enhancement

🛠️ Type of change

• ✨ New feature (a non-breaking change that adds new functionality)
• 🎨 User Interface (UI) updates

📄 Checklist

• 🔍 My code adheres to the style guidelines of this project.
• 🦿 I have indicated where (if any) I used an LLM for the contributions
• ✅ I ran ESLint and other code linters for modified files.
• 🛠️ I have reviewed and tested my code.
• 📝 I have commented my code, especially in hard-to-understand areas (e.g., using JSDoc for methods).
• ⚠️ My changes generate no new warnings.
• 🤖 My code needed automated testing. I have added them (this is an optional task).

🎯 Functionality

User Flow:

1. User clicks pause button on monitor/maintenance
2. Confirmation dialog appears with "Do not show this again" checkbox
3. If checkbox is checked and user confirms:
   • Preference is saved to localStorage
   • Future pause operations skip confirmation dialog
4. If checkbox is unchecked:
   • Normal confirmation behavior continues

Component Structure:

<PauseConfirm ref="confirmPause" :yes-text="$t('Yes')" :no-text="$t('No')" @yes="pauseSelected">
    {{ $t("pauseMonitorMsg") }}
</PauseConfirm>

🧪 Testing

Manual Testing Performed:

• Checkbox appears in pause confirmation dialogs
• Checking checkbox and confirming saves preference
• Subsequent pause operations skip confirmation when preference is saved
• Unchecking checkbox maintains normal confirmation behavior
• Preference persists across browser sessions
• Multiple monitor types (HTTP, ping, etc.) work correctly
• Maintenance pause dialogs work correctly
• No JavaScript errors in console
• Responsive design maintained

Browser Compatibility:

• Chrome/Chromium
• Firefox
• Safari (if available)
• Edge

[CommanderStorm]

looks mostly good.

The issue you linked is wrong, or at least I am failing to see the relevance.

Also I would like to see this more properly integrated into the settings, so this first of all is persistent across devices and secondly users can uncheck it

[CommanderStorm]

Please only add props which you are actually using, unused features create bugs

[Raj4478]

@CommanderStorm i have made the changes, please have a look

[Raj4478]

Hi @CommanderStorm, I have reverted back to Confirm.vue and deleted the PauseConfirm and extra logic that was added before, simply added a checkbox to Confirm.vue with a flag that becomes true when pause button is clicked

[CommanderStorm]

How does this fit into the confirm component?
Seems very bolted onto the side. I don't think this is a good engineering decision.
I would much prefer the solution that I suggested.

Also: are you a human? Your answers and decisions se m very LLM-Like

[Raj4478]

@CommanderStorm i am human , the reason i did was because i thought that this would make the workflow more simple as confirm and pauseConfirm had 80% similar fields but i admit this was a mistake The Confirm component now has two distinct responsibilities:
Generic confirmation dialogs
Pause-specific "do not show again" functionality. Actually i am learning vue (am a college student)and i thought i would learn a lot if i could read this repo and see how i can make contribution to this repo.T hank you for showing me my mistakes, Learned a lot

[CommanderStorm]

Ah, thanks for the explanation.

So if you are learning, you might not know about this:

• the confirm component has a <slot>
• so we wrap <Confirm><whatever we need here></Confirm>
• this can then be its own component <ConfirmWithDoNotShowAgain settings-key="abc" @yes="..." />

So we can just reuse that work without either duplicating this component or fitting the change in there.

[Raj4478]

Hi @CommanderStorm , can you take a look at the code again, i tried to implement your instructions, i think that this might work and also at ConfirmwithDonotShowAgain line 6 i have kept @yES="handleYes"
@no="handleNo" should i just remove them so that it can use from Confirm.vue or should i let it be for better readability as it becomes clearer what text will be shown

[CommanderStorm]

I am getting a bit annoyed.

Have you tested that your code works?
<Confirm> does not have the options that you are passing.
Please test your code and do a thorough self-review.