From 83429ccec3cd12710e049e7895cb1bcd68166dac Mon Sep 17 00:00:00 2001
From: Shawn Allen <shawnbot@users.noreply.github.com>
Date: Thu, 16 Nov 2023 10:40:34 -0800
Subject: [PATCH] fix(templates): override content + htmlelement components

This is a fix for EPR-1048 that overrides the content getter in
both the "content" and "htmlelement" component classes so
that the input of the interpolation is the translated string.
---
 src/components/content.js     | 18 ++++++++++++++++++
 src/components/htmlelement.js | 17 +++++++++++++++++
 src/components/index.js       |  8 ++++++--
 3 files changed, 41 insertions(+), 2 deletions(-)
 create mode 100644 src/components/content.js
 create mode 100644 src/components/htmlelement.js

diff --git a/src/components/content.js b/src/components/content.js
new file mode 100644
index 00000000..73423120
--- /dev/null
+++ b/src/components/content.js
@@ -0,0 +1,18 @@
+const { content: ContentComponent } = window.Formio.Components.components
+
+export default class Content extends ContentComponent {
+  get content () {
+    const submission = this.root?.submission || {}
+    const html = this.t([`${this.component.key}.html`, this.component.html])
+    // console.warn('[%s] get content(): %s -> %s <-', this.component.type, this.component.html, html, this.rootValue)
+    const content = html
+      ? this.interpolate(html, {
+        metadata: submission.metadata || {},
+        submission: submission,
+        data: this.rootValue,
+        row: this.data
+      })
+      : ''
+    return content || ''
+  }
+}
diff --git a/src/components/htmlelement.js b/src/components/htmlelement.js
new file mode 100644
index 00000000..35fdae1d
--- /dev/null
+++ b/src/components/htmlelement.js
@@ -0,0 +1,17 @@
+const { htmlelement: FormioHTMLElementComponent } = window.Formio.Components.components
+
+export default class HTMLElementComponent extends FormioHTMLElementComponent {
+  get content () {
+    const submission = this.root?.submission || {}
+    const content = this.t([`${this.component.key}.content`, this.component.content])
+    // console.warn('[%s] get content(): %s -> %s <-', this.component.type, this.component.content, content, data)
+    return content
+      ? this.interpolate(content, {
+        metadata: submission.metadata || {},
+        submission,
+        data: this.rootValue,
+        row: this.data
+      })
+      : ''
+  }
+}
diff --git a/src/components/index.js b/src/components/index.js
index 72723675..8c4f0a91 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -1,14 +1,18 @@
 import address from './address'
-import review from './review'
 import columns from './columns'
+import content from './content'
+import htmlelement from './htmlelement'
+import review from './review'
 import signature from './signature'
 import state from './state'
 import zip from './zip'
 
 export default {
   address,
-  review,
   columns,
+  content,
+  htmlelement,
+  review,
   state,
   signature,
   zip