rl-core-front 0.1.0

package/src/_services/auth/index.ts

@@ -0,0 +1,127 @@
+import { api } from "#core/_services/api/axios.factory";
+import type { components } from "#core/_services/api/schema";
+
+export type LoginStatus = "SETUP_REQUIRED" | "TOTP_REQUIRED";
+
+export interface LoginResponse {
+  status: LoginStatus;
+  pendingToken: string;
+}
+
+export interface TotpSetup {
+  secret: string;
+  otpauthUrl: string;
+  qrDataUrl: string;
+}
+
+
+
+export interface VerifyResponse {
+  user: Profile;
+  backupCodes?: string[];
+}
+
+/** Espelha PasswordTokenStatus do backend. */
+export type PasswordTokenStatus = "valid" | "invalid" | "expired" | "used";
+export type PasswordTokenPurpose = "password_reset" | "first_access";
+
+export interface PasswordTokenCheck {
+  valid: boolean;
+  status: PasswordTokenStatus;
+  purpose?: PasswordTokenPurpose;
+}
+
+/**
+ * Forma única do usuário autenticado, **derivada do contrato do backend**
+ * (`openapi.json` → `schema.d.ts`). Campo que mudar lá quebra o build aqui,
+ * em vez de quebrar a tela do usuário.
+ */
+export type Profile = components["schemas"]["SessionUserResponse"];
+
+
+export const authService = {
+  login(email: string, password: string) {
+    return api
+      .post<LoginResponse>("/auth/login", { email, password })
+      .then((r) => r.data);
+  },
+
+  setupTotp(pendingToken: string) {
+    return api
+      .post<TotpSetup>("/auth/2fa/setup", { pendingToken })
+      .then((r) => r.data);
+  },
+
+  requestEmailCode(pendingToken: string) {
+    return api
+      .post<{ sent: boolean }>("/auth/2fa/email", { pendingToken })
+      .then((r) => r.data);
+  },
+
+  verify(
+    pendingToken: string,
+    code: string,
+    method?: "totp" | "email" | "backup",
+  ) {
+    return api
+      .post<VerifyResponse>("/auth/2fa/verify", { pendingToken, code, method })
+      .then((r) => r.data);
+  },
+
+  profile() {
+    return api.get<Profile>("/auth/profile").then((r) => r.data);
+  },
+
+  logout() {
+    return api.post("/auth/logout").then((r) => r.data);
+  },
+
+  forgotPassword(email: string) {
+    return api.post("/auth/forgot-password", { email }).then((r) => r.data);
+  },
+
+  /** Verifica o link de senha antes de exibir o formulário (não consome o token). */
+  inspectPasswordToken(token: string): Promise<PasswordTokenCheck> {
+    return api
+      .get<PasswordTokenCheck>(
+        `/auth/password-token/${encodeURIComponent(token)}`,
+      )
+      .then((r) => r.data);
+  },
+
+  resetPassword(token: string, newPassword: string) {
+    return api
+      .post("/auth/reset-password", { token, newPassword })
+      .then((r) => r.data);
+  },
+
+  changePassword(currentPassword: string, newPassword: string) {
+    return api
+      .patch("/users/me/password", { currentPassword, newPassword })
+      .then((r) => r.data);
+  },
+
+  updateProfile(data: { name?: string; lastName?: string; phone?: string }) {
+    return api.patch("/users/me", data).then((r) => r.data);
+  },
+
+  regenerateBackup(code: string) {
+    return api
+      .post<{ backupCodes: string[] }>("/auth/2fa/backup/regenerate", { code })
+      .then((r) => r.data);
+  },
+
+  uploadAvatar(file: File) {
+    const form = new FormData();
+    form.append("file", file);
+    return api
+      .post("/users/me/avatar", form, {
+        headers: { "Content-Type": "multipart/form-data" },
+      })
+      .then((r) => r.data);
+  },
+
+  deleteAvatar() {
+    return api.delete("/users/me/avatar").then((r) => r.data);
+  },
+};

