@v1ct0rbr/minivault-web 0.3.0 → 0.4.0

package/dist/minivault-web.js

@@ -382,7 +382,7 @@ function U({ dbInfo: e, isLoading: t, error: n, label: r }) {
 			}),
 			"Banco padrão não configurado no servidor minivault (variáveis",
 			" ",
-			/* @__PURE__ */ p("code", { children: "MINIVAULT_DB_*" }),
+			/* @__PURE__ */ p("code", { children: "BACKUP_DB_*" }),
 			"). A criação e a importação usam esse banco."
 		]
 	});
@@ -938,12 +938,12 @@ function Y() {
 	}), [g, _] = o(() => /* @__PURE__ */ new Set()), [v, y] = o(null), [b, x] = o({}), [S, C] = o(""), D = E(v, t.data?.configured), k = i(() => new Set((t.data?.exportExcludedTables ?? []).map(te)), [t.data?.exportExcludedTables]), A = i(() => {
 		let e = n.data ?? [], t = S.trim().toLowerCase();
 		return t ? e.filter((e) => e.fullName.toLowerCase().includes(t)) : e;
-	}, [n.data, S]), j = (e) => {
+	}, [n.data, S]), j = i(() => Object.values(b).reduce((e, t) => e + t.length, 0), [b]), M = (e) => {
 		_((t) => {
 			let n = new Set(t);
 			return n.has(e) ? n.delete(e) : n.add(e), n;
 		});
-	}, M = (e, t) => {
+	}, N = (e, t) => {
 		x((n) => {
 			let r = n[e] ?? [], i = r.includes(t) ? r.filter((e) => e !== t) : [...r, t];
 			return {
@@ -951,7 +951,7 @@ function Y() {
 				[e]: i
 			};
 		});
-	}, N = () => {
+	}, P = () => {
 		let t;
 		if (l) {
 			t = { ...d }, g.size > 0 && (t.tables = [...g]);
@@ -964,7 +964,7 @@ function Y() {
 			originStorage: r ? s : void 0,
 			dumpOptions: t
 		});
-	}, P = e.isPending, F = t.data?.configured && !P;
+	}, F = e.isPending, I = t.data?.configured && !F;
 	return /* @__PURE__ */ m("div", { children: [
 		/* @__PURE__ */ m("div", {
 			className: "mb-3",
@@ -973,7 +973,7 @@ function Y() {
 				children: "Criar novo backup"
 			}), /* @__PURE__ */ p("p", {
 				className: "text-muted small mb-0",
-				children: "O minivault usa o banco configurado no servidor (via variáveis de ambiente). Selecione tabelas e colunas a incluir/omitir no dump."
+				children: "O minivault usa o banco configurado no servidor (via variáveis de ambiente). Selecione as tabelas no grid e expanda um card para marcar colunas cujo conteúdo será nulificado na exportação."
 			})]
 		}),
 		/* @__PURE__ */ p(U, {
@@ -1042,9 +1042,12 @@ function Y() {
 						children: "Nenhuma tabela encontrada."
 					}),
 					/* @__PURE__ */ p("div", {
-						className: "list-group list-group-flush",
+						className: "p-2",
 						style: {
-							maxHeight: 380,
+							display: "grid",
+							gridTemplateColumns: "repeat(auto-fill, minmax(240px, 1fr))",
+							gap: "0.5rem",
+							maxHeight: 420,
 							overflow: "auto"
 						},
 						children: A.map((e) => /* @__PURE__ */ p(ee, {
@@ -1052,17 +1055,32 @@ function Y() {
 							disabled: k.has(e.fullName),
 							selected: g.has(e.fullName),
 							expanded: v === e.fullName,
-							showColumnsToggle: d.format === "plain",
 							excluded: b[e.fullName] ?? [],
-							onToggleTable: () => j(e.fullName),
+							onToggleTable: () => M(e.fullName),
 							onToggleExpand: () => y(v === e.fullName ? null : e.fullName),
-							onToggleColumn: (t) => M(e.fullName, t),
+							onToggleColumn: (t) => N(e.fullName, t),
 							detail: v === e.fullName ? D : void 0
 						}, e.fullName))
 					}),
-					/* @__PURE__ */ p("div", {
-						className: "p-2 small text-muted border-top",
-						children: "Deixe tudo desmarcado para incluir todas as tabelas (exceto as bloqueadas por segurança)."
+					/* @__PURE__ */ m("div", {
+						className: "p-2 small border-top d-flex flex-wrap gap-2 align-items-center",
+						children: [/* @__PURE__ */ m("span", {
+							className: "text-muted",
+							children: [/* @__PURE__ */ p("i", {
+								className: "bi bi-info-circle me-1",
+								"aria-hidden": !0
+							}), "Deixe tudo desmarcado para incluir todas as tabelas (exceto as bloqueadas por segurança)."]
+						}), j > 0 && d.format !== "plain" && /* @__PURE__ */ m("span", {
+							className: "badge text-bg-warning ms-auto text-wrap text-start",
+							children: [
+								/* @__PURE__ */ p("i", {
+									className: "bi bi-exclamation-triangle me-1",
+									"aria-hidden": !0
+								}),
+								j,
+								" coluna(s) marcada(s) serão nulificadas apenas com formato Plain SQL (texto)"
+							]
+						})]
 					})
 				]
 			})]
@@ -1096,31 +1114,38 @@ function Y() {
 					className: "row g-3 mb-3",
 					children: /* @__PURE__ */ m("div", {
 						className: "col-md-4",
-						children: [/* @__PURE__ */ p("label", {
-							className: "form-label",
-							children: "Formato"
-						}), /* @__PURE__ */ m("select", {
-							className: "form-select",
-							value: d.format,
-							onChange: (e) => h((t) => ({
-								...t,
-								format: e.target.value
-							})),
-							children: [
-								/* @__PURE__ */ p("option", {
-									value: "custom",
-									children: "Custom (-Fc, recomendado)"
-								}),
-								/* @__PURE__ */ p("option", {
-									value: "plain",
-									children: "Plain SQL (texto)"
-								}),
-								/* @__PURE__ */ p("option", {
-									value: "tar",
-									children: "Tar (-Ft)"
-								})
-							]
-						})]
+						children: [
+							/* @__PURE__ */ p("label", {
+								className: "form-label",
+								children: "Formato"
+							}),
+							/* @__PURE__ */ m("select", {
+								className: "form-select",
+								value: d.format,
+								onChange: (e) => h((t) => ({
+									...t,
+									format: e.target.value
+								})),
+								children: [
+									/* @__PURE__ */ p("option", {
+										value: "custom",
+										children: "Custom (-Fc, recomendado)"
+									}),
+									/* @__PURE__ */ p("option", {
+										value: "plain",
+										children: "Plain SQL (texto)"
+									}),
+									/* @__PURE__ */ p("option", {
+										value: "tar",
+										children: "Tar (-Ft)"
+									})
+								]
+							}),
+							/* @__PURE__ */ p("div", {
+								className: "form-text",
+								children: "Colunas marcadas como omitidas têm o conteúdo nulificado no dump — aplicado apenas quando o formato é Plain SQL (texto)."
+							})
+						]
 					})
 				}), /* @__PURE__ */ p("div", {
 					className: "row g-3",
@@ -1363,10 +1388,10 @@ function Y() {
 			children: /* @__PURE__ */ m("button", {
 				type: "button",
 				className: "btn btn-primary",
-				onClick: N,
-				disabled: !F,
+				onClick: P,
+				disabled: !I,
 				children: [
-					P && /* @__PURE__ */ p("span", {
+					F && /* @__PURE__ */ p("span", {
 						className: "spinner-border spinner-border-sm me-2",
 						"aria-hidden": !0
 					}),
@@ -1380,104 +1405,119 @@ function Y() {
 		})
 	] });
 }
-function ee({ table: e, disabled: t, selected: n, expanded: r, showColumnsToggle: i, excluded: a, detail: o, onToggleTable: s, onToggleExpand: c, onToggleColumn: l }) {
-	return /* @__PURE__ */ m("div", {
-		className: "list-group-item px-3 py-2",
-		children: [/* @__PURE__ */ m("div", {
-			className: "d-flex align-items-center gap-2",
-			children: [
-				/* @__PURE__ */ p("input", {
-					className: "form-check-input",
+function ee({ table: e, disabled: t, selected: n, expanded: r, excluded: i, detail: a, onToggleTable: o, onToggleExpand: s, onToggleColumn: c }) {
+	return /* @__PURE__ */ p("div", {
+		className: `card h-100 ${n ? "border-primary" : ""}`,
+		style: { minWidth: 0 },
+		children: /* @__PURE__ */ m("div", {
+			className: "card-body p-2 d-flex flex-column gap-1",
+			children: [/* @__PURE__ */ m("div", {
+				className: "d-flex align-items-center gap-2",
+				children: [/* @__PURE__ */ p("input", {
+					className: "form-check-input mt-0",
 					type: "checkbox",
 					checked: n,
 					disabled: t,
-					title: t ? "Bloqueada por segurança (MINIVAULT_EXPORT_EXCLUDED_TABLES)" : void 0,
-					onChange: s
-				}),
-				/* @__PURE__ */ m("span", {
-					className: "font-monospace small",
+					title: t ? "Bloqueada por segurança (BACKUP_EXPORT_EXCLUDED_TABLES)" : void 0,
+					onChange: o
+				}), /* @__PURE__ */ m("span", {
+					className: "font-monospace small text-truncate",
+					style: { minWidth: 0 },
+					title: e.fullName,
 					children: [e.fullName, e.type === "VIEW" && /* @__PURE__ */ p("span", {
 						className: "badge text-bg-light ms-1",
 						children: "view"
 					})]
-				}),
-				t && /* @__PURE__ */ m("span", {
-					className: "badge text-bg-secondary ms-auto",
-					title: "Exportação sempre ignora esta tabela",
-					children: [/* @__PURE__ */ p("i", {
-						className: "bi bi-shield-lock me-1",
-						"aria-hidden": !0
-					}), "excluída"]
-				}),
-				!t && /* @__PURE__ */ m("button", {
+				})]
+			}), t ? /* @__PURE__ */ m("span", {
+				className: "badge text-bg-secondary text-wrap text-start",
+				title: "Exportação sempre ignora esta tabela",
+				children: [/* @__PURE__ */ p("i", {
+					className: "bi bi-shield-lock me-1",
+					"aria-hidden": !0
+				}), "excluída por segurança"]
+			}) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ m("div", {
+				className: "d-flex align-items-center justify-content-between gap-2",
+				children: [/* @__PURE__ */ m("button", {
 					type: "button",
-					className: "btn btn-sm btn-outline-secondary ms-auto",
-					onClick: c,
+					className: "btn btn-sm btn-outline-secondary",
+					onClick: s,
 					"aria-expanded": r,
 					children: [/* @__PURE__ */ p("i", {
 						className: `bi ${r ? "bi-chevron-up" : "bi-chevron-down"} me-1`,
 						"aria-hidden": !0
-					}), r ? "Ocultar" : "Colunas"]
-				})
-			]
-		}), r && /* @__PURE__ */ m("div", {
-			className: "mt-2 ps-3",
-			children: [
-				o?.isLoading && /* @__PURE__ */ p("small", {
-					className: "text-muted",
-					children: "Carregando colunas..."
-				}),
-				o?.isError && /* @__PURE__ */ m("small", {
-					className: "text-danger",
-					children: ["Erro: ", G(o.error)]
-				}),
-				o?.data && /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ m("table", {
-					className: "table table-sm small mb-2",
-					children: [/* @__PURE__ */ p("thead", { children: /* @__PURE__ */ m("tr", { children: [
-						i && /* @__PURE__ */ p("th", { style: { width: 30 } }),
-						/* @__PURE__ */ p("th", { children: "Coluna" }),
-						/* @__PURE__ */ p("th", { children: "Tipo" }),
-						/* @__PURE__ */ p("th", { children: "Null" })
-					] }) }), /* @__PURE__ */ p("tbody", { children: o.data.columns.map((e) => /* @__PURE__ */ m("tr", { children: [
-						i && /* @__PURE__ */ p("td", { children: /* @__PURE__ */ p("input", {
-							className: "form-check-input",
-							type: "checkbox",
-							title: "Omitir esta coluna na exportação",
-							checked: a.includes(e.name),
-							onChange: () => l(e.name)
-						}) }),
-						/* @__PURE__ */ m("td", { children: [
+					}), r ? "Ocultar colunas" : "Colunas"]
+				}), i.length > 0 && /* @__PURE__ */ m("span", {
+					className: "badge text-bg-warning",
+					title: "Conteúdo desta(s) coluna(s) será nulificado na exportação",
+					children: [
+						i.length,
+						" omitida",
+						i.length > 1 ? "s" : ""
+					]
+				})]
+			}), r && /* @__PURE__ */ m("div", {
+				className: "mt-1 pt-2 border-top",
+				style: {
+					maxHeight: 210,
+					overflowY: "auto"
+				},
+				children: [
+					a?.isLoading && /* @__PURE__ */ p("small", {
+						className: "text-muted",
+						children: "Carregando colunas..."
+					}),
+					a?.isError && /* @__PURE__ */ m("small", {
+						className: "text-danger",
+						children: ["Erro: ", G(a.error)]
+					}),
+					a?.data && /* @__PURE__ */ m(f, { children: [a.data.columns.map((e) => /* @__PURE__ */ m("div", {
+						className: "d-flex align-items-center gap-2 py-1",
+						title: e.dataType,
+						children: [
+							/* @__PURE__ */ p("input", {
+								className: "form-check-input mt-0",
+								type: "checkbox",
+								title: "Omitir esta coluna (conteúdo nulificado na exportação)",
+								checked: i.includes(e.name),
+								onChange: () => c(e.name)
+							}),
 							/* @__PURE__ */ p("span", {
-								className: "font-monospace",
+								className: "font-monospace small text-truncate flex-grow-1",
+								style: { minWidth: 0 },
 								children: e.name
 							}),
 							e.primaryKey && /* @__PURE__ */ p("span", {
-								className: "badge text-bg-warning ms-1",
+								className: "badge text-bg-warning",
+								style: { fontSize: "0.6rem" },
 								children: "PK"
 							}),
 							e.generated && /* @__PURE__ */ p("span", {
-								className: "badge text-bg-info ms-1",
+								className: "badge text-bg-info",
+								style: { fontSize: "0.6rem" },
 								children: "auto"
+							}),
+							/* @__PURE__ */ p("span", {
+								className: "small text-body-secondary text-truncate",
+								style: { maxWidth: 80 },
+								children: e.dataType
 							})
-						] }),
-						/* @__PURE__ */ p("td", {
-							className: "text-body-secondary",
-							children: e.dataType
-						}),
-						/* @__PURE__ */ p("td", { children: e.nullable ? "sim" : "não" })
-					] }, e.name)) })]
-				}), o.data.relationships.length > 0 && /* @__PURE__ */ m("div", {
-					className: "small text-body-secondary",
-					children: [/* @__PURE__ */ p("i", {
-						className: "bi bi-diagram-3 me-1",
-						"aria-hidden": !0
-					}), o.data.relationships.map((e) => /* @__PURE__ */ p("div", {
-						className: "ms-4 font-monospace",
-						children: e.summary
-					}, `${e.constraintName}-${e.fromTable}-${e.toTable}`))]
-				})] })
-			]
-		})]
+						]
+					}, e.name)), a.data.relationships.length > 0 && /* @__PURE__ */ m("div", {
+						className: "small text-body-secondary mt-2 text-truncate",
+						title: a.data.relationships.map((e) => e.summary).join(" • "),
+						children: [
+							/* @__PURE__ */ p("i", {
+								className: "bi bi-diagram-3 me-1",
+								"aria-hidden": !0
+							}),
+							a.data.relationships.length,
+							" relação(ões)"
+						]
+					})] })
+				]
+			})] })]
+		})
 	});
 }
 function te(e) {

package/dist/types/minivault.d.ts

@@ -79,7 +79,7 @@ export interface ImportFromStorageRequest {
     database?: DatabaseCredentials;
     storageConfig?: OriginStorageConfig;
 }
-/** Banco configurado no servidor via env (MINIVAULT_DB_*) e tabelas excluídas por segurança. */
+/** Banco configurado no servidor via env (BACKUP_DB_*) e tabelas excluídas por segurança. */
 export interface DbInfo {
     configured: boolean;
     host: string | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@v1ct0rbr/minivault-web",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Módulo independente de gerenciamento de backups (minivault). Consumível como pacote npm em qualquer app React. Cliente do minivault REST API (acesso tipicamente via proxy autenticado).",
   "author": "Victor Queiroga (https://www.linkedin.com/in/victor-queiroga)",
   "license": "MIT",