Gramex 1.48 Release Notes

Template components

You can now use {% include "component.html" %} to include a template inside another template. This makes it easier to share components across pages.

This uses FileHandler templates, so ensure that template: true is enabled in your YAML file.

Variables from the parent template are available to the component. This allows programmable components. It’s like using functions to generate the template content. For example, if your navbar.html has:

...
<a class="navbar-brand">{{ title }}</a>
...

… you can change the title from the calling template.

{% set title = 'Main dashboard' %} {% include "navbar.html" %}
<!-- renders title as Main dashboard -->

Some components you may use commonly across pages are:

Automated translations

Gramex supports automated translations. The gramex.ml.translator function translates data using the Google Translate API, and caches the results in a FormHandler compatible table.

For example, translate?q=Apple&q=Orange&target=de returns a JSON list with the translations.

[
  { "q": "Apple", "t": "Apfel", "source": "en", "target": "de" },
  { "q": "Orange", "t": "Orange", "source": "en", "target": "de" }
]

The translations are stored in a table that you can edit using FormHandlers.

Better gramex init

gramex init automatically adds

You can decide which servers are production servers by editing the 'YOUR-PROD-SERVER-NAME' generated by gramex init. (You can also use any other check for production.)

import:
  # To secure application for production,
  # replace 'YOUR-PROD-SERVER-NAME' with your production server host name.
  deploy if socket.gethostname() in {'YOUR-PROD-SERVER-NAME'}: $GRAMEXPATH/deploy.yaml

Auto-create tables

FormHandler can create tables automatically.

If the database table or file that the url: points to does not exist, it returns an empty dataset.

When we POST into the table, it automatically creates a table with the columns available in the POST request.

Admin page enhancements

The admin page features a home: parameter that lets you link to the dashboard back from the admin page. It also displays a loading icon when fetching data – making slow pages more user-friendly.

SASS support

UI components use SASS to simplify CSS code. Gramex now converts SASS files into CSS on the fly:

url:
  my-css-handler:
    pattern: ...
    handler: FunctionHandler
    kwargs:
      function: gramex.apps.ui.sass(handler, r"$YAMLPATH/style.scss")

This converts style.scss into CSS. With this, you can create custom UI components, modify existing components, or write your CSS more efficiently in SASS.

Documentation

Bugfixes

Stats

Upgrade

To upgrade Gramex, run:

pip install --verbose gramex==1.48

To upgrade apps dependencies, run:

gramex setup --all

This downloads Chromium and other front-end dependencies. That may take time.