package/src/_utils/advanced-filter.ts

@@ -0,0 +1,386 @@
+import { fromIsoDay, toIsoDay } from "#core/_utils/calendar";
+import type { FilterField, FilterOperator } from "#core/_utils/filter";
+
+/**
+ * Modo avançado do filtro: uma árvore de regras e grupos, com `E`/`OU` por
+ * grupo. É o que a DSL do backend já aceitava desde o começo — aqui só ganha
+ * interface.
+ */
+export type Combinator = "$AND" | "$OR";
+
+export interface AdvancedRule {
+  id: string;
+  kind: "rule";
+  /** Nome público do campo, como vem do catálogo. */
+  field: string;
+  operator: FilterOperator;
+  /** Valor único, ou a primeira ponta de um intervalo. */
+  value: string;
+  /** Segunda ponta (`$BETWEEN`/`$NOTBETWEEN`). */
+  value2?: string;
+  /** Seleção múltipla (`$IN`/`$NOTIN`). */
+  values?: string[];
+}
+
+export interface AdvancedGroup {
+  id: string;
+  kind: "group";
+  combinator: Combinator;
+  children: AdvancedNode[];
+}
+
+export type AdvancedNode = AdvancedRule | AdvancedGroup;
+
+/**
+ * Tetos espelhados de `backend/src/core/query/filter.constants.ts`.
+ *
+ * Ficam repetidos de propósito: o backend precisa deles para se defender de
+ * qualquer cliente, e a tela precisa deles para avisar **antes** do 400. Se um
+ * mudar lá, muda aqui.
+ */
+export const MAX_DEPTH = 3;
+export const MAX_CONDITIONS = 50;
+export const MAX_IN_ITEMS = 100;
+
+/** Operadores que não têm campo de valor. */
+export const NULLABILITY_OPERATORS: FilterOperator[] = ["$IS", "$NOT"];
+/** Operadores com duas pontas. */
+export const RANGE_OPERATORS: FilterOperator[] = ["$BETWEEN", "$NOTBETWEEN"];
+/** Operadores de lista. */
+export const LIST_OPERATORS: FilterOperator[] = ["$IN", "$NOTIN"];
+
+const uid = (): string =>
+  `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`;
+
+export const isGroup = (node: AdvancedNode): node is AdvancedGroup =>
+  node.kind === "group";
+
+export const newRule = (field: FilterField): AdvancedRule => ({
+  id: uid(),
+  kind: "rule",
+  field: field.field,
+  operator: field.operators[0],
+  value: "",
+});
+
+export const newGroup = (combinator: Combinator = "$AND"): AdvancedGroup => ({
+  id: uid(),
+  kind: "group",
+  combinator,
+  children: [],
+});
+
+/** Árvore inicial: um grupo `E` com uma regra no primeiro campo do catálogo. */
+export const initialTree = (schema: FilterField[]): AdvancedGroup => {
+  const root = newGroup("$AND");
+  if (schema.length > 0) {
+    root.children.push(newRule(schema[0]));
+  }
+  return root;
+};
+
+export const countConditions = (node: AdvancedNode): number =>
+  isGroup(node)
+    ? node.children.reduce((total, child) => total + countConditions(child), 0)
+    : 1;
+
+/** Profundidade em níveis de grupo — o grupo raiz conta como 1. */
+export const depthOf = (node: AdvancedNode): number =>
+  isGroup(node)
+    ? 1 + Math.max(0, ...node.children.map((child) => depthOf(child)))
+    : 0;
+
+/** Substitui um nó na árvore pelo resultado de `update` (ou o remove com `null`). */
+export const replaceNode = (
+  node: AdvancedNode,
+  id: string,
+  update: (found: AdvancedNode) => AdvancedNode | null,
+): AdvancedNode | null => {
+  if (node.id === id) {
+    return update(node);
+  }
+  if (!isGroup(node)) {
+    return node;
+  }
+  const children = node.children
+    .map((child) => replaceNode(child, id, update))
+    .filter((child): child is AdvancedNode => child !== null);
+  return { ...node, children };
+};
+
+const splitList = (raw: string): string[] =>
+  raw
+    .split(",")
+    .map((item) => item.trim())
+    .filter((item) => item !== "");
+
+const isDateField = (field: FilterField): boolean =>
+  field.type === "DATE" || field.type === "DATETIME";
+
+/**
+ * Dia local → ISO com o fuso de quem filtrou, como no modo simples: dia sem
+ * hora seria lido como UTC e o período começaria atrasado.
+ */
+const dayBound = (value: string, bound: "start" | "end"): string => {
+  const day = fromIsoDay(value);
+  if (!day) {
+    return value;
+  }
+  const date = new Date(day);
+  if (bound === "start") {
+    date.setHours(0, 0, 0, 0);
+  } else {
+    date.setHours(23, 59, 59, 999);
+  }
+  return date.toISOString();
+};
+
+const coerce = (field: FilterField, raw: string): unknown => {
+  if (field.type === "NUMBER") {
+    const parsed = Number(raw);
+    return Number.isFinite(parsed) ? parsed : raw;
+  }
+  if (field.type === "BOOLEAN") {
+    return raw === "true";
+  }
+  return raw;
+};
+
+/** Uma regra → o par `{ campo: { operador: valor } }` da DSL. */
+const ruleToCondition = (
+  rule: AdvancedRule,
+  schema: FilterField[],
+): Record<string, unknown> | null => {
+  const field = schema.find((item) => item.field === rule.field);
+  if (!field) {
+    return null;
+  }
+
+  if (NULLABILITY_OPERATORS.includes(rule.operator)) {
+    // "" no select vale null; o resto é booleano.
+    const operand = rule.value === "" ? null : rule.value === "true";
+    return { [rule.field]: { [rule.operator]: operand } };
+  }
+
+  if (RANGE_OPERATORS.includes(rule.operator)) {
+    if (!rule.value || !rule.value2) {
+      return null;
+    }
+    const pair = isDateField(field)
+      ? [dayBound(rule.value, "start"), dayBound(rule.value2, "end")]
+      : [coerce(field, rule.value), coerce(field, rule.value2)];
+    return { [rule.field]: { [rule.operator]: pair } };
+  }
+
+  if (LIST_OPERATORS.includes(rule.operator)) {
+    const items = rule.values?.length ? rule.values : splitList(rule.value);
+    if (items.length === 0) {
+      return null;
+    }
+    return {
+      [rule.field]: {
+        [rule.operator]: items.map((item) => coerce(field, item)),
+      },
+    };
+  }
+
+  if (rule.value === "") {
+    return null;
+  }
+  const single = isDateField(field)
+    ? dayBound(rule.value, rule.operator === "$LTE" ? "end" : "start")
+    : coerce(field, rule.value);
+  return { [rule.field]: { [rule.operator]: single } };
+};
+
+const nodeToJson = (
+  node: AdvancedNode,
+  schema: FilterField[],
+): Record<string, unknown> | null => {
+  if (!isGroup(node)) {
+    return ruleToCondition(node, schema);
+  }
+  const parts = node.children
+    .map((child) => nodeToJson(child, schema))
+    .filter((part): part is Record<string, unknown> => part !== null);
+  if (parts.length === 0) {
+    return null;
+  }
+  return { [node.combinator]: parts };
+};
+
+/**
+ * Árvore → JSON da query.
+ *
+ * O topo sai sempre com o combinador explícito (`{"$AND":[…]}`), e é isso que
+ * faz a tela voltar no modo avançado depois de um F5.
+ */
+export const buildAdvancedFilter = (
+  root: AdvancedGroup,
+  schema: FilterField[],
+): string | undefined => {
+  const json = nodeToJson(root, schema);
+  return json ? JSON.stringify(json) : undefined;
+};
+
+export interface AdvancedValidation {
+  valid: boolean;
+  /** Chave de i18n do motivo, quando inválido. */
+  reason?: "tooDeep" | "tooManyConditions" | "tooManyItems";
+}
+
+/** Confere os tetos do backend antes de mandar, para o erro não virar 400. */
+export const validateTree = (root: AdvancedGroup): AdvancedValidation => {
+  if (depthOf(root) > MAX_DEPTH) {
+    return { valid: false, reason: "tooDeep" };
+  }
+  if (countConditions(root) > MAX_CONDITIONS) {
+    return { valid: false, reason: "tooManyConditions" };
+  }
+  const overflowing = (node: AdvancedNode): boolean =>
+    isGroup(node)
+      ? node.children.some(overflowing)
+      : (node.values?.length ?? splitList(node.value).length) > MAX_IN_ITEMS &&
+        LIST_OPERATORS.includes(node.operator);
+  return overflowing(root)
+    ? { valid: false, reason: "tooManyItems" }
+    : { valid: true };
+};
+
+/** O JSON veio de um filtro avançado? É o que decide o modo ao hidratar a URL. */
+export const isAdvancedFilter = (raw: string | null | undefined): boolean => {
+  if (!raw) {
+    return false;
+  }
+  try {
+    const parsed: unknown = JSON.parse(raw);
+    return (
+      typeof parsed === "object" &&
+      parsed !== null &&
+      ("$AND" in parsed || "$OR" in parsed)
+    );
+  } catch {
+    return false;
+  }
+};
+
+const OPERATOR_SET = new Set<string>([
+  "$EQ",
+  "$NE",
+  "$IS",
+  "$NOT",
+  "$GT",
+  "$GTE",
+  "$LT",
+  "$LTE",
+  "$BETWEEN",
+  "$NOTBETWEEN",
+  "$IN",
+  "$NOTIN",
+  "$LIKE",
+  "$NOTLIKE",
+  "$STARTSWITH",
+  "$ENDSWITH",
+  "$SUBSTRING",
+]);
+
+const asText = (field: FilterField, value: unknown): string => {
+  if (typeof value === "string" && isDateField(field)) {
+    const parsed = new Date(value);
+    return Number.isNaN(parsed.getTime()) ? value : toIsoDay(parsed);
+  }
+  return typeof value === "boolean" || typeof value === "number"
+    ? String(value)
+    : ((value as string | null) ?? "");
+};
+
+const jsonToNode = (
+  json: Record<string, unknown>,
+  schema: FilterField[],
+): AdvancedNode | null => {
+  const entries = Object.entries(json);
+  if (entries.length === 0) {
+    return null;
+  }
+  const [key, value] = entries[0];
+
+  if (key === "$AND" || key === "$OR") {
+    if (!Array.isArray(value)) {
+      return null;
+    }
+    const children = value
+      .map((child) =>
+        typeof child === "object" && child !== null
+          ? jsonToNode(child as Record<string, unknown>, schema)
+          : null,
+      )
+      .filter((child): child is AdvancedNode => child !== null);
+    return { id: uid(), kind: "group", combinator: key, children };
+  }
+
+  const field = schema.find((item) => item.field === key);
+  if (!field || typeof value !== "object" || value === null) {
+    return null;
+  }
+  const [operator, operand] = Object.entries(
+    value as Record<string, unknown>,
+  )[0] ?? [null, null];
+  if (!operator || !OPERATOR_SET.has(operator)) {
+    return null;
+  }
+
+  const rule: AdvancedRule = {
+    id: uid(),
+    kind: "rule",
+    field: key,
+    operator: operator as FilterOperator,
+    value: "",
+  };
+
+  if (Array.isArray(operand)) {
+    if (RANGE_OPERATORS.includes(rule.operator)) {
+      rule.value = asText(field, operand[0]);
+      rule.value2 = asText(field, operand[1]);
+    } else {
+      rule.values = operand.map((item) => asText(field, item));
+      rule.value = rule.values.join(", ");
+    }
+    return rule;
+  }
+
+  rule.value = operand === null ? "" : asText(field, operand);
+  return rule;
+};
+
+/**
+ * JSON → árvore, para reabrir a tela no mesmo filtro.
+ *
+ * Devolve `null` para o que não souber ler: a URL é editável à mão e um filtro
+ * estranho não pode impedir a tela de abrir.
+ */
+export const parseAdvancedFilter = (
+  raw: string | null | undefined,
+  schema: FilterField[],
+): AdvancedGroup | null => {
+  if (!raw) {
+    return null;
+  }
+  let parsed: unknown;
+  try {
+    parsed = JSON.parse(raw);
+  } catch {
+    return null;
+  }
+  if (typeof parsed !== "object" || parsed === null || Array.isArray(parsed)) {
+    return null;
+  }
+
+  const node = jsonToNode(parsed as Record<string, unknown>, schema);
+  if (!node) {
+    return null;
+  }
+  // A raiz é sempre um grupo: uma regra solta ganha um `E` em volta.
+  return isGroup(node)
+    ? node
+    : { id: uid(), kind: "group", combinator: "$AND", children: [node] };
+};

