rar-autopass/docs/prd/prd-5.22-ui-compact-trimiteri-reguli-fix-chips.md

PRD 5.22 — UI compact Trimiteri + bara contextuala "Aplica cod" + exemplu Reguli automate + fix buton "+" editor import

Stare: inchis

Mockup aprobat de utilizator (artifact 6efc43e0, v2, 2026-07-07). Decizii inchise: tabel desktop pe un rand cu header; status = bulina + tooltip; mediu = litera T/P; multi-cod = primul cod + badge +N cu tooltip; sub-linie de problema = textul brut al erorii, mono, trunchiat, doar pe erori; bara "Aplica cod" contextuala la selectie; Reguli automate = exemplu concret in loc de paragraf descriptiv; fix no-op silentios la butonul "+" din editorul de import.

1. Obiectiv

Patru imbunatatiri UI/UX aprobate pe mockup: (a) lista Trimiteri devine tabel compact pe un singur rand pe desktop, cu header de coloane si semnalizare compacta status/mediu; (b) actiunea bulk "Aplica cod" devine bara contextuala vizibila doar la selectie; (c) sectiunea "Reguli automate (text)" din Mapari isi inlocuieste descrierea cu un exemplu concret; (d) butonul "+" din editorul de prestatii (import) nu mai esueaza silentios — feedback vizibil la succes si la refuz.

2. Non-Goals (anti scope-creep)

• NU se schimba logica backend a bulk-fix (POST /trimiteri/bulk-fix) — doar prezentarea.
• NU se schimba masina de stari submissions, filtrele, paginarea sau modalul de detaliu.
• NU se adauga functionalitate noua la regulile text (/mapari/reguli-text) — doar microcopy.
• NU se redeseneaza restul editorului de rand din import (doar zona chips "+").
• NU se ating API v1, worker-ul sau schema DB.

3. Stories atomice

US-001: Fix buton "+" chips prestatii — feedback la refuz si la succes

Ca operator care editeaza un rand de import vreau ca apasarea pe "+" sa aiba mereu un efect vizibil pentru ca azi codul invalid sau duplicat produce un raspuns identic, fara niciun mesaj ("nu se intampla nimic").

