Skip to content

Fix delete button click propagation in list views#3304

Merged
kbeaugrand merged 4 commits into
mainfrom
copilot/fix-delete-button-functionality
Jan 31, 2026
Merged

Fix delete button click propagation in list views#3304
kbeaugrand merged 4 commits into
mainfrom
copilot/fix-delete-button-functionality

Conversation

Copilot AI commented Jan 31, 2026

Copy link
Copy Markdown
Contributor

Description

Delete buttons in list views triggered row click navigation due to event bubbling. Clicking delete would navigate to detail page instead of showing confirmation modal.

Changes:

  • Added @onclick:stopPropagation="true" to MudTd cells containing delete buttons in 6 list pages:
    • DeviceModelListPage.razor
    • EdgeModelListPage.razor
    • DeviceListPage.razor
    • EdgeDeviceListPage.razor
    • ConcentratorListPage.razor
    • PlanningListPage.razor
  • Corrected MudTh to MudTd in PlanningListPage RowTemplate
  • Added test verifying delete click doesn't trigger navigation

Example:

@* Before - click propagates to row *@
<MudTd DataLabel="Delete" Style="text-align: center">
    <MudIconButton OnClick="@(e => DeleteDeviceModel(context))" />
</MudTd>

@* After - click isolated to button *@
<MudTd DataLabel="Delete" Style="text-align: center" @onclick:stopPropagation="true">
    <MudIconButton OnClick="@(e => DeleteDeviceModel(context))" />
</MudTd>

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Tests
  • Other
Original prompt

This section details on the original issue you should resolve

<issue_title>Bug: Delete button doesn't work on device models</issue_title>
<issue_description><!--
Hi there! Thank you for discovering and submitting an issue!

-->

Expected Behavior

Same behavior as devices: Display a modal to confirm, and delete the model if the user confirms

Current Behavior

Clicking on Delete redirects to the model page, which then allows to delete the model with the big delete button.

Steps to Reproduce

  1. Click on the 🗑️ button

Context (Environment)

Portal version: 4.13.2.170
LoRaWAN Stack version: 2.2.2

Logs

Additional Information

Comments on the Issue (you are @copilot in this section)

@judramos Clicking redirects to the model page only if deletion button is disable (for builtined models). Deletion should not be authorized on the model page in this case. This issue is linked to the [#2856](https://github.com//issues/2856).

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Copilot AI and others added 3 commits January 31, 2026 12:16
Added @OnClick:stopPropagation="true" to MudTd elements containing delete buttons to prevent row click events from firing when clicking delete. This fixes the issue where clicking delete would navigate to detail pages instead of showing the confirmation modal.

Fixed in:
- DeviceModelListPage
- EdgeModelListPage
- DeviceListPage
- EdgeDeviceListPage
- ConcentratorListPage
- PlanningListPage

Co-authored-by: kbeaugrand <9513635+kbeaugrand@users.noreply.github.com>
Added test ClickOnDeleteShouldNotNavigateToDetailsPage to verify that clicking the delete button shows the confirmation dialog without navigating to the detail page.

Co-authored-by: kbeaugrand <9513635+kbeaugrand@users.noreply.github.com>
Corrected the element type from MudTh to MudTd for the delete button cell in the RowTemplate. MudTh should only be used in HeaderContent.

Co-authored-by: kbeaugrand <9513635+kbeaugrand@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix delete button behavior on device models Fix delete button click propagation in list views Jan 31, 2026
Copilot AI requested a review from kbeaugrand January 31, 2026 12:26
@codecov

codecov Bot commented Jan 31, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 81.06%. Comparing base (f3dd641) to head (f3e8a33).
⚠️ Report is 3 commits behind head on main.

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #3304   +/-   ##
=======================================
  Coverage   81.06%   81.06%           
=======================================
  Files         375      375           
  Lines       14268    14268           
  Branches     1213     1213           
=======================================
  Hits        11567    11567           
  Misses       2338     2338           
  Partials      363      363           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@kbeaugrand
kbeaugrand marked this pull request as ready for review January 31, 2026 12:47
@kbeaugrand
kbeaugrand requested a review from a team as a code owner January 31, 2026 12:47
Copilot AI review requested due to automatic review settings January 31, 2026 12:47
@kbeaugrand
kbeaugrand enabled auto-merge (rebase) January 31, 2026 12:47

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR fixes a bug where clicking delete buttons in list views would trigger row navigation instead of showing the deletion confirmation modal. The issue occurred because click events were bubbling from the delete button to the row's OnRowClick handler.

Changes:

  • Added @onclick:stopPropagation="true" to delete button cells in 6 list pages to prevent event bubbling
  • Corrected MudTh to MudTd in PlanningListPage's RowTemplate
  • Added test verifying delete button clicks don't trigger navigation

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated no comments.

Show a summary per file
File Description
DeviceModelListPage.razor Added stopPropagation to delete button cell to prevent row click navigation
EdgeModelListPage.razor Added stopPropagation to delete button cell to prevent row click navigation
DeviceListPage.razor Added stopPropagation to delete button cell to prevent row click navigation
EdgeDeviceListPage.razor Added stopPropagation to delete button cell to prevent row click navigation
ConcentratorListPage.razor Added stopPropagation to delete button cell to prevent row click navigation
PlanningListPage.razor Added stopPropagation to delete button cell and corrected MudTh to MudTd in RowTemplate
DeviceModelListPageTests.cs Added test to verify delete button click doesn't trigger navigation to details page

@kbeaugrand
kbeaugrand disabled auto-merge January 31, 2026 12:55
@kbeaugrand
kbeaugrand merged commit ab86bb5 into main Jan 31, 2026
12 checks passed
@kbeaugrand
kbeaugrand deleted the copilot/fix-delete-button-functionality branch January 31, 2026 12:55
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.

Bug: Delete button doesn't work on device models

3 participants