@decido/shell 1.0.0

package/src/hooks/useAgentStream.ts

@@ -0,0 +1,220 @@
+/**
+ * useAgentStream — Typed event consumer for Decido Agent cognitive loop.
+ *
+ * 📚 Inspired by Gemini CLI's Turn event system:
+ *   - Each event is typed (StatusChanged, Thought, ToolCallRequest, etc.)
+ *   - Events map to specific UI components (ThinkingBlock, ToolCallBlock, etc.)
+ *   - Supports multiple subscribers (broadcast pattern)
+ *
+ * This hook listens to Tauri IPC events from the Rust core-rust agent's
+ * broadcast channel (AgentStreamEvent) and maps them to ExecutionSteps
+ * for the chat timeline.
+ *
+ * Usage:
+ *   const { events, isActive, lastThought } = useAgentStream(agentId);
+ */
+import { useState, useEffect, useCallback, useRef } from 'react';
+import { usePlaygroundStore } from '../store/usePlaygroundStore';
+import type { ExecutionStep } from '../store/playgroundTypes';
+
+// Mirror of Rust AgentStreamEvent (from stream_events.rs)
+export interface AgentStreamEvent {
+    type: string;
+    // StatusChanged
+    status?: string;
+    agent_id?: string;
+    // Thought
+    summary?: string;
+    trace_id?: string;
+    // ToolCallRequest / ToolCallResponse
+    call_id?: string;
+    name?: string;
+    args?: Record<string, unknown>;
+    result?: unknown;
+    error?: string;
+    duration_ms?: number;
+    // ToolCallConfirmation
+    tool_name?: string;
+    details?: { kind: string; message?: string; command?: string; path?: string };
+    // Retry
+    attempt?: number;
+    max_attempts?: number;
+    delay_ms?: number;
+    reason?: string;
+    // Error
+    message?: string;
+    recoverable?: boolean;
+    // Finished
+    usage?: { input_tokens: number; output_tokens: number; total_tokens: number };
+    // GasUpdate
+    remaining?: number;
+    max?: number;
+    consumed?: number;
+    // LoopDetected
+    repeated_tool?: string;
+    count?: number;
+}
+
+interface UseAgentStreamOptions {
+    /** Whether to auto-create ExecutionSteps from events */
+    autoTimeline?: boolean;
+}
+
+export function useAgentStream(agentId: string | null, options: UseAgentStreamOptions = {}) {
+    const { autoTimeline = true } = options;
+
+    const [events, setEvents] = useState<AgentStreamEvent[]>([]);
+    const [isActive, setIsActive] = useState(false);
+    const [lastThought, setLastThought] = useState<string | null>(null);
+    const [lastStatus, setLastStatus] = useState<string>('idle');
+    const executionStepsRef = useRef<ExecutionStep[]>([]);
+
+    const addChatMessage = usePlaygroundStore(s => s.addChatMessage);
+
+    const handleEvent = useCallback((event: AgentStreamEvent) => {
+        setEvents(prev => [...prev, event]);
+
+        switch (event.type) {
+            case 'status_changed':
+                setLastStatus(event.status || 'unknown');
+                setIsActive(event.status !== 'idle' && event.status !== 'terminated');
+                if (autoTimeline) {
+                    executionStepsRef.current.push({
+                        type: event.status === 'thinking' ? 'thinking' : 'text_delta',
+                        label: event.status || 'Unknown',
+                        startTime: Date.now(),
+                    });
+                }
+                break;
+
+            case 'thought':
+                setLastThought(event.summary || null);
+                if (autoTimeline) {
+                    executionStepsRef.current.push({
+                        type: 'thinking',
+                        label: event.summary?.slice(0, 80) || 'Thinking...',
+                        startTime: Date.now(),
+                        endTime: Date.now(),
+                    });
+                }
+                break;
+
+            case 'tool_call_request':
+                if (autoTimeline) {
+                    executionStepsRef.current.push({
+                        type: 'tool_call' as any,
+                        label: `🔧 ${event.name}`,
+                        startTime: Date.now(),
+                    });
+                }
+                break;
+
+            case 'tool_call_response':
+                if (autoTimeline) {
+                    const last = executionStepsRef.current[executionStepsRef.current.length - 1];
+                    if (last) last.endTime = Date.now();
+                    executionStepsRef.current.push({
+                        type: 'text_complete',
+                        label: event.error
+                            ? `❌ ${event.name}: ${event.error}`
+                            : `✅ ${event.name} (${event.duration_ms}ms)`,
+                        startTime: Date.now(),
+                        endTime: Date.now(),
+                    });
+                }
+                break;
+
+            case 'tool_call_confirmation':
+                addChatMessage({
+                    type: 'alert',
+                    sender: 'system',
+                    text: `⚠️ Agent requests approval: ${event.tool_name} — ${event.details?.message || ''}`,
+                });
+                break;
+
+            case 'retry':
+                if (autoTimeline) {
+                    executionStepsRef.current.push({
+                        type: 'retry' as any,
+                        label: `🔄 Retry ${event.attempt}/${event.max_attempts}: ${event.reason}`,
+                        startTime: Date.now(),
+                    });
+                }
+                break;
+
+            case 'error':
+                addChatMessage({
+                    type: 'error',
+                    sender: 'system',
+                    text: `❌ ${event.message}${event.recoverable ? ' (recoverable)' : ''}`,
+                });
+                break;
+
+            case 'finished':
+                setIsActive(false);
+                if (autoTimeline) {
+                    executionStepsRef.current.push({
+                        type: 'text_complete',
+                        label: 'Complete',
+                        startTime: Date.now(),
+                        endTime: Date.now(),
+                    });
+                }
+                break;
+
+            case 'gas_update':
+                // Gas info is available via event properties (remaining, max, consumed)
+                break;
+
+            case 'loop_detected':
+                addChatMessage({
+                    type: 'alert',
+                    sender: 'system',
+                    text: `🔁 Loop detected: ${event.repeated_tool} called ${event.count} times`,
+                });
+                break;
+        }
+    }, [autoTimeline, addChatMessage]);
+
+    // Listen to Tauri IPC events from the Rust kernel
+    useEffect(() => {
+        if (!agentId) return;
+
+        let unlisten: (() => void) | null = null;
+
+        const setup = async () => {
+            try {
+                // Dynamic import to avoid build failures when not in Tauri context
+                const { listen } = await import('@tauri-apps/api/event');
+                const cleanup = await listen<AgentStreamEvent>(
+                    `agent-stream:${agentId}`,
+                    (e) => handleEvent(e.payload),
+                );
+                unlisten = cleanup;
+            } catch {
+                // Not in Tauri context (dev mode) — use mock EventSource fallback
+                console.debug('[useAgentStream] Not in Tauri context, using event bus fallback');
+            }
+        };
+
+        setup();
+
+        return () => {
+            unlisten?.();
+        };
+    }, [agentId, handleEvent]);
+
+    const clearEvents = useCallback(() => {
+        setEvents([]);
+        executionStepsRef.current = [];
+    }, []);
+
+    return {
+        events,
+        isActive,
+        lastThought,
+        lastStatus,
+        executionSteps: executionStepsRef.current,
+        clearEvents,
+    };
+}

