Views

A view is a Twig template that a controller renders. In Hubleto it is the thin layer between the controller and the React component: it contains the markup of the page and the hblreact-* tag that renders a table, a form or a board.

Where views live and how they are named

Views of an app are in Views/ and are referred to as @Hubleto:App:Community:<AppName>/<View>.twig. The controller selects it:

apps/Customers/Controllers/Customers.php (excerpt)

  public function prepareView(): void
  {
    parent::prepareView();
    $this->setView('@Hubleto:App:Community:Customers/Customers.twig');
  }

The name is the namespace of the app with \ replaced by : ($app->viewNamespace), so for a custom app it is @Hubleto:App:Custom:CarRental/Cars.twig. A view in a subfolder is Boards/CarsInService.twig.

Twig namespace	Folder
`@Hubleto:App:...`	`Views/` of the app
`@app`	`apps/` of `hubleto/erp`
`@hubleto-main`	`views/` of `hubleto/erp`
`@project`	`src/views/` of your project

Twig namespaces.

Variables

The view gets viewParams (from $this->viewParams of the controller, which starts with the URL parameters), the signed-in user, the config and the global object hubleto:

apps/Customers/Views/Customers.twig

<hblreact-customers-table-customers
  string:tag="table-customers"
  int:record-id="{{ viewParams.recordId }}"
  string:fulltext-search='{{ viewParams.q }}'
  json:column-search='{{ viewParams.search|json_encode }}'
  json:filters='{{ viewParams.filters|json_encode }}'
  string:form-active-tab-uid='{{ viewParams.tab }}'
></hblreact-customers-table-customers>

Useful helpers:

Expression	Result
`translate('Text')`	Translated text.
`hubleto.locale().formatCurrency(...)`	Formatted amount.
`viewParams.recordId`	Value from the controller.
`user.id`	ID of the signed-in user.

Twig helpers.

Rules

One view per controller, with the same name.
No business logic and no SQL in a view. Prepare data in prepareView().
Translate every visible text.
Escape Twig syntax in the documentation pages ({{ '{{' }}), not in views.