zyflow 0.6.4

package/src/hooks/useLeannStatus.ts

@@ -0,0 +1,93 @@
+/**
+ * LEANN Index Status Hook
+ *
+ * LEANN 인덱스 상태 조회 및 인덱싱 트리거
+ */
+
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
+import { API_ENDPOINTS } from '@/config/api'
+
+export interface ProjectIndexStatus {
+  projectId: string
+  projectName: string
+  projectPath: string
+  indexed: boolean
+  indexSize?: string
+  pathExists?: boolean
+}
+
+interface LeannIndexesResponse {
+  success: boolean
+  data: ProjectIndexStatus[]
+  leannInstalled: boolean
+  warning?: string
+}
+
+interface IndexProjectResponse {
+  success: boolean
+  message?: string
+  error?: string
+  indexName?: string
+}
+
+/**
+ * LEANN 인덱스 상태 조회 훅
+ */
+export function useLeannIndexStatus() {
+  return useQuery({
+    queryKey: ['leann', 'indexes'],
+    queryFn: async (): Promise<{
+      projects: ProjectIndexStatus[]
+      leannInstalled: boolean
+      warning?: string
+    }> => {
+      const res = await fetch(`${API_ENDPOINTS.base}/leann/indexes`)
+      if (!res.ok) {
+        throw new Error('Failed to fetch index status')
+      }
+      const data: LeannIndexesResponse = await res.json()
+      return {
+        projects: data.data || [],
+        leannInstalled: data.leannInstalled,
+        warning: data.warning,
+      }
+    },
+    staleTime: 30000, // 30초 캐시
+    refetchOnWindowFocus: false,
+  })
+}
+
+/**
+ * 프로젝트 인덱싱 mutation 훅
+ */
+export function useIndexProject() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: async ({
+      projectPath,
+      projectName,
+    }: {
+      projectPath: string
+      projectName: string
+    }): Promise<IndexProjectResponse> => {
+      const res = await fetch(`${API_ENDPOINTS.base}/leann/index`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ projectPath, projectName }),
+      })
+
+      const data: IndexProjectResponse = await res.json()
+
+      if (!res.ok || !data.success) {
+        throw new Error(data.error || 'Failed to start indexing')
+      }
+
+      return data
+    },
+    onSuccess: () => {
+      // 인덱싱 완료 후 상태 갱신
+      queryClient.invalidateQueries({ queryKey: ['leann', 'indexes'] })
+    },
+  })
+}

package/src/hooks/useNetworkStatus.ts