package/src/hooks/useAutoUpdater.ts

@@ -0,0 +1,89 @@
+import { useEffect } from 'react';
+import { kernel } from '@decido/kernel-bridge';
+import { useUpdaterStore } from '../store/UpdaterStore';
+export interface UseAutoUpdaterOptions {
+    appName?: string;
+    onUpdateAvailable?: (version: string, date?: string) => void;
+    onUpdateFinished?: () => void;
+    delayMs?: number;
+}
+
+export const useAutoUpdater = ({
+    appName = "Decido OS",
+    onUpdateAvailable,
+    onUpdateFinished,
+    delayMs = 4000
+}: UseAutoUpdaterOptions = {}) => {
+    const updaterStore = useUpdaterStore();
+
+    useEffect(() => {
+        const checkForUpdates = async () => {
+            if (!('__TAURI_INTERNALS__' in window)) {
+                console.info('[Updater] Ejecución en navegador detectada. Saltando buscar OTA de Tauri.');
+                return;
+            }
+            try {
+                updaterStore.setChecking();
+                
+                const updater = await import('@tauri-apps/plugin-updater');
+                const update = await updater.check();
+                
+                if (update) {
+                    console.info(`[Updater] Nueva versión encontrada: ${update.version} (${update.date})`);
+
+                    if (onUpdateAvailable) {
+                        onUpdateAvailable(update.version, update.date);
+                    } else {
+                        kernel.notify('🚀 Actualización Disponible', `Descargando silenciósamente la versión ${update.version}...`);
+                    }
+
+                    let downloaded = 0;
+                    let contentLength = 0;
+
+                    await update.downloadAndInstall((event) => {
+                        switch (event.event) {
+                            case 'Started':
+                                contentLength = event.data.contentLength as number;
+                                updaterStore.setDownloading(update.version, contentLength);
+                                break;
+                            case 'Progress':
+                                updaterStore.updateProgress(event.data.chunkLength);
+                                break;
+                            case 'Finished':
+                                console.info('[Updater] Descarga completada. Preparando reinicio.');
+                                updaterStore.setInstalling();
+                                break;
+                        }
+                    });
+
+                    if (onUpdateFinished) {
+                        onUpdateFinished();
+                    } else {
+                        updaterStore.setRebooting();
+                        setTimeout(async () => {
+                            const process = await import('@tauri-apps/plugin-process');
+                            process.relaunch();
+                        }, 3000);
+                    }
+
+                } else {
+                    updaterStore.reset();
+                }
+            } catch (error: any) {
+                const msg = error?.toString() || '';
+                // Treat ANY network/fetch failure as "offline mode" — don't show intrusive error UI
+                if (msg.includes('url') || msg.includes('404') || msg.includes('offline')
+                    || msg.includes('Could not fetch') || msg.includes('fetch')
+                    || msg.includes('network') || msg.includes('ECONNREFUSED')) {
+                    console.info('[Updater] OTA no disponible — modo local/offline.');
+                    updaterStore.reset();
+                } else {
+                    console.error('[Updater] Falló el escaneo de actualizaciones:', error);
+                    updaterStore.setError(msg);
+                }
+            }
+        };
+
+        setTimeout(checkForUpdates, delayMs);
+    }, [appName, onUpdateAvailable, onUpdateFinished, delayMs]);
+};