package/src/_utils/calendar.ts

@@ -0,0 +1,103 @@
+/**
+ * Aritmética de calendário para o seletor de período.
+ *
+ * Sem biblioteca de data: o que o componente precisa é grade do mês, soma de
+ * dias/meses e comparação por dia — não compensa uma dependência nova para isso.
+ * Toda `Date` criada aqui nasce ao **meio-dia**: em dia de mudança de horário de
+ * verão, meia-noite pode não existir e o dia "pula".
+ */
+const NOON = 12;
+
+/** `Date` local no dia informado, ao meio-dia. */
+export const dayOf = (year: number, month: number, day: number): Date =>
+  new Date(year, month, day, NOON, 0, 0, 0);
+
+/** `Date` → `"yyyy-MM-dd"` pelo calendário local (nada de `toISOString`, que é UTC). */
+export const toIsoDay = (date: Date): string => {
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${date.getFullYear()}-${month}-${day}`;
+};
+
+/** `"yyyy-MM-dd"` (ou ISO completo) → `Date` local ao meio-dia. `null` se não der. */
+export const fromIsoDay = (value: string | undefined): Date | null => {
+  if (!value) {
+    return null;
+  }
+  const match = /^(\d{4})-(\d{2})-(\d{2})/.exec(value);
+  if (!match) {
+    return null;
+  }
+  const date = dayOf(Number(match[1]), Number(match[2]) - 1, Number(match[3]));
+  return Number.isNaN(date.getTime()) ? null : date;
+};
+
+export const addDays = (date: Date, amount: number): Date =>
+  dayOf(date.getFullYear(), date.getMonth(), date.getDate() + amount);
+
+export const addMonths = (date: Date, amount: number): Date => {
+  const target = dayOf(date.getFullYear(), date.getMonth() + amount, 1);
+  // 31/03 - 1 mês não pode virar 03/03: prende no último dia do mês destino.
+  const lastDay = dayOf(target.getFullYear(), target.getMonth() + 1, 0).getDate();
+  return dayOf(
+    target.getFullYear(),
+    target.getMonth(),
+    Math.min(date.getDate(), lastDay),
+  );
+};
+
+export const isSameDay = (a: Date, b: Date): boolean =>
+  a.getFullYear() === b.getFullYear() &&
+  a.getMonth() === b.getMonth() &&
+  a.getDate() === b.getDate();
+
+export const isSameMonth = (a: Date, b: Date): boolean =>
+  a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
+
+/** Dia dentro do intervalo fechado — a ordem das pontas não importa. */
+export const isWithin = (day: Date, from: Date, to: Date): boolean => {
+  const [start, end] = from <= to ? [from, to] : [to, from];
+  return day >= start && day <= end;
+};
+
+export const today = (): Date => {
+  const now = new Date();
+  return dayOf(now.getFullYear(), now.getMonth(), now.getDate());
+};
+
+/**
+ * Grade do mês: 6 semanas × 7 dias, começando na segunda-feira.
+ *
+ * Seis semanas fixas de propósito — com 5 ou 6 conforme o mês, o painel muda de
+ * altura ao navegar e o calendário "pula" na tela.
+ */
+export const monthGrid = (month: Date): Date[] => {
+  const first = dayOf(month.getFullYear(), month.getMonth(), 1);
+  // getDay(): 0 = domingo. Queremos segunda como primeira coluna.
+  const offset = (first.getDay() + 6) % 7;
+  const start = addDays(first, -offset);
+  return Array.from({ length: 42 }, (_, index) => addDays(start, index));
+};
+
+/** "agosto 2026" — o mês vem do locale escolhido pelo usuário, não do navegador. */
+export const monthLabel = (month: Date, locale: string): string =>
+  new Intl.DateTimeFormat(locale, { month: "long", year: "numeric" }).format(
+    month,
+  );
+
+/** Iniciais dos dias da semana, de segunda a domingo, no locale. */
+export const weekdayLabels = (locale: string): string[] => {
+  const formatter = new Intl.DateTimeFormat(locale, { weekday: "short" });
+  // 2026-06-01 é uma segunda-feira — âncora só para varrer a semana.
+  return Array.from({ length: 7 }, (_, index) =>
+    formatter.format(dayOf(2026, 5, 1 + index)).replace(".", ""),
+  );
+};
+
+/** "01/08/2026" no locale, a partir de `"yyyy-MM-dd"`. */
+export const formatDay = (value: string, locale: string): string => {
+  const date = fromIsoDay(value);
+  return date
+    ? new Intl.DateTimeFormat(locale, { dateStyle: "short" }).format(date)
+    : value;
+};

package/src/_utils/crop-image.ts

@@ -0,0 +1,65 @@
+/** Área recortada em pixels da imagem original, como o cropper devolve. */
+export interface CropAreaPixels {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+}
+
+/** Lado do avatar gerado. O backend também redimensiona; aqui já sai pequeno. */
+const OUTPUT_SIZE = 512;
+const OUTPUT_TYPE = "image/webp";
+const OUTPUT_QUALITY = 0.85;
+
+function loadImage(src: string): Promise<HTMLImageElement> {
+  return new Promise((resolve, reject) => {
+    const image = new Image();
+    image.onload = () => resolve(image);
+    image.onerror = () => reject(new Error("Não foi possível ler a imagem"));
+    image.src = src;
+  });
+}
+
+/**
+ * Recorta a área escolhida e devolve o arquivo já pronto para upload.
+ *
+ * O recorte acontece no cliente para o backend receber a imagem final: menos
+ * bytes na rede e nada de guardar a original só para cortar depois.
+ */
+export async function cropImageToFile(
+  src: string,
+  area: CropAreaPixels,
+  filename = "avatar.webp",
+): Promise<File> {
+  const image = await loadImage(src);
+
+  const canvas = document.createElement("canvas");
+  canvas.width = OUTPUT_SIZE;
+  canvas.height = OUTPUT_SIZE;
+
+  const ctx = canvas.getContext("2d");
+  if (!ctx) {
+    throw new Error("Canvas indisponível neste navegador");
+  }
+
+  ctx.drawImage(
+    image,
+    area.x,
+    area.y,
+    area.width,
+    area.height,
+    0,
+    0,
+    OUTPUT_SIZE,
+    OUTPUT_SIZE,
+  );
+
+  const blob = await new Promise<Blob | null>((resolve) =>
+    canvas.toBlob(resolve, OUTPUT_TYPE, OUTPUT_QUALITY),
+  );
+  if (!blob) {
+    throw new Error("Não foi possível gerar a imagem recortada");
+  }
+
+  return new File([blob], filename, { type: OUTPUT_TYPE });
+}