vibepulse 0.1.0 → 0.1.2

package/src/hooks/useOpencodeSync.ts

@@ -0,0 +1,378 @@
+'use client';
+
+import { useEffect, useRef, useCallback } from 'react';
+import { useQueryClient } from '@tanstack/react-query';
+import { OpencodeEvent, OpencodeSession } from '@/types';
+import { playAttentionSound, playAlertSound, playCompleteSound } from '@/lib/notificationSound';
+
+const WAITING_STORAGE_KEY = 'vibepulse:waiting-sessions';
+
+function getPersistedWaiting(): Record<string, boolean> {
+    if (typeof window === 'undefined') return {};
+    try {
+        return JSON.parse(localStorage.getItem(WAITING_STORAGE_KEY) || '{}');
+    } catch {
+        return {};
+    }
+}
+
+function persistWaiting(sessionId: string, waiting: boolean) {
+    if (typeof window === 'undefined') return;
+    const state = getPersistedWaiting();
+    if (waiting) {
+        state[sessionId] = true;
+    } else {
+        delete state[sessionId];
+    }
+    localStorage.setItem(WAITING_STORAGE_KEY, JSON.stringify(state));
+}
+
+function inferProjectName(directory?: string): string {
+    if (!directory) return 'Unknown Project';
+    const normalized = directory.replace(/\\/g, '/');
+    const parts = normalized.split('/').filter(Boolean);
+    return parts[parts.length - 1] || 'Unknown Project';
+}
+
+function buildOptimisticSession(info: OpencodeSession): OpencodeSession {
+    const now = Date.now();
+    return {
+        ...info,
+        slug: info.slug || info.id,
+        title: info.title || 'Untitled Session',
+        directory: info.directory || '',
+        projectName: info.projectName || inferProjectName(info.directory),
+        time: info.time || { created: now, updated: now },
+        realTimeStatus: info.realTimeStatus || 'busy',
+        waitingForUser: !!info.waitingForUser,
+        children: info.children || [],
+    };
+}
+
+export function useOpencodeSync() {
+    const queryClient = useQueryClient();
+    const reconnectTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+    const reconnectAttemptsRef = useRef(0);
+    const refetchTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+    const streamRotateTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+    const rotatingRef = useRef(false);
+    const initialLoadRef = useRef(true);
+    const initialLoadTimerRef = useRef<NodeJS.Timeout | null>(null);
+    const MAX_RECONNECT_ATTEMPTS = 5;
+    const BASE_RECONNECT_DELAY = 1000;
+    const STREAM_ROTATE_INTERVAL = 15000;
+
+    const scheduleRefetch = useCallback(() => {
+        if (refetchTimeoutRef.current) return;
+        refetchTimeoutRef.current = setTimeout(() => {
+            queryClient.invalidateQueries({ queryKey: ['sessions'] });
+            refetchTimeoutRef.current = null;
+        }, 500);
+    }, [queryClient]);
+
+    const handleEvent = useCallback((rawEvent: OpencodeEvent | { payload: OpencodeEvent; directory: string }) => {
+        // Unwrap GlobalEvent wrapper if present
+        const event: OpencodeEvent = 'payload' in rawEvent ? rawEvent.payload as OpencodeEvent : rawEvent;
+        if (!event?.type) {
+            scheduleRefetch();
+            return;
+        }
+        const sessionId = event.properties?.sessionID;
+        
+        const handledEvents = [
+            'session.status',
+            'session.updated',
+            'session.created',
+            'session.deleted',
+            'question.asked',
+            'permission.asked',
+            'permission.updated',
+            'question.replied',
+            'question.rejected',
+            'permission.replied',
+            'session.archived'
+        ];
+
+        if (!handledEvents.includes(event.type)) {
+            scheduleRefetch();
+            return;
+        }
+
+        // Update cache based on event type
+        queryClient.setQueryData(['sessions'], (old: { sessions: OpencodeSession[] } | undefined) => {
+            if (!old?.sessions) {
+                scheduleRefetch();
+                return old;
+            }
+
+            switch (event.type) {
+                case 'session.updated':
+                case 'session.created': {
+                    const info = event.properties?.info as OpencodeSession | undefined;
+                    if (!info) { scheduleRefetch(); return old; }
+                    
+                    if (info.parentID) {
+                        let updated = false;
+                        const sessions = old.sessions.map((parent) => {
+                            const hasTargetChild = parent.children?.some((child) => child.id === info.id);
+                            const isTargetParent = parent.id === info.parentID;
+
+                            if (!hasTargetChild && !isTargetParent) {
+                                return parent;
+                            }
+
+                            updated = true;
+                            const children = parent.children || [];
+                            const existingChild = children.find((child) => child.id === info.id);
+                            const child = buildOptimisticSession({
+                                ...existingChild,
+                                ...info,
+                                realTimeStatus: info.realTimeStatus ?? existingChild?.realTimeStatus ?? 'busy',
+                                waitingForUser: info.waitingForUser ?? existingChild?.waitingForUser,
+                            } as OpencodeSession);
+
+                            if (existingChild) {
+                                return {
+                                    ...parent,
+                                    children: children.map((entry) => (entry.id === info.id ? child : entry)),
+                                };
+                            }
+
+                            return {
+                                ...parent,
+                                children: [...children, child],
+                            };
+                        });
+
+                        if (!updated) {
+                            scheduleRefetch();
+                            return old;
+                        }
+
+                        return {
+                            ...old,
+                            sessions,
+                        };
+                    }
+                    
+                    const existing = old.sessions.find(s => s.id === info.id);
+                    if (!existing) {
+                        scheduleRefetch();
+                        return {
+                            ...old,
+                            sessions: [buildOptimisticSession(info), ...old.sessions],
+                        };
+                    }
+                    const merged = { 
+                        ...info, 
+                        projectName: existing.projectName, 
+                        branch: existing.branch, 
+                        realTimeStatus: info.realTimeStatus ?? existing.realTimeStatus, 
+                        waitingForUser: info.waitingForUser ?? existing.waitingForUser,
+                        children: existing.children,
+                    };
+                    return {
+                        ...old,
+                        sessions: old.sessions.map(s => (s.id === info.id ? merged : s)),
+                    };
+                }
+                case 'session.deleted': {
+                    const info = event.properties?.info as OpencodeSession | undefined;
+                    const id = info?.id ?? event.properties?.sessionID;
+                    if (!id) { scheduleRefetch(); return old; }
+                    return { ...old, sessions: old.sessions.filter(s => s.id !== id) };
+                }
+                default: {
+                    if (!sessionId) {
+                        scheduleRefetch();
+                        return old;
+                    }
+
+                    const applyEvent = (s: OpencodeSession): OpencodeSession => {
+                        switch (event.type) {
+                            case 'session.status': {
+                                const statusType = event.properties?.status?.type as 'idle' | 'busy' | 'retry' | undefined;
+                                if (!statusType) return s;
+                                const previousStatus = s.realTimeStatus;
+                                const isParentSession = !s.parentID;
+                                if (statusType === 'retry' && !initialLoadRef.current) {
+                                    playAlertSound();
+                                }
+                                if (
+                                    statusType === 'idle' &&
+                                    !initialLoadRef.current &&
+                                    !s.parentID &&
+                                    (previousStatus === 'busy' || previousStatus === 'retry')
+                                ) {
+                                    playCompleteSound();
+                                }
+                                if (statusType === 'idle') {
+                                    persistWaiting(s.id, false);
+                                }
+                                if (statusType === 'retry') {
+                                    persistWaiting(s.id, true);
+                                }
+                                if (statusType === 'idle' && isParentSession && (s.children?.length || 0) > 0) {
+                                    scheduleRefetch();
+                                }
+                                return { 
+                                    ...s, 
+                                    realTimeStatus: statusType, 
+                                    waitingForUser:
+                                        statusType === 'retry'
+                                            ? true
+                                            : statusType === 'idle'
+                                                ? false
+                                                : s.waitingForUser,
+                                    children: s.children,
+                                };
+                            }
+                            case 'question.asked':
+                            case 'permission.asked':
+                                if (!initialLoadRef.current) {
+                                    playAttentionSound();
+                                }
+                                persistWaiting(sessionId!, true);
+                                return { ...s, waitingForUser: true };
+                            case 'permission.updated':
+                                scheduleRefetch();
+                                return s;
+                            case 'question.replied':
+                            case 'question.rejected':
+                            case 'permission.replied':
+                                persistWaiting(sessionId!, false);
+                                return { ...s, waitingForUser: false };
+                            case 'session.archived':
+                                return { 
+                                    ...s, 
+                                    time: { ...(s.time || {}), archived: Date.now() } 
+                                };
+                            default:
+                                return s;
+                        }
+                    };
+
+                    let found = false;
+                    const newSessions = old.sessions.map((session: OpencodeSession) => {
+                        if (session.id === sessionId) {
+                            found = true;
+                            return applyEvent(session);
+                        }
+                        if (session.children?.some(c => c.id === sessionId)) {
+                            found = true;
+                            // If the event is a status update to 'idle', we should filter the child out
+                            // so it disappears from the UI without needing a full refetch, matching backend logic.
+                            if (event.type === 'session.status' && event.properties?.status?.type === 'idle') {
+                                return {
+                                    ...session,
+                                    children: session.children.filter(c => c.id !== sessionId)
+                                };
+                            }
+                            
+                            return {
+                                ...session,
+                                children: session.children.map(c => c.id === sessionId ? applyEvent(c) : c)
+                            };
+                        }
+                        return session;
+                    });
+
+                    if (!found) {
+                        scheduleRefetch();
+                        return old;
+                    }
+
+                    return { ...old, sessions: newSessions };
+                }
+            }
+        });
+    }, [queryClient, scheduleRefetch]);
+
+    // After initial connection, mark as no longer initial load after 3 seconds
+    useEffect(() => {
+        initialLoadTimerRef.current = setTimeout(() => {
+            initialLoadRef.current = false;
+        }, 3000);
+        return () => {
+            if (initialLoadTimerRef.current) {
+                clearTimeout(initialLoadTimerRef.current);
+            }
+        };
+    }, []);
+
+    useEffect(() => {
+        let eventSource: EventSource | null = null;
+
+        const connect = () => {
+            if (reconnectTimeoutRef.current) {
+                clearTimeout(reconnectTimeoutRef.current);
+                reconnectTimeoutRef.current = null;
+            }
+            if (streamRotateTimeoutRef.current) {
+                clearTimeout(streamRotateTimeoutRef.current);
+                streamRotateTimeoutRef.current = null;
+            }
+
+            eventSource = new EventSource('/api/opencode-events');
+
+            eventSource.onopen = () => {
+                reconnectAttemptsRef.current = 0;
+                rotatingRef.current = false;
+                streamRotateTimeoutRef.current = setTimeout(() => {
+                    if (!eventSource) return;
+                    rotatingRef.current = true;
+                    eventSource.close();
+                    scheduleRefetch();
+                    connect();
+                }, STREAM_ROTATE_INTERVAL);
+            };
+
+            eventSource.onmessage = (event) => {
+                try {
+                    const data = JSON.parse(event.data) as OpencodeEvent;
+                    handleEvent(data);
+                    reconnectAttemptsRef.current = 0; // Reset on success
+                } catch (err) {
+                    console.error('Failed to parse SSE event:', err);
+                }
+            };
+
+            eventSource.onerror = () => {
+                eventSource?.close();
+
+                if (streamRotateTimeoutRef.current) {
+                    clearTimeout(streamRotateTimeoutRef.current);
+                    streamRotateTimeoutRef.current = null;
+                }
+
+                if (rotatingRef.current) {
+                    rotatingRef.current = false;
+                    return;
+                }
+
+                if (reconnectAttemptsRef.current < MAX_RECONNECT_ATTEMPTS) {
+                    const delay = BASE_RECONNECT_DELAY * Math.pow(2, reconnectAttemptsRef.current);
+                    reconnectTimeoutRef.current = setTimeout(() => {
+                        reconnectAttemptsRef.current++;
+                        connect();
+                    }, delay);
+                }
+            };
+        };
+
+        connect();
+
+        return () => {
+            eventSource?.close();
+            if (reconnectTimeoutRef.current) {
+                clearTimeout(reconnectTimeoutRef.current);
+                reconnectTimeoutRef.current = null;
+            }
+            if (streamRotateTimeoutRef.current) {
+                clearTimeout(streamRotateTimeoutRef.current);
+                streamRotateTimeoutRef.current = null;
+            }
+        };
+    }, [handleEvent, scheduleRefetch]);
+
+}

