From 16b1065a518075dbca147007d6527c5b6f255969 Mon Sep 17 00:00:00 2001
From: Philip Molares <philip.molares@udo.edu>
Date: Sun, 15 Jan 2023 19:32:15 +0100
Subject: [PATCH] feat(frontend): add fork awesome linter

This linter will tell users that their fork awesome icon is deprecated and will stop working in the future and that they should replace it with a new bootstrap icon.

Signed-off-by: Philip Molares <philip.molares@udo.edu>
---
 frontend/CHANGELOG.md                         |  1 +
 frontend/locales/en.json                      |  2 +-
 .../linter/single-line-regex-linter.ts        | 33 ++++++++++---------
 .../fork-awesome-app-extension.ts             |  2 +-
 4 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/frontend/CHANGELOG.md b/frontend/CHANGELOG.md
index c8c747d90..4dd31c998 100644
--- a/frontend/CHANGELOG.md
+++ b/frontend/CHANGELOG.md
@@ -19,6 +19,7 @@ SPDX-License-Identifier: CC-BY-SA-4.0
     - `{%pdf https://example.org/example-pdf.pdf %}` -> Embedding removed
 - The use of `sequence` as code block language ([Why?](https://github.com/hedgedoc/react-client/issues/488#issuecomment-683262875))
 - Comma-separated definition of tags in the yaml-frontmatter
+- Fork Awesome Icons will be removed in a future release
 
 ### Removed
 
diff --git a/frontend/locales/en.json b/frontend/locales/en.json
index 21374de11..cc00edf7b 100644
--- a/frontend/locales/en.json
+++ b/frontend/locales/en.json
@@ -223,7 +223,7 @@
       "shortcode": "The {{shortcode}} short-code is deprecated and will be removed in a future release. Use a single line URL instead.",
       "frontmatter": "The yaml-metadata is invalid.",
       "frontmatter-tags": "The comma-separated definition of tags in the yaml-metadata is deprecated. Use a yaml-array instead.",
-      "fork-awesome": "Fork Awesome is deprecated and will be removed in future release. Please use the new bootstrap icons instead. See {{link}} for more information."
+      "fork-awesome": "Fork Awesome is deprecated and will be removed in a future release. Please use bootstrap icons instead. See {{link}} for more information."
     },
     "upload": {
       "uploadFile": {
diff --git a/frontend/src/components/editor-page/editor-pane/linter/single-line-regex-linter.ts b/frontend/src/components/editor-page/editor-pane/linter/single-line-regex-linter.ts
index d8d826128..726f33a54 100644
--- a/frontend/src/components/editor-page/editor-pane/linter/single-line-regex-linter.ts
+++ b/frontend/src/components/editor-page/editor-pane/linter/single-line-regex-linter.ts
@@ -51,25 +51,28 @@ export class SingleLineRegexLinter implements Linter {
       .map(({ lineStartIndex, regexResult }) => this.createDiagnostic(lineStartIndex, regexResult as RegExpExecArray))
   }
 
-  private createDiagnostic(from: number, found: RegExpExecArray): Diagnostic {
-    let actions: Action[] = []
-    if (this.replace !== undefined) {
-      const replacedText = this.replace(found[1])
-      actions = [
-        {
-          name: t(this.actionLabel ?? 'editor.linter.defaultAction'),
-          apply: (view: EditorView, from: number, to: number) => {
-            view.dispatch({
-              changes: { from, to, insert: replacedText }
-            })
-          }
-        }
-      ]
+  private buildActions(found: RegExpExecArray): Action[] {
+    if (this.replace === undefined) {
+      return []
     }
+    const replacedText = this.replace(found[1])
+    return [
+      {
+        name: t(this.actionLabel ?? 'editor.linter.defaultAction'),
+        apply: (view: EditorView, from: number, to: number) => {
+          view.dispatch({
+            changes: { from, to, insert: replacedText }
+          })
+        }
+      }
+    ]
+  }
+
+  private createDiagnostic(from: number, found: RegExpExecArray): Diagnostic {
     return {
       from: from,
       to: from + found[0].length,
-      actions: actions,
+      actions: this.buildActions(found),
       message: this.message,
       severity: 'warning'
     }
diff --git a/frontend/src/extensions/extra-integrations/fork-awesome/fork-awesome-app-extension.ts b/frontend/src/extensions/extra-integrations/fork-awesome/fork-awesome-app-extension.ts
index b01f5185c..1dcd975ed 100644
--- a/frontend/src/extensions/extra-integrations/fork-awesome/fork-awesome-app-extension.ts
+++ b/frontend/src/extensions/extra-integrations/fork-awesome/fork-awesome-app-extension.ts
@@ -8,7 +8,7 @@ import { SingleLineRegexLinter } from '../../../components/editor-page/editor-pa
 import { AppExtension } from '../../base/app-extension'
 import { t } from 'i18next'
 
-export const forkAwesomeRegex = /<i class=["']fa fa-[\w-]+["'](?: aria-hidden=["']true["'])?\/?>(?:<\/i>)?/
+const forkAwesomeRegex = /<i class=["'][\w\s]*fa-[\w-]+[\w\s-]*["'][^>]*\/?>(?:<\/i>)?/
 
 /**
  * Adds support for flow charts to the markdown rendering.