Migrated from TinyMCE editor to Hugerte

ui-ngx/angular.json

@@ -74,8 +74,8 @@
               },
               {
                 "glob": "**/*",
-                "input": "node_modules/tinymce",
-                "output": "/assets/tinymce/"
+                "input": "node_modules/hugerte",
+                "output": "/assets/hugerte/"
               },
               {
                 "glob": "marker-icon-2x.png",

ui-ngx/package.json

@@ -37,8 +37,8 @@
     "@ngx-translate/core": "^17.0.0",
     "@svgdotjs/svg.filter.js": "^3.0.9",
     "@svgdotjs/svg.js": "3.2.4",
+    "@hugerte/hugerte-angular": "^1.1.1",
     "@svgdotjs/svg.panzoom.js": "^2.1.2",
-    "@tinymce/tinymce-angular": "^8.0.1",
     "ace-builds": "1.43.6",
     "ace-diff": "^3.3.0",
     "angular-gridster2": "~20.2.4",
@@ -51,6 +51,7 @@
     "flot.curvedlines": "https://github.com/MichaelZinsmaier/CurvedLines.git#master",
     "font-awesome": "^4.7.0",
     "html2canvas": "^1.4.1",
+    "hugerte": "^1.0.12",
     "jquery": "^3.7.1",
     "jquery.terminal": "^2.45.2",
     "js-beautify": "1.15.4",
@@ -87,7 +88,6 @@
     "split.js": "^1.6.5",
     "systemjs": "6.15.1",
     "tinycolor2": "^1.6.0",
-    "tinymce": "~6.8.6",
     "tooltipster": "^4.2.8",
     "tslib": "^2.8.1",
     "typeface-roboto": "^1.1.13",
@@ -138,7 +138,6 @@
   },
   "resolutions": {
     "ace-builds": "1.43.6",
-    "tinymce": "6.8.6",
     "@babel/core": "7.28.3",
     "esbuild": "0.28.1",
     "vite": "7.3.5",

ui-ngx/src/app/modules/home/pages/mobile/common/editor-panel.component.ts

@@ -17,7 +17,7 @@
 import { Component, EventEmitter, Input, OnInit, Output, ViewEncapsulation } from '@angular/core';
 import { FormBuilder, FormControl } from '@angular/forms';
 import { TbPopoverComponent } from '@shared/components/popover.component';
-import { EditorOptions } from 'tinymce';
+import { EditorOptions } from 'hugerte';
 
 @Component({
     selector: 'tb-release-notes-panel',
@@ -46,7 +46,7 @@ export class EditorPanelComponent implements OnInit {
   editorControl: FormControl<string>;
 
   tinyMceOptions: Partial<EditorOptions> = {
-    base_url: '/assets/tinymce',
+    base_url: '/assets/hugerte',
     suffix: '.min',
     plugins: ['link', 'table', 'image', 'lists', 'fullscreen'],
     menubar: 'edit insert view format',
@@ -56,11 +56,10 @@ export class EditorPanelComponent implements OnInit {
     height: 400,
     autofocus: false,
     branding: false,
-    promotion: false,
     resize: false,
     setup: (editor) => {
       editor.on('PostRender', function() {
-        const container = document.querySelector('.tox.tox-tinymce-aux');
+        const container = document.querySelector('.tox.tox-hugerte-aux');
         const styleSheet = document.createElement('style');
         styleSheet.innerText = `
           .tox-tiered-menu .tox-menu {

ui-ngx/src/app/modules/home/pages/notification/sent/sent-notification-dialog.componet.ts

@@ -79,7 +79,7 @@ export class SentNotificationDialogComponent extends
   showRefresh = false;
 
   tinyMceOptions: Record<string, any> = {
-    base_url: '/assets/tinymce',
+    base_url: '/assets/hugerte',
     suffix: '.min',
     plugins: ['autoresize'],
     menubar: false,
@@ -90,11 +90,10 @@ export class SentNotificationDialogComponent extends
     height: 400,
     autofocus: false,
     branding: false,
-    promotion: false,
     setup: (ed) => {
       ed.on('PreInit', () => {
         const document = $(ed.iframeElement.contentDocument);
-        const body = $('#tinymce', document);
+        const body = $('#hugerte', document);
         body.attr({contenteditable: false});
         body.css('pointerEvents', 'none');
         body.css('userSelect', 'none');

ui-ngx/src/app/modules/home/pages/notification/template/configuration/notification-template-configuration.component.ts

@@ -37,7 +37,7 @@ import { Subject } from 'rxjs';
 import { deepClone, isDefinedAndNotNull } from '@core/utils';
 import { coerceBoolean } from '@shared/decorators/coercion';
 import { TranslateService } from '@ngx-translate/core';
-import { EditorOptions } from 'tinymce';
+import { EditorOptions } from 'hugerte';
 
 @Component({
     selector: 'tb-template-configuration',
@@ -84,7 +84,7 @@ export class NotificationTemplateConfigurationComponent implements OnDestroy, Co
   readonly NotificationTemplateTypeTranslateMap = NotificationTemplateTypeTranslateMap;
 
   tinyMceOptions: Partial<EditorOptions> = {
-    base_url: '/assets/tinymce',
+    base_url: '/assets/hugerte',
     suffix: '.min',
     plugins: ['link', 'table', 'image', 'lists', 'code', 'fullscreen'],
     menubar: 'edit insert tools view format table',
@@ -95,10 +95,9 @@ export class NotificationTemplateConfigurationComponent implements OnDestroy, Co
     height: 400,
     autofocus: false,
     branding: false,
-    promotion: false,
     setup: (editor) => {
       editor.on('PostRender', function() {
-        const container = document.querySelector('.tox.tox-tinymce-aux');
+        const container = document.querySelector('.tox.tox-hugerte-aux');
         const styleSheet = document.createElement('style');
         styleSheet.innerText = `
           .tox-tiered-menu .tox-menu {

ui-ngx/src/app/shared/shared.module.ts

@@ -64,7 +64,7 @@ import { ShareButtonDirective } from 'ngx-sharebuttons';
 import { HotkeyModule } from 'angular2-hotkeys';
 import { ColorPickerModule } from '@iplab/ngx-color-picker';
 import { NgxHmCarouselComponent, NgxHmCarouselDynamicDirective, NgxHmCarouselItemDirective } from 'ngx-hm-carousel';
-import { EditorModule, TINYMCE_SCRIPT_SRC } from '@tinymce/tinymce-angular';
+import { EditorModule, HUGERTE_SCRIPT_SRC } from '@hugerte/hugerte-angular';
 import { UserMenuComponent } from '@shared/components/user-menu.component';
 import { TruncateWithTooltipDirective } from '@shared/directives/truncate-with-tooltip.directive';
 import { ContextMenuDirective } from '@shared/directives/context-menu.directive';
@@ -258,8 +258,8 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService)
       useValue: Flow
     },
     {
-      provide: TINYMCE_SCRIPT_SRC,
-      useValue: 'assets/tinymce/tinymce.min.js'
+      provide: HUGERTE_SCRIPT_SRC,
+      useValue: 'assets/hugerte/hugerte.min.js'
     },
     {
       provide: MAT_DATE_LOCALE,

ui-ngx/src/styles.scss

@@ -1227,9 +1227,9 @@ pre.tb-highlight {
     white-space: pre-line;
   }
 
-  // TinyMCE
+  // HugeRTE
 
-  .tox-tinymce {
+  .tox-hugerte {
     button:not(.mat-mdc-menu-item):not(.mat-sort-header-button) {
       text-transform: none;
     }

ui-ngx/yarn.lock

@@ -1614,6 +1614,19 @@
   resolved "https://registry.yarnpkg.com/@hono/node-server/-/node-server-1.19.11.tgz#dc419f0826dd2504e9fc86ad289d5636a0444e2f"
   integrity sha512-dr8/3zEaB+p0D2n/IUrlPF1HZm586qgJNXK1a9fhg/PzdtkK7Ksd5l312tJX2yBuALqDYBlG20QEbayqPyxn+g==
 
+"@hugerte/framework-integration-shared@^1.0.1":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@hugerte/framework-integration-shared/-/framework-integration-shared-1.2.0.tgz#75f04e4249bbb2c314d1f7a962b9c2f5fed7db80"
+  integrity sha512-ogcvVO0dFcb/HQAY7itj8xnmeMcHZmtMaOj9uC34ZYopnvj12TGWnfRQwbt8jZMlmoZk2z1TTLmJgvQBuH013A==
+
+"@hugerte/hugerte-angular@^1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@hugerte/hugerte-angular/-/hugerte-angular-1.1.1.tgz#08b2c963d66d7a754e8cd4884b9111ca166781e7"
+  integrity sha512-ubh6ZG3+dU6g3BkS2ZHx0FO46nti6N2CpN2gG/URFtF+pau/V59N94E7w7+8VeoPjqsFRpjB6zefRGNUoTJLOA==
+  dependencies:
+    "@hugerte/framework-integration-shared" "^1.0.1"
+    tslib "^2.3.0"
+
 "@humanfs/core@^0.19.1":
   version "0.19.1"
   resolved "https://registry.yarnpkg.com/@humanfs/core/-/core-0.19.1.tgz#17c55ca7d426733fe3c561906b8173c336b40a77"
@@ -2824,14 +2837,6 @@
   dependencies:
     "@svgdotjs/svg.js" "^3.0.16"
 
-"@tinymce/tinymce-angular@^8.0.1":
-  version "8.0.1"
-  resolved "https://registry.yarnpkg.com/@tinymce/tinymce-angular/-/tinymce-angular-8.0.1.tgz#a17b4a5bef87d563e63dc442ffeb4b82d2137da3"
-  integrity sha512-m0/ne5nL00YeZ7wCyhBVwKUbvS8fQZ+S+T5pinqTIqTUKpcfIC2+BIKqzUpS+niiRCowFoZl5eVlI5zdFN9/0A==
-  dependencies:
-    tinymce "^7.0.0 || ^6.0.0 || ^5.5.0"
-    tslib "^2.3.0"
-
 "@tsconfig/node10@^1.0.7":
   version "1.0.11"
   resolved "https://registry.yarnpkg.com/@tsconfig/node10/-/node10-1.0.11.tgz#6ee46400685f130e278128c7b38b7e031ff5b2f2"
@@ -6689,6 +6694,11 @@ https-proxy-agent@7.0.6, https-proxy-agent@^7.0.1:
     agent-base "^7.1.2"
     debug "4"
 
+hugerte@^1.0.12:
+  version "1.0.12"
+  resolved "https://registry.yarnpkg.com/hugerte/-/hugerte-1.0.12.tgz#84337116bd7e76c39e851a51d5dc0214af9882b8"
+  integrity sha512-/JDCdJy1C83a7+RjlfWx6EjRvxqmmHFA5Pzcq8Y0ngdBESiC+2xa4ogsqnRPeadF04Cs95YfTd1SKquDdksjRw==
+
 hyperdyperid@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/hyperdyperid/-/hyperdyperid-1.2.0.tgz#59668d323ada92228d2a869d3e474d5a33b69e6b"
@@ -8059,7 +8069,7 @@ mz@^2.7.0:
     object-assign "^4.0.1"
     thenify-all "^1.0.0"
 
-nanoid@^3.3.11, nanoid@^3.3.16:
+nanoid@^3.3.16:
   version "3.3.18"
   resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.18.tgz#f66a2de1199ffde0fcf21c8a5f13106b1c081913"
   integrity sha512-DTg4MJbGMWkfi6VZFdNt2/caMbQy4Ou+Op/hJQvGEWcnVfoA1QA+xzRKAzw9jD6+GVOOeYr/mIcuDSdug6F6+w==
@@ -10199,11 +10209,6 @@ tinyglobby@^0.2.11, tinyglobby@^0.2.12, tinyglobby@^0.2.15:
     fdir "^6.5.0"
     picomatch "^4.0.3"
 
-tinymce@6.8.6, "tinymce@^7.0.0 || ^6.0.0 || ^5.5.0", tinymce@~6.8.6:
-  version "6.8.6"
-  resolved "https://registry.yarnpkg.com/tinymce/-/tinymce-6.8.6.tgz#799e4f03eeb4399399dfdeb12ba17b3b91887adf"
-  integrity sha512-++XYEs8lKWvZxDCjrr8Baiw7KiikraZ5JkLMg6EdnUVNKJui0IsrAADj5MsyUeFkcEryfn2jd3p09H7REvewyg==
-
 tinyqueue@^2.0.0:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/tinyqueue/-/tinyqueue-2.0.3.tgz#64d8492ebf39e7801d7bd34062e29b45b2035f08"