Skip to content

Arquitetura

Jump to bottom
GitHub Copilot edited this page Aug 15, 2026 · 1 revision

Arquitetura

← Home | Contratos →

Estrutura de diretórios

src/
├── react/
│   ├── index.js                    # Entrypoint do módulo React
│   ├── css/
│   │   └── people.js               # Estilos base compartilhados
│   ├── components/
│   │   ├── AddCompanyModal.js       # Modal criação/vinculação de pessoa/empresa
│   │   ├── PeopleAvatar.js          # Avatar universal (física/jurídica)
│   │   └── address/
│   │       └── PeopleAddressesPanel.js  # Painel de endereços
│   ├── pages/
│   │   ├── People.js                # Lista de pessoas com contexto
│   │   ├── Profile.js               # Perfil do usuário logado
│   │   ├── MyCompaniesPage.js       # Empresas vinculadas ao usuário
│   │   ├── PeopleDomainsPage.js     # Domínios de acesso
│   │   └── PeopleDomainDetailPage.js # Detalhe de domínio
│   ├── router/
│   │   └── routes.js               # Definição de rotas React Navigation
│   └── utils/
│       ├── peopleContext.js         # Config de contexto (tipos, labels, filtros)
│       ├── peopleLinkFilters.js     # Filtros de vínculo pessoa-empresa
│       ├── peopleImage.js           # Resolução de avatar/imagem de pessoa
│       ├── profileSession.js        # Persiste sessão de avatar no localStorage
│       ├── currentCompanySelection.js # Seleção e persistência de empresa atual
│       └── menuCostsSuppliers.js    # Helpers de menu de fornecedores
└── store/
    ├── people/                      # Store: entidade principal People
    ├── people_domains/              # Store: domínios de acesso
    ├── people_domains_api/          # Store: API auxiliar de domínios
    ├── people_link/                 # Store: vínculos entre pessoas e empresas
    ├── address/                     # Store: endereços
    ├── documents/                   # Store: documentos (CPF, CNPJ, etc.)
    ├── documentsTypes/              # Store: tipos de documentos
    ├── phones/                      # Store: telefones
    └── emails/                      # Store: e-mails

Diagrama de dependências

ui-people
  ├── @controleonline/ui-common   (utilitários, API, formatters, UserAvatar, MessageService)
  ├── @controleonline/ui-default  (DefaultTable, DefaultAddress, DefaultUpload, filtros)
  ├── @controleonline/ui-crm      (integração de contexto CRM)
  └── @controleonline/ui-layout   (layout base)

Fluxo da página People 

People({ context })
  │
  ├─ buildPeopleContextConfig(context)
  │     └─ availableTypes, defaultType, hasTypeFilter, options
  │
  ├─ useStore('people')       → getters.currentCompany
  ├─ useStore('auth')         → getters.user
  ├─ useStore('theme')        → getters.colors
  │
  ├─ selectedLinkType (state local)
  │
  ├─ buildParentCompanyRequestParams({ user, selectedLinkType })
  │     └─ filtra empresas via 'company.people' + 'company.linkType'
  │
  ├─ buildPeopleLinkRequestParams({ currentCompany, selectedLinkType })
  │     └─ filtra pessoas via 'link.company' + 'link.linkType'
  │
  └─ <DefaultTable store="people" params={requestParams} />
        └─ exibe lista com PeopleAvatar + filtros externos

Fluxo da página Profile 

Profile
  │
  ├─ resolveLoggedUserId(user)     → ID numérico do usuário
  ├─ useStore('people').actions.fetchItem(userId)
  │
  ├─ Edição de campos: name, alias, phone, foundationDate
  ├─ DefaultUpload → uploadAvatar → persistSessionAvatar
  │
  └─ PeopleAddressesPanel(peopleIri)
        └─ useStore('address') → list/create/edit/delete endereços

Encaixe no ecossistema

app-community (superprojeto)
  └── modules/controleonline/ui-people   (submódulo Git)
        ├── src/react/pages/             → telas registradas no navigator do app
        ├── src/store/                   → módulos registrados no store global
        └── src/react/utils/             → utilitários importados por outros módulos

A instância do superprojeto define qual APP_TYPE está ativo; o módulo ui-people adapta labels e contextos disponíveis conforme esse valor.

Clone this wiki locally