diff --git a/frontend/src/components/EmailContent.vue b/frontend/src/components/EmailContent.vue
index f68ea6b6..17b2778a 100644
--- a/frontend/src/components/EmailContent.vue
+++ b/frontend/src/components/EmailContent.vue
@@ -27,6 +27,72 @@ const files = import.meta.globEager('/src/index.css', { query: '?inline' })
const css = files['/src/index.css'].default
const iframeRef = ref(null)
+const _content = ref(props.content)
+
+const parser = new DOMParser()
+const doc = parser.parseFromString(_content.value, 'text/html')
+
+const replyToContent = doc.querySelectorAll('p.reply-to-content')
+
+if (replyToContent.length) {
+ _content.value = parseReplyToContent(doc)
+}
+
+function parseReplyToContent(doc) {
+ function handleAllInstances(doc) {
+ const replyToContentElements = doc.querySelectorAll('p.reply-to-content')
+ if (replyToContentElements.length === 0) {
+ return
+ }
+ const replyToContentElement = replyToContentElements[0]
+ replaceReplyToContent(replyToContentElement)
+ handleAllInstances(doc)
+ }
+
+ handleAllInstances(doc)
+
+ return doc.body.innerHTML
+}
+
+function replaceReplyToContent(replyToContentElement) {
+ let randomId = Math.random().toString(36).substring(2, 7)
+ const wrapper = doc.createElement('div')
+ wrapper.classList.add('replied-content')
+
+ const collapseLabel = doc.createElement('label')
+ collapseLabel.classList.add('collapse')
+ collapseLabel.setAttribute('for', randomId)
+ collapseLabel.innerHTML = '...'
+ wrapper.appendChild(collapseLabel)
+
+ const collapseInput = doc.createElement('input')
+ collapseInput.setAttribute('id', randomId)
+ collapseInput.setAttribute('class', 'replyCollapser')
+ collapseInput.setAttribute('type', 'checkbox')
+ wrapper.appendChild(collapseInput)
+
+ const allSiblings = Array.from(replyToContentElement.parentElement.children)
+ const replyToContentIndex = allSiblings.indexOf(replyToContentElement)
+ const followingSiblings = allSiblings.slice(replyToContentIndex + 1)
+
+ let clonedFollowingSiblings = followingSiblings.map((sibling) =>
+ sibling.cloneNode(true),
+ )
+
+ const div = doc.createElement('div')
+ div.append(...clonedFollowingSiblings)
+
+ wrapper.append(div)
+
+ for (let i = replyToContentIndex + 1; i < allSiblings.length; i++) {
+ replyToContentElement.parentElement.removeChild(allSiblings[i])
+ }
+
+ replyToContentElement.parentElement.replaceChild(
+ wrapper,
+ replyToContentElement,
+ )
+}
const htmlContent = `
@@ -35,6 +101,35 @@ const htmlContent = `
- ${props.content}
+ ${_content.value}