From 8456b2e2a0c39557ac8b430cf077f6c1ca9302b0 Mon Sep 17 00:00:00 2001
From: Jonathon Herbert <jonathon.herbert@guardian.co.uk>
Date: Tue, 5 Nov 2024 18:06:04 +0000
Subject: [PATCH] Add rule type to table

---
 .../client/src/ts/components/RuleContent.tsx    |  8 ++++++--
 .../client/src/ts/components/hooks/useRule.ts   |  1 +
 .../ts/components/table/PaginatedRulesTable.tsx | 17 ++++++++++++++++-
 3 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/apps/rule-manager/client/src/ts/components/RuleContent.tsx b/apps/rule-manager/client/src/ts/components/RuleContent.tsx
index 1c3755361..7f711a3a8 100644
--- a/apps/rule-manager/client/src/ts/components/RuleContent.tsx
+++ b/apps/rule-manager/client/src/ts/components/RuleContent.tsx
@@ -33,13 +33,17 @@ export const ruleTypeOptions: RuleTypeOption[] = [
 		id: 'regex',
 		label: 'Regex',
 	},
+	{
+		id: 'dictionary',
+		label: 'Dictionary',
+	},
 	{
 		id: 'languageToolXML',
 		label: 'LanguageTool',
 	},
 	{
-		id: 'dictionary',
-		label: 'Dictionary',
+		id: 'languageToolCore',
+		label: 'LT built-in',
 	},
 ];
 
diff --git a/apps/rule-manager/client/src/ts/components/hooks/useRule.ts b/apps/rule-manager/client/src/ts/components/hooks/useRule.ts
index cdb6d7926..3972c46d4 100644
--- a/apps/rule-manager/client/src/ts/components/hooks/useRule.ts
+++ b/apps/rule-manager/client/src/ts/components/hooks/useRule.ts
@@ -26,6 +26,7 @@ export type BaseRule = {
 	updatedBy: string;
 	updatedAt: string;
 	id?: number;
+	externalId?: string;
 	isArchived: boolean;
 	isPublished: boolean;
 	hasUnpublishedChanges: boolean;
diff --git a/apps/rule-manager/client/src/ts/components/table/PaginatedRulesTable.tsx b/apps/rule-manager/client/src/ts/components/table/PaginatedRulesTable.tsx
index eb9c8fc53..768965d50 100644
--- a/apps/rule-manager/client/src/ts/components/table/PaginatedRulesTable.tsx
+++ b/apps/rule-manager/client/src/ts/components/table/PaginatedRulesTable.tsx
@@ -26,6 +26,7 @@ import { TagsContext } from '../context/tags';
 import { EuiDataGridToolBarVisibilityOptions } from '@elastic/eui/src/components/datagrid/data_grid_types';
 import { useEuiFontSize } from '@elastic/eui/src/global_styling/mixins/_typography';
 import { useNavigate } from 'react-router-dom';
+import { ruleTypeOptions } from '../RuleContent';
 
 type EditRuleButtonProps = {
 	editIsEnabled: boolean;
@@ -121,6 +122,12 @@ const TestRule = ({
 };
 
 const columns: EuiDataGridColumn[] = [
+	{
+		id: 'ruleType',
+		display: 'Rule type',
+		isSortable: true,
+		initialWidth: 120,
+	},
 	{
 		id: 'description',
 		display: 'Description',
@@ -338,7 +345,15 @@ export const PaginatedRulesTable = ({
 				if (!rule || isLoading) {
 					return <EuiSkeletonText />;
 				}
-				return getRuleAtRowIndex(rowIndex)[columnId as keyof BaseRule] || '';
+
+				const value =
+					getRuleAtRowIndex(rowIndex)[columnId as keyof BaseRule] || '';
+
+				if (columnId === 'ruleType') {
+					return ruleTypeOptions.find(({ id }) => id === value)?.label ?? '';
+				}
+
+				return value;
 			},
 		[ruleData, isLoading],
 	);