From fde1ca963ccd2539d5852b86d6eefe5b0b8a6689 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?G=C3=A9ry=20Debongnie?= Date: Wed, 29 Jun 2022 18:38:22 +0000 Subject: [PATCH] [IMP] web, project: introduce and use renderToMarkup Part-of: odoo/odoo#92475 --- .../src/js/project_task_kanban_examples.js | 26 +++++++++---------- addons/web/static/src/core/utils/render.js | 18 ++++++++++--- 2 files changed, 28 insertions(+), 16 deletions(-) diff --git a/addons/project/static/src/js/project_task_kanban_examples.js b/addons/project/static/src/js/project_task_kanban_examples.js index 2ae2f87445e..2125ea4868e 100644 --- a/addons/project/static/src/js/project_task_kanban_examples.js +++ b/addons/project/static/src/js/project_task_kanban_examples.js @@ -3,7 +3,7 @@ import { _lt } from 'web.core'; import kanbanExamplesRegistry from 'web.kanban_examples_registry'; import { registry } from "@web/core/registry"; -import { renderToString } from '@web/core/utils/render'; +import { renderToMarkup } from '@web/core/utils/render'; const { markup } = owl; const greenBullet = markup(``); @@ -18,83 +18,83 @@ const exampleData = { name: _lt('Software Development'), columns: [_lt('Backlog'), _lt('Specifications'), _lt('Development'), _lt('Tests'), _lt('Delivered')], get description() { - return markup(renderToString("project.example.generic")); + return renderToMarkup("project.example.generic"); }, bullets: [greenBullet, redBullet, star], }, { name: _lt('Agile Scrum'), columns: [_lt('Backlog'), _lt('Sprint Backlog'), _lt('Sprint in Progress'), _lt('Sprint Complete'), _lt('Old Completed Sprint')], get description() { - return markup(renderToString("project.example.agilescrum")); + return renderToMarkup("project.example.agilescrum"); }, bullets: [greenBullet, redBullet], }, { name: _lt('Digital Marketing'), columns: [_lt('Ideas'), _lt('Researching'), _lt('Writing'), _lt('Editing'), _lt('Done')], get description() { - return markup(renderToString("project.example.digitalmarketing")); + return renderToMarkup("project.example.digitalmarketing"); }, bullets: [greenBullet, redBullet], }, { name: _lt('Customer Feedback'), columns: [_lt('New'), _lt('In development'), _lt('Done'), _lt('Refused')], get description() { - return markup(renderToString("project.example.customerfeedback")); + return renderToMarkup("project.example.customerfeedback"); }, bullets: [greenBullet, redBullet], }, { name: _lt('Consulting'), columns: [_lt('New Projects'), _lt('Resources Allocation'), _lt('In Progress'), _lt('Done')], get description() { - return markup(renderToString("project.example.consulting")); + return renderToMarkup("project.example.consulting"); }, bullets: [greenBullet, redBullet], }, { name: _lt('Research Project'), columns: [_lt('Brainstorm'), _lt('Research'), _lt('Draft'), _lt('Final Document')], get description() { - return markup(renderToString("project.example.researchproject")); + return renderToMarkup("project.example.researchproject"); }, bullets: [greenBullet, redBullet], }, { name: _lt('Website Redesign'), columns: [_lt('Page Ideas'), _lt('Copywriting'), _lt('Design'), _lt('Live')], get description() { - return markup(renderToString("project.example.researchproject")); + return renderToMarkup("project.example.researchproject"); }, }, { name: _lt('T-shirt Printing'), columns: [_lt('New Orders'), _lt('Logo Design'), _lt('To Print'), _lt('Done')], get description() { - return markup(renderToString("project.example.tshirtprinting")); + return renderToMarkup("project.example.tshirtprinting"); }, bullets: [star], }, { name: _lt('Design'), columns: [_lt('New Request'), _lt('Design'), _lt('Client Review'), _lt('Handoff')], get description() { - return markup(renderToString("project.example.generic")); + return renderToMarkup("project.example.generic"); }, bullets: [greenBullet, redBullet, star, clock], }, { name: _lt('Publishing'), columns: [_lt('Ideas'), _lt('Writing'), _lt('Editing'), _lt('Published')], get description() { - return markup(renderToString("project.example.generic")); + return renderToMarkup("project.example.generic"); }, bullets: [greenBullet, redBullet, star, clock], }, { name: _lt('Manufacturing'), columns: [_lt('New Orders'), _lt('Material Sourcing'), _lt('Manufacturing'), _lt('Assembling'), _lt('Delivered')], get description() { - return markup(renderToString("project.example.generic")); + return renderToMarkup("project.example.generic"); }, bullets: [greenBullet, redBullet, star, clock], }, { name: _lt('Podcast and Video Production'), columns: [_lt('Research'), _lt('Script'), _lt('Recording'), _lt('Mixing'), _lt('Published')], get description() { - return markup(renderToString("project.example.generic")); + return renderToMarkup("project.example.generic"); }, bullets: [greenBullet, redBullet, star, clock], }], diff --git a/addons/web/static/src/core/utils/render.js b/addons/web/static/src/core/utils/render.js index 42820e40b24..d5ff1c1a90d 100644 --- a/addons/web/static/src/core/utils/render.js +++ b/addons/web/static/src/core/utils/render.js @@ -1,15 +1,15 @@ /** @odoo-module **/ -const { blockDom } = owl; +const { blockDom, markup } = owl; /** - * loads a template using getTemplate, and render the template immediately; + * renders a template with an (optional) context and returns a Markup string, + * suitable to be inserted in a template with a t-out directive * * @param {string} template * @param {Object} context * @returns string: the html of the template */ - export function renderToString(template, context = {}) { const app = renderToString.app; if (!app) { @@ -21,3 +21,15 @@ export function renderToString(template, context = {}) { blockDom.mount(bdom, div); return div.innerHTML; } + +/** + * renders a template with an (optional) context and returns a Markup string, + * suitable to be inserted in a template with a t-out directive + * + * @param {string} template + * @param {Object} context + * @returns string: the html of the template, as a markup string + */ +export function renderToMarkup(template, context = {}) { + return markup(renderToString(template, context)); +}