package/src/hooks/useBootSequence.ts

@@ -0,0 +1,20 @@
+import { useEffect } from 'react';
+import { usePlaygroundStore } from '../store/usePlaygroundStore';
+import { playSound } from './useSoundEffects';
+
+/**
+ * useBootSequence — Handles the initial boot animation timer.
+ * After 2.5s, sets isBooting=false and plays a success sound.
+ */
+export function useBootSequence() {
+    const setIsBooting = usePlaygroundStore((s) => s.setIsBooting);
+    const isMuted = usePlaygroundStore((s) => s.isMuted);
+
+    useEffect(() => {
+        const timer = setTimeout(() => {
+            setIsBooting(false);
+            playSound('success', isMuted);
+        }, 2500);
+        return () => clearTimeout(timer);
+    }, [isMuted, setIsBooting]);
+}

package/src/hooks/useExportDSD.ts

@@ -0,0 +1,53 @@
+import { usePlaygroundStore } from '../store/usePlaygroundStore';
+import { useTimelineStore } from '@decido/engine';
+
+/**
+ * useExportDSD — Handles exporting the current blueprint as a
+ * Decido Standard Document (.dsd) file.
+ */
+export function useExportDSD() {
+    const { prototypeBrand, addLog } = usePlaygroundStore();
+    const currentBlueprint = useTimelineStore(
+        (s) => s.timelines[prototypeBrand]
+    );
+
+    const handleExport = async () => {
+        if (!currentBlueprint) {
+            addLog('No hay un blueprint activo para exportar.', 'error');
+            return;
+        }
+
+        try {
+            const dsdPayload = {
+                format: 'decido-standard-document',
+                version: '1.0',
+                exportedAt: new Date().toISOString(),
+                brand: prototypeBrand,
+                blueprint: currentBlueprint,
+            };
+
+            const blob = new Blob([JSON.stringify(dsdPayload, null, 2)], {
+                type: 'application/json',
+            });
+            const url = URL.createObjectURL(blob);
+
+            const a = document.createElement('a');
+            a.href = url;
+            a.download = `${prototypeBrand}-demo.dsd`;
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
+            URL.revokeObjectURL(url);
+
+            addLog(
+                `Grafo exportado exitosamente como ${prototypeBrand}-demo.dsd`,
+                'success'
+            );
+        } catch (e) {
+            addLog(`Error exportando DSD: ${e}`, 'error');
+            console.error(e);
+        }
+    };
+
+    return { handleExport };
+}

package/src/hooks/useFullscreen.ts

@@ -0,0 +1,35 @@
+import { useEffect, useCallback } from 'react';
+import { usePlaygroundStore } from '../store/usePlaygroundStore';
+
+/**
+ * useFullscreen — Manages native fullscreen API.
+ * Keeps usePlaygroundStore.isFullscreen in sync with document.fullscreenElement.
+ *
+ * Returns: { isFullscreen, toggleFullscreen }
+ */
+export function useFullscreen() {
+    const isFullscreen = usePlaygroundStore((s) => s.isFullscreen);
+    const setIsFullscreen = usePlaygroundStore((s) => s.setIsFullscreen);
+
+    const toggleFullscreen = useCallback(() => {
+        if (!document.fullscreenElement) {
+            document.documentElement
+                .requestFullscreen()
+                .catch((err) =>
+                    console.error(`Fullscreen err: ${err.message}`)
+                );
+        } else {
+            if (document.exitFullscreen) document.exitFullscreen();
+        }
+    }, []);
+
+    useEffect(() => {
+        const handleChange = () =>
+            setIsFullscreen(!!document.fullscreenElement);
+        document.addEventListener('fullscreenchange', handleChange);
+        return () =>
+            document.removeEventListener('fullscreenchange', handleChange);
+    }, [setIsFullscreen]);
+
+    return { isFullscreen, toggleFullscreen };
+}