Frontend
Hooks
Padrão 1 arquivo por concern em src/hooks/
Os hooks ficam em src/hooks/, com um arquivo por tabela ou concern do Supabase.
Hooks disponíveis
| Hook | Concern |
|---|---|
use-activities.ts | CRUD de atividades |
use-activity-attempts.ts | Tentativas de contato em atividades |
use-activity-types.ts | Tipos de atividade |
use-ai-insight.ts | Insights de IA sobre base de clientes |
use-client-base-metrics.ts | Métricas de base de clientes importada |
use-client-bases.ts | CRUD de bases importadas |
use-column-config.ts | Configuração de colunas de tabela |
use-comments.ts | Comentários/notas/observações em negócios |
use-companies.ts | CRUD de empresas |
use-company-timeline.ts | Timeline de empresa |
use-contact-timeline.ts | Timeline de contato |
use-contacts.ts | CRUD de contatos |
use-create-client-base-from-import.ts | Criar base a partir de importação |
use-custom-field-definitions.ts | Definições de campos personalizados |
use-dashboard-filters.ts | Estado dos filtros do dashboard (período, owner) |
use-dashboard.ts | Todas as RPCs de dashboard (KPIs, timeline, funil, etc.) |
use-deal-activities.ts | Atividades de um negócio específico |
use-deal-history.ts | Event logs de um negócio |
use-deal-products.ts | Produtos vinculados a um negócio |
use-deal-qualification.ts | Qualificação de um negócio |
use-deal-qualification-scores.ts | Scores de qualificação de negócios |
use-deal-timeline.ts | Timeline unificada do hub do negócio |
use-deal-types.ts | Tipos de negócio |
use-deals-by-relation.ts | Negócios vinculados a contato/empresa |
use-deals.ts | CRUD de negócios (criar, editar, mover, ganhar, perder) |
use-global-search.ts | Busca global |
use-goals.ts | Metas mensais do workspace |
use-infinite-scroll.ts | Scroll infinito utilitário |
use-js-loaded.ts | Detecta se JS carregou |
use-lead-sources.ts | Origens de leads |
use-loss-reasons.ts | Motivos de perda |
use-members.ts | Membros do workspace |
use-mobile.ts | Breakpoint mobile |
use-next-activities.ts | Próximas atividades agendadas |
use-now.ts | Relógio visibility-aware (pausa em background, atualiza ao voltar) |
use-pipelines.ts | Pipelines e etapas |
use-product-suggestions.ts | Sugestões de produtos do catálogo |
use-products.ts | CRUD de produtos |
use-profile.ts | Perfil do usuário autenticado |
use-proposals.ts | CRUD de propostas e wizard |
use-qualification.ts | Formulários de qualificação (CRUD + respostas) |
use-super-admin.ts | Operações de super admin (listar workspaces, entrar, sair, criar) |
use-update-deal-field.ts | Atualização individual de campo de negócio (inline edit) |
use-workspace-cases.ts | Cases/exemplos do workspace para propostas |
use-workspace-proposal-settings.ts | Configurações de propostas do workspace |
use-workspace-settings.ts | Configurações gerais do workspace |
use-workspace.ts | Workspace ativo e membros |
Padrão de um hook
Cada hook exporta funções que seguem o padrão:
// Leitura (useQuery)
export function useDeals(pipelineId?: string) {
const workspace = useWorkspaceStore((s) => s.workspace);
return useQuery({
queryKey: ["deals", workspace?.id, pipelineId],
queryFn: async () => {
const { data, error } = await supabase
.from("deals")
.select("*, companies(name), contacts(name), stages(name)")
.eq("workspace_id", workspace!.id);
if (error) throw error;
return data;
},
enabled: !!workspace && !!pipelineId,
});
}
// Escrita (useMutation)
export function useCreateDeal() {
const workspace = useWorkspaceStore((s) => s.workspace);
const qc = useQueryClient();
return useMutation({
mutationFn: async (deal: DealInsert) => {
const { data, error } = await supabase
.from("deals")
.insert({ ...deal, workspace_id: workspace!.id })
.select()
.single();
if (error) throw error;
return data;
},
onSuccess: () =>
qc.invalidateQueries({ queryKey: ["deals", workspace?.id] }),
});
}Convenções
workspace_idé injetado automaticamente pelo hook (não passado pelo chamador)- Tipos são derivados de
Database["public"]["Tables"]["<table>"] enabledgarante que a query só roda quando há workspaceonSuccessinvalida as queries relacionadas