diff --git a/src/renderer/components/virtual-table/cells/note-cell.tsx b/src/renderer/components/virtual-table/cells/note-cell.tsx new file mode 100644 index 00000000..1191d597 --- /dev/null +++ b/src/renderer/components/virtual-table/cells/note-cell.tsx @@ -0,0 +1,47 @@ +import type { ICellRendererParams } from '@ag-grid-community/core'; +import { Skeleton } from '/@/renderer/components/skeleton'; +import { CellContainer } from '/@/renderer/components/virtual-table/cells/generic-cell'; +import { useMemo } from 'react'; +import { Text } from '/@/renderer/components/text'; + +const URL_REGEX = + /((?:https?:\/\/)?(?:[\w-]{1,32}(?:\.[\w-]{1,32})+)(?:\/[\w\-./?%&=][^.|^\s]*)?)/g; + +const replaceURLWithHTMLLinks = (text: string) => { + const urlRegex = new RegExp(URL_REGEX, 'g'); + return text.replaceAll( + urlRegex, + (url) => `${url}`, + ); +}; + +export const NoteCell = ({ value }: ICellRendererParams) => { + const formattedValue = useMemo(() => { + if (!value) { + return ''; + } + + return replaceURLWithHTMLLinks(value); + }, [value]); + + if (value === undefined) { + return ( + + + + ); + } + + return ( + + + + ); +}; diff --git a/src/renderer/components/virtual-table/index.tsx b/src/renderer/components/virtual-table/index.tsx index e343d521..f59ec520 100644 --- a/src/renderer/components/virtual-table/index.tsx +++ b/src/renderer/components/virtual-table/index.tsx @@ -36,6 +36,7 @@ import { TablePagination } from '/@/renderer/components/virtual-table/table-pagi import { ActionsCell } from '/@/renderer/components/virtual-table/cells/actions-cell'; import { TitleCell } from '/@/renderer/components/virtual-table/cells/title-cell'; import { useFixedTableHeader } from '/@/renderer/components/virtual-table/hooks/use-fixed-table-header'; +import { NoteCell } from '/@/renderer/components/virtual-table/cells/note-cell'; export * from './table-config-dropdown'; export * from './table-pagination'; @@ -150,7 +151,7 @@ const tableColumns: { [key: string]: ColDef } = { width: 100, }, comment: { - cellRenderer: GenericCell, + cellRenderer: NoteCell, colId: TableColumn.COMMENT, headerName: 'Note', valueGetter: (params: ValueGetterParams) => (params.data ? params.data.comment : undefined),