@@ -0,0 +1,167 @@
+/**
+ * Network Status Detection Hook
+ *
+ * Detects online/offline state and provides callbacks for state changes
+ * Uses navigator.onLine and online/offline event listeners
+ *
+ * @module hooks/useNetworkStatus
+ */
+
+import { useState, useEffect, useCallback } from 'react'
+
+// =============================================
+// Types
+// =============================================
+
+export type NetworkStatus = 'online' | 'offline' | 'unknown'
+
+export interface UseNetworkStatusReturn {
+  /** Current network status */
+  status: NetworkStatus
+  /** Whether device is online */
+  isOnline: boolean
+  /** Whether device is offline */
+  isOffline: boolean
+  /** Last status change timestamp */
+  lastStatusChange: number
+}
+
+export interface UseNetworkStatusOptions {
+  /** Callback when status changes to online */
+  onOnline?: () => void
+  /** Callback when status changes to offline */
+  onOffline?: () => void
+  /** Polling interval for additional checks (ms, 0 = disabled) */
+  pollingInterval?: number
+}
+
+// =============================================
+// Implementation
+// =============================================
+
+/**
+ * Hook to detect network status
+ */
+export function useNetworkStatus(
+  options: UseNetworkStatusOptions = {}
+): UseNetworkStatusReturn {
+  const { onOnline, onOffline, pollingInterval = 30000 } = options
+
+  // Initialize with current navigator.onLine status
+  const [status, setStatus] = useState<NetworkStatus>(() => {
+    if (typeof navigator === 'undefined') {
+      return 'unknown'
+    }
+    return navigator.onLine ? 'online' : 'offline'
+  })
+
+  const [lastStatusChange, setLastStatusChange] = useState<number>(Date.now())
+
+  // Handle online event
+  const handleOnline = useCallback(() => {
+    setStatus('online')
+    setLastStatusChange(Date.now())
+    onOnline?.()
+  }, [onOnline])
+
+  // Handle offline event
+  const handleOffline = useCallback(() => {
+    setStatus('offline')
+    setLastStatusChange(Date.now())
+    onOffline?.()
+  }, [onOffline])
+
+  // Polling function for additional network checks
+  const checkNetworkStatus = useCallback(async () => {
+    if (typeof navigator === 'undefined') return
+
+    // Get current navigator status
+    const isNavigatorOnline = navigator.onLine
+
+    // Try to fetch a small resource to verify connectivity
+    try {
+      const controller = new AbortController()
+      const timeoutId = setTimeout(() => controller.abort(), 5000)
+
+      const response = await fetch('/api/health', {
+        method: 'HEAD',
+        signal: controller.signal,
+        cache: 'no-cache',
+      })
+
+      clearTimeout(timeoutId)
+
+      // If health check succeeds, we're online
+      if (response.ok) {
+        if (status !== 'online') {
+          handleOnline()
+        }
+        return
+      }
+    } catch {
+      // Health check failed
+    }
+
+    // If navigator says offline or health check failed, we're offline
+    if (!isNavigatorOnline && status !== 'offline') {
+      handleOffline()
+    }
+  }, [status, handleOnline, handleOffline])
+
+  // Set up event listeners
+  useEffect(() => {
+    if (typeof window === 'undefined') return
+
+    window.addEventListener('online', handleOnline)
+    window.addEventListener('offline', handleOffline)
+
+    return () => {
+      window.removeEventListener('online', handleOnline)
+      window.removeEventListener('offline', handleOffline)
+    }
+  }, [handleOnline, handleOffline])
+
+  // Set up polling for additional checks
+  useEffect(() => {
+    if (pollingInterval <= 0) return
+
+    const interval = setInterval(checkNetworkStatus, pollingInterval)
+
+    return () => clearInterval(interval)
+  }, [pollingInterval, checkNetworkStatus])
+
+  return {
+    status,
+    isOnline: status === 'online',
+    isOffline: status === 'offline',
+    lastStatusChange,
+  }
+}
+
+// =============================================
+// Utility: Get current network status synchronously
+// =============================================
+
+/**
+ * Get current network status without hook (useful for non-React code)
+ */
+export function getNetworkStatus(): NetworkStatus {
+  if (typeof navigator === 'undefined') {
+    return 'unknown'
+  }
+  return navigator.onLine ? 'online' : 'offline'
+}
+
+/**
+ * Check if currently online
+ */
+export function isOnlineNow(): boolean {
+  return getNetworkStatus() === 'online'
+}
+
+/**
+ * Check if currently offline
+ */
+export function isOfflineNow(): boolean {
+  return getNetworkStatus() === 'offline'
+}

package/src/hooks/useProjects.ts

