diff --git a/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/Extensions/index.ts b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/Extensions/index.ts
index 74c796f93d62..008f1565a9a2 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/Extensions/index.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/Extensions/index.ts
@@ -34,6 +34,7 @@ import { mentionSuggestion } from './mention/mentionSuggestions';
import slashCommand from './slash-command';
import { getSuggestionItems } from './slash-command/items';
import renderItems from './slash-command/renderItems';
+import TextHighlightView from './text-highlight-view';
import { TrailingNode } from './trailing-node';
export const extensions = [
@@ -112,6 +113,7 @@ export const extensions = [
suggestion: hashtagSuggestion(),
}),
DiffView,
+ TextHighlightView,
Image.configure({
allowBase64: true,
inline: true,
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/Extensions/text-highlight-view.ts b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/Extensions/text-highlight-view.ts
new file mode 100644
index 000000000000..e66503922771
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/components/BlockEditor/Extensions/text-highlight-view.ts
@@ -0,0 +1,77 @@
+/*
+ * Copyright 2025 Collate.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { Node } from '@tiptap/core';
+
+export default Node.create({
+ name: 'textHighLightView',
+ content: 'inline*',
+ group: 'inline',
+ inline: true,
+
+ addAttributes() {
+ return {
+ class: {
+ default: '',
+ },
+ 'data-testid': {
+ default: '',
+ parseHTML: (element) => element.getAttribute('data-testid'),
+ renderHTML: (attributes) => {
+ if (!attributes['data-testid']) {
+ return {};
+ }
+
+ return {
+ 'data-testid': attributes['data-testid'],
+ };
+ },
+ },
+ 'data-highlight': {
+ default: true,
+ parseHTML: (element) => element.getAttribute('data-highlight'),
+ renderHTML: (attributes) => {
+ if (!attributes['data-highlight']) {
+ return {};
+ }
+
+ return {
+ 'data-highlight': attributes['data-highlight'],
+ };
+ },
+ },
+ };
+ },
+
+ parseHTML() {
+ return [
+ {
+ tag: 'span[data-highlight]',
+ },
+ ];
+ },
+
+ renderHTML({ HTMLAttributes, node }) {
+ const textHighlightNode = document.createElement('span');
+
+ Object.keys(HTMLAttributes).forEach((key) => {
+ textHighlightNode.setAttribute(key, HTMLAttributes[key]);
+ });
+
+ textHighlightNode.setAttribute('data-highlight', 'true');
+ textHighlightNode.innerHTML = node.textContent;
+
+ return {
+ dom: textHighlightNode,
+ };
+ },
+});
diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
index f8d7a36b833f..cbd2d8ee75fc 100644
--- a/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
@@ -2404,7 +2404,10 @@ export const highlightSearchText = (
const regex = new RegExp(`(${searchText})`, 'gi');
- return text.replace(regex, `$1`);
+ return text.replace(
+ regex,
+ `$1`
+ );
};
/**
diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/mocks/EntityUtils.mock.ts b/openmetadata-ui/src/main/resources/ui/src/utils/mocks/EntityUtils.mock.ts
index 7d6a4a520e7d..842e91f513d7 100644
--- a/openmetadata-ui/src/main/resources/ui/src/utils/mocks/EntityUtils.mock.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/mocks/EntityUtils.mock.ts
@@ -143,4 +143,4 @@ export const mockText =
export const mockSearchText = 'test';
export const mockHighlightedResult =
- 'This is a test description to verify highlightText method.';
+ 'This is a test description to verify highlightText method.';