diff --git a/src/components/settings/MeuCadastroForm.tsx b/src/components/settings/MeuCadastroForm.tsx new file mode 100644 index 0000000..7799f82 --- /dev/null +++ b/src/components/settings/MeuCadastroForm.tsx @@ -0,0 +1,297 @@ + +import React, { useEffect, useState } from "react"; +import { Input } from "@/components/ui/input"; +import { Label } from "@/components/ui/label"; +import { Button } from "@/components/ui/button"; +import { Select, SelectTrigger, SelectContent, SelectItem } from "@/components/ui/select"; +import { useToast } from "@/hooks/use-toast"; +import { authStore } from "@/stores/authStore"; +import { supabase } from "@/integrations/supabase/client"; + +// Campos que vêm da tabela usuarios: +const camposUsuarios = ["nome", "email", "whatsapp"] as const; +// Campos que vêm da tabela perfis_usuario: +const camposPerfilExtra = [ + "nome_preferido", + "aniversario", + "sexo", + "nacionalidade", + "cpf", + "cep", + "estado", + "cidade", + "objetivo_financeiro", + "participa_pesquisas" +] as const; + +type PerfilExtra = { + nome_preferido: string | null; + aniversario: string | null; + sexo: string | null; + nacionalidade: string | null; + cpf: string | null; + cep: string | null; + estado: string | null; + cidade: string | null; + objetivo_financeiro: string | null; + participa_pesquisas: boolean | null; +}; + +type Usuario = { + id: string; + nome: string; + email: string; + whatsapp: string; +}; + +const estados = [ + "AC","AL","AP","AM","BA","CE","DF","ES","GO","MA","MT","MS","MG","PA","PB","PR","PE","PI","RJ","RN","RS","RO","RR","SC","SP","SE","TO" +]; + +const sexos = ["Feminino","Masculino", "Outro"]; + +export default function MeuCadastroForm() { + const { toast } = useToast(); + const [loading, setLoading] = useState(true); + const [usuario, setUsuario] = useState(null); + const [perfil, setPerfil] = useState({ + nome_preferido: "", + aniversario: "", + sexo: "", + nacionalidade: "", + cpf: "", + cep: "", + estado: "", + cidade: "", + objetivo_financeiro: "", + participa_pesquisas: false + }); + + const userId = authStore.getState().user?.id; + + useEffect(() => { + async function fetchData() { + setLoading(true); + // Busca os dados da tabela usuarios + if (!userId) return; + const { data: usuarioData, error: userError } = await supabase + .from("usuarios") + .select("id, nome, email, whatsapp") + .eq("id", userId) + .single(); + + if (userError || !usuarioData) { + toast({ title: "Erro ao carregar cadastro", description: "Não foi possível carregar seus dados.", variant: "destructive" }); + setLoading(false); + return; + } + + setUsuario(usuarioData); + + // Busca/perfil da tabela perfis_usuario (pode não existir ainda) + const { data: perfilData } = await supabase + .from("perfis_usuario") + .select("*") + .eq("id", userId) + .maybeSingle(); + + if (perfilData) { + setPerfil({ + ...perfil, + ...perfilData, + }); + } + setLoading(false); + } + fetchData(); + // eslint-disable-next-line + }, [userId]); + + async function handleSubmit(e: React.FormEvent) { + e.preventDefault(); + setLoading(true); + + if (!userId || !usuario) return; + + // Atualiza tabela usuarios + const { error: errorUser } = await supabase + .from("usuarios") + .update({ + nome: usuario.nome, + whatsapp: usuario.whatsapp, + }) + .eq("id", userId); + + // Atualiza/inserir em perfis_usuario + const { error: errorPerfil } = await supabase + .from("perfis_usuario") + .upsert({ + id: userId, + ...perfil, + participa_pesquisas: perfil.participa_pesquisas ?? false, + atualizado_em: new Date().toISOString(), + }); + + setLoading(false); + if (!errorUser && !errorPerfil) { + toast({ title: "Cadastro atualizado!", description: "Suas informações foram salvas com sucesso." }); + } else { + toast({ title: "Erro ao salvar", description: "Tente novamente ou entre em contato." , variant: "destructive"}); + } + } + + if (loading) { + return
Carregando...
; + } + + if (!usuario) { + return
Não foi possível carregar seu perfil.
; + } + + return ( +
+
+
+ + + setUsuario((u) => u ? { ...u, nome: e.target.value } : u) + } + required + /> +
+
+ + +
+
+ + + setUsuario((u) => u ? { ...u, whatsapp: e.target.value } : u) + } + required + /> +
+
+ + + setPerfil(p => ({ ...p, nome_preferido: e.target.value })) + } + /> +
+
+ + setPerfil(p => ({ ...p, cpf: e.target.value }))} + /> +
+
+ + setPerfil(p => ({ ...p, cep: e.target.value }))} + /> +
+
+ + +
+
+ + setPerfil(p => ({ ...p, cidade: e.target.value }))} + /> +
+
+ + setPerfil(p => ({ ...p, aniversario: e.target.value }))} + /> +
+
+ + +
+
+ + + setPerfil(p => ({ ...p, nacionalidade: e.target.value })) + } + /> +
+
+ + + setPerfil(p => ({ ...p, objetivo_financeiro: e.target.value })) + } + /> +
+
+ + setPerfil(p => ({ + ...p, + participa_pesquisas: e.target.checked + })) + } + /> + +
+
+
+ +
+
+ ); +} diff --git a/src/integrations/supabase/types.ts b/src/integrations/supabase/types.ts index b535cd7..4133a15 100644 --- a/src/integrations/supabase/types.ts +++ b/src/integrations/supabase/types.ts @@ -371,6 +371,59 @@ export type Database = { } Relationships: [] } + perfis_usuario: { + Row: { + aniversario: string | null + atualizado_em: string | null + cep: string | null + cidade: string | null + cpf: string | null + estado: string | null + id: string + nacionalidade: string | null + nome_preferido: string | null + objetivo_financeiro: string | null + participa_pesquisas: boolean | null + sexo: string | null + } + Insert: { + aniversario?: string | null + atualizado_em?: string | null + cep?: string | null + cidade?: string | null + cpf?: string | null + estado?: string | null + id: string + nacionalidade?: string | null + nome_preferido?: string | null + objetivo_financeiro?: string | null + participa_pesquisas?: boolean | null + sexo?: string | null + } + Update: { + aniversario?: string | null + atualizado_em?: string | null + cep?: string | null + cidade?: string | null + cpf?: string | null + estado?: string | null + id?: string + nacionalidade?: string | null + nome_preferido?: string | null + objetivo_financeiro?: string | null + participa_pesquisas?: boolean | null + sexo?: string | null + } + Relationships: [ + { + foreignKeyName: "perfis_usuario_id_fkey" + columns: ["id"] + isOneToOne: true + referencedRelation: "usuarios" + referencedColumns: ["id"] + }, + ] + } transacoes: { Row: { categoria: string | null diff --git a/src/pages/Configuracoes.tsx b/src/pages/Configuracoes.tsx index 93839e8..a49b6f1 100644 --- a/src/pages/Configuracoes.tsx +++ b/src/pages/Configuracoes.tsx @@ -1,15 +1,48 @@ import { SidebarProvider } from "@/components/ui/sidebar"; import SettingsSidebar from "@/components/settings/SettingsSidebar"; +import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs"; +import MeuCadastroForm from "@/components/settings/MeuCadastroForm"; +import { useState } from "react"; const Configuracoes = () => { + // Por padrão "visao-geral" + const [tab, setTab] = useState("visao-geral"); + return (
-
-

Configurações

- {/* Aqui virá o conteúdo das configurações que você solicitar */} +
+

Configurações

+ + + + Visão Geral + + + Meu cadastro + + + Assinatura + + + +
+
Bem-vindo à página de Configurações!
+
Aqui você pode gerenciar suas informações, assinatura e muito mais.
+
+
+ + + + +
+
Em breve!
+
Funcionalidades de assinatura serão lançadas em breve.
+
+
+