s.setEditText(e.target.value)} onKeyDown={e => { if (e.key === 'Enter') s.handleSaveEdit(); if (e.key === 'Escape') s.handleCancelEdit(); }} className="h-7 text-sm bg-background text-foreground" autoFocus />
-
) : (
<>
+ {repliedMsg && (
+
}
- {msg.content && (!hasMedia || msg.media_type === 'document') &&
}
- {msg.content && hasMedia && msg.media_type !== 'document' && !['🎨 Figurinha', '🎵 Áudio meme', '😀 Emoji', '🎤 Mensagem de áudio'].includes(msg.content) &&
- {cleanText &&
}
-
{formatTime(msg.created_at)}{msg.is_edited && ' · editado'}
+ {msg.content && (!hasMedia || msg.media_type === 'document') && (
+
+
+
+ )}
+ {msg.content && hasMedia && msg.media_type !== 'document' && !['🎨 Figurinha', '🎵 Áudio meme', '😀 Emoji', '🎤 Mensagem de áudio'].includes(msg.content) && (
+
{msg.content}
+ )}
+
+ {cleanText && (
+
+ )}
+
+ {formatTime(msg.created_at)}{msg.is_edited && ' · editado'}
+
)}
diff --git a/src/components/team-chat/__tests__/team-chat-exhaustive-audit.test.ts b/src/components/team-chat/__tests__/team-chat-exhaustive-audit.test.ts
index 2bacc9ef5..f936896c8 100644
--- a/src/components/team-chat/__tests__/team-chat-exhaustive-audit.test.ts
+++ b/src/components/team-chat/__tests__/team-chat-exhaustive-audit.test.ts
@@ -13,7 +13,9 @@ const inputSrc = readSrc('components/team-chat/TeamChatInputArea.tsx');
const headerSrc = readSrc('components/team-chat/TeamChatHeader.tsx');
const uploaderSrc = readSrc('components/team-chat/TeamFileUploader.tsx');
const viewSrc = readSrc('components/team-chat/TeamChatView.tsx');
-const hookSrc = readSrc('hooks/useTeamChat.ts');
+const hookSrc = readSrc('hooks/team-chat/useTeamMessages.ts');
+const mutationHookSrc = readSrc('hooks/team-chat/useTeamChatMutations.ts');
+const panelHookSrc = readSrc('components/team-chat/useTeamChatPanel.ts');
// External chat reference files
const inboxToolbarSrc = readSrc('components/inbox/chat/ChatToolbar.tsx');
@@ -326,8 +328,9 @@ describe('Team Chat — Exhaustive Audit', () => {
expect(panelSrc).toContain('editado');
});
- it.skip('should not save empty edits', () => {
- expect(panelSrc).toMatch(/!editText\.trim\(\)/);
+ it('should not save empty edits', () => {
+ expect(panelHookSrc).toContain('!trimmed');
+ expect(panelHookSrc).toContain('handleCancelEdit');
});
});
diff --git a/src/components/team-chat/useTeamChatPanel.ts b/src/components/team-chat/useTeamChatPanel.ts
index 45139760f..b6406183f 100644
--- a/src/components/team-chat/useTeamChatPanel.ts
+++ b/src/components/team-chat/useTeamChatPanel.ts
@@ -90,16 +90,18 @@ export function useTeamChatPanel(conversation: TeamConversation) {
{ onError: (err) => { log.error('Failed to delete:', err); toast.error('Falha ao excluir.'); } });
}, [deleteMutation, conversation.id]);
- const handleStartEdit = useCallback((msg: TeamMessage) => { setEditingId(msg.id); setEditText(msg.content); }, []);
+ const handleStartEdit = useCallback((msg: TeamMessage) => { setEditingId(msg.id); setEditText(msg.content || ''); }, []);
const handleSaveEdit = useCallback(() => {
- if (!editingId || !editText.trim()) return;
- editMutation.mutate({ messageId: editingId, content: editText.trim(), conversationId: conversation.id },
+ const trimmed = editText.trim();
+ if (!editingId || !trimmed) { handleCancelEdit(); return; }
+ editMutation.mutate({ messageId: editingId, content: trimmed, conversationId: conversation.id },
{ onError: (err) => { log.error('Failed to edit:', err); toast.error('Falha ao editar.'); } });
setEditingId(null); setEditText('');
}, [editingId, editText, editMutation, conversation.id]);
const handleCancelEdit = useCallback(() => { setEditingId(null); setEditText(''); }, []);
- const handleCopyMessage = useCallback((content: string) => {
+ const handleCopyMessage = useCallback((content: string | null) => {
+ if (!content) return;
navigator.clipboard.writeText(content).then(() => toast.success('Copiado!')).catch(() => toast.error('Erro ao copiar'));
}, []);
diff --git a/src/components/ui/__tests__/button.test.tsx b/src/components/ui/__tests__/button.test.tsx
new file mode 100644
index 000000000..5c9505211
--- /dev/null
+++ b/src/components/ui/__tests__/button.test.tsx
@@ -0,0 +1,44 @@
+import { describe, it, expect } from 'vitest';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { Button } from '@/components/ui/button';
+import React from 'react';
+
+describe('Button Component', () => {
+ it('renders correctly with default props', () => {
+ render(
);
+ const button = screen.getByRole('button', { name: /click me/i });
+ expect(button).toBeDefined();
+ expect(button.className).toContain('bg-primary');
+ });
+
+ it('renders with different variants', () => {
+ const { rerender } = render(
);
+ let button = screen.getByRole('button', { name: /delete/i });
+ expect(button.className).toContain('bg-destructive');
+
+ rerender(
);
+ button = screen.getByRole('button', { name: /outline/i });
+ expect(button.className).toContain('border-input');
+ });
+
+ it('renders in loading state and is disabled', () => {
+ render(
);
+ const button = screen.getByRole('button');
+ expect(button).toBeDisabled();
+ expect(screen.getByText(/loading.../i)).toBeDefined();
+ // Lucide Loader2 should be present (aria-hidden by default usually, but we check for text)
+ });
+
+ it('handles click events', () => {
+ const handleClick = vi.fn();
+ render(
);
+ fireEvent.click(screen.getByRole('button'));
+ expect(handleClick).toHaveBeenCalledTimes(1);
+ });
+
+ it('is disabled when disabled prop is true', () => {
+ render(
);
+ const button = screen.getByRole('button');
+ expect(button).toBeDisabled();
+ });
+});
diff --git a/src/hooks/__tests__/useAuth.test.tsx b/src/hooks/__tests__/useAuth.test.tsx
index 79794a092..1f4c1011b 100644
--- a/src/hooks/__tests__/useAuth.test.tsx
+++ b/src/hooks/__tests__/useAuth.test.tsx
@@ -1,164 +1,76 @@
-// @ts-nocheck
import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { renderHook, act, waitFor } from '@testing-library/react';
+import { renderHook, act } from '@testing-library/react';
+import { useAuth, AuthProvider } from '../useAuth';
+import { supabase } from '@/integrations/supabase/client';
import React from 'react';
-// Mock supabase before importing useAuth
-const mockUnsubscribe = vi.fn();
-const mockOnAuthStateChange = vi.fn().mockReturnValue({
- data: { subscription: { unsubscribe: mockUnsubscribe } },
-});
-const mockGetSession = vi.fn();
-const mockSignInWithPassword = vi.fn();
-const mockSignUp = vi.fn();
-const mockSignOut = vi.fn();
-const mockFrom = vi.fn();
-
+// Mock Supabase
vi.mock('@/integrations/supabase/client', () => ({
supabase: {
auth: {
- onAuthStateChange: (...args: any[]) => mockOnAuthStateChange(...args),
- getSession: (...args: any[]) => mockGetSession(...args),
- signInWithPassword: (...args: any[]) => mockSignInWithPassword(...args),
- signUp: (...args: any[]) => mockSignUp(...args),
- signOut: (...args: any[]) => mockSignOut(...args),
+ getSession: vi.fn(),
+ onAuthStateChange: vi.fn(() => ({
+ data: { subscription: { unsubscribe: vi.fn() } },
+ })),
+ signInWithPassword: vi.fn(),
+ signUp: vi.fn(),
+ signOut: vi.fn(),
},
- from: (...args: any[]) => mockFrom(...args),
+ from: vi.fn(() => ({
+ select: vi.fn().mockReturnThis(),
+ eq: vi.fn().mockReturnThis(),
+ maybeSingle: vi.fn().mockResolvedValue({ data: null, error: null }),
+ })),
},
}));
-import { AuthProvider, useAuth } from '@/hooks/useAuth';
-
-function wrapper({ children }: { children: React.ReactNode }) {
- return
{children};
-}
-
-describe('useAuth', () => {
+describe('useAuth hook', () => {
beforeEach(() => {
vi.clearAllMocks();
- mockGetSession.mockResolvedValue({ data: { session: null } });
- mockOnAuthStateChange.mockReturnValue({
- data: { subscription: { unsubscribe: mockUnsubscribe } },
- });
});
- it('throws error when used outside AuthProvider', () => {
- expect(() => {
- renderHook(() => useAuth());
- }).toThrow('useAuth must be used within an AuthProvider');
- });
+ const wrapper = ({ children }: { children: React.ReactNode }) => (
+
{children}
+ );
- it('starts with loading=true and resolves to no user', async () => {
+ it('initializes with loading state', async () => {
+ (supabase.auth.getSession as any).mockResolvedValue({ data: { session: null }, error: null });
+
const { result } = renderHook(() => useAuth(), { wrapper });
-
- await waitFor(() => {
- expect(result.current.loading).toBe(false);
- });
-
+
+ expect(result.current.loading).toBe(true);
expect(result.current.user).toBeNull();
- expect(result.current.session).toBeNull();
- expect(result.current.profile).toBeNull();
});
- it('loads user from existing session', async () => {
- const mockUser = { id: 'user-1', email: 'test@test.com' };
- const mockSession = { user: mockUser, access_token: 'token' };
-
- mockGetSession.mockResolvedValue({ data: { session: mockSession } });
- mockFrom.mockReturnValue({
- select: vi.fn().mockReturnValue({
- eq: vi.fn().mockReturnValue({
- maybeSingle: vi.fn().mockResolvedValue({
- data: { id: 'p1', user_id: 'user-1', name: 'Test', role: 'agent', max_chats: 5 },
- error: null,
- }),
- }),
- }),
+ it('handles sign in successfully', async () => {
+ (supabase.auth.signInWithPassword as any).mockResolvedValue({
+ data: { user: { id: '123' } },
+ error: null
});
const { result } = renderHook(() => useAuth(), { wrapper });
-
- await waitFor(() => {
- expect(result.current.loading).toBe(false);
- });
-
- expect(result.current.user).toEqual(mockUser);
- expect(result.current.session).toEqual(mockSession);
- });
-
- it('signIn calls supabase signInWithPassword', async () => {
- mockSignInWithPassword.mockResolvedValue({ error: null });
-
- const { result } = renderHook(() => useAuth(), { wrapper });
-
- await waitFor(() => expect(result.current.loading).toBe(false));
-
- const response = await act(async () => {
- return result.current.signIn('test@test.com', 'password123');
+
+ let response;
+ await act(async () => {
+ response = await result.current.signIn('test@test.com', 'password123');
});
-
- expect(mockSignInWithPassword).toHaveBeenCalledWith({
+
+ expect(supabase.auth.signInWithPassword).toHaveBeenCalledWith({
email: 'test@test.com',
- password: 'password123',
+ password: 'password123'
});
- expect(response.error).toBeNull();
+ expect((response as any).error).toBeNull();
});
- it('signIn returns error on failure', async () => {
- const mockError = new Error('Invalid credentials');
- mockSignInWithPassword.mockResolvedValue({ error: mockError });
+ it('handles sign out', async () => {
+ (supabase.auth.signOut as any).mockResolvedValue({ error: null });
const { result } = renderHook(() => useAuth(), { wrapper });
- await waitFor(() => expect(result.current.loading).toBe(false));
-
- const response = await act(async () => {
- return result.current.signIn('bad@test.com', 'wrong');
- });
-
- expect(response.error).toEqual(mockError);
- });
-
- it('signUp calls supabase signUp with correct params', async () => {
- mockSignUp.mockResolvedValue({ error: null });
-
- const { result } = renderHook(() => useAuth(), { wrapper });
- await waitFor(() => expect(result.current.loading).toBe(false));
-
- const response = await act(async () => {
- return result.current.signUp('new@test.com', 'pass123', 'New User');
- });
-
- expect(mockSignUp).toHaveBeenCalledWith({
- email: 'new@test.com',
- password: 'pass123',
- options: {
- emailRedirectTo: expect.stringContaining('/'),
- data: { name: 'New User' },
- },
- });
- expect(response.error).toBeNull();
- });
-
- it('signOut clears profile and calls supabase signOut', async () => {
- mockSignOut.mockResolvedValue({ error: null });
-
- const { result } = renderHook(() => useAuth(), { wrapper });
- await waitFor(() => expect(result.current.loading).toBe(false));
-
+
await act(async () => {
await result.current.signOut();
});
-
- expect(mockSignOut).toHaveBeenCalled();
- expect(result.current.profile).toBeNull();
- });
-
- it('cleans up auth subscription on unmount', async () => {
- const { unmount } = renderHook(() => useAuth(), { wrapper });
-
- await waitFor(() => {});
- unmount();
-
- expect(mockUnsubscribe).toHaveBeenCalled();
+
+ expect(supabase.auth.signOut).toHaveBeenCalled();
});
});
diff --git a/src/hooks/team-chat/useTeamMessages.ts b/src/hooks/team-chat/useTeamMessages.ts
index 9dad91458..cf34af480 100644
--- a/src/hooks/team-chat/useTeamMessages.ts
+++ b/src/hooks/team-chat/useTeamMessages.ts
@@ -29,7 +29,7 @@ export function useTeamMessages(conversationId: string | null) {
if (!conversationId) return;
const channel = supabase
.channel(`team-messages-${conversationId}`)
- .on('postgres_changes', { event: 'INSERT', schema: 'public', table: 'team_messages', filter: `conversation_id=eq.${conversationId}` }, () => {
+ .on('postgres_changes', { event: '*', schema: 'public', table: 'team_messages', filter: `conversation_id=eq.${conversationId}` }, () => {
queryClient.invalidateQueries({ queryKey: ['team-messages', conversationId] });
queryClient.invalidateQueries({ queryKey: ['team-conversations'] });
})
diff --git a/src/hooks/useAuth.tsx b/src/hooks/useAuth.tsx
index e3475c769..3a44bd271 100644
--- a/src/hooks/useAuth.tsx
+++ b/src/hooks/useAuth.tsx
@@ -54,15 +54,15 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
}, []);
useEffect(() => {
+ console.log('[BOOT] AuthProvider initialized, starting session check');
const { data: { subscription } } = supabase.auth.onAuthStateChange(
(event, session) => {
+ console.log('[BOOT] Auth state change:', event, session ? 'Authenticated' : 'Unauthenticated');
setSession(session);
setUser(session?.user ?? null);
if (session?.user) {
- setTimeout(() => {
- fetchProfile(session.user.id);
- }, 0);
+ fetchProfile(session.user.id);
} else {
setProfile(null);
}
@@ -70,12 +70,17 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
);
supabase.auth.getSession().then(({ data: { session } }) => {
+ console.log('[BOOT] Initial session retrieved:', session ? 'User Found' : 'No User');
setSession(session);
setUser(session?.user ?? null);
if (session?.user) {
fetchProfile(session.user.id);
}
setLoading(false);
+ console.log('[BOOT] Auth loading finished');
+ }).catch(err => {
+ console.error('[BOOT] Error fetching session:', err);
+ setLoading(false);
});
return () => subscription.unsubscribe();
diff --git a/src/hooks/useDebounce.test.ts b/src/hooks/useDebounce.test.ts
new file mode 100644
index 000000000..fdc225df2
--- /dev/null
+++ b/src/hooks/useDebounce.test.ts
@@ -0,0 +1,57 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { renderHook } from '@testing-library/react';
+import { useDebounce } from './useDebounce';
+
+describe('useDebounce hook', () => {
+ beforeEach(() => {
+ vi.useFakeTimers();
+ });
+
+ afterEach(() => {
+ vi.restoreAllMocks();
+ });
+
+ it('debounces a function call', () => {
+ const callback = vi.fn();
+ const { result } = renderHook(() => useDebounce(callback, 500));
+
+ const debouncedFn = result.current;
+
+ // Call the function
+ debouncedFn('test');
+
+ // Should not have been called yet
+ expect(callback).not.toHaveBeenCalled();
+
+ // Fast-forward time
+ vi.advanceTimersByTime(500);
+
+ // Should have been called now
+ expect(callback).toHaveBeenCalledWith('test');
+ expect(callback).toHaveBeenCalledTimes(1);
+ });
+
+ it('cancels previous calls if called multiple times within delay', () => {
+ const callback = vi.fn();
+ const { result } = renderHook(() => useDebounce(callback, 500));
+
+ const debouncedFn = result.current;
+
+ // Call multiple times
+ debouncedFn(1);
+ vi.advanceTimersByTime(250);
+ debouncedFn(2);
+ vi.advanceTimersByTime(250);
+ debouncedFn(3);
+
+ // Still not called
+ expect(callback).not.toHaveBeenCalled();
+
+ // Fast-forward remaining time for the last call
+ vi.advanceTimersByTime(500);
+
+ // Only the last call should be executed
+ expect(callback).toHaveBeenCalledTimes(1);
+ expect(callback).toHaveBeenCalledWith(3);
+ });
+});
diff --git a/src/hooks/useExternalEvolution.ts b/src/hooks/useExternalEvolution.ts
index 3e87c5015..75481172e 100644
--- a/src/hooks/useExternalEvolution.ts
+++ b/src/hooks/useExternalEvolution.ts
@@ -42,7 +42,7 @@ async function fetchMessagesByJid(remoteJid: string, limit = 1000): Promise
void) | undefined;
- let disposed = false;
-
- const registerServiceWorker = async () => {
+ const unregisterAll = async () => {
try {
- const reloadedForLegacyCleanup = await cleanupLegacyServiceWorker();
- if (reloadedForLegacyCleanup || disposed) return;
-
- const registration = await navigator.serviceWorker.register('/sw.js', {
- scope: '/',
- updateViaCache: 'none',
- });
-
- if (disposed) return;
-
- log.debug('[ServiceWorker] Registration successful:', registration.scope);
-
- // Check for updates every 5 minutes (was 1 min — too frequent)
- const intervalId = setInterval(() => {
- registration.update();
- }, 300_000);
-
- // Handle service worker updates
- registration.addEventListener('updatefound', () => {
- const newWorker = registration.installing;
- if (newWorker) {
- newWorker.addEventListener('statechange', () => {
- if (newWorker.state === 'installed' && navigator.serviceWorker.controller) {
- log.debug('[ServiceWorker] New content available');
- document.dispatchEvent(new CustomEvent('sw-update-available'));
- }
- });
+ const registrations = await navigator.serviceWorker.getRegistrations();
+ for (const registration of registrations) {
+ await registration.unregister();
+ log.info('[ServiceWorker] Unregistered existing worker');
+ }
+
+ if (typeof caches !== 'undefined') {
+ const keys = await caches.keys();
+ for (const key of keys) {
+ await caches.delete(key);
+ log.info('[ServiceWorker] Deleted cache:', key);
}
- });
-
- // Listen for messages from service worker
- const onMessage = (event: MessageEvent) => {
- log.debug('[ServiceWorker] Message received:', event.data);
- if (event.data.type === 'NOTIFICATION_CLICK') {
- document.dispatchEvent(new CustomEvent('notification-click', {
- detail: event.data.data,
- }));
- }
- };
- navigator.serviceWorker.addEventListener('message', onMessage);
-
- // Cleanup on unmount (interval was leaking before)
- cleanup = () => {
- clearInterval(intervalId);
- navigator.serviceWorker.removeEventListener('message', onMessage);
- };
+ }
} catch (error) {
- log.error('[ServiceWorker] Registration failed:', error);
+ log.error('[ServiceWorker] Unregistration failed:', error);
}
};
- void registerServiceWorker();
-
- return () => {
- disposed = true;
- cleanup?.();
- };
+ void unregisterAll();
}, []);
+
}
diff --git a/src/index.css b/src/index.css
index 92c7e2e3c..fd7b6bd68 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,19 +1,49 @@
+@import './styles/tokens.css';
+@import './styles/base.css';
+@import './styles/utilities.css';
+@import './styles/components.css';
+@import './styles/animations.css';
+@import './styles/sidebar.css';
+@import './styles/accessibility.css';
+
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer utilities {
+ .animate-pulse-subtle {
+ animation: pulse-subtle 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+ }
+
+ @keyframes pulse-subtle {
+ 0%, 100% { opacity: 1; transform: scale(1); }
+ 50% { opacity: 0.8; transform: scale(1.01); filter: brightness(1.1); }
+ }
+}
+
/* ===== FONT VARIABLES ===== */
:root {
--font-display: 'Outfit', system-ui, sans-serif;
--font-sans: 'Outfit', system-ui, sans-serif;
}
-/* ===== VIEWPORT LOCK — Must be outside @layer to win specificity ===== */
+/* ===== VIEWPORT LOCK — Allowed overflow on mobile for Auth page compatibility ===== */
html, body, #root {
- height: 100vh !important;
- max-height: 100vh !important;
- overflow: hidden !important;
+ min-height: 100vh;
margin: 0;
padding: 0;
font-family: var(--font-sans);
}
+body {
+ overflow-x: hidden;
+}
+
+#root {
+ display: flex;
+ flex-direction: column;
+}
+
/* ===== VIEW TRANSITIONS API ===== */
::view-transition-old(root),
::view-transition-new(root) {
@@ -28,44 +58,3 @@ html, body, #root {
::view-transition-old(root),
::view-transition-new(root) { animation-duration: 0.01ms !important; }
}
-
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-/* ===== ACCESSIBILITY ===== */
-/* Global focus-visible ring for all interactive elements */
-:focus-visible {
- outline: 2px solid hsl(var(--ring));
- outline-offset: 2px;
- border-radius: inherit;
-}
-
-:focus:not(:focus-visible) {
- outline: none;
-}
-
-.safe-area-top { padding-top: env(safe-area-inset-top, 0); }
-.safe-area-bottom { padding-bottom: env(safe-area-inset-bottom, 0); }
-.touch-manipulation { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
-
-/* Mobile-specific optimizations */
-@media (max-width: 767px) {
- input, textarea, select { font-size: 16px !important; }
- * { -webkit-overflow-scrolling: touch; }
- body { overscroll-behavior-y: contain; }
- button, a, [role="button"] { min-height: 44px; min-width: 44px; }
- .scrollbar-none::-webkit-scrollbar { display: none; }
- .scrollbar-none { -ms-overflow-style: none; scrollbar-width: none; }
- .overscroll-contain { overscroll-behavior: contain; }
- .will-change-transform { will-change: transform; }
-}
-
-/* ===== MODULAR DESIGN SYSTEM ===== */
-@import './styles/tokens.css';
-@import './styles/base.css';
-@import './styles/utilities.css';
-@import './styles/components.css';
-@import './styles/animations.css';
-@import './styles/sidebar.css';
-@import './styles/accessibility.css';
diff --git a/src/integrations/supabase/types.ts b/src/integrations/supabase/types.ts
index eeba4b938..0569ab23f 100644
--- a/src/integrations/supabase/types.ts
+++ b/src/integrations/supabase/types.ts
@@ -10,7 +10,7 @@ export type Database = {
// Allows to automatically instantiate createClient with right options
// instead of createClient(URL, KEY)
__InternalSupabase: {
- PostgrestVersion: "13.0.5"
+ PostgrestVersion: "14.5"
}
public: {
Tables: {
diff --git a/src/lib/utils.test.ts b/src/lib/utils.test.ts
new file mode 100644
index 000000000..2ad191a81
--- /dev/null
+++ b/src/lib/utils.test.ts
@@ -0,0 +1,21 @@
+import { describe, it, expect } from 'vitest';
+import { cn } from './utils';
+
+describe('cn utility', () => {
+ it('merges class names correctly', () => {
+ expect(cn('class1', 'class2')).toBe('class1 class2');
+ });
+
+ it('handles conditional classes', () => {
+ expect(cn('base', true && 'is-true', false && 'is-false')).toBe('base is-true');
+ });
+
+ it('merges tailwind classes correctly (using twMerge)', () => {
+ // p-4 and p-8 should be merged to p-8
+ expect(cn('p-4', 'p-8')).toBe('p-8');
+ });
+
+ it('handles undefined and null values', () => {
+ expect(cn('class1', undefined, null, 'class2')).toBe('class1 class2');
+ });
+});
diff --git a/src/lib/web-vitals.ts b/src/lib/web-vitals.ts
index ab366070b..d85523635 100644
--- a/src/lib/web-vitals.ts
+++ b/src/lib/web-vitals.ts
@@ -47,74 +47,82 @@ export function initWebVitals() {
// LCP - Largest Contentful Paint
try {
- const lcpObserver = new PerformanceObserver((list) => {
- const entries = list.getEntries();
- const lastEntry = entries[entries.length - 1] as PerformanceEntry;
- if (lastEntry) {
- onMetric({
- name: 'LCP',
- value: lastEntry.startTime,
- rating: getRating('LCP', lastEntry.startTime),
- delta: lastEntry.startTime,
- id: `lcp-${Date.now()}`,
- });
- }
- });
- lcpObserver.observe({ type: 'largest-contentful-paint', buffered: true });
+ if (PerformanceObserver.supportedEntryTypes.includes('largest-contentful-paint')) {
+ const lcpObserver = new PerformanceObserver((list) => {
+ const entries = list.getEntries();
+ const lastEntry = entries[entries.length - 1] as PerformanceEntry;
+ if (lastEntry) {
+ onMetric({
+ name: 'LCP',
+ value: lastEntry.startTime,
+ rating: getRating('LCP', lastEntry.startTime),
+ delta: lastEntry.startTime,
+ id: `lcp-${Date.now()}`,
+ });
+ }
+ });
+ lcpObserver.observe({ type: 'largest-contentful-paint', buffered: true });
+ }
} catch (e) { /* not supported */ }
// FID - First Input Delay
try {
- const fidObserver = new PerformanceObserver((list) => {
- for (const entry of list.getEntries()) {
- const fid = (entry as PerformanceEventTiming).processingStart - entry.startTime;
- onMetric({
- name: 'FID',
- value: fid,
- rating: getRating('FID', fid),
- delta: fid,
- id: `fid-${Date.now()}`,
- });
- }
- });
- fidObserver.observe({ type: 'first-input', buffered: true });
+ if (PerformanceObserver.supportedEntryTypes.includes('first-input')) {
+ const fidObserver = new PerformanceObserver((list) => {
+ for (const entry of list.getEntries()) {
+ const fid = (entry as PerformanceEventTiming).processingStart - entry.startTime;
+ onMetric({
+ name: 'FID',
+ value: fid,
+ rating: getRating('FID', fid),
+ delta: fid,
+ id: `fid-${Date.now()}`,
+ });
+ }
+ });
+ fidObserver.observe({ type: 'first-input', buffered: true });
+ }
} catch (e) { /* not supported */ }
// CLS - Cumulative Layout Shift
try {
- let clsValue = 0;
- const clsObserver = new PerformanceObserver((list) => {
- for (const entry of list.getEntries()) {
- if (!(entry as PerformanceEntry & { hadRecentInput?: boolean }).hadRecentInput) {
- clsValue += (entry as PerformanceEntry & { value: number }).value;
+ if (PerformanceObserver.supportedEntryTypes.includes('layout-shift')) {
+ let clsValue = 0;
+ const clsObserver = new PerformanceObserver((list) => {
+ for (const entry of list.getEntries()) {
+ if (!(entry as PerformanceEntry & { hadRecentInput?: boolean }).hadRecentInput) {
+ clsValue += (entry as PerformanceEntry & { value: number }).value;
+ }
}
- }
- onMetric({
- name: 'CLS',
- value: clsValue,
- rating: getRating('CLS', clsValue),
- delta: clsValue,
- id: `cls-${Date.now()}`,
+ onMetric({
+ name: 'CLS',
+ value: clsValue,
+ rating: getRating('CLS', clsValue),
+ delta: clsValue,
+ id: `cls-${Date.now()}`,
+ });
});
- });
- clsObserver.observe({ type: 'layout-shift', buffered: true });
+ clsObserver.observe({ type: 'layout-shift', buffered: true });
+ }
} catch (e) { /* not supported */ }
// INP - Interaction to Next Paint
try {
- const inpObserver = new PerformanceObserver((list) => {
- for (const entry of list.getEntries()) {
- const duration = entry.duration;
- onMetric({
- name: 'INP',
- value: duration,
- rating: getRating('INP', duration),
- delta: duration,
- id: `inp-${Date.now()}`,
- });
- }
- });
- inpObserver.observe({ type: 'event', buffered: true, durationThreshold: 40 } as PerformanceObserverInit);
+ if (PerformanceObserver.supportedEntryTypes.includes('event')) {
+ const inpObserver = new PerformanceObserver((list) => {
+ for (const entry of list.getEntries()) {
+ const duration = entry.duration;
+ onMetric({
+ name: 'INP',
+ value: duration,
+ rating: getRating('INP', duration),
+ delta: duration,
+ id: `inp-${Date.now()}`,
+ });
+ }
+ });
+ inpObserver.observe({ type: 'event', buffered: true, durationThreshold: 40 } as PerformanceObserverInit);
+ }
} catch (e) { /* not supported */ }
// TTFB - Time to First Byte
@@ -130,7 +138,7 @@ export function initWebVitals() {
id: `ttfb-${Date.now()}`,
});
}
- } catch (e) { console.debug('[web-vitals] Navigation Timing API not supported:', e); }
+ } catch (e) { log.debug('[web-vitals] Navigation Timing API not supported'); }
}
export function getWebVitalsReport(): WebVitalMetric[] {
diff --git a/src/main.tsx b/src/main.tsx
index 59be72266..f695f076f 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -7,6 +7,10 @@ import { getLogger } from "./lib/logger";
import { initWebVitals } from "./lib/web-vitals";
const log = getLogger('App');
+if (window.performance && window.performance.mark) {
+ performance.mark('main-init');
+}
+console.log('[BOOT] src/main.tsx loaded');
log.info('Initialized at', new Date().toISOString());
// Global unhandled error handlers for resilience
diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx
index bf0fff84a..982d96bde 100644
--- a/src/pages/Index.tsx
+++ b/src/pages/Index.tsx
@@ -1,4 +1,4 @@
-import { useState, useEffect, useCallback, useRef, forwardRef } from 'react';
+import { useState, useEffect, useCallback, useRef, forwardRef, memo } from 'react';
import { useQueryClient } from '@tanstack/react-query';
import { useNavigationHistory } from '@/hooks/useNavigationHistory';
import { useNavigate } from 'react-router-dom';
@@ -261,28 +261,28 @@ function LoadingSplash() {
);
}
-const Index = forwardRef(function Index(_props, _ref) {
+const Index = memo(forwardRef(function Index(_props, _ref) {
const { user, loading } = useAuth();
const { completeOnboarding } = useOnboarding();
+ const navigate = useNavigate();
+
+ useEffect(() => {
+ if (!loading && !user) {
+ navigate('/auth', { replace: true });
+ }
+ }, [user, loading, navigate]);
if (loading) {
- return (
-
- );
+ return ;
}
+ if (!user) return null;
+
return (
);
-});
+}));
export default Index;
diff --git a/src/pages/Install.tsx b/src/pages/Install.tsx
index 122fcc146..f2d7bcf75 100644
--- a/src/pages/Install.tsx
+++ b/src/pages/Install.tsx
@@ -18,7 +18,7 @@ const Install = () => {
useEffect(() => {
// Detect iOS
const ua = navigator.userAgent;
- setIsIOS(/iPad|iPhone|iPod/.test(ua) && !(window as any).MSStream);
+ setIsIOS(/iPad|iPhone|iPod/.test(ua) && !(window as Window & { MSStream?: unknown }).MSStream);
// Check if already installed
if (window.matchMedia("(display-mode: standalone)").matches) {
diff --git a/src/styles/animations.css b/src/styles/animations.css
index 5038e8444..9ce9a8c25 100644
--- a/src/styles/animations.css
+++ b/src/styles/animations.css
@@ -151,3 +151,8 @@
0%, 60%, 100% { opacity: 0.3; transform: scale(1); }
30% { opacity: 1; transform: scale(1.15); }
}
+
+@keyframes pulse-soft {
+ 0%, 100% { opacity: 1; }
+ 50% { opacity: 0.5; }
+}
diff --git a/src/styles/base.css b/src/styles/base.css
index 37243b4d4..e0f033ec9 100644
--- a/src/styles/base.css
+++ b/src/styles/base.css
@@ -1,7 +1,6 @@
/* ===== BASE STYLES — Resets, typography, body ===== */
-@layer base {
- * {
+* {
@apply border-border;
}
@@ -114,7 +113,6 @@
code, pre {
font-family: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;
@apply text-sm;
- }
}
/* ===== SCROLLBAR ===== */
diff --git a/src/styles/components.css b/src/styles/components.css
index 5ffe2d790..8301fe9de 100644
--- a/src/styles/components.css
+++ b/src/styles/components.css
@@ -1,115 +1,113 @@
/* ===== COMPONENT STYLES — Cards, hover effects, chat, gamification ===== */
-@layer components {
- /* ===== CARD STYLES ===== */
- .card-base { @apply bg-card rounded-xl border border-border p-6 transition-all duration-200; }
- .card-elevated { @apply bg-card-elevated rounded-xl border border-border p-6 transition-all duration-200; box-shadow: var(--shadow-sm); }
- .card-elevated:hover { box-shadow: var(--shadow-md); @apply border-primary/20; transform: translateY(-1px); }
-
- .card-interactive {
- @apply relative bg-card rounded-xl border border-border p-6 cursor-pointer;
- transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
- }
- .card-interactive:hover { @apply border-primary/30 bg-accent/30; box-shadow: var(--shadow-md); transform: translateY(-2px); }
- .card-interactive:active { transform: translateY(0) scale(0.995); transition-duration: 0.1s; }
-
- .card-glow-purple { @apply relative bg-card rounded-xl border border-primary/20 p-6 transition-all duration-200; box-shadow: var(--shadow-sm); }
- .card-glow-purple:hover { box-shadow: var(--shadow-glow-primary); @apply border-primary/40; transform: translateY(-2px); }
-
- .card-glow-gradient { @apply relative bg-card rounded-xl border border-primary/15 p-6 transition-all duration-200; box-shadow: var(--shadow-sm); }
- .card-glow-gradient:hover { box-shadow: var(--shadow-glow-primary); transform: translateY(-1px); }
-
- .glass-card { @apply rounded-xl p-6 border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); }
- .glass-card:hover { border-color: hsl(var(--primary) / 0.3); box-shadow: 0 8px 32px hsl(var(--primary) / 0.1); }
-
- .glass-panel { @apply border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); box-shadow: var(--shadow-lg); }
-
- .stat-card { @apply bg-card rounded-xl border border-border p-4; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); }
- .stat-card:hover { @apply border-primary/25; box-shadow: var(--shadow-sm); transform: translateY(-1px); }
-
- .card-subtle { @apply bg-muted/30 border-transparent; }
- .card-prominent { @apply bg-card-elevated border-primary/10; box-shadow: var(--shadow-md); }
- .card-featured { @apply bg-card-elevated border-primary/20 ring-1 ring-primary/10; box-shadow: var(--shadow-lg); }
-
- /* Shimmer highlight */
- .card-shimmer { @apply relative overflow-hidden; }
- .card-shimmer::after {
- content: '';
- position: absolute;
- inset: 0;
- background: linear-gradient(105deg, transparent 40%, hsl(var(--primary) / 0.04) 45%, hsl(var(--primary) / 0.08) 50%, hsl(var(--primary) / 0.04) 55%, transparent 60%);
- background-size: 200% 100%;
- animation: shimmer 2.5s ease-in-out infinite;
- pointer-events: none;
- }
-
- /* ===== HOVER EFFECTS ===== */
- .hover-lift { @apply transition-all duration-200; }
- .hover-lift:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
- .hover-lift-sm { @apply transition-all duration-200; }
- .hover-lift-sm:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm); }
- .hover-lift-lg { @apply transition-all duration-200; }
- .hover-lift-lg:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
-
- .hover-scale { @apply transition-transform duration-200; }
- .hover-scale:hover { transform: scale(1.03); }
- .hover-scale-sm { @apply transition-transform duration-200; }
- .hover-scale-sm:hover { transform: scale(1.01); }
-
- .hover-glow { @apply transition-shadow duration-200; }
- .hover-glow:hover { box-shadow: var(--shadow-glow-primary); }
- .hover-glow-primary { @apply transition-shadow duration-200; }
- .hover-glow-primary:hover { box-shadow: var(--shadow-glow-primary); }
- .hover-glow-success { @apply transition-shadow duration-200; }
- .hover-glow-success:hover { box-shadow: var(--shadow-glow-success); }
-
- .press-scale { @apply transition-transform duration-100; }
- .press-scale:active { transform: scale(0.97); }
- .press-scale-sm { @apply transition-transform duration-100; }
- .press-scale-sm:active { transform: scale(0.98); }
-
- /* ===== RANK BADGES ===== */
- .rank-gold { @apply relative; background: linear-gradient(135deg, hsl(45 93% 47%), hsl(38 92% 50%)); color: hsl(var(--rank-gold-foreground)); }
- .rank-silver { @apply relative; background: linear-gradient(135deg, hsl(220 15% 75%), hsl(220 13% 65%)); color: hsl(var(--rank-silver-foreground)); }
- .rank-bronze { @apply relative; background: linear-gradient(135deg, hsl(30 55% 55%), hsl(25 50% 45%)); color: hsl(var(--rank-bronze-foreground)); }
-
- /* ===== CONVERSATION ITEM ===== */
- .conversation-item {
- @apply flex items-center gap-3 p-3 rounded-xl cursor-pointer;
- transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
- @apply hover:bg-accent/60;
- }
- .conversation-item.active {
- @apply bg-primary/10 border-l-[3px] border-primary;
- box-shadow: inset 4px 0 8px -4px hsl(var(--primary) / 0.15);
- }
-
- /* ===== MESSAGE BUBBLES ===== */
- .message-bubble { @apply max-w-[70%] px-4 py-2 rounded-2xl; }
- .message-bubble.sent { @apply bg-[hsl(var(--chat-bubble-sent))] text-[hsl(var(--chat-bubble-sent-foreground))] rounded-br-md; }
- .message-bubble.received { @apply bg-[hsl(var(--chat-bubble-received))] text-[hsl(var(--chat-bubble-received-foreground))] rounded-bl-md; }
-
- /* ===== STATUS DOT ===== */
- .status-dot { @apply w-2.5 h-2.5 rounded-full; }
- .status-dot.online { @apply bg-[hsl(var(--online))]; }
- .status-dot.away { @apply bg-[hsl(var(--away))]; }
- .status-dot.offline { @apply bg-[hsl(var(--offline))]; }
-
- /* ===== UNREAD BADGE ===== */
- .unread-badge { @apply min-w-5 h-5 px-1.5 flex items-center justify-center rounded-full text-xs font-bold bg-destructive text-destructive-foreground; }
-
- /* ===== GLASS MORPHISM ===== */
- .glass { @apply border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); }
- .glass-strong { @apply border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); }
-
- /* ===== GAMIFICATION ANIMATIONS ===== */
- .animate-xp-shimmer {
- background: linear-gradient(90deg, hsl(var(--xp)) 0%, hsl(var(--xp) / 0.7) 50%, hsl(var(--xp)) 100%);
- background-size: 200% 100%;
- animation: xp-shimmer 2s ease-in-out infinite;
- }
- .animate-streak-fire { animation: streak-fire 0.8s ease-in-out infinite; }
- .animate-coin-shine { animation: coin-shine 2s ease-in-out infinite; }
- .animate-level-up { animation: level-up 0.6s ease-out; }
- .animate-pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }
+/* ===== CARD STYLES ===== */
+.card-base { @apply bg-card rounded-xl border border-border p-6 transition-all duration-200; }
+.card-elevated { @apply bg-card-elevated rounded-xl border border-border p-6 transition-all duration-200; box-shadow: var(--shadow-sm); }
+.card-elevated:hover { box-shadow: var(--shadow-md); @apply border-primary/20; transform: translateY(-1px); }
+
+.card-interactive {
+ @apply relative bg-card rounded-xl border border-border p-6 cursor-pointer;
+ transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
+.card-interactive:hover { @apply border-primary/30 bg-accent/30; box-shadow: var(--shadow-md); transform: translateY(-2px); }
+.card-interactive:active { transform: translateY(0) scale(0.995); transition-duration: 0.1s; }
+
+.card-glow-purple { @apply relative bg-card rounded-xl border border-primary/20 p-6 transition-all duration-200; box-shadow: var(--shadow-sm); }
+.card-glow-purple:hover { box-shadow: var(--shadow-glow-primary); @apply border-primary/40; transform: translateY(-2px); }
+
+.card-glow-gradient { @apply relative bg-card rounded-xl border border-primary/15 p-6 transition-all duration-200; box-shadow: var(--shadow-sm); }
+.card-glow-gradient:hover { box-shadow: var(--shadow-glow-primary); transform: translateY(-1px); }
+
+.glass-card { @apply rounded-xl p-6 border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); }
+.glass-card:hover { border-color: hsl(var(--primary) / 0.3); box-shadow: 0 8px 32px hsl(var(--primary) / 0.1); }
+
+.glass-panel { @apply border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); box-shadow: var(--shadow-lg); }
+
+.stat-card { @apply bg-card rounded-xl border border-border p-4; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); }
+.stat-card:hover { @apply border-primary/25; box-shadow: var(--shadow-sm); transform: translateY(-1px); }
+
+.card-subtle { @apply bg-muted/30 border-transparent; }
+.card-prominent { @apply bg-card-elevated border-primary/10; box-shadow: var(--shadow-md); }
+.card-featured { @apply bg-card-elevated border-primary/20 ring-1 ring-primary/10; box-shadow: var(--shadow-lg); }
+
+/* Shimmer highlight */
+.card-shimmer { @apply relative overflow-hidden; }
+.card-shimmer::after {
+ content: '';
+ position: absolute;
+ inset: 0;
+ background: linear-gradient(105deg, transparent 40%, hsl(var(--primary) / 0.04) 45%, hsl(var(--primary) / 0.08) 50%, hsl(var(--primary) / 0.04) 55%, transparent 60%);
+ background-size: 200% 100%;
+ animation: shimmer 2.5s ease-in-out infinite;
+ pointer-events: none;
+}
+
+/* ===== HOVER EFFECTS ===== */
+.hover-lift { @apply transition-all duration-200; }
+.hover-lift:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
+.hover-lift-sm { @apply transition-all duration-200; }
+.hover-lift-sm:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm); }
+.hover-lift-lg { @apply transition-all duration-200; }
+.hover-lift-lg:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
+
+.hover-scale { @apply transition-transform duration-200; }
+.hover-scale:hover { transform: scale(1.03); }
+.hover-scale-sm { @apply transition-transform duration-200; }
+.hover-scale-sm:hover { transform: scale(1.01); }
+
+.hover-glow { @apply transition-shadow duration-200; }
+.hover-glow:hover { box-shadow: var(--shadow-glow-primary); }
+.hover-glow-primary { @apply transition-shadow duration-200; }
+.hover-glow-primary:hover { box-shadow: var(--shadow-glow-primary); }
+.hover-glow-success { @apply transition-shadow duration-200; }
+.hover-glow-success:hover { box-shadow: var(--shadow-glow-success); }
+
+.press-scale { @apply transition-transform duration-100; }
+.press-scale:active { transform: scale(0.97); }
+.press-scale-sm { @apply transition-transform duration-100; }
+.press-scale-sm:active { transform: scale(0.98); }
+
+/* ===== RANK BADGES ===== */
+.rank-gold { @apply relative; background: linear-gradient(135deg, hsl(45 93% 47%), hsl(38 92% 50%)); color: hsl(var(--rank-gold-foreground)); }
+.rank-silver { @apply relative; background: linear-gradient(135deg, hsl(220 15% 75%), hsl(220 13% 65%)); color: hsl(var(--rank-silver-foreground)); }
+.rank-bronze { @apply relative; background: linear-gradient(135deg, hsl(30 55% 55%), hsl(25 50% 45%)); color: hsl(var(--rank-bronze-foreground)); }
+
+/* ===== CONVERSATION ITEM ===== */
+.conversation-item {
+ @apply flex items-center gap-3 p-3 rounded-xl cursor-pointer;
+ transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+ @apply hover:bg-accent/60;
+}
+.conversation-item.active {
+ @apply bg-primary/10 border-l-[3px] border-primary;
+ box-shadow: inset 4px 0 8px -4px hsl(var(--primary) / 0.15);
+}
+
+/* ===== MESSAGE BUBBLES ===== */
+.message-bubble { @apply max-w-[70%] px-4 py-2 rounded-2xl; }
+.message-bubble.sent { @apply bg-[hsl(var(--chat-bubble-sent))] text-[hsl(var(--chat-bubble-sent-foreground))] rounded-br-md; }
+.message-bubble.received { @apply bg-[hsl(var(--chat-bubble-received))] text-[hsl(var(--chat-bubble-received-foreground))] rounded-bl-md; }
+
+/* ===== STATUS DOT ===== */
+.status-dot { @apply w-2.5 h-2.5 rounded-full; }
+.status-dot.online { @apply bg-[hsl(var(--online))]; }
+.status-dot.away { @apply bg-[hsl(var(--away))]; }
+.status-dot.offline { @apply bg-[hsl(var(--offline))]; }
+
+/* ===== UNREAD BADGE ===== */
+.unread-badge { @apply min-w-5 h-5 px-1.5 flex items-center justify-center rounded-full text-xs font-bold bg-destructive text-destructive-foreground; }
+
+/* ===== GLASS MORPHISM ===== */
+.glass { @apply border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); }
+.glass-strong { @apply border transition-all duration-200; background: hsl(var(--glass-bg)); border-color: hsl(var(--glass-border)); }
+
+/* ===== GAMIFICATION ANIMATIONS ===== */
+.animate-xp-shimmer {
+ background: linear-gradient(90deg, hsl(var(--xp)) 0%, hsl(var(--xp) / 0.7) 50%, hsl(var(--xp)) 100%);
+ background-size: 200% 100%;
+ animation: xp-shimmer 2s ease-in-out infinite;
+}
+.animate-streak-fire { animation: streak-fire 0.8s ease-in-out infinite; }
+.animate-coin-shine { animation: coin-shine 2s ease-in-out infinite; }
+.animate-level-up { animation: level-up 0.6s ease-out; }
+.animate-pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }
diff --git a/src/styles/tokens.css b/src/styles/tokens.css
index 38473408f..2e1e56aeb 100644
--- a/src/styles/tokens.css
+++ b/src/styles/tokens.css
@@ -1,7 +1,6 @@
/* ===== DESIGN TOKENS — Light & Dark mode CSS variables ===== */
-@layer base {
- :root {
+:root {
/* ===== FONTS ===== */
--font-sans: 'Outfit', system-ui, sans-serif;
--font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
@@ -206,10 +205,10 @@
--chart-sentiment-positive: 160 70% 42%;
--chart-sentiment-neutral: 220 10% 50%;
--chart-sentiment-negative: 0 84% 60%;
- }
+}
- /* ===== DARK MODE - Corporate Blue ===== */
- .dark {
+/* ===== DARK MODE - Corporate Blue ===== */
+.dark {
--background: 0 0% 4%;
--foreground: 0 0% 97%;
--card: 240 7% 11%;
@@ -317,5 +316,4 @@
--chart-sentiment-positive: 155 80% 52%;
--chart-sentiment-neutral: 220 25% 65%;
--chart-sentiment-negative: 0 85% 62%;
- }
}
diff --git a/src/styles/utilities.css b/src/styles/utilities.css
index 884fc4c8e..1f2c01c2b 100644
--- a/src/styles/utilities.css
+++ b/src/styles/utilities.css
@@ -1,7 +1,6 @@
/* ===== UTILITY CLASSES — Typography, gradients, shadows, scrollbar ===== */
-@layer utilities {
- .font-display {
+.font-display {
font-family: var(--font-display);
}
@@ -122,5 +121,4 @@
.shadow-sticky {
box-shadow: 0 1px 3px hsl(var(--foreground) / 0.04), 0 1px 1px hsl(var(--foreground) / 0.02);
- }
}
diff --git a/src/utils/exportReport.ts b/src/utils/exportReport.ts
index 124b00f64..9aa0d8342 100644
--- a/src/utils/exportReport.ts
+++ b/src/utils/exportReport.ts
@@ -11,7 +11,7 @@ export interface ReportData {
subtitle?: string;
generatedAt: Date;
columns: { header: string; key: string; width?: number }[];
- rows: Record[];
+ rows: Record[];
summary?: { label: string; value: string | number }[];
}
diff --git a/supabase/config.toml b/supabase/config.toml
index a0c5c2567..3a9dfc49c 100644
--- a/supabase/config.toml
+++ b/supabase/config.toml
@@ -1,76 +1 @@
-project_id = "allrjhkpuscmgbsnmjlv"
-
-[functions.ai-conversation-summary]
-verify_jwt = false
-
-[functions.ai-conversation-analysis]
-verify_jwt = false
-
-[functions.ai-suggest-reply]
-verify_jwt = false
-
-[functions.ai-transcribe-audio]
-verify_jwt = false
-
-[functions.get-mapbox-token]
-verify_jwt = false
-
-[functions.whatsapp-webhook]
-verify_jwt = false
-
-[functions.sentiment-alert]
-verify_jwt = false
-
-[functions.evolution-api]
-verify_jwt = false
-
-[functions.evolution-webhook]
-verify_jwt = false
-
-[functions.bitrix-api]
-verify_jwt = false
-
-[functions.elevenlabs-tts]
-verify_jwt = false
-
-[functions.elevenlabs-scribe-token]
-verify_jwt = false
-
-[functions.send-rate-limit-alert]
-verify_jwt = false
-
-[functions.cleanup-rate-limit-logs]
-verify_jwt = false
-
-[functions.evolution-sync]
-verify_jwt = false
-
-[functions.ai-enhance-message]
-verify_jwt = false
-
-[functions.classify-audio-meme]
-verify_jwt = false
-
-[functions.classify-emoji]
-verify_jwt = false
-
-[functions.classify-sticker]
-verify_jwt = false
-
-[functions.elevenlabs-tts-stream]
-verify_jwt = false
-
-[functions.elevenlabs-webhook]
-verify_jwt = false
-
-[functions.elevenlabs-dialogue]
-verify_jwt = false
-
-[functions.elevenlabs-voice-design]
-verify_jwt = false
-
-[functions.elevenlabs-sts]
-verify_jwt = false
-
-[functions.elevenlabs-sfx]
-verify_jwt = false
+project_id = "uqysyzndkfiwfztbqvsl"
\ No newline at end of file
diff --git a/supabase/functions/external-db-proxy/index.ts b/supabase/functions/external-db-proxy/index.ts
index aeb517f54..400d1fb61 100644
--- a/supabase/functions/external-db-proxy/index.ts
+++ b/supabase/functions/external-db-proxy/index.ts
@@ -13,9 +13,12 @@ Deno.serve(async (req) => {
try {
const url = Deno.env.get('EXTERNAL_SUPABASE_URL')
const key = Deno.env.get('EXTERNAL_SUPABASE_ANON_KEY')
- if (!url || !key) {
- return new Response(JSON.stringify({ error: 'External DB not configured' }), {
- status: 500, headers: { ...corsHeaders, 'Content-Type': 'application/json' }
+
+ // If external DB is not configured, return empty result gracefully
+ // (avoids 503 errors that break the UI when the integration is optional)
+ if (!url || !key || url.includes('PLACEHOLDER') || !url.startsWith('https://')) {
+ return new Response(JSON.stringify({ data: [], count: 0, notConfigured: true }), {
+ status: 200, headers: { ...corsHeaders, 'Content-Type': 'application/json' }
})
}
diff --git a/supabase/functions/webhook-diagnostic/diagnostic.test.ts b/supabase/functions/webhook-diagnostic/diagnostic.test.ts
new file mode 100644
index 000000000..58f8a4d1f
--- /dev/null
+++ b/supabase/functions/webhook-diagnostic/diagnostic.test.ts
@@ -0,0 +1,44 @@
+
+import { assertEquals } from "https://deno.land/std@0.168.0/testing/asserts.ts";
+import { createClient } from "https://esm.sh/@supabase/supabase-js@2";
+
+// Mock implementation of logic for testing without actual DB/API calls
+// In a real scenario, we'd use a test DB or mock the fetch
+function calculateHealthScore(connections: any[], webhooks: any[]) {
+ if (connections.length === 0) return 0;
+ const activeCount = connections.filter(c => c.status === 'connected').length;
+ const webhookOk = webhooks.every(w => w.configured);
+
+ let score = (activeCount / connections.length) * 80;
+ if (webhookOk) score += 20;
+
+ return Math.round(score);
+}
+
+Deno.test("Health Score Calculation - All Connected", () => {
+ const connections = [{ status: 'connected' }, { status: 'connected' }];
+ const webhooks = [{ configured: true }];
+ const score = calculateHealthScore(connections, webhooks);
+ assertEquals(score, 100);
+});
+
+Deno.test("Health Score Calculation - Half Connected", () => {
+ const connections = [{ status: 'connected' }, { status: 'disconnected' }];
+ const webhooks = [{ configured: true }];
+ const score = calculateHealthScore(connections, webhooks);
+ assertEquals(score, 60); // (0.5 * 80) + 20
+});
+
+Deno.test("Health Score Calculation - Webhook Missing", () => {
+ const connections = [{ status: 'connected' }];
+ const webhooks = [{ configured: false }];
+ const score = calculateHealthScore(connections, webhooks);
+ assertEquals(score, 80);
+});
+
+Deno.test("Health Score Calculation - No Connections", () => {
+ const connections: any[] = [];
+ const webhooks = [{ configured: true }];
+ const score = calculateHealthScore(connections, webhooks);
+ assertEquals(score, 0);
+});
diff --git a/vite.config.ts b/vite.config.ts
index 9e47d44e6..621bf87a8 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -13,40 +13,8 @@ export default defineConfig(({ mode }) => ({
plugins: [
react(),
mode === "development" && componentTagger(),
- VitePWA({
- registerType: "autoUpdate",
- includeAssets: ["favicon.ico", "apple-touch-icon.png"],
- workbox: {
- globPatterns: ["**/*.{js,css,html,ico,png,svg,woff2}"],
- navigateFallbackDenylist: [/^\/~oauth/],
- // Force new SW to take over immediately
- skipWaiting: true,
- clientsClaim: true,
- // Clean old caches on update
- cleanupOutdatedCaches: true,
- runtimeCaching: [
- {
- urlPattern: /^https:\/\/fonts\.googleapis\.com\/.*/i,
- handler: "StaleWhileRevalidate",
- options: {
- cacheName: "google-fonts-cache",
- expiration: { maxEntries: 10, maxAgeSeconds: 60 * 60 * 24 * 365 },
- cacheableResponse: { statuses: [0, 200] },
- },
- },
- {
- urlPattern: /^https:\/\/fonts\.gstatic\.com\/.*/i,
- handler: "CacheFirst",
- options: {
- cacheName: "gstatic-fonts-cache",
- expiration: { maxEntries: 10, maxAgeSeconds: 60 * 60 * 24 * 365 },
- cacheableResponse: { statuses: [0, 200] },
- },
- },
- ],
- },
- manifest: false, // Use existing public/manifest.json
- }),
+ // PWA disabled to resolve preview issues
+
].filter(Boolean),
resolve: {
alias: {
@@ -59,7 +27,7 @@ export default defineConfig(({ mode }) => ({
force: true,
},
esbuild: {
- drop: mode === 'production' ? ['console', 'debugger'] : [],
+ drop: [], // Mantém logs para facilitar a depuração no preview
},
build: {
target: "esnext",