Squad Front

Appearance

Multi-tenant ​

Multi-tenancy (ou multi-inquilinato) é uma arquitetura de software onde uma única instância de uma aplicação atende a múltiplos clientes (tenants). Cada cliente compartilha a mesma infraestrutura e código, mas seus dados e configurações são isolados e invisíveis para os outros clientes.

No nosso ecossistema (Teleconsulta e Telediagnóstico), somos uma aplicação multi-tenant, atendendo diferentes frentes como SOS, IASEP, Piauí, etc., em uma única plataforma.

1. Por que usamos Multi-tenant? ​

A. Facilidade de Manutenção ​

Em vez de atualizar 10 versões diferentes da aplicação para 10 clientes, atualizamos apenas uma vez e todos recebem a melhoria ou correção simultaneamente.

B. Escalabilidade ​

Podemos adicionar um novo cliente (ex: "Saúde AM Digital") apenas criando novas configurações no banco de dados, sem precisar subir novos servidores ou repositórios de código.

C. Eficiência de Custos ​

Compartilhamos os mesmos recursos de infraestrutura (banco de dados, cache, storage), reduzindo drasticamente o custo operacional.

2. Multi-tenant no Front-end ​

No front-end, o desafio é garantir que a aplicação se comporte de forma diferente dependendo do cliente logado, sem que o código se torne um emaranhado de ifs.

Estratégias principais: ​

  1. Whitelabeling (Tematização): Uso de Design Tokens para mudar cores, logos e fontes baseados no tenant.
  2. Feature Flags: Ativar ou desativar funcionalidades específicas por cliente (ex: o cliente A tem chat, o cliente B não).
  3. Configurações Dinâmicas: Obter via API as regras de negócio específicas daquele tenant (ex: horários de atendimento, tipos de especialidades).
  4. Isolamento de Dados: Garantir que o Front-end nunca peça dados de um tenant B estando logado no tenant A (geralmente controlado via JWT e IDs de tenant nos headers).

3. Exemplos Práticos ​

✅ Como fazer (Abstração por Contexto) ​

Use o estado global ou um Provider de Configuração para gerenciar as regras do tenant.

tsx
function Header() {
  const { tenant } = useTenant(); // Hook que sabe qual cliente está logado

  return (
    <header>
      <Logo src={tenant.logoUrl} />
      <Text>{tenant.welcomeMessage}</Text>
      {tenant.features.hasVideoCall && <VideoButton />}
    </header>
  );
}

❌ Como não fazer (Hardcoding de Clientes) ​

Nunca escreva o nome do cliente diretamente no código para tomar decisões.

tsx
function Header() {
  // ⛔ RUIM: Se entrar um novo cliente, você precisa mudar o código de UI
  const isPiaui = window.location.hostname.includes('piaui');

  return (
    <header>
      {isPiaui ? <LogoPiaui /> : <LogoPadrao />}
      {isPiaui && <Button>Telefone do Piauí</Button>}
    </header>
  );
}

4. O Impacto na Arquitetura ​

O conceito de Multi-tenant reforça a necessidade de uma Camada de Aplicação robusta que saiba injetar o ID do tenant em todas as requisições de API de forma transparente para o desenvolvedor, e uma Camada de Tela que seja agnóstica a quem é o cliente final.

5. Veja também ​