feat(condo): DOMA-12916 add rich text area in news (#7286)

* feat(condo): DOMA-12914 add markdown editor in news create flow

* feat(condo): DOMA-12916 fix after bot review

* feat(condo): DOMA-12916 enhance news item display and notifications with markdown support

* feat(condo): DOMA-12916 add stripMarkdown utility for processing markdown text

* feat(condo): DOMA-12916 add markdown support in telegram news

* feat(condo): DOMA-12916 migrate news template placeholders from square brackets to angle brackets

* feat(condo): DOMA-12916 fix pointers

* feat(condo): DOMA-12916 consolidate stripMarkdown utility and update dependencies

* feat(condo): DOMA-12916 update stripMarkdown utility to use CommonJS module syntax

* feat(condo): DOMA-12916 update subproject commits for news-greenhouse, news-telegram-api, news-telegram-web, and resident-app

Author: tolmachev21

apps/condo/bin/migrate-news-templates-placeholders.js

@@ -0,0 +1,111 @@
+/**
+ * Migrates old news template placeholders from square brackets to angle brackets.
+ *
+ * Example:
+ *   [address] -> <address>
+ *
+ * Usage:
+ *   yarn workspace @app/condo node bin/migrate-news-templates-placeholders
+ */
+
+const path = require('path')
+
+const { GraphQLApp } = require('@open-keystone/app-graphql')
+
+
+const PROCESS_CHUNK_SIZE = 200
+const SCRIPT_SENDER = { dv: 1, sender: { dv: 1, fingerprint: 'migrate-news-templates-placeholders' } }
+
+function log (message, payload = '') {
+    console.log(message, payload)
+}
+
+function isLinkBracket (text, matchIndex, matchLength) {
+    return text[matchIndex + matchLength] === '('
+}
+
+function replaceSquarePlaceholders (text) {
+    if (!text || text.indexOf('[') === -1) return { updatedText: text, replacementsCount: 0 }
+
+    let replacementsCount = 0
+    const updatedText = text.replace(/\[([^[\]]+?)\]/g, (match, placeholder, offset, source) => {
+        // Keep markdown links untouched: [label](https://...)
+        if (isLinkBracket(source, offset, match.length)) return match
+        replacementsCount += 1
+        return `<${placeholder}>`
+    })
+
+    return { updatedText, replacementsCount }
+}
+
+async function getTemplatesBatch (context, cursorId) {
+    const query = context.adapter.knex('NewsItemTemplate')
+        .select('id', 'title', 'body')
+        .whereNull('deletedAt')
+        .orderBy('id', 'asc')
+        .limit(PROCESS_CHUNK_SIZE)
+
+    if (cursorId) query.andWhere('id', '>', cursorId)
+
+    return query
+}
+
+async function updateTemplate (context, id, title, body) {
+    await context.adapter.knex('NewsItemTemplate')
+        .where({ id })
+        .update({
+            title,
+            body,
+            ...SCRIPT_SENDER,
+            updatedAt: context.adapter.knex.fn.now(),
+        })
+}
+
+async function main () {
+    const resolved = path.resolve('./index.js')
+    const { distDir, keystone, apps } = require(resolved)
+    const graphqlIndex = apps.findIndex(app => app instanceof GraphQLApp)
+
+    await keystone.prepare({ apps: [apps[graphqlIndex]], distDir, dev: true })
+    await keystone.connect()
+
+    const stats = {
+        scanned: 0,
+        updated: 0,
+        titleReplacements: 0,
+        bodyReplacements: 0,
+    }
+
+    let cursorId = null
+    let hasMore = true
+
+    while (hasMore) {
+        const templates = await getTemplatesBatch(keystone, cursorId)
+        hasMore = templates.length === PROCESS_CHUNK_SIZE
+
+        for (const template of templates) {
+            stats.scanned += 1
+            cursorId = template.id
+
+            const { updatedText: title, replacementsCount: titleReplacements } = replaceSquarePlaceholders(template.title)
+            const { updatedText: body, replacementsCount: bodyReplacements } = replaceSquarePlaceholders(template.body)
+
+            if (titleReplacements === 0 && bodyReplacements === 0) continue
+
+            await updateTemplate(keystone, template.id, title, body)
+            stats.updated += 1
+            stats.titleReplacements += titleReplacements
+            stats.bodyReplacements += bodyReplacements
+        }
+
+        log('Processed batch', { cursorId, scanned: stats.scanned, updated: stats.updated })
+    }
+
+    log('Migration completed', stats)
+    process.exit(0)
+}
+
+main().catch((error) => {
+    console.error(error)
+    process.exit(1)
+})

apps/condo/domains/common/constants/featureflags.js

@@ -40,6 +40,7 @@ const UI_AI_REWRITE_TEXT = 'ui-ai-rewrite-text'
 const UI_AI_REWRITE_NEWS_TEXT = 'ui-ai-news-rewrite-text'
 const UI_AI_REWRITE_INCIDENT_TEXT_FOR_RESIDENT = 'ui-ai-rewrite-incident-text-for-resident'
 const UI_AI_CHAT_WITH_CONDO = 'ui-ai-chat-with-condo'
+const UI_NEWS_MARKDOWN = 'ui-news-markdown'
 const SUBSCRIPTIONS = 'subscriptions'
 const ACTIVE_BANKING_SUBSCRIPTION_PLAN_ID = 'active-banking-subscription-plan-id'
 const TICKET_OBSERVERS = 'ticket-observers'
@@ -91,6 +92,7 @@ module.exports = {
     UI_AI_REWRITE_NEWS_TEXT,
     UI_AI_REWRITE_INCIDENT_TEXT_FOR_RESIDENT,
     UI_AI_CHAT_WITH_CONDO,
+    UI_NEWS_MARKDOWN,
     ACTIVE_BANKING_SUBSCRIPTION_PLAN_ID,
     TICKET_OBSERVERS,
     DEFAULT_TRIAL_SUBSCRIPTION_PLAN_ID,

…do/domains/common/utils/stripMarkdown.ts …do/domains/common/utils/stripMarkdown.jsapps/condo/domains/common/utils/stripMarkdown.ts renamed to apps/condo/domains/common/utils/stripMarkdown.js apps/condo/domains/common/utils/stripMarkdown.ts renamed to apps/condo/domains/common/utils/stripMarkdown.js

@@ -1,4 +1,10 @@
-export const stripMarkdown = (input?: string | null): string => {
+/**
+ * Removes basic markdown syntax and returns plain text.
+ *
+ * @param {string | null | undefined} input
+ * @returns {string}
+ */
+const stripMarkdown = (input) => {
     if (!input) {
         return ''
     }
@@ -14,3 +20,5 @@ export const stripMarkdown = (input?: string | null): string => {
         .replaceAll(/\s{2,1000}/g, ' ')
         .trim()
 }
+
+module.exports = { stripMarkdown }

…mains/common/utils/stripMarkdown.spec.ts …mains/common/utils/stripMarkdown.spec.jsapps/condo/domains/common/utils/stripMarkdown.spec.ts renamed to apps/condo/domains/common/utils/stripMarkdown.spec.js apps/condo/domains/common/utils/stripMarkdown.spec.ts renamed to apps/condo/domains/common/utils/stripMarkdown.spec.js

@@ -1,4 +1,4 @@
-import { stripMarkdown } from './stripMarkdown'
+const { stripMarkdown } = require('./stripMarkdown')
 
 describe('stripMarkdown', () => {
     it('returns empty string for empty input', () => {

apps/condo/domains/news/components/NewsForm/BaseNewsForm.tsx

@@ -175,7 +175,7 @@ const FULL_WIDTH_STYLE: React.CSSProperties = { width: '100%' }
 const SMALL_VERTICAL_GUTTER: [Gutter, Gutter] = [0, 24]
 const EXTRA_SMALL_VERTICAL_GUTTER: [Gutter, Gutter] = [0, 10]
 const BIG_HORIZONTAL_GUTTER: [Gutter, Gutter] = [50, 0]
-const ALL_SQUARE_BRACKETS_OCCURRENCES_REGEX = /\[[^\]]*?\]/g
+const ANGLE_BRACKETS_REGEX = /<[^>]*?>/
 const ADDITIONAL_DISABLED_MINUTES_COUNT = 5
 const DATE_FORMAT = 'DD MMMM YYYY HH:mm'
 
@@ -209,19 +209,19 @@ const getValidBeforeAfterSendAt = (form) => {
     return true
 }
 
-const containWordsInSquareBrackets = (str) => {
-    const words = str.match(ALL_SQUARE_BRACKETS_OCCURRENCES_REGEX) || []
-    return words.length !== 0
+const containTemplatePlaceholders = (str?: string) => {
+    if (!str) return false
+    return ANGLE_BRACKETS_REGEX.test(str)
 }
 
 const getTitleTemplateChanged = (form) => {
     const { title } = form.getFieldsValue(['title'])
-    return !containWordsInSquareBrackets(title)
+    return !containTemplatePlaceholders(title)
 }
 
 const getBodyTemplateChanged = (form) => {
     const { body } = form.getFieldsValue(['body'])
-    return !containWordsInSquareBrackets(body)
+    return !containTemplatePlaceholders(body)
 }
 
 const isDateDisabled = date => {

apps/condo/domains/news/components/NewsForm/InputStep/InputStepForm.module.css

@@ -17,12 +17,3 @@
     display: none;
   }
 }
-
-.custom-form-item-label {
-  padding-bottom: 8px !important;
-}
-
-.custom-form-item-label label {
-  height: auto !important;
-  white-space: nowrap !important;
-}