feat(channel-card): add confirmation dialog for schedule regeneration

- Removed unnecessary class names for buttons in ChannelCard and DashboardPage components.
- Updated layout styles in RootLayout to apply dark mode by default.
- Refactored edit-channel-sheet to streamline block editor and filter editor components.
- Adjusted duration input fields to reflect minutes instead of seconds in AlgorithmicFilterEditor.
- Enhanced the structure of the EditChannelSheet for better readability and maintainability.

k-tv-frontend/app/(main)/dashboard/components/channel-card.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { useState } from "react";
 import Link from "next/link";
 import {
   Pencil,
@@ -14,6 +15,7 @@ import {
 import { Button } from "@/components/ui/button";
 import { useActiveSchedule } from "@/hooks/use-channels";
 import type { ChannelResponse } from "@/lib/types";
+import { ConfirmDialog } from "./confirm-dialog";
 
 interface ChannelCardProps {
   channel: ChannelResponse;
@@ -65,6 +67,7 @@ export function ChannelCard({
   onMoveUp,
   onMoveDown,
 }: ChannelCardProps) {
+  const [confirmOpen, setConfirmOpen] = useState(false);
   const blockCount = channel.schedule_config.blocks.length;
   const { status, label } = useScheduleStatus(channel.id);
 
@@ -155,7 +158,13 @@ export function ChannelCard({
       <div className="flex gap-2">
         <Button
           size="sm"
-          onClick={onGenerateSchedule}
+          onClick={() => {
+            if (status !== "none") {
+              setConfirmOpen(true);
+            } else {
+              onGenerateSchedule();
+            }
+          }}
           disabled={isGenerating}
           className={`flex-1 ${status === "expired" ? "border border-red-800/50 bg-red-950/30 text-red-300 hover:bg-red-900/40" : ""}`}
         >
@@ -168,7 +177,6 @@ export function ChannelCard({
           size="icon-sm"
           onClick={onViewSchedule}
           title="View schedule"
-          className="border-zinc-700 text-zinc-400 hover:text-zinc-100"
         >
           <CalendarDays className="size-3.5" />
         </Button>
@@ -176,13 +184,28 @@ export function ChannelCard({
           size="icon-sm"
           asChild
           title="Watch on TV"
-          className="border-zinc-700 text-zinc-400 hover:text-zinc-100"
         >
           <Link href={`/tv?channel=${channel.id}`}>
             <Tv2 className="size-3.5" />
           </Link>
         </Button>
       </div>
+      <ConfirmDialog
+        open={confirmOpen}
+        onOpenChange={setConfirmOpen}
+        title="Regenerate schedule?"
+        description={
+          <>
+            <span className="font-medium text-zinc-200">{channel.name}</span>
+            {" "}already has an active schedule. Generating a new one will overwrite it immediately.
+          </>
+        }
+        confirmLabel="Regenerate"
+        onConfirm={() => {
+          setConfirmOpen(false);
+          onGenerateSchedule();
+        }}
+      />
     </div>
   );
 }

k-tv-frontend/app/(main)/dashboard/components/confirm-dialog.tsx

@@ -0,0 +1,67 @@
+"use client";
+
+import React from "react";
+import {
+  AlertDialog,
+  AlertDialogContent,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogCancel,
+  AlertDialogAction,
+} from "@/components/ui/alert-dialog";
+
+interface ConfirmDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  title: string;
+  description: React.ReactNode;
+  confirmLabel?: string;
+  cancelLabel?: string;
+  onConfirm: () => void;
+  isPending?: boolean;
+  destructive?: boolean;
+}
+
+export function ConfirmDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  confirmLabel = "Confirm",
+  cancelLabel = "Cancel",
+  onConfirm,
+  isPending,
+  destructive,
+}: ConfirmDialogProps) {
+  return (
+    <AlertDialog open={open} onOpenChange={onOpenChange}>
+      <AlertDialogContent className="bg-zinc-900 border-zinc-800 text-zinc-100">
+        <AlertDialogHeader>
+          <AlertDialogTitle>{title}</AlertDialogTitle>
+          <AlertDialogDescription className="text-zinc-400">
+            {description}
+          </AlertDialogDescription>
+        </AlertDialogHeader>
+        <AlertDialogFooter>
+          <AlertDialogCancel
+            disabled={isPending}
+            className="border-zinc-700 bg-transparent text-zinc-300 hover:bg-zinc-800 hover:text-zinc-100"
+          >
+            {cancelLabel}
+          </AlertDialogCancel>
+          <AlertDialogAction
+            onClick={onConfirm}
+            disabled={isPending}
+            className={
+              destructive ? "bg-red-600 text-white hover:bg-red-700" : undefined
+            }
+          >
+            {confirmLabel}
+          </AlertDialogAction>
+        </AlertDialogFooter>
+      </AlertDialogContent>
+    </AlertDialog>
+  );
+}

k-tv-frontend/app/(main)/dashboard/page.tsx

@@ -241,7 +241,6 @@ export default function DashboardPage() {
             <Button
               onClick={() => setTranscodeOpen(true)}
               title="Transcode settings"
-              className="border-zinc-700 text-zinc-400 hover:text-zinc-100"
             >
               <Settings2 className="size-4" />
               Transcode
@@ -257,7 +256,6 @@ export default function DashboardPage() {
               }
               disabled={rescanLibrary.isPending}
               title="Rescan local files directory"
-              className="border-zinc-700 text-zinc-400 hover:text-zinc-100"
             >
               <RefreshCw className={`size-4 ${rescanLibrary.isPending ? "animate-spin" : ""}`} />
               Rescan library
@@ -268,7 +266,6 @@ export default function DashboardPage() {
               onClick={handleRegenerateAll}
               disabled={isRegeneratingAll}
               title="Regenerate schedules for all channels"
-              className="border-zinc-700 text-zinc-400 hover:text-zinc-100"
             >
               <RefreshCw
                 className={`size-4 ${isRegeneratingAll ? "animate-spin" : ""}`}
@@ -276,17 +273,11 @@ export default function DashboardPage() {
               Regenerate all
             </Button>
           )}
-          <Button
+          <Button onClick={() => setIptvOpen(true)}>
-            onClick={() => setIptvOpen(true)}
-            className="border-zinc-700 text-zinc-300 hover:text-zinc-100"
-          >
             <Antenna className="size-4" />
             IPTV
           </Button>
-          <Button
+          <Button onClick={() => setImportOpen(true)}>
-            onClick={() => setImportOpen(true)}
-            className="border-zinc-700 text-zinc-300 hover:text-zinc-100"
-          >
             <Upload className="size-4" />
             Import
           </Button>

k-tv-frontend/app/layout.tsx

@@ -26,7 +26,7 @@ export default function RootLayout({
   children: React.ReactNode;
 }>) {
   return (
-    <html lang="en">
+    <html lang="en" className="dark">
       <head>
         <Script
           src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"