create-fluxstack 1.8.1 → 1.8.3

package/app/client/src/store/slices/uiSlice.ts

@@ -1,151 +0,0 @@
-/**
- * UI Store with Zustand
- * Manages global UI state like modals, notifications, theme, etc.
- */
-
-import { create } from 'zustand'
-import { persist } from 'zustand/middleware'
-
-export interface Notification {
-  id: string
-  type: 'success' | 'error' | 'warning' | 'info'
-  title: string
-  message: string
-  duration?: number
-  timestamp: number
-}
-
-export interface Modal {
-  id: string
-  component: string
-  props?: Record<string, any>
-  closable?: boolean
-}
-
-interface UIState {
-  // State
-  theme: 'light' | 'dark' | 'system'
-  sidebarOpen: boolean
-  notifications: Notification[]
-  modals: Modal[]
-  loading: {
-    global: boolean
-    operations: Record<string, boolean>
-  }
-
-  // Actions
-  setTheme: (theme: 'light' | 'dark' | 'system') => void
-  toggleSidebar: () => void
-  setSidebarOpen: (open: boolean) => void
-  
-  // Notifications
-  addNotification: (notification: Omit<Notification, 'id' | 'timestamp'>) => void
-  removeNotification: (id: string) => void
-  clearNotifications: () => void
-  
-  // Modals
-  openModal: (modal: Omit<Modal, 'id'>) => void
-  closeModal: (id: string) => void
-  closeAllModals: () => void
-  
-  // Loading
-  setGlobalLoading: (loading: boolean) => void
-  setOperationLoading: (operation: string, loading: boolean) => void
-  clearOperationLoading: (operation: string) => void
-}
-
-export const useUIStore = create<UIState>()(
-  persist(
-    (set, get) => ({
-      // Initial state
-      theme: 'system',
-      sidebarOpen: true,
-      notifications: [],
-      modals: [],
-      loading: {
-        global: false,
-        operations: {}
-      },
-
-      // Theme actions
-      setTheme: (theme) => set({ theme }),
-
-      // Sidebar actions
-      toggleSidebar: () => set((state) => ({ sidebarOpen: !state.sidebarOpen })),
-      setSidebarOpen: (open) => set({ sidebarOpen: open }),
-
-      // Notification actions
-      addNotification: (notification) => {
-        const newNotification: Notification = {
-          ...notification,
-          id: Math.random().toString(36).substr(2, 9),
-          timestamp: Date.now()
-        }
-        
-        set((state) => ({
-          notifications: [...state.notifications, newNotification]
-        }))
-
-        // Auto-remove notification after duration
-        if (notification.duration !== 0) {
-          setTimeout(() => {
-            get().removeNotification(newNotification.id)
-          }, notification.duration || 5000)
-        }
-      },
-
-      removeNotification: (id) => set((state) => ({
-        notifications: state.notifications.filter(n => n.id !== id)
-      })),
-
-      clearNotifications: () => set({ notifications: [] }),
-
-      // Modal actions
-      openModal: (modal) => {
-        const newModal: Modal = {
-          ...modal,
-          id: Math.random().toString(36).substr(2, 9)
-        }
-        
-        set((state) => ({
-          modals: [...state.modals, newModal]
-        }))
-      },
-
-      closeModal: (id) => set((state) => ({
-        modals: state.modals.filter(m => m.id !== id)
-      })),
-
-      closeAllModals: () => set({ modals: [] }),
-
-      // Loading actions
-      setGlobalLoading: (loading) => set((state) => ({
-        loading: { ...state.loading, global: loading }
-      })),
-
-      setOperationLoading: (operation, loading) => set((state) => ({
-        loading: {
-          ...state.loading,
-          operations: {
-            ...state.loading.operations,
-            [operation]: loading
-          }
-        }
-      })),
-
-      clearOperationLoading: (operation) => set((state) => {
-        const { [operation]: _, ...operations } = state.loading.operations
-        return {
-          loading: { ...state.loading, operations }
-        }
-      })
-    }),
-    {
-      name: 'ui-store',
-      partialize: (state) => ({
-        theme: state.theme,
-        sidebarOpen: state.sidebarOpen
-      })
-    }
-  )
-)

package/app/client/src/store/slices/userSlice.ts

