From 6fce5620e0c178b04c8bdd660275e39e0fc74d89 Mon Sep 17 00:00:00 2001
From: Max Schmitt <max@schmitt.mx>
Date: Mon, 18 Nov 2024 10:21:28 +0100
Subject: [PATCH] fix(ui-mode): use onChange instead of onClick for <input
 type='checkbox' (#33636)

---
 packages/trace-viewer/src/ui/settingsView.tsx      | 2 +-
 packages/trace-viewer/src/ui/uiModeFiltersView.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/trace-viewer/src/ui/settingsView.tsx b/packages/trace-viewer/src/ui/settingsView.tsx
index 883e4abca5..0a4340b2b6 100644
--- a/packages/trace-viewer/src/ui/settingsView.tsx
+++ b/packages/trace-viewer/src/ui/settingsView.tsx
@@ -30,7 +30,7 @@ export const SettingsView: React.FunctionComponent<{
     {settings.map(({ value, set, title }) => {
       return <div key={title} className='setting'>
         <label>
-          <input type='checkbox' checked={value} onClick={() => set(!value)}/>
+          <input type='checkbox' checked={value} onChange={() => set(!value)}/>
           {title}
         </label>
       </div>;
diff --git a/packages/trace-viewer/src/ui/uiModeFiltersView.tsx b/packages/trace-viewer/src/ui/uiModeFiltersView.tsx
index 314fce3a96..8ed0f47982 100644
--- a/packages/trace-viewer/src/ui/uiModeFiltersView.tsx
+++ b/packages/trace-viewer/src/ui/uiModeFiltersView.tsx
@@ -62,7 +62,7 @@ export const FiltersView: React.FC<{
         {[...statusFilters.entries()].map(([status, value]) => {
           return <div className='filter-entry' key={status} role='listitem'>
             <label>
-              <input type='checkbox' checked={value} onClick={() => {
+              <input type='checkbox' checked={value} onChange={() => {
                 const copy = new Map(statusFilters);
                 copy.set(status, !copy.get(status));
                 setStatusFilters(copy);
@@ -76,7 +76,7 @@ export const FiltersView: React.FC<{
         {[...projectFilters.entries()].map(([projectName, value]) => {
           return <div className='filter-entry' key={projectName}  role='listitem'>
             <label>
-              <input type='checkbox' checked={value} onClick={() => {
+              <input type='checkbox' checked={value} onChange={() => {
                 const copy = new Map(projectFilters);
                 copy.set(projectName, !copy.get(projectName));
                 setProjectFilters(copy);