Better image management in Flax
(Based on a comment here: !1141 (comment 135056))
Our current approach to inserting images in Flax templates requires modifying the templates every time we publish, using regex search/replace to update the src
attribute in every image tag. This is hacky and fragile and breaks the principle that the template should be essentially a static file that changes only when the user decides they want to modify layout.
Currently, if you copy/paste an image asset into your template, you get something like this:
{{ '<img data-name="rose.png" data-id="68e1ed6f-c31e-47e1-a332-1c229d216c6d" src="http://filehosting:9000/uploads/ad5a0a8cd860.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=nonRootUser%2F20240215%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20240215T192026Z&X-Amz-Expires=86400&X-Amz-Signature=3d62d7451101ac5448a4405b814efff0bdcd0ab262b494720ab30aadff6288ee&X-Amz-SignedHeaders=host" alt="rose.png" />' | imagesHandler(article.shortId, 'articles', config.group, cmsLayout.hexCode) | makeSvgsFromLatex(true) | safe }}
This is inherently fragile because the src
will soon expire. We should instead be inserting something like this:
<img src="{{ assets.6jX8mOe1 }}" alt="foo.png" />
where junjucks will replace {{ assets.6jX8mOe1 }}
with /kotahi/assets/images/articles/6jX8mOe1-foo.png
(or whatever path Flax has saved the asset to).
In the 'Template assets' tab, the numeric ID currently displayed for each asset is meaningless, as it will change if an earlier asset in the list is deleted: The ID does not stay with the asset for its lifetime. I recommend instead providing a short unique ID such as '6jX8mOe1' that will emable the user to match asset tags from the template with assets in the list.