@@ -1,161 +0,0 @@
-/**
- * User Store
- * App-specific user store using FluxStack core
- */
-
-// Temporary direct implementation until module resolution is fixed
-import { create } from 'zustand'
-import { persist, createJSONStorage } from 'zustand/middleware'
-
-export interface BaseUser {
-  id: string
-  email: string
-  name: string
-  role: 'admin' | 'user'
-}
-
-// Type aliases for compatibility
-export type User = BaseUser
-
-export interface LoginCredentials {
-  email: string
-  password: string
-}
-
-export interface RegisterData {
-  email: string
-  password: string
-  name: string
-}
-
-export interface BaseUserStore {
-  currentUser: BaseUser | null
-  isAuthenticated: boolean
-  isLoading: boolean
-  error: string | null
-  login: (credentials: { email: string; password: string }) => Promise<void>
-  register: (data: { email: string; password: string; name: string }) => Promise<void>
-  logout: () => void
-  updateProfile: (data: Partial<BaseUser>) => Promise<void>
-  clearError: () => void
-  setLoading: (loading: boolean) => void
-}
-
-// Create user store using Zustand directly (temporary)
-export const useUserStore = create<BaseUserStore>()(
-  persist(
-    (set, get) => ({
-      currentUser: null,
-      isAuthenticated: false,
-      isLoading: false,
-      error: null,
-
-      login: async (credentials) => {
-        set({ isLoading: true, error: null })
-        try {
-          const response = await fetch('/api/auth/login', {
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify(credentials)
-          })
-
-          if (!response.ok) {
-            const error = await response.json()
-            throw new Error(error.message || 'Login failed')
-          }
-
-          const { user } = await response.json()
-          set({
-            currentUser: user,
-            isAuthenticated: true,
-            isLoading: false
-          })
-        } catch (error) {
-          set({
-            error: error instanceof Error ? error.message : 'Login failed',
-            isLoading: false
-          })
-          throw error
-        }
-      },
-
-      register: async (data) => {
-        set({ isLoading: true, error: null })
-        try {
-          const response = await fetch('/api/auth/register', {
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify(data)
-          })
-
-          if (!response.ok) {
-            const error = await response.json()
-            throw new Error(error.message || 'Registration failed')
-          }
-
-          const { user } = await response.json()
-          set({
-            currentUser: user,
-            isAuthenticated: true,
-            isLoading: false
-          })
-        } catch (error) {
-          set({
-            error: error instanceof Error ? error.message : 'Registration failed',
-            isLoading: false
-          })
-          throw error
-        }
-      },
-
-      logout: () => {
-        fetch('/api/auth/logout', { method: 'POST' }).catch(console.error)
-        set({
-          currentUser: null,
-          isAuthenticated: false,
-          error: null
-        })
-      },
-
-      updateProfile: async (data) => {
-        const { currentUser } = get()
-        if (!currentUser) {
-          throw new Error('No user logged in')
-        }
-
-        set({ isLoading: true, error: null })
-        try {
-          const response = await fetch('/api/user/profile', {
-            method: 'PUT',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify(data)
-          })
-
-          if (!response.ok) {
-            const error = await response.json()
-            throw new Error(error.message || 'Profile update failed')
-          }
-
-          const { user } = await response.json()
-          set({
-            currentUser: user,
-            isLoading: false
-          })
-        } catch (error) {
-          set({
-            error: error instanceof Error ? error.message : 'Profile update failed',
-            isLoading: false
-          })
-          throw error
-        }
-      },
-
-      clearError: () => set({ error: null }),
-      setLoading: (loading) => set({ isLoading: loading })
-    }),
-    {
-      name: 'user-store',
-      storage: createJSONStorage(() => localStorage)
-    }
-  )
-)

package/app/client/src/test/README.md