package/src/index.ts

@@ -0,0 +1,2 @@
+export type { Profile, ProfileConfig, CategoryConfig, AgentConfig, OhMyOpencodeConfig, ProfileIndex } from './types/opencodeConfig';
+export { CONFIG_DIR, CONFIG_PATH, type OpenCodeConfig, detectConfig, readConfig, writeConfig } from './lib/opencodeConfig';

package/src/lib/notificationSound.ts

@@ -0,0 +1,266 @@
+'use client';
+
+let audioContext: AudioContext | null = null;
+
+const STORAGE_KEY = 'vibepulse:sound-muted';
+const SOUND_LOG_THROTTLE_MS = 10000;
+const soundLogLastAt = new Map<string, number>();
+
+function shouldLogSound(key: string): boolean {
+    const now = Date.now();
+    const lastAt = soundLogLastAt.get(key) ?? 0;
+    if (now - lastAt < SOUND_LOG_THROTTLE_MS) {
+        return false;
+    }
+    soundLogLastAt.set(key, now);
+    return true;
+}
+
+function logSoundInfo(key: string, message: string): void {
+    if (!shouldLogSound(`info:${key}`)) return;
+    console.info(`[VibePulse sound] ${message}`);
+}
+
+function logSoundWarning(key: string, message: string, error: unknown): void {
+    if (!shouldLogSound(`warn:${key}`)) return;
+    console.warn(`[VibePulse sound] ${message}`, error);
+}
+
+function getAudioContext(): AudioContext {
+    if (!audioContext) {
+        audioContext = new AudioContext();
+    }
+    return audioContext;
+}
+
+function runWithAudio(
+    key: string,
+    mutedMessage: string,
+    failureMessage: string,
+    play: (ctx: AudioContext, now: number) => void
+): void {
+    if (isMuted()) {
+        logSoundInfo(`${key}-muted`, mutedMessage);
+        return;
+    }
+
+    try {
+        const ctx = getAudioContext();
+        const playNow = () => {
+            try {
+                play(ctx, ctx.currentTime);
+            } catch (error) {
+                logSoundWarning(key, failureMessage, error);
+            }
+        };
+
+        if (ctx.state === 'running') {
+            playNow();
+            return;
+        }
+
+        void ctx
+            .resume()
+            .then(() => {
+                if (ctx.state === 'running') {
+                    playNow();
+                    return;
+                }
+                logSoundWarning(`${key}-state`, `${failureMessage} (AudioContext not running after resume)`, new Error(ctx.state));
+            })
+            .catch((error) => {
+                logSoundWarning(`${key}-resume`, `${failureMessage} (AudioContext resume failed)`, error);
+            });
+    } catch (error) {
+        logSoundWarning(key, failureMessage, error);
+    }
+}
+
+export function isMuted(): boolean {
+    if (typeof window === 'undefined') return false;
+    return window.localStorage.getItem(STORAGE_KEY) === 'true';
+}
+
+export function setMuted(muted: boolean): void {
+    if (typeof window === 'undefined') return;
+    window.localStorage.setItem(STORAGE_KEY, String(muted));
+}
+
+/**
+ * Ensure AudioContext is unlocked after a user gesture.
+ * Call this from any click handler to enable future sound playback.
+ */
+export function unlockAudio(): void {
+    try {
+        const ctx = getAudioContext();
+        const prime = () => {
+            const buffer = ctx.createBuffer(1, 1, 22050);
+            const source = ctx.createBufferSource();
+            source.buffer = buffer;
+            source.connect(ctx.destination);
+            source.start(0);
+        };
+
+        if (ctx.state === 'running') {
+            prime();
+            return;
+        }
+
+        void ctx
+            .resume()
+            .then(() => {
+                if (ctx.state === 'running') {
+                    prime();
+                    return;
+                }
+                logSoundWarning('unlock-state', 'unlockAudio() resume did not reach running state', new Error(ctx.state));
+            })
+            .catch((error) => {
+                logSoundWarning('unlock-resume', 'Failed to resume AudioContext in unlockAudio()', error);
+            });
+    } catch (error) {
+        logSoundWarning('unlock-audio', 'unlockAudio() failed', error);
+    }
+}
+
+/**
+ * Two-tone ascending chime — used for question.asked / permission.asked
+ * A gentle, non-alarming notification that user input is needed.
+ */
+export function playAttentionSound(): void {
+    runWithAudio(
+        'play-attention',
+        'Skipped playAttentionSound() because muted',
+        'playAttentionSound() failed',
+        (ctx, now) => {
+        // First tone: C5 (523 Hz)
+        const osc1 = ctx.createOscillator();
+        const gain1 = ctx.createGain();
+        osc1.type = 'sine';
+        osc1.frequency.value = 523;
+        gain1.gain.setValueAtTime(0.3, now);
+        gain1.gain.exponentialRampToValueAtTime(0.001, now + 0.2);
+        osc1.connect(gain1);
+        gain1.connect(ctx.destination);
+        osc1.start(now);
+        osc1.stop(now + 0.2);
+
+        // Second tone: E5 (659 Hz) — ascending interval
+        const osc2 = ctx.createOscillator();
+        const gain2 = ctx.createGain();
+        osc2.type = 'sine';
+        osc2.frequency.value = 659;
+        gain2.gain.setValueAtTime(0.3, now + 0.15);
+        gain2.gain.exponentialRampToValueAtTime(0.001, now + 0.4);
+        osc2.connect(gain2);
+        gain2.connect(ctx.destination);
+        osc2.start(now + 0.15);
+        osc2.stop(now + 0.4);
+
+        // Third tone: G5 (784 Hz) — more noticeable
+        const osc3 = ctx.createOscillator();
+        const gain3 = ctx.createGain();
+        osc3.type = 'sine';
+        osc3.frequency.value = 784;
+        gain3.gain.setValueAtTime(0.25, now + 0.3);
+        gain3.gain.exponentialRampToValueAtTime(0.001, now + 0.55);
+        osc3.connect(gain3);
+        gain3.connect(ctx.destination);
+        osc3.start(now + 0.3);
+        osc3.stop(now + 0.55);
+        }
+    );
+}
+
+/**
+ * Descending alert tone — used for retry/error states.
+ * Slightly more urgent than the attention chime.
+ */
+export function playAlertSound(): void {
+    runWithAudio(
+        'play-alert',
+        'Skipped playAlertSound() because muted',
+        'playAlertSound() failed',
+        (ctx, now) => {
+        // Descending tone: A5 → F5
+        const osc = ctx.createOscillator();
+        const gain = ctx.createGain();
+        osc.type = 'triangle';
+        osc.frequency.setValueAtTime(880, now);
+        osc.frequency.exponentialRampToValueAtTime(698, now + 0.25);
+        gain.gain.setValueAtTime(0.3, now);
+        gain.gain.exponentialRampToValueAtTime(0.001, now + 0.35);
+        osc.connect(gain);
+        gain.connect(ctx.destination);
+        osc.start(now);
+        osc.stop(now + 0.35);
+
+        // Second hit
+        const osc2 = ctx.createOscillator();
+        const gain2 = ctx.createGain();
+        osc2.type = 'triangle';
+        osc2.frequency.setValueAtTime(698, now + 0.2);
+        osc2.frequency.exponentialRampToValueAtTime(523, now + 0.45);
+        gain2.gain.setValueAtTime(0.25, now + 0.2);
+        gain2.gain.exponentialRampToValueAtTime(0.001, now + 0.5);
+        osc2.connect(gain2);
+        gain2.connect(ctx.destination);
+        osc2.start(now + 0.2);
+        osc2.stop(now + 0.5);
+        }
+    );
+}
+
+export function playCompleteSound(): void {
+    runWithAudio(
+        'play-complete',
+        'Skipped playCompleteSound() because muted',
+        'playCompleteSound() failed',
+        (ctx, now) => {
+        const osc = ctx.createOscillator();
+        const gain = ctx.createGain();
+        osc.type = 'sine';
+        osc.frequency.setValueAtTime(659, now);
+        osc.frequency.exponentialRampToValueAtTime(988, now + 0.18);
+        gain.gain.setValueAtTime(0.22, now);
+        gain.gain.exponentialRampToValueAtTime(0.001, now + 0.22);
+        osc.connect(gain);
+        gain.connect(ctx.destination);
+        osc.start(now);
+        osc.stop(now + 0.22);
+
+        const osc2 = ctx.createOscillator();
+        const gain2 = ctx.createGain();
+        osc2.type = 'sine';
+        osc2.frequency.setValueAtTime(988, now + 0.12);
+        osc2.frequency.exponentialRampToValueAtTime(1318, now + 0.32);
+        gain2.gain.setValueAtTime(0.18, now + 0.12);
+        gain2.gain.exponentialRampToValueAtTime(0.001, now + 0.36);
+        osc2.connect(gain2);
+        gain2.connect(ctx.destination);
+        osc2.start(now + 0.12);
+        osc2.stop(now + 0.36);
+        }
+    );
+}
+
+export function playToggleFeedbackSound(): void {
+    runWithAudio(
+        'play-toggle-feedback',
+        'Skipped playToggleFeedbackSound() because muted',
+        'playToggleFeedbackSound() failed',
+        (ctx, now) => {
+        const osc = ctx.createOscillator();
+        const gain = ctx.createGain();
+        osc.type = 'sine';
+        osc.frequency.setValueAtTime(740, now);
+        osc.frequency.exponentialRampToValueAtTime(920, now + 0.1);
+        gain.gain.setValueAtTime(0.13, now);
+        gain.gain.exponentialRampToValueAtTime(0.001, now + 0.13);
+        osc.connect(gain);
+        gain.connect(ctx.destination);
+        osc.start(now);
+        osc.stop(now + 0.13);
+        }
+    );
+}