Frontend Validation & Linting¶

HBIA provides validation and linting tools specific to the frontend graph system.

Validation¶

YAML Validation¶

Validates the YAML structure of each graph type:

hbia ui-validate graph/

from honey_badgeria.front.dsl.validator import validate_frontend

errors = validate_frontend(domain)

What Validation Checks¶

Check	Description
Schema correctness	Required fields present, correct types
Field references	`reads` and `watch` references resolve to actual state fields
Mutation references	Event flows reference mutations that exist in state nodes
Effect handler paths	Handler paths are valid identifiers
Cross-graph integrity	All references across the four graphs are consistent

Example Errors¶

Error: UINode "Dashboard" reads "FilterState.nonexistent" — field does not exist
Error: Event "refresh" flow references "ChartState.invalid_mutation" — mutation not defined
Error: Effect "fetch_data" watches "UnknownState.field" — state node not found

Linting¶

CLI¶

hbia ui-lint graph/

Python¶

from honey_badgeria.front.lint import FrontendLinter

linter = FrontendLinter()
issues = linter.lint(domain)

for issue in issues:
    print(f"[{issue.code}] {issue.severity}: {issue.message}")

Lint Checks¶

Check	Severity	Description
Unused state nodes	Warning	State nodes not referenced by any UI node, effect, or event
Orphaned effects	Warning	Effects not triggered by any state or event
Dangling event references	Error	Events referencing non-existent mutations or components
Non-pure UI nodes	Warning	UI nodes that appear to contain logic
Missing effect handlers	Warning	Effects with no handler path specified

Explanation¶

Generate human/AI-readable descriptions of your frontend architecture:

hbia ui-inspect graph/dashboard/

from honey_badgeria.front.explain import FrontendExplainer

explainer = FrontendExplainer(domain)
explainer.explain()              # Print to stdout
lines = explainer.explain_lines()  # list[str]
dict_view = explainer.to_dict()  # AI-friendly dict

The explainer outputs:

Component tree structure
State node inventory
Effect inventory with triggers
Event flow documentation
Cross-graph reference map