@oondemand/oon-core-front 0.2.0 → 0.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -121
- package/dist/index.d.ts +18 -23
- package/dist/index.js +2016 -389
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,122 +1,3 @@
|
|
|
1
|
-
#
|
|
1
|
+
# OonCore Front - ativação de instâncias
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
Core de **frontend** para Centrais Oon. Uma Central de frontend passa a ser
|
|
6
|
-
apenas **declaração**: você escreve um `central.ui.ts` (identidade + views) e
|
|
7
|
-
sobe tudo com `oonCore-front dev`.
|
|
8
|
-
|
|
9
|
-
Todo o resto — bootstrap, providers (React Query + Chakra), roteamento por
|
|
10
|
-
metadata, autenticação, RBAC, layout, menu, SDK REST único do `/core/*`,
|
|
11
|
-
auditoria e os componentes `Core*` (Coleção, Documento, Esteira, Multi-moedas,
|
|
12
|
-
Assistente, Dashboard) — vive aqui dentro.
|
|
13
|
-
|
|
14
|
-
É o par de frontend do [`@oondemand/oon-core-back`](../oonCore-back): o back
|
|
15
|
-
descreve as models em `/core/metadata`; o front monta as telas a partir disso,
|
|
16
|
-
sem código de UI por entidade.
|
|
17
|
-
|
|
18
|
-
## Instalação
|
|
19
|
-
|
|
20
|
-
```bash
|
|
21
|
-
npm install @oondemand/oon-core-front
|
|
22
|
-
# peers: react, react-dom, react-router-dom, @tanstack/react-query,
|
|
23
|
-
# @tanstack/react-table, @chakra-ui/react
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
## Uso mínimo
|
|
27
|
-
|
|
28
|
-
`central.ui.ts`:
|
|
29
|
-
|
|
30
|
-
```ts
|
|
31
|
-
import { defineCollectionView, type OonCoreFrontConfig } from "@oondemand/oon-core-front";
|
|
32
|
-
|
|
33
|
-
export const appConfig: OonCoreFrontConfig = {
|
|
34
|
-
app: { id: "minha-central", name: "Minha Central" },
|
|
35
|
-
api: { baseUrl: import.meta.env.VITE_API_URL },
|
|
36
|
-
auth: { mode: "bearer", tokenParam: "code" },
|
|
37
|
-
ui: {
|
|
38
|
-
views: [
|
|
39
|
-
// 100% dinâmico: nada além do nome da model. Grid, form, rota e menu
|
|
40
|
-
// são montados a partir de /core/models/Cotacao.
|
|
41
|
-
defineCollectionView({ model: "Cotacao", mode: "dynamic" }),
|
|
42
|
-
],
|
|
43
|
-
},
|
|
44
|
-
};
|
|
45
|
-
```
|
|
46
|
-
|
|
47
|
-
`src/main.tsx`:
|
|
48
|
-
|
|
49
|
-
```ts
|
|
50
|
-
import { start } from "@oondemand/oon-core-front";
|
|
51
|
-
import { appConfig } from "../central.ui";
|
|
52
|
-
|
|
53
|
-
start(appConfig);
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
`main.tsx` não conhece providers, router, auth, layout, menu nem serviços.
|
|
57
|
-
|
|
58
|
-
## Três formas de declarar uma coleção (Seção 4.4)
|
|
59
|
-
|
|
60
|
-
```ts
|
|
61
|
-
// 1. JSON completo — colunas e form explícitos (mode "full").
|
|
62
|
-
defineCollectionView({
|
|
63
|
-
model: "Pessoa",
|
|
64
|
-
mode: "full",
|
|
65
|
-
columns: [{ field: "nome", label: "Nome", sortable: true }],
|
|
66
|
-
form: [{ field: "nome", label: "Nome", required: true }],
|
|
67
|
-
});
|
|
68
|
-
|
|
69
|
-
// 2. Registro mínimo — só model + label; Core deriva tudo da metadata.
|
|
70
|
-
defineCollectionView({ model: "Pessoa", label: "Prestadores", mode: "minimal" });
|
|
71
|
-
|
|
72
|
-
// 3. 100% dinâmico — consome /core/models/Pessoa e monta sozinho.
|
|
73
|
-
defineCollectionView({ model: "Pessoa", mode: "dynamic" });
|
|
74
|
-
```
|
|
75
|
-
|
|
76
|
-
Ou direto no JSX, sem registrar view:
|
|
77
|
-
|
|
78
|
-
```tsx
|
|
79
|
-
import { CoreCollection } from "@oondemand/oon-core-front";
|
|
80
|
-
|
|
81
|
-
<CoreCollection model="Pessoa" />;
|
|
82
|
-
```
|
|
83
|
-
|
|
84
|
-
## CLI
|
|
85
|
-
|
|
86
|
-
```bash
|
|
87
|
-
oonCore-front dev # vite dev
|
|
88
|
-
oonCore-front build # vite build
|
|
89
|
-
oonCore-front preview # vite preview
|
|
90
|
-
oonCore-front sync:metadata # baixa /core/metadata do back e cacheia em src/.oon/metadata.json
|
|
91
|
-
```
|
|
92
|
-
|
|
93
|
-
## Componentes Core
|
|
94
|
-
|
|
95
|
-
| Componente | Para quê |
|
|
96
|
-
| ---------------- | ------------------------------------------------------------------- |
|
|
97
|
-
| `CoreCollection` | CRUD genérico: grid + form (3 modos). |
|
|
98
|
-
| `CoreDocument` | Tipos documentais com aprovação/anexos sobre a coleção. |
|
|
99
|
-
| `CorePipeline` | Esteira kanban agrupada por etapa (enum da metadata). |
|
|
100
|
-
| `CoreCurrency` | Multi-moedas: lista + ação `actions/update-rates`. |
|
|
101
|
-
| `CoreIntegration`| Painel de `/core/integrations` + reprocessar ativos. |
|
|
102
|
-
| `CoreAssistant` | Chat de IA seguro — envia só `assistantCode`/`entity`/`message`. |
|
|
103
|
-
| `CoreDashboard` | Widgets `count`/`sum`/`custom` declarados na Central. |
|
|
104
|
-
|
|
105
|
-
## Segurança por design
|
|
106
|
-
|
|
107
|
-
- **Sem segredos no front**: o assistente nunca envia chave de IA — só
|
|
108
|
-
`assistantCode`, `entity` e `message`; o back resolve modelo/prompt/chave.
|
|
109
|
-
- **Token encapsulado** em `tokenStorage` (try/catch, captura de `?code=` e
|
|
110
|
-
limpeza da URL); 401 dispara logout + redirect para o login externo.
|
|
111
|
-
- **RBAC de UX**: `RouteGuard`/`PermissionGate` escondem o que o usuário não
|
|
112
|
-
pode usar — o back continua sendo a autoridade final.
|
|
113
|
-
- **Auditoria**: toda mutação leva headers `x-oon-origin/module/entity`.
|
|
114
|
-
|
|
115
|
-
## Contrato com o back
|
|
116
|
-
|
|
117
|
-
| `/core/*` (back) | Uso no front |
|
|
118
|
-
| ----------------------- | ---------------------------------------------- |
|
|
119
|
-
| `GET /core/metadata` | `useCoreMetadata()` — menu/dashboard/derivação |
|
|
120
|
-
| `GET /core/models/:n` | `useModelSchema(n)` — modo dynamic |
|
|
121
|
-
| CRUD em `basePath` | `useOonResource(basePath)` — list/get/CRUD |
|
|
122
|
-
| `GET /auth/validar-token` | `AuthProvider` resolve o usuário |
|
|
3
|
+
O frontend inclui a rota pública `/ativacao` e um `ActivationProvider` que consulta `/ativacao/status` antes de liberar rotas privadas. Centrais `member` não ativas são enviadas para o assistente de ativação; estados `suspensa` e `revogada` usam páginas próprias. O código de ativação fica apenas em memória e é limpo após conclusão.
|
package/dist/index.d.ts
CHANGED
|
@@ -11,6 +11,7 @@ interface FieldMeta {
|
|
|
11
11
|
kind: FieldKind;
|
|
12
12
|
label?: string;
|
|
13
13
|
searchable?: boolean;
|
|
14
|
+
required?: boolean;
|
|
14
15
|
/** model referenciada quando kind === "ref". */
|
|
15
16
|
ref?: string;
|
|
16
17
|
/** valores possíveis quando kind === "enum". */
|
|
@@ -116,6 +117,12 @@ interface OonAuthConfig {
|
|
|
116
117
|
loginUrl?: string;
|
|
117
118
|
/** Nome do query param que carrega o token na volta do SSO. Default: "code". */
|
|
118
119
|
tokenParam?: string;
|
|
120
|
+
/**
|
|
121
|
+
* Token usado somente no desenvolvimento local. Quando informado, tem
|
|
122
|
+
* prioridade sobre um token antigo do storage, é persistido e validado no
|
|
123
|
+
* backend normalmente antes de qualquer redirecionamento.
|
|
124
|
+
*/
|
|
125
|
+
devToken?: string;
|
|
119
126
|
}
|
|
120
127
|
interface OonSecurityConfig {
|
|
121
128
|
enableRouteGuard?: boolean;
|
|
@@ -177,6 +184,8 @@ interface OonFormFieldDef {
|
|
|
177
184
|
kind?: FieldKind;
|
|
178
185
|
required?: boolean;
|
|
179
186
|
options?: string[];
|
|
187
|
+
/** model relacionada quando kind === "ref". */
|
|
188
|
+
ref?: string;
|
|
180
189
|
}
|
|
181
190
|
/** Definição de uma coleção nas três formas da Seção 4.4. */
|
|
182
191
|
interface CollectionViewDef {
|
|
@@ -311,6 +320,8 @@ interface ManifestRuntime {
|
|
|
311
320
|
meusAppsUrl?: string;
|
|
312
321
|
assistantBaseUrl?: string;
|
|
313
322
|
versionPrefix?: string;
|
|
323
|
+
/** Token local enviado ao backend somente quando o consumidor o configurar. */
|
|
324
|
+
devToken?: string;
|
|
314
325
|
}
|
|
315
326
|
/** Converte o manifesto declarativo + runtime em config do Core. */
|
|
316
327
|
declare function manifestToConfig(manifest: CentralUiManifest, runtime: ManifestRuntime): OonCoreFrontConfig;
|
|
@@ -338,26 +349,14 @@ declare function defineOonModule(mod: OonModule): OonModule;
|
|
|
338
349
|
interface CoreCollectionProps {
|
|
339
350
|
model: string;
|
|
340
351
|
label?: string;
|
|
341
|
-
|
|
342
|
-
* Três formas de declarar a coleção (Seção 4.4):
|
|
343
|
-
* - "full" : colunas + form explícitos (passe `columns` e `form`).
|
|
344
|
-
* - "minimal" : só `model`; Core busca a metadata e deriva tudo.
|
|
345
|
-
* - "dynamic" : 100% dirigido por /core/models/:model (default).
|
|
346
|
-
*/
|
|
352
|
+
section?: string;
|
|
347
353
|
mode?: CollectionMode;
|
|
348
|
-
/** basePath do recurso; default vem da metadata da model. */
|
|
349
354
|
endpoint?: string;
|
|
350
355
|
columns?: OonColumnDef[];
|
|
351
356
|
form?: OonFormFieldDef[];
|
|
352
357
|
importExport?: boolean;
|
|
353
358
|
}
|
|
354
|
-
|
|
355
|
-
* Componente Core de coleção. Renderiza grid + form de qualquer model do back
|
|
356
|
-
* sem código de UI por entidade. No modo dinâmico, lê /core/models/:model e
|
|
357
|
-
* monta colunas, formulário e endpoint a partir da metadata — esse é o
|
|
358
|
-
* critério de pronto da Fase 3.
|
|
359
|
-
*/
|
|
360
|
-
declare function CoreCollection({ model, label, mode, endpoint, columns, form, importExport }: CoreCollectionProps): react.JSX.Element;
|
|
359
|
+
declare function CoreCollection({ model, label, section, mode, endpoint, columns, form, importExport }: CoreCollectionProps): react.JSX.Element;
|
|
361
360
|
|
|
362
361
|
interface CoreDocumentProps {
|
|
363
362
|
model: string;
|
|
@@ -382,21 +381,14 @@ interface CorePipelineProps {
|
|
|
382
381
|
model: string;
|
|
383
382
|
label?: string;
|
|
384
383
|
endpoint?: string;
|
|
385
|
-
/** campo do registro que define a coluna/etapa. Default: "status". */
|
|
386
384
|
stageField?: string;
|
|
387
|
-
/** etapas fixas; se omitido, derivadas do enum de `stageField`. */
|
|
388
385
|
stages?: Array<{
|
|
389
386
|
id: string;
|
|
390
387
|
label: string;
|
|
391
388
|
}>;
|
|
392
|
-
/** campo exibido como título do card. Default: primeiro string. */
|
|
393
389
|
titleField?: string;
|
|
394
390
|
}
|
|
395
|
-
/**
|
|
396
|
-
* Esteira (kanban) genérica do Core. Agrupa registros por `stageField` em
|
|
397
|
-
* colunas. As etapas vêm das props ou são derivadas do enum declarado na
|
|
398
|
-
* metadata da model — nenhuma esteira específica hardcoded.
|
|
399
|
-
*/
|
|
391
|
+
/** Esteira horizontal padrão, com tickets clicáveis e formulário completo em modal. */
|
|
400
392
|
declare function CorePipeline({ model, label, endpoint, stageField, stages, titleField }: CorePipelineProps): react.JSX.Element;
|
|
401
393
|
|
|
402
394
|
interface CoreIntegrationProps {
|
|
@@ -450,12 +442,15 @@ interface CoreDashboardProps {
|
|
|
450
442
|
*/
|
|
451
443
|
declare function CoreDashboard({ label, widgets }: CoreDashboardProps): react.JSX.Element;
|
|
452
444
|
|
|
445
|
+
type AuthStatus = "loading" | "authenticated" | "unauthenticated" | "forbidden" | "error";
|
|
453
446
|
interface AuthContextValue {
|
|
454
447
|
user: OonUser | null;
|
|
455
448
|
roles: string[];
|
|
456
|
-
status:
|
|
449
|
+
status: AuthStatus;
|
|
457
450
|
isAuthenticated: boolean;
|
|
458
451
|
hasPermission: (permission?: string | string[]) => boolean;
|
|
452
|
+
login: (email: string, password: string) => Promise<void>;
|
|
453
|
+
retry: () => Promise<void>;
|
|
459
454
|
logout: () => void;
|
|
460
455
|
}
|
|
461
456
|
declare function useOonAuth(): AuthContextValue;
|