Ajustou wizard Telegram v4

X-Lovable-Edit-ID: edt-796564ad-4023-40cd-b9fc-da6daf930998
Co-authored-by: domfelipe <53182096+domfelipe@users.noreply.github.com>

src/components/mika/telegram/StepToken.tsx

@@ -101,11 +101,13 @@ export function StepToken({ onValidated, onNext, validated }: Props) {
         )}
       </div>
 
-      <div className="mt-6 flex justify-end">
+      {state !== "success" && (
-        <Button onClick={onNext} disabled={state !== "success"}>
+        <div className="mt-6 flex justify-end">
-          Próximo
+          <Button onClick={onNext} disabled>
-        </Button>
+            Próximo
-      </div>
+          </Button>
+        </div>
+      )}
     </div>
   );
 }

src/components/mika/telegram/TelegramOnboardingWizard.tsx

@@ -14,10 +14,9 @@ import { toast } from "sonner";
 import { StepWelcome } from "./StepWelcome";
 import { StepCreateBot } from "./StepCreateBot";
 import { StepToken, type ValidatedBot } from "./StepToken";
-import { StepWaiting } from "./StepWaiting";
 
 const STORAGE_KEY = "mika-onboarding-last-step";
-const TOTAL_STEPS = 4;
+const TOTAL_STEPS = 3;
 
 interface Props {
   open: boolean;
@@ -35,19 +34,11 @@ export function TelegramOnboardingWizard({ open, onOpenChange, initialStep }: Pr
   const [validated, setValidated] = useState<ValidatedBot | null>(null);
 
   // Deriva o passo inicial do estado real do agente.
-  // Só pula para passos avançados se houver evidência concreta no banco.
   function deriveStepFromAgent(): number {
     if (!agent) return 1;
     const hasToken = !!agent.telegram_bot_token_vault_id;
     const hasUsername = !!agent.telegram_bot_username;
-    const webhookOk = !!agent.telegram_webhook_configured;
-    const firstMsg = !!agent.telegram_first_message_received_at;
-
-    // Token validado + webhook configurado → aguardando 1ª mensagem (ou já recebida)
-    if (hasToken && hasUsername && (webhookOk || firstMsg)) return 4;
-    // Token validado mas webhook ainda não → ainda no passo do token (3)
     if (hasToken && hasUsername) return 3;
-    // Sem token: sempre começa do início
     return 1;
   }
 
@@ -59,7 +50,6 @@ export function TelegramOnboardingWizard({ open, onOpenChange, initialStep }: Pr
       return;
     }
     const derived = deriveStepFromAgent();
-    // Se o agente ainda não tem token, ignora qualquer valor antigo do localStorage
     if (derived === 1 && typeof window !== "undefined") {
       window.localStorage.removeItem(STORAGE_KEY);
       setStep(1);
@@ -91,35 +81,30 @@ export function TelegramOnboardingWizard({ open, onOpenChange, initialStep }: Pr
     onOpenChange(false);
   }
 
-  async function handleFinish() {
+
-    if (!agent || !user) return handleClose();
+  // Após validar token, recarrega agent_instance, marca onboarding como completo,
-    const { error } = await supabase
+  // mostra toast de sucesso e fecha o wizard automaticamente.
-      .from("agent_instances")
+  async function handleValidated(bot: ValidatedBot) {
-      .update({ telegram_onboarding_completed: true })
+    setValidated(bot);
-      .eq("id", agent.id);
+    if (user) {
-    if (error) {
+      await queryClient.invalidateQueries({ queryKey: ["agent-instance", user.id] });
-      toast.error("Não foi possível salvar o status do onboarding.");
+    }
-      return;
+    if (agent) {
+      await supabase
+        .from("agent_instances")
+        .update({ telegram_onboarding_completed: true })
+        .eq("id", agent.id);
+      if (user) {
+        await queryClient.invalidateQueries({ queryKey: ["agent-instance", user.id] });
+      }
     }
     if (typeof window !== "undefined") {
       window.localStorage.removeItem(STORAGE_KEY);
     }
-    await queryClient.invalidateQueries({ queryKey: ["agent-instance", user.id] });
+    toast.success("Token salvo! Seu agente será ativado em alguns minutos.");
-    toast.success("Onboarding concluído!");
     onOpenChange(false);
   }
 
-  // Após validar token, recarrega agent_instance (já tem bot_username persistido)
-  function handleValidated(bot: ValidatedBot) {
-    setValidated(bot);
-    if (user) {
-      queryClient.invalidateQueries({ queryKey: ["agent-instance", user.id] });
-    }
-  }
-
-  const botUsername = validated?.bot_username ?? agent?.telegram_bot_username ?? "";
-  const connectedAt = agent?.telegram_connected_at ?? null;
-
   return (
     <DialogPrimitive.Root open={open} onOpenChange={onOpenChange}>
       <DialogPrimitive.Portal>
@@ -137,7 +122,7 @@ export function TelegramOnboardingWizard({ open, onOpenChange, initialStep }: Pr
             Conectar Telegram ao Mika
           </DialogPrimitive.Title>
           <DialogPrimitive.Description className="sr-only">
-            Wizard guiado para conectar seu agente Mika ao Telegram em 4 passos.
+            Wizard guiado para conectar seu agente Mika ao Telegram em 3 passos.
           </DialogPrimitive.Description>
 
           <div className="sticky top-0 z-10 bg-background/95 backdrop-blur-sm border-b border-border">
@@ -178,22 +163,9 @@ export function TelegramOnboardingWizard({ open, onOpenChange, initialStep }: Pr
                   <StepToken
                     validated={validated}
                     onValidated={handleValidated}
-                    onNext={() => setStep(4)}
+                    onNext={() => { /* fechamento é feito em handleValidated */ }}
                   />
                 )}
-                {step === 4 && agent && botUsername && (
-                  <StepWaiting
-                    agentInstanceId={agent.id}
-                    botUsername={botUsername}
-                    connectedAt={connectedAt}
-                    onFinish={handleFinish}
-                  />
-                )}
-                {step === 4 && (!agent || !botUsername) && (
-                  <div className="px-6 py-12 text-center text-sm text-muted-foreground">
-                    Conecte o bot primeiro para receber a primeira mensagem.
-                  </div>
-                )}
               </motion.div>
             </AnimatePresence>
           </div>

src/routes/bem-vindo.tsx

@@ -358,8 +358,13 @@ function WelcomePage() {
         open={wizardOpen}
         onOpenChange={(open) => {
           setWizardOpen(open);
-          // Quando fechar o wizard, leva ao painel
           if (!open) {
+            // Se o token foi salvo (vault_id presente), considera sucesso
+            if (agent?.telegram_bot_token_vault_id) {
+              toast.success(
+                "Perfeito! Seu agente está sendo ativado. Você receberá uma mensagem no Telegram quando estiver pronto! 🎉",
+              );
+            }
             navigate({ to: "/painel", search: {} });
           }
         }}