diff --git a/catalog-rest-service/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx b/catalog-rest-service/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx index 5a1a6343c8d..2e4c8a64765 100644 --- a/catalog-rest-service/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx +++ b/catalog-rest-service/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx @@ -18,6 +18,7 @@ import React, { FunctionComponent } from 'react'; import { Link } from 'react-router-dom'; import { getDatasetDetailsPath } from '../../../constants/constants'; +import { stringToHTML } from '../../../utils/StringsUtils'; import { getUsagePercentile } from '../../../utils/TableUtils'; import TableDataCardBody from './TableDataCardBody'; @@ -59,7 +60,7 @@ const TableDataCard: FunctionComponent = ({
diff --git a/catalog-rest-service/src/main/resources/ui/src/components/searched-data/SearchedData.tsx b/catalog-rest-service/src/main/resources/ui/src/components/searched-data/SearchedData.tsx index 36b9c3f50f6..51d61f41192 100644 --- a/catalog-rest-service/src/main/resources/ui/src/components/searched-data/SearchedData.tsx +++ b/catalog-rest-service/src/main/resources/ui/src/components/searched-data/SearchedData.tsx @@ -15,6 +15,7 @@ * limitations under the License. */ +import { isEmpty } from 'lodash'; import { FormatedTableData } from 'Models'; import PropTypes from 'prop-types'; import React, { ReactNode } from 'react'; @@ -54,6 +55,38 @@ const SearchedData: React.FC = ({ totalValue, fetchLeftPanel, }) => { + const highlightSearchResult = () => { + return data.map((table, index) => { + const description = isEmpty(table.highlight?.description) + ? table.description + : table.highlight?.description.join(' '); + + const name = isEmpty(table.highlight?.table_name) + ? table.name + : table.highlight?.table_name.join(' ') || table.name; + + return ( +
+ +
+ ); + }); + }; + return ( <> @@ -72,27 +105,7 @@ const SearchedData: React.FC = ({ ) : null} {data.length > 0 ? (
- {data.map((table, index) => ( -
- -
- ))} - + {highlightSearchResult()} {totalValue > PAGE_SIZE && data.length > 0 && ( { newData.tableEntity = hit._source.table_entity; newData.tier = hit._source.tier; newData.owner = hit._source.owner; + newData.highlight = hit.highlight; return newData; }); diff --git a/catalog-rest-service/src/main/resources/ui/tailwind.config.js b/catalog-rest-service/src/main/resources/ui/tailwind.config.js index c3d19aea158..3d7a71c4e70 100644 --- a/catalog-rest-service/src/main/resources/ui/tailwind.config.js +++ b/catalog-rest-service/src/main/resources/ui/tailwind.config.js @@ -30,6 +30,7 @@ const success = '#51C41A'; const error = '#FF4C3B'; const info = '#1890FF'; const warning = '#FFC34E'; +const warningBG = '#FFC34E40'; // Background colors const bodyBG = '#FCFBFE'; @@ -89,6 +90,7 @@ module.exports = { success: success, error: error, warning: warning, + 'warning-lite': warningBG, info: info, }, fontFamily: {