entregas_app/docs/CORRECAO_BOTAO_SINCRONIZAR_...

4.2 KiB

Correção do Botão "Sincronizar Dados" no ProfileScreen

🚨 Problema Identificado

O botão "Sincronizar Dados" no ProfileScreen.tsx estava executando a sincronização diretamente na tela, mas deveria navegar para a CheckoutScreen.tsx onde o usuário pode escolher quais entregas sincronizar.

Comportamento Anterior:

  • Botão executava syncNow() diretamente
  • Usuário não tinha controle sobre quais entregas sincronizar
  • Não havia interface para seleção de entregas específicas

Comportamento Desejado:

  • Botão deve navegar para CheckoutScreen.tsx
  • Usuário pode escolher sincronizar todas ou selecionar entregas específicas
  • Interface completa de sincronização disponível

🔧 Soluções Implementadas

1. Correção da Função handleSync

// ANTES (INCORRETO)
const handleSync = async () => {
  if (!isOnline) {
    Alert.alert("Erro", "Você está offline. Conecte-se à internet para sincronizar.")
    return
  }

  const success = await syncNow()
  if (success) {
    Alert.alert("Sucesso", "Dados sincronizados com sucesso!")
    loadDriverStats()
  } else {
    Alert.alert("Erro", "Não foi possível sincronizar os dados. Tente novamente.")
  }
}

// DEPOIS (CORRETO)
const handleSync = async () => {
  if (!isOnline) {
    Alert.alert("Erro", "Você está offline. Conecte-se à internet para sincronizar.")
    return
  }

  // Navegar para a tela de sincronização
  navigation.navigate("CheckoutScreen" as any)
}

2. Adição da Propriedade navigation

// ANTES (INCORRETO)
const ProfileScreen = () => {
  // ... código sem acesso à navigation

// DEPOIS (CORRETO)
interface ProfileScreenProps {
  navigation: any;
}

const ProfileScreen = ({ navigation }: ProfileScreenProps) => {
  // ... código com acesso à navigation

Benefícios da Correção

1. Melhor UX (User Experience):

  • Controle granular - usuário pode escolher quais entregas sincronizar
  • Interface dedicada - tela específica para sincronização com todas as opções
  • Feedback visual - estatísticas e status de sincronização em tempo real

2. Funcionalidades Disponíveis na CheckoutScreen:

  • Sincronizar todas - botão para sincronizar todas as entregas pendentes
  • Selecionar específicas - modal para escolher entregas individuais
  • Estatísticas - contadores de entregas sincronizadas, pendentes, etc.
  • Status de conexão - indicação visual se está online/offline
  • Resultados detalhados - feedback sobre sucessos e falhas

3. Fluxo de Navegação Correto:

ProfileScreen → Botão "Sincronizar Dados" → CheckoutScreen

📱 Fluxo de Uso

1. Usuário clica em "Sincronizar Dados":

  • Verifica se está online
  • Navega para CheckoutScreen.tsx

2. Na CheckoutScreen:

  • Vê estatísticas de sincronização
  • Pode escolher "Sincronizar Todas" ou "Selecionar Entregas"
  • Tem controle total sobre o processo

3. Após sincronização:

  • Volta para ProfileScreen
  • Estatísticas são atualizadas automaticamente

🔍 Validações Mantidas

Verificação de Conectividade:

if (!isOnline) {
  Alert.alert("Erro", "Você está offline. Conecte-se à internet para sincronizar.")
  return
}

Navegação Segura:

navigation.navigate("CheckoutScreen" as any)

📝 Arquivos Modificados

  • src/screens/main/ProfileScreen.tsx
    • Adicionada interface ProfileScreenProps
    • Adicionada propriedade navigation ao componente
    • Modificada função handleSync para navegar em vez de executar sincronização

🚀 Teste

Para Verificar a Correção:

  1. Abrir ProfileScreen - tela de perfil do usuário
  2. Clicar em "Sincronizar Dados" - botão azul com ícone de sync
  3. Verificar navegação - deve ir para CheckoutScreen.tsx
  4. Confirmar funcionalidades - deve ver opções de sincronização

Comportamento Esperado:

  • Online: Navega para CheckoutScreen
  • Offline: Mostra alerta "Você está offline"

Data: 2024-01-16
Status: Resolvido
Impacto: Botão "Sincronizar Dados" agora navega corretamente para a tela de sincronização