• Depinde de: —
• Fisiere: app/web/routes.py (post_form_chips), app/web/templates/_chips_prestatii.html, tests/test_web_corectie_prestatii.py (~3 fisiere)
• Test intai (RED): tests/test_web_corectie_prestatii.py — test_add_cod_duplicat_afiseaza_mesaj, test_add_cod_invalid_afiseaza_mesaj, test_add_cod_reusit_marcheaza_chip_nou
• Acceptance criteria:
  • Ramurile add, add_extra, add_flat din post_form_chips: cod care nu trece verificarea in nomenclator_rar → mesaj de eroare in fragmentul re-randat ("Cod necunoscut in nomenclator"), nu raspuns identic.
  • Cod deja prezent in lista (dedup) → mesaj "X este deja in lista — nu a fost adaugat inca o data", pe TOATE cele 3 ramuri.
  • Adaugare reusita → chip-ul nou primeste clasa de evidentiere (chip-nou, outline verde) + mesaj de confirmare "X adaugat" (aria-live pentru SR).
  • Mesajele traiesc in fragmentul _chips_prestatii.html (swap outerHTML pe #chips-section) si dispar la urmatoarea actiune reusita.
  • python3 -m pytest -q verde.
• Verificare E2E: browser pe import → Editeaza rand → alege cod deja adaugat → "+" → mesaj rosu vizibil; alege cod nou → "+" → chip verde evidentiat + mesaj.

US-002: Reguli automate — exemplu concret in loc de descriere

Ca utilizator al paginii Mapari vreau sa vad un exemplu de regula in loc de un paragraf explicativ pentru ca exemplul arata direct formatul si scuteste cititul.

• Depinde de: —
• Fisiere: app/web/templates/_mapari.html, tests/test_web_mapari_text_rules.py (~2 fisiere)
• Test intai (RED): tests/test_web_mapari_text_rules.py — test_sectiune_reguli_afiseaza_exemplu_nu_descriere
• Acceptance criteria:
  • Textul descriptiv din capul sectiunii "Reguli automate (text)" (inclusiv empty-state) e inlocuit cu un singur exemplu formatat: Daca operatia contine "verificare" → Cod RAR = OE-2 Intretinere si revizie, cu pattern-ul si codul evidentiate vizual (chip warn / chip accent, ca in mockup).
  • Nicio schimbare functionala la tabel, adaugare, preview sau stergere reguli.
  • python3 -m pytest -q verde.
• Verificare E2E: browser pe Mapari → sectiunea Reguli automate afiseaza exemplul.

US-003: View-model rand trimitere — coduri multiple + eroare bruta

Ca dashboard vreau ca randul de trimitere sa expuna lista completa de coduri RAR si textul brut al erorii pentru ca UI-ul compact afiseaza primul cod +N (tooltip cu toate) si sub-linia de eroare cu mesajul RAR, nu eticheta explicativa.

• Depinde de: —
• Fisiere: app/payload_view.py, app/web/routes.py (_submission_row_view), tests/test_payload_view.py, tests/test_web_submissions.py (~4 fisiere)
• Test intai (RED): tests/test_payload_view.py — test_coduri_rar_lista_ordonata_dedup, test_coduri_rar_gol_fara_prestatii; tests/test_web_submissions.py — test_rand_expune_eroare_bruta_doar_pe_error
• Acceptance criteria:
  • prezentare_din_payload intoarce camp nou coduri_rar: lista ordonata, dedup, a codurilor RAR (cod_prestatie) din TOATE prestatiile (lista goala cand nu exista); campurile existente raman neschimbate (compatibilitate).
  • _submission_row_view expune eroare_bruta: mesajul RAR brut cand exista (rar_error → mesajul serverului, ex. ORA-12899...), altfel motiv scurt; sir gol pe stari fara problema. needs_mapping NU produce eroare_bruta (informatia "nemapat" traieste in coloana Cod RAR).
  • python3 -m pytest -q verde.
• Verificare E2E: — (acoperit de US-004).

US-004: Trimiteri desktop — tabel cu header, un rand per trimitere

Ca operator pe desktop vreau trimiterile intr-un tabel compact cu header de coloane pentru ca este loc pe orizontala si scanez mai repede o lista pe un rand.

• Depinde de: US-003
• Fisiere: app/web/templates/_submissions.html, app/web/templates/base.html (CSS), tests/test_web_submissions_layout.py (~3 fisiere)
• Test intai (RED): tests/test_web_submissions_layout.py — test_desktop_header_coloane, test_status_bulina_cu_tooltip, test_mediu_litera_t_p, test_multicod_badge_plus_n, test_sublinie_eroare_bruta_doar_pe_error
• Acceptance criteria:
  • Pe desktop (>= breakpoint existent), lista devine tabel/grid cu header: (checkbox) · Vehicul · Cod RAR · Operatie · Data · Status · Mediu · (actiuni). Un rand per trimitere, fara wrap; operatia primeste ellipsis.
  • Status = DOAR bulina colorata (culorile claselor s-* existente), nume stare complet in title (tooltip); coloana are headerul "Status".
  • Mediu = litera in coloana proprie cu header "Mediu": P alb pe fundal --err (productie), T contur discret (testare); title cu numele complet.
  • Mai multe coduri: primul cod + badge +N cu title care listeaza toate codurile din coduri_rar; un singur cod → fara badge; niciun cod → nemapat.
  • Sub-linia de problema apare DOAR cand eroare_bruta e ne-goala: text mono, --fs-xs, culoare --err, un singur rand cu text-overflow:ellipsis, title cu textul complet.
  • Comportamente pastrate: click pe rand → modal detaliu; checkbox doar pe gestionabil; buton "Trimite" doar pe tinut; paginare/filtre neatinse.
  • python3 -m pytest -q verde.
• Verificare E2E: browser HTMX pe http://localhost:8010/ (desktop 1280px) — randuri pe o singura linie, header vizibil, tooltip-uri corecte.

US-005: Trimiteri mobil — bulina status + litera mediu

Ca operator pe mobil vreau aceleasi semnale compacte (bulina + T/P) pe lista de 2 linii pentru ca pill-urile cu text ocupa spatiu inutil pe ecran mic.

• Depinde de: US-004
• Fisiere: app/web/templates/_submissions.html, app/web/templates/base.html (media query), tests/test_web_submissions_layout.py (~3 fisiere)
• Test intai (RED): tests/test_web_submissions_layout.py — test_mobil_pastreaza_doua_linii_cu_bulina_si_litera
• Acceptance criteria:
  • Sub breakpoint, randul revine la 2 linii (placuta / cod·operatie·data), iar in dreapta stau litera de mediu + bulina de status (+ butonul "Trimite" pe tinute).
  • Fara header de tabel pe mobil; fara scroll orizontal la 390px.
  • python3 -m pytest -q verde.
• Verificare E2E: browser la 390px — lista lizibila, fara overflow orizontal.

US-006: Bara contextuala "Aplica cod" — vizibila doar la selectie

Ca operator vreau ca actiunile bulk sa apara doar cand am selectat randuri, cu text explicit pentru ca butonul permanent "Aplica cod" fara context e confuz.

• Depinde de: US-004
• Fisiere: app/web/templates/_submissions.html, app/web/templates/base.html (CSS + JS numarare selectie), tests/test_web_bulk_fix.py (~3 fisiere)
• Test intai (RED): tests/test_web_bulk_fix.py — test_bara_bulk_ascunsa_implicit, test_bara_bulk_texte_explicite
• Acceptance criteria:
  • Inputul de cod + "Aplica cod" + "Sterge selectate" dispar din capul listei; apar intr-o bara contextuala (stil accent, ca in mockup) randata ascunsa si afisata prin JS cand >= 1 checkbox e bifat; dispare la deselectare.
  • Bara contine: contor "N selectate", input cod RAR, buton "Aplica acest cod la N randuri", separator, buton "Sterge N randuri", actiune "Deselecteaza"; N se actualizeaza la fiecare bifare (JS, fara roundtrip).
  • Sub bara: hint pe un rand — "Aplica codul RAR doar operatiilor fara cod din randurile selectate, apoi le repune in coada."
  • Endpoint-urile, CSRF, hx-confirm pe stergere si hx-disinherit raman functional identice; bulk_message se afiseaza ca acum.
  • Starea barei supravietuieste re-randarii fragmentului (re-evaluare la htmx:afterSwap — dupa swap selectia se pierde, bara se ascunde).
  • python3 -m pytest -q verde.
• Verificare E2E: browser — capul listei curat; bifez 2 randuri blocate → bara apare cu "2 selectate"; aplic cod → lista se reincarca, bara dispare, sumar vizibil.

4. Riscuri

• Tabel vs. lista pe acelasi fragment: _submissions.html e folosit si de paginare/filtre/OOB — orice schimbare de structura trebuie sa pastreze id-urile (#submissions-wrap, #bulk-trimiteri, OOB-urile). Mitigare: pastram form-ul si id-urile existente, schimbam doar interiorul listei; testele de layout existente (test_web_submissions_layout.py) ruleaza inainte si dupa.
• rar_error brut poate contine detalii tehnice lungi: afisare pe un rand cu ellipsis + title; nu se logheaza/expune nimic nou (textul exista deja in modal).
• JS-ul de numarare selectie ruleaza peste randuri re-randate de HTMX: legare prin delegare pe container, nu pe noduri (altfel handler-ii mor la swap).
• Doua semnale rotunde alaturate pe mobil (bulina status + litera mediu): litera are forma/continut diferit de bulina — validat in mockup; daca in practica se confunda, fallback aprobat: mediu doar pe randurile de productie.

5. Intrebari deschise

— (toate inchise prin mockup v2 aprobat)

6. Valuri de executie (graful de dependente)

Val 1: [US-001] [US-002] [US-003]   ← fara dependente, fisiere disjuncte → paralel
Val 2: [US-004]                     ← deblocat de US-003
Val 3: [US-005] [US-006]            ← deblocate de US-004; ating aceleasi fisiere → secvential intre ele

---

Raport VERIFY

Verdict: PASS — 2026-07-07, E2E in browser (Playwright, uvicorn pe DB temporar, 7 trimiteri seedate: sent/queued/held/needs_mapping/error, test+prod, multi-cod).

• Desktop 1280px: header Vehicul/Cod RAR/Operatie/Data/Status/Mediu; un rand per trimitere; bulina colorata cu title; P fill rosu / T contur; OE-1 +2 cu tooltip; sub-linie ORA-12899... mono trunchiata doar pe rândul error; nemapat italic fara sub-linie.
• Bara bulk: ascunsa implicit; la 2 checkbox-uri → "2 selectate · Aplica acest cod la 2 randuri | Sterge 2 randuri | Deselecteaza" + hint; aplicat OE-2 → ambele randuri → queued, bara dispare.
• Mapari: exemplul "Daca operatia contine «verificare» → Cod RAR = OE-2 Intretinere si revizie" inlocuieste descrierea.
• Chips "+": adaugare OE-1 → chip evidentiat (chip-nou) + "OE-1 adaugat."; duplicat → "OE-1 este deja in lista — nu a fost adaugat inca o data."; select gol → "Selecteaza un cod RAR din lista".
• Mobil 390px: fara header, 2 linii, T/P + bulina in dreapta, fara scroll orizontal.
• Suita completa: 1622 passed, 1 skipped.

Cauza-radacina REALA a bug-ului "+" (gasita LA VERIFY, nu in analiza statica): form-urile parinte din modalele de editare au hx-disabled-elt="find button"; atributul se MOSTENESTE pe butoanele chips, iar find button rezolvat relativ la butonul "+" (fara butoane descendente) → null → TypeError intern htmx 1.9.12 INAINTE de request → nicio cerere, nicio eroare vizibila. Fix: hx-disabled-elt="this" explicit pe toate butoanele hx-post din _chips_prestatii.html (care si dezactiveaza butonul cat cererea e in zbor). No-op-urile silentioase server-side (cod invalid pe add/add_flat, duplicat) erau defecte reale suplimentare, reparate separat.

Observatii non-blocante: (1) bulk_message ("N reusite") dispare imediat — HX-Trigger trimiteriChanged reincarca lista peste raspunsul cu mesaj (comportament pre-existent); (2) pe mobil, operatia e trunchiata agresiv pe randurile cu buton "Trimite" (spatiul e consumat de actiune + mediu + status) — acceptat, informatia completa e in modal.