feat: Add real-time IO/interlock updates, HW status display, and history page

- Implement real-time IO value updates via IOValueChanged event
- Add interlock toggle and real-time interlock change events
- Fix ToggleLight to check return value of DIO.SetRoomLight
- Add HW status display in Footer matching WinForms HWState
- Implement GetHWStatus API and 250ms broadcast interval
- Create HistoryPage React component for work history viewing
- Add GetHistoryData API for database queries
- Add date range selection, search, filter, and CSV export
- Add History button in Header navigation
- Add PickerMoveDialog component for manage operations
- Fix DataSet column names (idx, PRNATTACH, PRNVALID, qtymax)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

FrontEnd/contexts/AlertContext.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, useContext, useState, ReactNode } from 'react';
+import React, { createContext, useContext, useState, ReactNode, useCallback, useRef } from 'react';
 
 interface AlertConfig {
     type: 'success' | 'error' | 'warning' | 'info';
@@ -6,8 +6,14 @@ interface AlertConfig {
     message: string;
 }
 
+interface ConfirmConfig {
+    title: string;
+    message: string;
+}
+
 interface AlertContextType {
     showAlert: (config: AlertConfig) => void;
+    showConfirm: (config: ConfirmConfig) => Promise<boolean>;
 }
 
 const AlertContext = createContext<AlertContextType | undefined>(undefined);
@@ -26,6 +32,8 @@ interface AlertProviderProps {
 
 export const AlertProvider: React.FC<AlertProviderProps> = ({ children }) => {
     const [alertConfig, setAlertConfig] = useState<(AlertConfig & { isOpen: boolean }) | null>(null);
+    const [confirmConfig, setConfirmConfig] = useState<(ConfirmConfig & { isOpen: boolean }) | null>(null);
+    const confirmResolveRef = useRef<((value: boolean) => void) | null>(null);
 
     const showAlert = (config: AlertConfig) => {
         setAlertConfig({ ...config, isOpen: true });
@@ -35,9 +43,25 @@ export const AlertProvider: React.FC<AlertProviderProps> = ({ children }) => {
         setAlertConfig(null);
     };
 
+    const showConfirm = useCallback((config: ConfirmConfig): Promise<boolean> => {
+        return new Promise((resolve) => {
+            confirmResolveRef.current = resolve;
+            setConfirmConfig({ ...config, isOpen: true });
+        });
+    }, []);
+
+    const handleConfirm = (result: boolean) => {
+        setConfirmConfig(null);
+        if (confirmResolveRef.current) {
+            confirmResolveRef.current(result);
+            confirmResolveRef.current = null;
+        }
+    };
+
     return (
-        <AlertContext.Provider value={{ showAlert }}>
+        <AlertContext.Provider value={{ showAlert, showConfirm }}>
             {children}
+            {/* Alert Dialog */}
             {alertConfig && (
                 <div className="fixed inset-0 z-[100] flex items-center justify-center">
                     {/* Backdrop */}
@@ -77,6 +101,53 @@ export const AlertProvider: React.FC<AlertProviderProps> = ({ children }) => {
                     </div>
                 </div>
             )}
+
+            {/* Confirm Dialog */}
+            {confirmConfig && (
+                <div className="fixed inset-0 z-[100] flex items-center justify-center">
+                    {/* Backdrop */}
+                    <div
+                        className="absolute inset-0 bg-black/80 backdrop-blur-sm"
+                        onClick={() => handleConfirm(false)}
+                    />
+
+                    {/* Dialog */}
+                    <div className="relative bg-black/95 backdrop-blur-md border-2 border-amber-500 rounded-lg shadow-2xl max-w-md w-full mx-4 animate-fadeIn">
+                        {/* Icon and Title */}
+                        <div className="flex items-center gap-4 p-6 border-b border-white/10">
+                            <svg className="w-12 h-12 text-amber-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M8.228 9c.549-1.165 2.03-2 3.772-2 2.21 0 4 1.343 4 3 0 1.4-1.278 2.575-3.006 2.907-.542.104-.994.54-.994 1.093m0 3h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+                            </svg>
+                            <h2 className="text-xl font-tech font-bold text-white uppercase tracking-wider">
+                                {confirmConfig.title}
+                            </h2>
+                        </div>
+
+                        {/* Message */}
+                        <div className="p-6 max-w-full overflow-hidden">
+                            <p className="text-slate-300 font-mono text-sm whitespace-pre-wrap leading-relaxed break-words max-w-full">
+                                {confirmConfig.message}
+                            </p>
+                        </div>
+
+                        {/* Buttons */}
+                        <div className="flex justify-end gap-3 p-6 border-t border-white/10">
+                            <button
+                                onClick={() => handleConfirm(false)}
+                                className="px-6 py-2 bg-slate-700 hover:bg-slate-600 border border-white/20 text-white font-tech font-bold rounded transition-colors"
+                            >
+                                No
+                            </button>
+                            <button
+                                onClick={() => handleConfirm(true)}
+                                className="px-6 py-2 bg-amber-500/20 hover:bg-amber-500/30 border border-amber-500 text-amber-400 font-tech font-bold rounded transition-colors"
+                            >
+                                Yes
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            )}
         </AlertContext.Provider>
     );
 };