@@ -0,0 +1,353 @@
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
+import type {
+  Project,
+  ApiResponse,
+  ProjectsResponse,
+  ProjectsAllDataResponse,
+  LocalSettingsStatus,
+  InitLocalSettingsResponse,
+  ExportToLocalResponse,
+} from '@/types'
+
+async function fetchProjects(): Promise<ProjectsResponse> {
+  const response = await fetch('/api/projects')
+  const json: ApiResponse<ProjectsResponse> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to fetch projects')
+  }
+
+  return json.data
+}
+
+export function useProjects() {
+  return useQuery({
+    queryKey: ['projects'],
+    queryFn: fetchProjects,
+  })
+}
+
+async function fetchProjectsAllData(): Promise<ProjectsAllDataResponse> {
+  const response = await fetch('/api/projects/all-data')
+  const json: ApiResponse<ProjectsAllDataResponse> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to fetch projects data')
+  }
+
+  return json.data
+}
+
+export function useProjectsAllData() {
+  return useQuery({
+    queryKey: ['projects-all-data'],
+    queryFn: fetchProjectsAllData,
+    staleTime: 10000, // 10초간 fresh 유지
+    refetchOnWindowFocus: true, // 창 포커스 시 갱신
+    refetchInterval: 30000, // 30초마다 자동 갱신
+  })
+}
+
+async function addProject(path: string): Promise<Project> {
+  const response = await fetch('/api/projects', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ path }),
+  })
+  const json: ApiResponse<{ project: Project }> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to add project')
+  }
+
+  return json.data.project
+}
+
+export function useAddProject() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: addProject,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['projects'] })
+      queryClient.invalidateQueries({ queryKey: ['projects-all-data'] })
+      queryClient.invalidateQueries({ queryKey: ['changes'] })
+      queryClient.invalidateQueries({ queryKey: ['specs'] })
+    },
+  })
+}
+
+async function activateProject(projectId: string): Promise<Project> {
+  const response = await fetch(`/api/projects/${projectId}/activate`, {
+    method: 'PUT',
+  })
+  const json: ApiResponse<{ project: Project }> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to activate project')
+  }
+
+  return json.data.project
+}
+
+export function useActivateProject() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: activateProject,
+    // Optimistic Update: 즉시 activeProjectId 업데이트 (프로젝트 전환 중 멈춤 방지)
+    onMutate: async (newProjectId) => {
+      // 진행 중인 쿼리 취소
+      await queryClient.cancelQueries({ queryKey: ['projects-all-data'] })
+
+      // 이전 데이터 스냅샷 저장 (롤백용)
+      const previousData = queryClient.getQueryData<ProjectsAllDataResponse>(['projects-all-data'])
+
+      // 즉시 캐시 업데이트 (optimistic)
+      queryClient.setQueryData<ProjectsAllDataResponse>(['projects-all-data'], (old) => {
+        if (!old) return old
+        return { ...old, activeProjectId: newProjectId }
+      })
+
+      return { previousData }
+    },
+    onError: (_err, _newProjectId, context) => {
+      // 실패 시 이전 상태로 롤백
+      if (context?.previousData) {
+        queryClient.setQueryData(['projects-all-data'], context.previousData)
+      }
+    },
+    onSuccess: () => {
+      // 이전 프로젝트의 flow 관련 캐시 완전 삭제 (404 요청 방지)
+      queryClient.removeQueries({ queryKey: ['flow'] })
+      queryClient.removeQueries({ queryKey: ['changes'] })
+      queryClient.removeQueries({ queryKey: ['specs'] })
+      queryClient.removeQueries({ queryKey: ['tasks'] })
+      // projects-all-data만 refetch (나머지는 이미 포함됨)
+      queryClient.invalidateQueries({ queryKey: ['projects-all-data'] })
+    },
+  })
+}
+
+async function removeProject(projectId: string): Promise<void> {
+  const response = await fetch(`/api/projects/${projectId}`, {
+    method: 'DELETE',
+  })
+  const json: ApiResponse<void> = await response.json()
+
+  if (!json.success) {
+    throw new Error(json.error || 'Failed to remove project')
+  }
+}
+
+export function useRemoveProject() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: removeProject,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['projects'] })
+      queryClient.invalidateQueries({ queryKey: ['projects-all-data'] })
+      queryClient.invalidateQueries({ queryKey: ['changes'] })
+      queryClient.invalidateQueries({ queryKey: ['specs'] })
+    },
+  })
+}
+
+interface BrowseFolderResult {
+  path: string | null
+  cancelled: boolean
+}
+
+async function browseFolder(): Promise<BrowseFolderResult> {
+  const response = await fetch('/api/projects/browse', {
+    method: 'POST',
+  })
+  const json: ApiResponse<BrowseFolderResult> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to open folder picker')
+  }
+
+  return json.data
+}
+
+export function useBrowseFolder() {
+  return useMutation({
+    mutationFn: browseFolder,
+  })
+}
+
+// ==================== 프로젝트 이름 변경 ====================
+
+async function updateProjectName(projectId: string, newName: string): Promise<Project> {
+  const response = await fetch(`/api/projects/${projectId}/name`, {
+    method: 'PUT',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ name: newName }),
+  })
+  const json: ApiResponse<{ project: Project }> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to update project name')
+  }
+
+  return json.data.project
+}
+
+export function useUpdateProjectName() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: ({ projectId, name }: { projectId: string; name: string }) =>
+      updateProjectName(projectId, name),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['projects'] })
+      queryClient.invalidateQueries({ queryKey: ['projects-all-data'] })
+    },
+  })
+}
+
+// ==================== 프로젝트 경로 변경 ====================
+
+async function updateProjectPath(projectId: string, newPath: string): Promise<Project> {
+  const response = await fetch(`/api/projects/${projectId}/path`, {
+    method: 'PUT',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ path: newPath }),
+  })
+  const json: ApiResponse<{ project: Project }> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to update project path')
+  }
+
+  return json.data.project
+}
+
+export function useUpdateProjectPath() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: ({ projectId, path }: { projectId: string; path: string }) =>
+      updateProjectPath(projectId, path),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['projects'] })
+      queryClient.invalidateQueries({ queryKey: ['projects-all-data'] })
+    },
+  })
+}
+
+// ==================== 프로젝트 순서 변경 ====================
+
+async function reorderProjects(projectIds: string[]): Promise<Project[]> {
+  const response = await fetch('/api/projects/reorder', {
+    method: 'PUT',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ projectIds }),
+  })
+  const json: ApiResponse<{ projects: Project[] }> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to reorder projects')
+  }
+
+  return json.data.projects
+}
+
+export function useReorderProjects() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: reorderProjects,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['projects'] })
+      queryClient.invalidateQueries({ queryKey: ['projects-all-data'] })
+    },
+  })
+}
+
+// ==================== 로컬 설정 상태 조회 ====================
+
+async function fetchLocalSettingsStatus(projectPath: string): Promise<LocalSettingsStatus> {
+  const response = await fetch(
+    `/api/integrations/local/status?projectPath=${encodeURIComponent(projectPath)}`
+  )
+  const json: ApiResponse<{ projectPath: string; status: LocalSettingsStatus }> =
+    await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to fetch local settings status')
+  }
+
+  return json.data.status
+}
+
+export function useLocalSettingsStatus(projectPath: string | undefined) {
+  return useQuery({
+    queryKey: ['local-settings-status', projectPath],
+    queryFn: () => fetchLocalSettingsStatus(projectPath!),
+    enabled: !!projectPath,
+    staleTime: 30000, // 30초 캐시
+  })
+}
+
+// ==================== 로컬 설정 초기화 ====================
+
+async function initLocalSettings(projectPath: string): Promise<InitLocalSettingsResponse> {
+  const response = await fetch('/api/integrations/local/init', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ projectPath }),
+  })
+  const json: ApiResponse<InitLocalSettingsResponse> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to initialize local settings')
+  }
+
+  return json.data
+}
+
+export function useInitLocalSettings() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: initLocalSettings,
+    onSuccess: (_data, projectPath) => {
+      queryClient.invalidateQueries({ queryKey: ['local-settings-status', projectPath] })
+    },
+  })
+}
+
+// ==================== 전역 설정을 로컬로 내보내기 ====================
+
+async function exportToLocal(
+  projectId: string,
+  projectPath: string
+): Promise<ExportToLocalResponse> {
+  const response = await fetch(`/api/integrations/projects/${projectId}/export-to-local`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ projectPath }),
+  })
+  const json: ApiResponse<ExportToLocalResponse> = await response.json()
+
+  if (!json.success || !json.data) {
+    throw new Error(json.error || 'Failed to export to local')
+  }
+
+  return json.data
+}
+
+export function useExportToLocal() {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: ({ projectId, projectPath }: { projectId: string; projectPath: string }) =>
+      exportToLocal(projectId, projectPath),
+    onSuccess: (_data, { projectPath }) => {
+      queryClient.invalidateQueries({ queryKey: ['local-settings-status', projectPath] })
+    },
+  })
+}