From 1fcff6a4393a66618130d33401c8a1eb8009e6c1 Mon Sep 17 00:00:00 2001
From: Aron Prins <pwf.aron@gmail.com>
Date: Mon, 13 Apr 2026 11:21:49 +0200
Subject: [PATCH] refactor(ui): use Checkbox primitive in ScheduleEditor

Swap raw <input type="checkbox"> for the shadcn Checkbox component so
the "only between certain hours" and "weekdays only" toggles get the
same focus ring, shadow, and dark-mode behaviour as every other
checkbox in the app.
---
 ui/src/components/ScheduleEditor.tsx | 13 +++++--------
 1 file changed, 5 insertions(+), 8 deletions(-)

diff --git a/ui/src/components/ScheduleEditor.tsx b/ui/src/components/ScheduleEditor.tsx
index 7c0e6c04d6..d40263300d 100644
--- a/ui/src/components/ScheduleEditor.tsx
+++ b/ui/src/components/ScheduleEditor.tsx
@@ -4,6 +4,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { Badge } from "@/components/ui/badge";
+import { Checkbox } from "@/components/ui/checkbox";
 import { Separator } from "@/components/ui/separator";
 import { X } from "lucide-react";
 
@@ -840,11 +841,9 @@ function WindowAndWeekdaysToggles({
     <>
       <div className="space-y-2">
         <label className="flex items-center gap-2 cursor-pointer text-sm">
-          <input
-            type="checkbox"
+          <Checkbox
             checked={state.windowEnabled}
-            onChange={(e) => update({ windowEnabled: e.target.checked })}
-            className="h-4 w-4"
+            onCheckedChange={(checked) => update({ windowEnabled: checked === true })}
           />
           <span>Only between certain hours</span>
         </label>
@@ -898,11 +897,9 @@ function WeekdaysOnlyToggle({
 }) {
   return (
     <label className="flex items-center gap-2 cursor-pointer text-sm">
-      <input
-        type="checkbox"
+      <Checkbox
         checked={state.weekdaysOnly}
-        onChange={(e) => update({ weekdaysOnly: e.target.checked })}
-        className="h-4 w-4"
+        onCheckedChange={(checked) => update({ weekdaysOnly: checked === true })}
       />
       <span>Weekdays only (Mon–Fri)</span>
     </label>