Fix tag inconsistencies

stusherwin · stusherwin · commit 160c7759ab4a · 2025-11-29T10:02:38.000Z
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Persons/PersonDetail/Qualifications.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Persons/PersonDetail/Qualifications.cshtml
@@ -23,12 +23,6 @@ else
 {
     @foreach (var professionalStatus in Model.ProfessionalStatuses)
     {
-        var statusTitle = ProfessionalStatusStatusRegistry.GetTitle(professionalStatus.Status).ToUpper();
-        var statusColor = professionalStatus.Status switch {
-            RouteToProfessionalStatusStatus.Holds => "green",
-            RouteToProfessionalStatusStatus.InTraining => "light-blue",
-            _ => "red"
-        };
         var cardTitle = $"{professionalStatus.RouteToProfessionalStatusType?.ProfessionalStatusType.GetDisplayName()}";
 
             <govuk-summary-card data-testid="professionalstatus-@professionalStatus.QualificationId">
@@ -48,9 +42,18 @@ else
                     <govuk-summary-list-row>
                         <govuk-summary-list-row-key>Status</govuk-summary-list-row-key>
                         <govuk-summary-list-row-value>
-                            <govuk-tag class="govuk-tag--@statusColor">
-                                @statusTitle
-                            </govuk-tag>
+                            @{
+                                var statusColor = professionalStatus.Status switch {
+                                    RouteToProfessionalStatusStatus.Holds => TagColor.Green,
+                                    RouteToProfessionalStatusStatus.InTraining => TagColor.LightBlue,
+                                    RouteToProfessionalStatusStatus.Withdrawn => TagColor.Grey,
+                                    RouteToProfessionalStatusStatus.Failed => TagColor.Red,
+                                    _ => TagColor.Turquoise
+                                };
+                            }
+                            <tag color="@statusColor">
+                                @ProfessionalStatusStatusRegistry.GetTitle(professionalStatus.Status)
+                            </tag>
                         </govuk-summary-list-row-value>
                     </govuk-summary-list-row>
                     @if (QuestionDriverHelper.FieldRequired(professionalStatus.RouteToProfessionalStatusType!.TrainingStartDateRequired, professionalStatus.Status.GetStartDateRequirement()) != FieldRequirement.NotApplicable)
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Persons/PersonDetail/Timeline/Events/ApiTrnRequestSupportTaskUpdatedEvent.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Persons/PersonDetail/Timeline/Events/ApiTrnRequestSupportTaskUpdatedEvent.cshtml
@@ -92,7 +92,7 @@
                         <govuk-summary-list-row-value>
                             @if (applicationUser is not null)
                             {
-                                <colored-tag>@applicationUser.Name</colored-tag>
+                                <tag color="TagColor.Auto">@applicationUser.Name</tag>
                             }
                             else
                             {
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Persons/PersonDetail/Timeline/Events/NpqTrnRequestSupportTaskResolvedEvent.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Persons/PersonDetail/Timeline/Events/NpqTrnRequestSupportTaskResolvedEvent.cshtml
@@ -123,7 +123,7 @@
                         <govuk-summary-list-row-value>
                             @if (applicationUser is not null)
                             {
-                                <colored-tag>@applicationUser.Name</colored-tag>
+                                <tag color="TagColor.Auto">@applicationUser.Name</tag>
                             }
                             else
                             {
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Shared/_PersonDetail.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Shared/_PersonDetail.cshtml
@@ -62,18 +62,13 @@
             <govuk-summary-list-row>
                 <govuk-summary-list-row-key>Status</govuk-summary-list-row-key>
                 <govuk-summary-list-row-value use-empty-fallback>
-                    @if (Model.IsActive == true)
+                    @if (Model.IsActive == false)
                     {
-                        <govuk-tag class="govuk-tag--green">
-                            ACTIVE
-                        </govuk-tag>
+                        <tag color="TagColor.Grey">Deactivated</tag>
                     }
-
-                    @if (Model.IsActive == false)
+                    else
                     {
-                        <govuk-tag class="govuk-tag--red">
-                            DEACTIVATED
-                        </govuk-tag>
+                        <tag color="TagColor.Green">Active</tag>
                     }
                 </govuk-summary-list-row-value>
             </govuk-summary-list-row>
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/ApiTrnRequests/Index.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/ApiTrnRequests/Index.cshtml
@@ -77,7 +77,7 @@
                         </th>
                         <td class="govuk-table__cell" data-testid="email">@result.EmailAddress</td>
                         <td class="govuk-table__cell" data-testid="requested-on">@result.CreatedOn.ToString(UiDefaults.DateOnlyDisplayFormat)</td>
-                        <td class="govuk-table__cell" data-testid="source"><colored-tag>@result.SourceApplicationName</colored-tag></td>
+                        <td class="govuk-table__cell" data-testid="source"><tag color="TagColor.Auto">@result.SourceApplicationName</tag></td>
                     </tr>
                 }
                 </tbody>
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/ApiTrnRequests/Resolve/Matches.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/ApiTrnRequests/Resolve/Matches.cshtml
@@ -135,7 +135,7 @@
                                     <govuk-summary-list-row-value>
                                         @foreach (var tag in tags)
                                         {
-                                            <govuk-tag>@tag</govuk-tag>
+                                            <tag>@tag</tag>
                                         }
                                     </govuk-summary-list-row-value>
                                 </govuk-summary-list-row>
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/IntegrationTransactions/Detail.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/IntegrationTransactions/Detail.cshtml
@@ -131,22 +131,22 @@
 
                                     @if (result.Duplicate == true)
                                     {
-                                        <span class="govuk-tag--orange govuk-!-static-padding-1">Duplicate</span>
+                                        <tag color="TagColor.Orange" class="govuk-!-static-padding-1">Duplicate</tag>
                                     }
                                 </td>
                                 <td class="govuk-table__cell"
                                     data-testid="integration-transaction-record:@result.IntegrationTransactionRecordId:status">
                                     @if (result.Status == IntegrationTransactionRecordStatus.Success)
                                     {
-                                        <span class="govuk-tag--green govuk-!-static-padding-1">@result.Status.GetDisplayName()</span>
+                                        <tag color="TagColor.Green" class="govuk-!-static-padding-1">@result.Status.GetDisplayName()</tag>
                                     }
                                     else @if (result.Status == IntegrationTransactionRecordStatus.Warning)
                                     {
-                                        <span class="govuk-tag--yellow govuk-!-static-padding-1">@result.Status.GetDisplayName()</span>
+                                        <tag color="TagColor.Yellow" class="govuk-!-static-padding-1">@result.Status.GetDisplayName()</tag>
                                     }
                                     else @if (result.Status == IntegrationTransactionRecordStatus.Failure)
                                     {
-                                        <span class="govuk-tag--red govuk-!-static-padding-1">@result.Status.GetDisplayName()</span>
+                                        <tag color="TagColor.Red" class="govuk-!-static-padding-1">@result.Status.GetDisplayName()</tag>
                                     }
                                 </td>
                             </tr>
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/IntegrationTransactions/Index.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/IntegrationTransactions/Index.cshtml
@@ -96,15 +96,15 @@
                                 data-testid="integration-transaction:@result.IntegrationTransactionId:importstatus">
                                 @if (result.ImportStatus == IntegrationTransactionImportStatus.Success)
                                 {
-                                    <span class="govuk-tag--green govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</span>
+                                    <tag color="TagColor.Green" class="govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</tag>
                                 }
                                 else @if (result.ImportStatus == IntegrationTransactionImportStatus.InProgress)
                                 {
-                                    <span class="govuk-tag--light-blue govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</span>
+                                    <tag color="TagColor.Blue" class="govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</tag>
                                 }
                                 else
                                 {
-                                    <span class="govuk-tag--red govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</span>
+                                    <tag color="TagColor.Red" class="govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</tag>
                                 }
                             </td>
 
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/NpqTrnRequests/Details.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/NpqTrnRequests/Details.cshtml
@@ -20,7 +20,7 @@
                 <govuk-summary-list>
                     <govuk-summary-list-row>
                         <govuk-summary-list-row-key>Source</govuk-summary-list-row-key>
-                        <govuk-summary-list-row-value use-empty-fallback><colored-tag>@Model.SourceApplicationUserName</colored-tag></govuk-summary-list-row-value>
+                        <govuk-summary-list-row-value use-empty-fallback><tag color="TagColor.Auto">@Model.SourceApplicationUserName</tag></govuk-summary-list-row-value>
                     </govuk-summary-list-row>
                     <govuk-summary-list-row>
                         <govuk-summary-list-row-key>Name</govuk-summary-list-row-key>
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/NpqTrnRequests/Index.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/NpqTrnRequests/Index.cshtml
@@ -68,8 +68,7 @@
                 <tbody class="govuk-table__body">
                 @foreach (var result in Model.Results)
                 {
-                    var tagValue = result.PotentialDuplicate.HasValue ? (result.PotentialDuplicate.Value ? "Yes" : "No") : null;
-                    var tagClass = result.PotentialDuplicate.HasValue ? (result.PotentialDuplicate.Value ? "govuk-tag--red" : "govuk-tag--green") : null;
+                    (var tagValue, var tagColor) = result.PotentialDuplicate is true ? ("Yes", TagColor.Yellow) : ("No", TagColor.Green);
                     <tr class="govuk-table__row" data-testid="task:@result.SupportTaskReference">
                         <th scope="row" class="govuk-table__header" data-testid="name">
                             <a href="@LinkGenerator.SupportTasks.NpqTrnRequests.Details(result.SupportTaskReference)" class="govuk-link">
@@ -78,7 +77,7 @@
                         </th>
                         <td class="govuk-table__cell" data-testid="email">@result.EmailAddress</td>
                         <td class="govuk-table__cell" data-testid="requested-on">@result.CreatedOn.ToString(UiDefaults.DateTimeDisplayFormat)</td>
-                        <td class="govuk-table__cell" data-testid="potential-duplicate"><colored-tag class="@tagClass">@tagValue</colored-tag></td>
+                        <td class="govuk-table__cell" data-testid="potential-duplicate"><tag color="@tagColor">@tagValue</tag></td>
                     </tr>
                 }
                 </tbody>
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/NpqTrnRequests/Resolve/Matches.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/NpqTrnRequests/Resolve/Matches.cshtml
@@ -141,7 +141,7 @@
                                     <govuk-summary-list-row-value>
                                         @foreach (var tag in tags)
                                         {
-                                            <govuk-tag>@tag</govuk-tag>
+                                            <tag>@tag</tag>
                                         }
                                     </govuk-summary-list-row-value>
                                 </govuk-summary-list-row>
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/TrnRequestManualChecksNeeded/Index.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/SupportTasks/TrnRequestManualChecksNeeded/Index.cshtml
@@ -99,7 +99,7 @@
                                     </th>
                                     <td class="govuk-table__cell" data-testid="created-on">@result.CreatedOn.ToGmt().ToString(UiDefaults.DateOnlyDisplayFormat)</td>
                                     <td class="govuk-table__cell" data-testid="date-of-birth">@result.DateOfBirth.ToString(UiDefaults.DateOnlyDisplayFormat)</td>
-                                    <td class="govuk-table__cell" data-testid="source"><colored-tag>@result.SourceApplicationName</colored-tag></td>
+                                    <td class="govuk-table__cell" data-testid="source"><tag color="TagColor.Auto">@result.SourceApplicationName</tag></td>
                                 </tr>
                             }
                         }
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Users/AddUser/Confirm.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Users/AddUser/Confirm.cshtml
@@ -52,25 +52,19 @@
                                             {
                                                 case UserPermissionLevel.Edit:
                                                     <td class="govuk-table__cell">
-                                                        <govuk-tag class="govuk-tag--green">
-                                                        EDIT
-                                                        </govuk-tag>
+                                                        <tag color="TagColor.Green">Edit</tag>
                                                     </td>
                                                     break;
 
                                                 case UserPermissionLevel.View:
                                                     <td class="govuk-table__cell">
-                                                        <govuk-tag class="govuk-tag--yellow">
-                                                        VIEW
-                                                        </govuk-tag>
+                                                        <tag color="TagColor.LightBlue">View</tag>
                                                     </td>
                                                     break;
 
                                                 default:
                                                     <td class="govuk-table__cell">
-                                                        <govuk-tag class="govuk-tag--red">
-                                                        NO
-                                                        </govuk-tag>
+                                                        <tag color="TagColor.Grey">No</tag>
                                                     </td>
                                                     break;
                                             }
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Users/EditUser/Index.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/Users/EditUser/Index.cshtml
@@ -51,25 +51,19 @@
                                             {
                                                 case UserPermissionLevel.Edit:
                                                     <td class="govuk-table__cell">
-                                                        <govuk-tag class="govuk-tag--green">
-                                                        EDIT
-                                                        </govuk-tag>
+                                                        <tag color="TagColor.Green">Edit</tag>
                                                     </td>
                                                     break;
 
                                                 case UserPermissionLevel.View:
                                                     <td class="govuk-table__cell">
-                                                        <govuk-tag class="govuk-tag--yellow">
-                                                        VIEW
-                                                        </govuk-tag>
+                                                        <tag color="TagColor.LightBlue">View</tag>
                                                     </td>
                                                     break;
 
                                                 default:
                                                     <td class="govuk-table__cell">
-                                                        <govuk-tag class="govuk-tag--red">
-                                                        NO
-                                                        </govuk-tag>
+                                                        <tag color="TagColor.Grey">No</tag>
                                                     </td>
                                                     break;
                                             }
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/_ViewImports.cshtml b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/Pages/_ViewImports.cshtml
@@ -3,6 +3,7 @@
 @using TeachingRecordSystem.Core.Models
 @using TeachingRecordSystem.WebCommon
 @using TeachingRecordSystem.SupportUi
+@using TagColor = TeachingRecordSystem.SupportUi.TagHelpers.TagColor;
 @namespace TeachingRecordSystem.SupportUi.Pages
 @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
 @addTagHelper *, GovUk.Frontend.AspNetCore
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/TagHelpers/ColoredTagHelper.cs b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/TagHelpers/ColoredTagHelper.cs
diff --git a/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/TagHelpers/TagTagHelper.cs b/TeachingRecordSystem/src/TeachingRecordSystem.SupportUi/TagHelpers/TagTagHelper.cs
@@ -0,0 +1,71 @@
+using System.Security.Cryptography;
+using System.Text;
+using System.Text.Encodings.Web;
+using Microsoft.AspNetCore.Mvc.TagHelpers;
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace TeachingRecordSystem.SupportUi.TagHelpers;
+
+[HtmlTargetElement("tag")]
+[OutputElementHint("strong")]
+public class TagTagHelper : TagHelper
+{
+    private static readonly TagColor[] NeutralColors = [TagColor.Purple, TagColor.Turquoise, TagColor.Blue, TagColor.LightBlue];
+
+    [HtmlAttributeName("color")]
+    public TagColor? Color { get; set; }
+
+    public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
+    {
+        var content = await output.GetChildContentAsync();
+
+        var color = Color switch
+        {
+            TagColor.Auto => GenerateColorFromContent(content),
+            TagColor c => c,
+            _ => TagColor.Blue
+        };
+
+        output.TagMode = TagMode.StartTagAndEndTag;
+        output.TagName = "strong";
+        output.AddClass("govuk-tag", HtmlEncoder.Default);
+        output.AddClass(color.GetCssClass(), HtmlEncoder.Default);
+    }
+
+    private TagColor GenerateColorFromContent(TagHelperContent content) => NeutralColors[
+        Math.Abs(
+            BitConverter.ToInt64(SHA256.HashData(Encoding.UTF8.GetBytes(content.ToHtmlString(HtmlEncoder.Default))).AsSpan()[..^8])
+            % NeutralColors.Length)];
+}
+
+public enum TagColor
+{
+    Auto,
+    Blue,
+    Green,
+    Grey,
+    LightBlue,
+    Orange,
+    Pink,
+    Purple,
+    Red,
+    Turquoise,
+    Yellow,
+}
+
+public static class TagColorExtensions
+{
+    public static string GetCssClass(this TagColor tagColor) => tagColor switch
+    {
+        TagColor.Green => "govuk-tag--green",
+        TagColor.Grey => "govuk-tag--grey",
+        TagColor.LightBlue => "govuk-tag--light-blue",
+        TagColor.Orange => "govuk-tag--orange",
+        TagColor.Pink => "govuk-tag--pink",
+        TagColor.Purple => "govuk-tag--purple",
+        TagColor.Red => "govuk-tag--red",
+        TagColor.Turquoise => "govuk-tag--turquoise",
+        TagColor.Yellow => "govuk-tag--yellow",
+        _ => "govuk-tag--blue",
+    };
+}
diff --git a/TeachingRecordSystem/tests/TeachingRecordSystem.SupportUi.Tests/PageTests/Persons/PersonDetail/IndexTests.cs b/TeachingRecordSystem/tests/TeachingRecordSystem.SupportUi.Tests/PageTests/Persons/PersonDetail/IndexTests.cs
diff --git a/TeachingRecordSystem/tests/TeachingRecordSystem.SupportUi.Tests/PageTests/SupportTasks/IntegrationTransactions/IndexTests.cs b/TeachingRecordSystem/tests/TeachingRecordSystem.SupportUi.Tests/PageTests/SupportTasks/IntegrationTransactions/IndexTests.cs

Original file line number	Diff line number	Diff line change
`@@ -92,7 +92,7 @@`
`92`	`92`	`<govuk-summary-list-row-value>`
`93`	`93`	`@if (applicationUser is not null)`
`94`	`94`	`{`
`95`		`- <colored-tag>@applicationUser.Name</colored-tag>`
	`95`	`+ <tag color="TagColor.Auto">@applicationUser.Name</tag>`
`96`	`96`	`}`
`97`	`97`	`else`
`98`	`98`	`{`
Original file line number	Diff line number	Diff line change
`@@ -123,7 +123,7 @@`
`123`	`123`	`<govuk-summary-list-row-value>`
`124`	`124`	`@if (applicationUser is not null)`
`125`	`125`	`{`
`126`		`- <colored-tag>@applicationUser.Name</colored-tag>`
	`126`	`+ <tag color="TagColor.Auto">@applicationUser.Name</tag>`
`127`	`127`	`}`
`128`	`128`	`else`
`129`	`129`	`{`
Original file line number	Diff line number	Diff line change
`@@ -62,18 +62,13 @@`
`62`	`62`	`<govuk-summary-list-row>`
`63`	`63`	`<govuk-summary-list-row-key>Status</govuk-summary-list-row-key>`
`64`	`64`	`<govuk-summary-list-row-value use-empty-fallback>`
`65`		`- @if (Model.IsActive == true)`
	`65`	`+ @if (Model.IsActive == false)`
`66`	`66`	`{`
`67`		`- <govuk-tag class="govuk-tag--green">`
`68`		`- ACTIVE`
`69`		`- </govuk-tag>`
	`67`	`+ <tag color="TagColor.Grey">Deactivated</tag>`
`70`	`68`	`}`
`71`		`-`
`72`		`- @if (Model.IsActive == false)`
	`69`	`+ else`
`73`	`70`	`{`
`74`		`- <govuk-tag class="govuk-tag--red">`
`75`		`- DEACTIVATED`
`76`		`- </govuk-tag>`
	`71`	`+ <tag color="TagColor.Green">Active</tag>`
`77`	`72`	`}`
`78`	`73`	`</govuk-summary-list-row-value>`
`79`	`74`	`</govuk-summary-list-row>`
Original file line number	Diff line number	Diff line change
`@@ -77,7 +77,7 @@`
`77`	`77`	`</th>`
`78`	`78`	`<td class="govuk-table__cell" data-testid="email">@result.EmailAddress</td>`
`79`	`79`	`<td class="govuk-table__cell" data-testid="requested-on">@result.CreatedOn.ToString(UiDefaults.DateOnlyDisplayFormat)</td>`
`80`		`- <td class="govuk-table__cell" data-testid="source"><colored-tag>@result.SourceApplicationName</colored-tag></td>`
	`80`	`+ <td class="govuk-table__cell" data-testid="source"><tag color="TagColor.Auto">@result.SourceApplicationName</tag></td>`
`81`	`81`	`</tr>`
`82`	`82`	`}`
`83`	`83`	`</tbody>`
Original file line number	Diff line number	Diff line change
`@@ -135,7 +135,7 @@`
`135`	`135`	`<govuk-summary-list-row-value>`
`136`	`136`	`@foreach (var tag in tags)`
`137`	`137`	`{`
`138`		`- <govuk-tag>@tag</govuk-tag>`
	`138`	`+ <tag>@tag</tag>`
`139`	`139`	`}`
`140`	`140`	`</govuk-summary-list-row-value>`
`141`	`141`	`</govuk-summary-list-row>`
Original file line number	Diff line number	Diff line change
`@@ -131,22 +131,22 @@`
`131`	`131`
`132`	`132`	`@if (result.Duplicate == true)`
`133`	`133`	`{`
`134`		`- <span class="govuk-tag--orange govuk-!-static-padding-1">Duplicate</span>`
	`134`	`+ <tag color="TagColor.Orange" class="govuk-!-static-padding-1">Duplicate</tag>`
`135`	`135`	`}`
`136`	`136`	`</td>`
`137`	`137`	`<td class="govuk-table__cell"`
`138`	`138`	`data-testid="integration-transaction-record:@result.IntegrationTransactionRecordId:status">`
`139`	`139`	`@if (result.Status == IntegrationTransactionRecordStatus.Success)`
`140`	`140`	`{`
`141`		`- <span class="govuk-tag--green govuk-!-static-padding-1">@result.Status.GetDisplayName()</span>`
	`141`	`+ <tag color="TagColor.Green" class="govuk-!-static-padding-1">@result.Status.GetDisplayName()</tag>`
`142`	`142`	`}`
`143`	`143`	`else @if (result.Status == IntegrationTransactionRecordStatus.Warning)`
`144`	`144`	`{`
`145`		`- <span class="govuk-tag--yellow govuk-!-static-padding-1">@result.Status.GetDisplayName()</span>`
	`145`	`+ <tag color="TagColor.Yellow" class="govuk-!-static-padding-1">@result.Status.GetDisplayName()</tag>`
`146`	`146`	`}`
`147`	`147`	`else @if (result.Status == IntegrationTransactionRecordStatus.Failure)`
`148`	`148`	`{`
`149`		`- <span class="govuk-tag--red govuk-!-static-padding-1">@result.Status.GetDisplayName()</span>`
	`149`	`+ <tag color="TagColor.Red" class="govuk-!-static-padding-1">@result.Status.GetDisplayName()</tag>`
`150`	`150`	`}`
`151`	`151`	`</td>`
`152`	`152`	`</tr>`
Original file line number	Diff line number	Diff line change
`@@ -96,15 +96,15 @@`
`96`	`96`	`data-testid="integration-transaction:@result.IntegrationTransactionId:importstatus">`
`97`	`97`	`@if (result.ImportStatus == IntegrationTransactionImportStatus.Success)`
`98`	`98`	`{`
`99`		`- <span class="govuk-tag--green govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</span>`
	`99`	`+ <tag color="TagColor.Green" class="govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</tag>`
`100`	`100`	`}`
`101`	`101`	`else @if (result.ImportStatus == IntegrationTransactionImportStatus.InProgress)`
`102`	`102`	`{`
`103`		`- <span class="govuk-tag--light-blue govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</span>`
	`103`	`+ <tag color="TagColor.Blue" class="govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</tag>`
`104`	`104`	`}`
`105`	`105`	`else`
`106`	`106`	`{`
`107`		`- <span class="govuk-tag--red govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</span>`
	`107`	`+ <tag color="TagColor.Red" class="govuk-!-static-padding-1">@result.ImportStatus.GetDisplayName()</tag>`
`108`	`108`	`}`
`109`	`109`	`</td>`
`110`	`110`