@@ -1,257 +0,0 @@
-# FluxStack Testing Guide
-
-Este guia explica como testar o sistema de estado baseado em Zustand no FluxStack.
-
-## 🧪 **Estrutura de Testes**
-
-```
-app/client/src/
-├── store/
-│   ├── __tests__/
-│   │   ├── userSlice.test.ts      # Testes do store de usuário
-│   │   └── uiSlice.test.ts        # Testes do store de UI
-├── hooks/
-│   ├── __tests__/
-│   │   ├── useAuth.test.ts        # Testes do hook de auth
-│   │   └── useNotifications.test.ts # Testes do hook de notificações
-├── components/
-│   └── __tests__/
-│       └── StateDemo.test.tsx     # Testes de integração
-└── test/
-    ├── setup.ts                   # Configuração global
-    ├── types.ts                   # Tipos para testes
-    └── README.md                  # Este arquivo
-```
-
-## 🔧 **Configuração**
-
-### Dependências necessárias:
-
-```json
-{
-  "devDependencies": {
-    "@testing-library/jest-dom": "^6.1.4",
-    "@testing-library/react": "^13.4.0",
-    "@testing-library/user-event": "^14.5.1",
-    "jsdom": "^22.1.0",
-    "vitest": "^0.34.6"
-  }
-}
-```
-
-### Configuração do Vitest:
-
-O arquivo `vitest.config.ts` está configurado para:
-- Usar jsdom como ambiente
-- Configurar aliases para imports
-- Incluir setup global
-- Configurar coverage
-
-## 🧪 **Testando Stores Zustand**
-
-### Exemplo básico:
-
-```typescript
-import { renderHook, act } from '@testing-library/react'
-import { useUserStore } from '../slices/userSlice'
-
-describe('useUserStore', () => {
-  beforeEach(() => {
-    // Reset store state
-    useUserStore.setState({
-      currentUser: null,
-      isAuthenticated: false,
-      isLoading: false,
-      error: null
-    })
-  })
-
-  it('should login successfully', async () => {
-    const { result } = renderHook(() => useUserStore())
-
-    await act(async () => {
-      await result.current.login({
-        email: 'test@example.com',
-        password: 'password'
-      })
-    })
-
-    expect(result.current.isAuthenticated).toBe(true)
-  })
-})
-```
-
-### Padrões importantes:
-
-1. **Reset do estado**: Sempre resetar o store antes de cada teste
-2. **act()**: Usar `act()` para mudanças de estado assíncronas
-3. **Mock de APIs**: Mockar fetch para testes isolados
-
-## 🎯 **Testando Hooks Utilitários**
-
-```typescript
-import { renderHook } from '@testing-library/react'
-import { useAuth } from '../useAuth'
-
-describe('useAuth', () => {
-  it('should detect admin user', () => {
-    // Set admin user in store
-    useUserStore.setState({
-      currentUser: { role: 'admin', /* ... */ },
-      isAuthenticated: true
-    })
-
-    const { result } = renderHook(() => useAuth())
-    
-    expect(result.current.isAdmin).toBe(true)
-  })
-})
-```
-
-## 🧩 **Testando Componentes com Estado**
-
-```typescript
-import { render, screen, fireEvent } from '@testing-library/react'
-import { MyComponent } from '../MyComponent'
-import { useUIStore } from '../../store/slices/uiSlice'
-
-describe('MyComponent', () => {
-  beforeEach(() => {
-    // Reset stores
-    useUIStore.setState({ /* initial state */ })
-  })
-
-  it('should update theme when button clicked', () => {
-    render(<MyComponent />)
-    
-    fireEvent.click(screen.getByText('Dark Theme'))
-    
-    expect(screen.getByText('Current theme: dark')).toBeInTheDocument()
-  })
-})
-```
-
-## 🔄 **Mocking APIs**
-
-```typescript
-// Mock fetch globally
-global.fetch = vi.fn()
-
-beforeEach(() => {
-  vi.resetAllMocks()
-})
-
-it('should handle API success', async () => {
-  // Mock successful response
-  ;(global.fetch as any).mockResolvedValueOnce({
-    ok: true,
-    json: async () => ({ user: mockUser })
-  })
-
-  // Test your component/hook
-})
-```
-
-## 📊 **Coverage**
-
-Execute testes com coverage:
-
-```bash
-npm run test:coverage
-```
-
-Isso gerará um relatório em `coverage/index.html`.
-
-## 🎨 **Boas Práticas**
-
-### 1. **Isolamento de Testes**
-- Sempre resetar stores antes de cada teste
-- Mockar APIs externas
-- Não depender de ordem de execução
-
-### 2. **Testes Descritivos**
-```typescript
-// ❌ Ruim
-it('should work', () => { /* ... */ })
-
-// ✅ Bom
-it('should login successfully with valid credentials', () => { /* ... */ })
-```
-
-### 3. **Arrange-Act-Assert**
-```typescript
-it('should add notification', () => {
-  // Arrange
-  const { result } = renderHook(() => useNotifications())
-  
-  // Act
-  act(() => {
-    result.current.success('Title', 'Message')
-  })
-  
-  // Assert
-  expect(result.current.notifications).toHaveLength(1)
-})
-```
-
-### 4. **Testar Comportamentos, não Implementação**
-```typescript
-// ❌ Ruim - testa implementação
-expect(mockSetState).toHaveBeenCalledWith({ loading: true })
-
-// ✅ Bom - testa comportamento
-expect(result.current.isLoading).toBe(true)
-```
-
-## 🚀 **Executando Testes**
-
-```bash
-# Todos os testes
-npm run test:run
-
-# Modo watch
-npm run test:watch
-
-# Com UI
-npm run test:ui
-
-# Apenas stores
-npm run test:client -- store
-
-# Apenas hooks
-npm run test:client -- hooks
-
-# Apenas componentes
-npm run test:client -- components
-```
-
-## 🐛 **Debugging**
-
-### Console logs em testes:
-```typescript
-it('should debug state', () => {
-  const { result } = renderHook(() => useUserStore())
-  
-  console.log('Current state:', result.current)
-  
-  // Seu teste aqui
-})
-```
-
-### Usando screen.debug():
-```typescript
-it('should render correctly', () => {
-  render(<MyComponent />)
-  
-  screen.debug() // Mostra o DOM atual
-  
-  // Seu teste aqui
-})
-```
-
-## 📝 **Exemplos Completos**
-
-Veja os arquivos de teste existentes para exemplos completos:
-- `store/__tests__/userSlice.test.ts` - Testes de store
-- `hooks/__tests__/useAuth.test.ts` - Testes de hooks
-- `components/__tests__/StateDemo.test.tsx` - Testes de integração

package/app/client/src/test/setup.ts

@@ -1,70 +0,0 @@
-/**
- * Test Setup
- * Global test configuration and mocks
- */
-
-import { expect, afterEach, vi } from 'vitest'
-import { cleanup } from '@testing-library/react'
-import * as matchers from '@testing-library/jest-dom/matchers'
-
-// Extend Vitest's expect with jest-dom matchers
-expect.extend(matchers)
-
-// Mock fetch with proper typing
-global.fetch = vi.fn() as any
-
-// Cleanup after each test case (e.g. clearing jsdom)
-afterEach(() => {
-  cleanup()
-})
-
-// Mock window.matchMedia
-Object.defineProperty(window, 'matchMedia', {
-  writable: true,
-  value: vi.fn().mockImplementation(query => ({
-    matches: false,
-    media: query,
-    onchange: null,
-    addListener: vi.fn(), // deprecated
-    removeListener: vi.fn(), // deprecated
-    addEventListener: vi.fn(),
-    removeEventListener: vi.fn(),
-    dispatchEvent: vi.fn(),
-  })),
-})
-
-// Mock window.ResizeObserver
-global.ResizeObserver = vi.fn().mockImplementation(() => ({
-  observe: vi.fn(),
-  unobserve: vi.fn(),
-  disconnect: vi.fn(),
-}))
-
-// Mock localStorage
-const localStorageMock = {
-  getItem: vi.fn(),
-  setItem: vi.fn(),
-  removeItem: vi.fn(),
-  clear: vi.fn(),
-}
-vi.stubGlobal('localStorage', localStorageMock)
-
-// Mock sessionStorage
-const sessionStorageMock = {
-  getItem: vi.fn(),
-  setItem: vi.fn(),
-  removeItem: vi.fn(),
-  clear: vi.fn(),
-}
-vi.stubGlobal('sessionStorage', sessionStorageMock)
-
-// Mock console methods to reduce noise in tests
-global.console = {
-  ...console,
-  // Uncomment to ignore console logs in tests
-  // log: vi.fn(),
-  // debug: vi.fn(),
-  // info: vi.fn(),
-  // warn: vi.fn(),
-  // error: vi.fn(),
-}

package/app/client/src/test/types.ts

@@ -1,12 +0,0 @@
-/**
- * Test Types
- * Type definitions for testing utilities
- */
-
-import '@testing-library/jest-dom'
-
-declare global {
-  namespace Vi {
-    interface JestAssertion<T = any> extends jest.Matchers<void, T> {}
-  }
-}