Repository: dhsc-govuk/FingertipsNext
Pull request #285: DHSCFT-214: Add trend marker to line chart table
Author: login: dlzhry2
Created: 2025-03-17T12:00:08Z | Merged: 2025-03-18T10:44:10Z

# Description

Jira ticket: [DHSCFT-214](https://bjss-enterprise.atlassian.net/browse/DHSCFT-214)
I believe this also resolves [DHSCFT-371](https://bjss-enterprise.atlassian.net/browse/DHSCFT-371)

On a line chart table with displaying 1-2 areas for a given indicator, the trend will now be shown for the relevant areas

## Changes

- Slight modification to existing TrendTag component to use the actual data that will be returned by the API
- Removed the demo tags (hope this is ok - they did not seem to be referenced anywhere
- Extended line chart table to render the relevant trend tag and updated all relevant tests
- The Indicator polarity strings in the database had been changed, so needed to update the trend analysis application accordingly

## Validation

Tested locally (you need to wait for the trend-analysis container to finish running locally (about 30 seconds).

Indicator used: Alcohol-related mortality

All of England:
<img width="752" alt="image" src="https://github.com/user-attachments/assets/820115bb-80de-42bb-aed1-35a98845bb26" />
And matches the Fingertips site:
<img width="1024" alt="image" src="https://github.com/user-attachments/assets/e07f7b7d-3948-46ba-bc99-3822f03a26f1" />

2 Areas - Blackpool and Bolton (I flagged the rendering issue - see Engineering channel - it's an existing issue with a ticket to look into it.)
<img width="827" alt="image" src="https://github.com/user-attachments/assets/e5a4e47c-606d-4ccb-9db6-69663d868315" />
This also matches Fingertips website.

Indicator with no polarity: Deaths in hospital (%)

East Midlands region:
<img width="785" alt="image" src="https://github.com/user-attachments/assets/e7e2ad06-cd80-44c4-b442-3c2431712ba5" />




Diff:
diff --git a/compose.yaml b/compose.yaml
index d06e4cbd2..4c7b9656e 100644
--- a/compose.yaml
+++ b/compose.yaml
@@ -19,6 +19,8 @@ services:
     depends_on:
       db-setup:
         condition: service_completed_successfully
+      db-apply-trends:
+        condition: service_completed_successfully
 
     build: api
     environment:
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png
index a158ede1c..cf5b60fdb 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png
index 7399e3d7a..766a6d182 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png
index 77aaca3c5..f7730f3df 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png
index b658f8de9..94fa96ca6 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png
index 7e1f641f4..e0033c386 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/chromium/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-inequalities-component.png b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-inequalities-component.png
index f110f56ad..4911e95f9 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-inequalities-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-inequalities-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png
index 6ab5e0b90..e7881151d 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChart-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png
index 220af54f9..8ef1857ef 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/BOTH-SUBJECT-AND-AREA-then-select-ONE-INDICATOR-and-ONE-AREA-then-check-the-charts-page-lineChartTable-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png
index ce9c554c8..f9a370f67 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-barChartEmbeddedTable-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png
index 278e60b1a..4f0575b42 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChart-component.png differ
diff --git a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png
index cbd433346..ff35e34fa 100644
Binary files a/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png and b/frontend/fingertips-frontend/.test/spec/snaps/webkit/fully_integrated_e2e_tests/core_journeys.spec.ts/ONLY-SUBJECT-then-select-ONE-INDICATOR-and-TWO-PLUS-AREAS-then-check-the-charts-page-lineChartTable-component.png differ
diff --git a/frontend/fingertips-frontend/components/molecules/TrendTag/DemoTrendTags.tsx b/frontend/fingertips-frontend/components/molecules/TrendTag/DemoTrendTags.tsx
deleted file mode 100644
index 09e4f5101..000000000
--- a/frontend/fingertips-frontend/components/molecules/TrendTag/DemoTrendTags.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import { Trend, TrendCondition } from '@/lib/common-types';
-import { TrendTag } from '@/components/molecules/TrendTag/index';
-import { FC } from 'react';
-import styled from 'styled-components';
-
-const Div = styled('div')({
-  margin: '4em 0',
-});
-
-const Th = styled('th')({
-  borderBottom: '1px solid gray',
-});
-
-const Td = styled('td')({
-  borderBottom: '1px solid gray',
-  padding: '1em 0',
-});
-
-export const DemoTrendTags: FC = () => {
-  const trendConditions: (TrendCondition | undefined)[] =
-    Object.values(TrendCondition);
-  trendConditions.push(undefined);
-
-  return (
-    <Div>
-      <table>
-        <thead>
-          <tr>
-            <Th>Trend</Th>
-            {trendConditions.map((trendCondition) => (
-              <Th key={trendCondition ?? 'none'}>
-                {trendCondition ?? 'undefined'}
-              </Th>
-            ))}
-          </tr>
-        </thead>
-        <tbody>
-          {Object.values(Trend).map((trend) => (
-            <tr key={trend}>
-              <Td>{trend}</Td>
-              {trendConditions.map((trendCondition) => (
-                <Td key={`${trend}-${trendCondition}`}>
-                  <TrendTag trend={trend} trendCondition={trendCondition} />
-                  <TrendTag
-                    trend={trend}
-                    trendCondition={trendCondition}
-                    useArrow={false}
-                  />
-                </Td>
-              ))}
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </Div>
-  );
-};
diff --git a/frontend/fingertips-frontend/components/molecules/TrendTag/index.tsx b/frontend/fingertips-frontend/components/molecules/TrendTag/index.tsx
index bef8a7c13..cddff60e9 100644
--- a/frontend/fingertips-frontend/components/molecules/TrendTag/index.tsx
+++ b/frontend/fingertips-frontend/components/molecules/TrendTag/index.tsx
@@ -11,11 +11,10 @@ import {
   getTrendColour,
   getTrendConditionColours,
 } from '@/components/molecules/TrendTag/trendTagConfig';
+import { HealthDataPointTrendEnum } from '@/generated-sources/ft-api-client/models/HealthDataPoint';
 
 interface TagProps {
-  trend: Trend;
-  useArrow?: boolean;
-  trendCondition?: TrendCondition;
+  trendFromResponse: HealthDataPointTrendEnum;
 }
 
 const StyledDivContainer = styled('div')({
@@ -61,12 +60,45 @@ const arrowDirectionMap: Partial<Record<Trend, Direction>> = {
   [Trend.NOT_AVAILABLE]: undefined,
 };
 
-export const TrendTag = ({
-  trend,
-  useArrow = true,
-  trendCondition,
-}: Readonly<TagProps>) => {
-  const arrowDirection = useArrow ? arrowDirectionMap[trend] : null;
+interface MappedTrend {
+  trend: Trend;
+  trendCondition?: TrendCondition;
+}
+
+/**
+ * Breaks down the trend string returned from the API to a trend and trend condition.
+ * @param trendResString - string returned from the API representing the trend.
+ * @returns - the mapped trend broken into trend and trend condition.
+ */
+export const mapTrendResponse = (
+  trendResString: HealthDataPointTrendEnum
+): MappedTrend => {
+  switch (trendResString) {
+    case HealthDataPointTrendEnum.NoSignificantChange:
+      return { trend: Trend.NO_SIGNIFICANT_CHANGE };
+    case HealthDataPointTrendEnum.Increasing:
+      return { trend: Trend.INCREASING };
+    case HealthDataPointTrendEnum.Decreasing:
+      return { trend: Trend.DECREASING };
+    case HealthDataPointTrendEnum.NotYetCalculated:
+    case HealthDataPointTrendEnum.CannotBeCalculated:
+      return { trend: Trend.NOT_AVAILABLE };
+  }
+
+  const isIncreasing = trendResString.startsWith('Increasing');
+  const isGettingBetter = trendResString.endsWith('getting better');
+
+  return {
+    trend: isIncreasing ? Trend.INCREASING : Trend.DECREASING,
+    trendCondition: isGettingBetter
+      ? TrendCondition.GETTING_BETTER
+      : TrendCondition.GETTING_WORSE,
+  };
+};
+
+export const TrendTag = ({ trendFromResponse }: Readonly<TagProps>) => {
+  const { trend, trendCondition } = mapTrendResponse(trendFromResponse);
+  const arrowDirection = arrowDirectionMap[trend];
   const trendMessage =
     trend === Trend.NO_SIGNIFICANT_CHANGE || trend === Trend.NOT_AVAILABLE
       ? trend
diff --git a/frontend/fingertips-frontend/components/molecules/TrendTag/trendTag.test.tsx b/frontend/fingertips-frontend/components/molecules/TrendTag/trendTag.test.tsx
index 3431cbb19..0ae199ef5 100644
--- a/frontend/fingertips-frontend/components/molecules/TrendTag/trendTag.test.tsx
+++ b/frontend/fingertips-frontend/components/molecules/TrendTag/trendTag.test.tsx
@@ -1,13 +1,13 @@
 import { Trend, TrendCondition } from '@/lib/common-types';
-import { TrendTag } from '.';
+import { mapTrendResponse, TrendTag } from '.';
 import { render, screen } from '@testing-library/react';
+import { HealthDataPointTrendEnum } from '@/generated-sources/ft-api-client/models/HealthDataPoint';
 
 describe('Trend Tag Suite', () => {
   it('should render expected elements', () => {
     render(
       <TrendTag
-        trend={Trend.INCREASING}
-        trendCondition={TrendCondition.GETTING_BETTER}
+        trendFromResponse={HealthDataPointTrendEnum.IncreasingAndGettingBetter}
       />
     );
 
@@ -17,12 +17,56 @@ describe('Trend Tag Suite', () => {
     expect(screen.getByRole('paragraph')).toBeInTheDocument();
   });
 
+  describe('mapTrendResponse function', () => {
+    it.each([
+      [
+        HealthDataPointTrendEnum.CannotBeCalculated,
+        Trend.NOT_AVAILABLE,
+        undefined,
+      ],
+      [
+        HealthDataPointTrendEnum.NotYetCalculated,
+        Trend.NOT_AVAILABLE,
+        undefined,
+      ],
+      [
+        HealthDataPointTrendEnum.NoSignificantChange,
+        Trend.NO_SIGNIFICANT_CHANGE,
+        undefined,
+      ],
+      [HealthDataPointTrendEnum.Increasing, Trend.INCREASING, undefined],
+      [
+        HealthDataPointTrendEnum.IncreasingAndGettingBetter,
+        Trend.INCREASING,
+        TrendCondition.GETTING_BETTER,
+      ],
+      [
+        HealthDataPointTrendEnum.DecreasingAndGettingBetter,
+        Trend.DECREASING,
+        TrendCondition.GETTING_BETTER,
+      ],
+      [
+        HealthDataPointTrendEnum.DecreasingAndGettingWorse,
+        Trend.DECREASING,
+        TrendCondition.GETTING_WORSE,
+      ],
+    ])(
+      'should break down trend strings from the API to relevant values for %s',
+      (trendFromResponse, expectedTrend, expectedTrendCondition) => {
+        const { trend, trendCondition } = mapTrendResponse(trendFromResponse);
+        expect(trend).toEqual(expectedTrend);
+        expect(trendCondition).toEqual(expectedTrendCondition);
+      }
+    );
+  });
+
   describe('should render elements according to props', () => {
     it('should render decreasing trend', () => {
       render(
         <TrendTag
-          trend={Trend.DECREASING}
-          trendCondition={TrendCondition.GETTING_BETTER}
+          trendFromResponse={
+            HealthDataPointTrendEnum.DecreasingAndGettingBetter
+          }
         />
       );
 
@@ -35,8 +79,7 @@ describe('Trend Tag Suite', () => {
     it('should render increasing trend', () => {
       render(
         <TrendTag
-          trend={Trend.INCREASING}
-          trendCondition={TrendCondition.GETTING_WORSE}
+          trendFromResponse={HealthDataPointTrendEnum.IncreasingAndGettingWorse}
         />
       );
 
@@ -47,7 +90,11 @@ describe('Trend Tag Suite', () => {
     });
 
     it('should render no significant change', () => {
-      render(<TrendTag trend={Trend.NO_SIGNIFICANT_CHANGE} />);
+      render(
+        <TrendTag
+          trendFromResponse={HealthDataPointTrendEnum.NoSignificantChange}
+        />
+      );
 
       expect(screen.getByTestId('arrow-right')).toBeInTheDocument();
       expect(screen.getByRole('paragraph')).toHaveTextContent(
@@ -56,21 +103,29 @@ describe('Trend Tag Suite', () => {
     });
 
     it('should render increasing trend without condition', () => {
-      render(<TrendTag trend={Trend.INCREASING} />);
+      render(
+        <TrendTag trendFromResponse={HealthDataPointTrendEnum.Increasing} />
+      );
 
       expect(screen.getByTestId('arrow-up')).toBeInTheDocument();
       expect(screen.getByRole('paragraph')).toHaveTextContent('Increasing');
     });
 
     it('should render decreasing trend without condition', () => {
-      render(<TrendTag trend={Trend.DECREASING} />);
+      render(
+        <TrendTag trendFromResponse={HealthDataPointTrendEnum.Decreasing} />
+      );
 
       expect(screen.getByTestId('arrow-down')).toBeInTheDocument();
       expect(screen.getByRole('paragraph')).toHaveTextContent('Decreasing');
     });
 
     it('should render trend not available', () => {
-      render(<TrendTag trend={Trend.NOT_AVAILABLE} />);
+      render(
+        <TrendTag
+          trendFromResponse={HealthDataPointTrendEnum.CannotBeCalculated}
+        />
+      );
       expect(
         screen.queryByTestId('arrow', { exact: false })
       ).not.toBeInTheDocument();
@@ -83,8 +138,7 @@ describe('Trend Tag Suite', () => {
   it('snapshot test', () => {
     const container = render(
       <TrendTag
-        trend={Trend.INCREASING}
-        trendCondition={TrendCondition.GETTING_WORSE}
+        trendFromResponse={HealthDataPointTrendEnum.IncreasingAndGettingWorse}
       />
     );
 
diff --git a/frontend/fingertips-frontend/components/organisms/LineChartTable/LineChartTable.test.tsx b/frontend/fingertips-frontend/components/organisms/LineChartTable/LineChartTable.test.tsx
index dc6b57433..7d1f5849b 100644
--- a/frontend/fingertips-frontend/components/organisms/LineChartTable/LineChartTable.test.tsx
+++ b/frontend/fingertips-frontend/components/organisms/LineChartTable/LineChartTable.test.tsx
@@ -9,6 +9,7 @@ import {
 import {
   MOCK_ENGLAND_DATA,
   MOCK_HEALTH_DATA,
+  MOCK_HEALTH_DATA_WITH_TRENDS,
   MOCK_PARENT_DATA,
 } from '@/lib/tableHelpers/mocks';
 import { GovukColours } from '@/lib/styleHelpers/colours';
@@ -97,7 +98,7 @@ describe('Line chart table suite', () => {
 
       expect(screen.getByRole('table')).toBeInTheDocument();
       expect(screen.getAllByRole('columnheader')[0]).toHaveTextContent(
-        `${mockHealthData[0].areaName} recent trend:`
+        'Recent trend: No trend data available'
       );
       expect(screen.getAllByRole('columnheader')[2]).toHaveTextContent(
         mockHealthData[0].areaName
@@ -190,6 +191,22 @@ describe('Line chart table suite', () => {
         ).toHaveTextContent('X');
       }
     });
+
+    it('should render trend markers based on data returned by the API', () => {
+      render(
+        <LineChartTable
+          healthIndicatorData={[MOCK_HEALTH_DATA_WITH_TRENDS[0]]}
+          englandBenchmarkData={undefined}
+          measurementUnit="per 100,000"
+        />
+      );
+
+      // Right-facing arrow for the 'no significant change' trend
+      expect(screen.getByTestId('arrow-right')).toBeVisible();
+      expect(screen.getAllByRole('columnheader')[0]).toHaveTextContent(
+        'Recent trend: No significant change'
+      );
+    });
   });
 
   describe('1 Indicator, 2 Areas', () => {
@@ -217,10 +234,10 @@ describe('Line chart table suite', () => {
 
       expect(screen.getByRole('table')).toBeInTheDocument();
       expect(screen.getAllByRole('columnheader')[1]).toHaveTextContent(
-        `${mockHealthData[0].areaName} recent trend:`
+        'Recent trend: No trend data available'
       );
       expect(screen.getAllByRole('columnheader')[2]).toHaveTextContent(
-        `${mockHealthData[1].areaName} recent trend:`
+        'Recent trend: No trend data available'
       );
       expect(screen.getAllByRole('columnheader')[4]).toHaveTextContent(
         mockHealthData[0].areaName
@@ -296,6 +313,29 @@ describe('Line chart table suite', () => {
 
       expectPeriodsToBeDisplayedInAscendingOrder(CELLS_PER_ROW);
     });
+
+    it('should render trend markers for 2 indicators based on data returned by the API', () => {
+      render(
+        <LineChartTable
+          healthIndicatorData={MOCK_HEALTH_DATA_WITH_TRENDS}
+          englandBenchmarkData={undefined}
+          measurementUnit="per 100,000"
+        />
+      );
+
+      // Should be one indicator with 'no significant change' and the other 'increasing and getting worse'
+      expect(screen.getByTestId('arrow-right')).toBeVisible();
+      expect(screen.getByTestId('arrow-up')).toBeVisible();
+      expect(screen.getAllByTestId('arrow-right')).toHaveLength(1);
+      expect(screen.getAllByTestId('arrow-up')).toHaveLength(1);
+
+      expect(screen.getAllByRole('columnheader')[1]).toHaveTextContent(
+        'Recent trend: No significant change'
+      );
+      expect(screen.getAllByRole('columnheader')[2]).toHaveTextContent(
+        'Recent trend: Increasing and getting worse'
+      );
+    });
   });
 
   describe('group data', () => {
diff --git a/frontend/fingertips-frontend/components/organisms/LineChartTable/__snapshots__/LineChartTable.test.tsx.snap b/frontend/fingertips-frontend/components/organisms/LineChartTable/__snapshots__/LineChartTable.test.tsx.snap
index f3ea5bfb8..984414c23 100644
--- a/frontend/fingertips-frontend/components/organisms/LineChartTable/__snapshots__/LineChartTable.test.tsx.snap
+++ b/frontend/fingertips-frontend/components/organisms/LineChartTable/__snapshots__/LineChartTable.test.tsx.snap
@@ -2,7 +2,49 @@
 
 exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match snapshot 1`] = `
 <DocumentFragment>
-  .c16 {
+  .c10 {
+  margin: 0;
+  font-family: "nta",Arial,sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 1.25;
+  margin-bottom: 15px;
+}
+
+.c10 > p {
+  margin: 0;
+}
+
+.c10 > p > code {
+  padding: 0.2em 0.4em;
+  margin: 0;
+  font-size: 85%;
+  background-color: rgba(27,31,35,0.05);
+  border-radius: 3px;
+}
+
+.c10 > pre {
+  padding: 16px;
+  overflow: auto;
+  font-size: 85%;
+  line-height: 1.45;
+  background-color: #f6f8fa;
+  border-radius: 3px;
+}
+
+.c10 > pre > code {
+  display: inline;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  overflow: visible;
+  line-height: inherit;
+  word-wrap: normal;
+}
+
+.c7 {
   font-family: "nta",Arial,sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -38,7 +80,7 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
   padding-right: 0;
 }
 
-.c12 {
+.c18 {
   padding: 10px 20px 10px 0;
   border-bottom: 1px solid #bfc1c3;
   text-align: right;
@@ -48,17 +90,17 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
   font-weight: 400;
 }
 
-.c12:last-child {
+.c18:last-child {
   padding-right: 0;
 }
 
-.c15 {
+.c21 {
   padding: 10px 20px 10px 0;
   border-bottom: 1px solid #bfc1c3;
   text-align: left;
 }
 
-.c15:last-child {
+.c21:last-child {
   padding-right: 0;
 }
 
@@ -87,19 +129,19 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
   padding: 0.625em 0;
 }
 
-.c7 {
+.c13 {
   text-align: right;
   padding-right: 10px;
   vertical-align: top;
 }
 
-.c8 {
+.c14 {
   background-color: #B1B4B6;
   border-top: solid #F3F2F1 2px;
   width: 16%;
 }
 
-.c13 {
+.c19 {
   font-family: "nta",Arial,sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -109,17 +151,17 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
   padding-right: 0;
 }
 
-.c18 {
+.c23 {
   text-align: right;
   padding-right: 10px;
 }
 
-.c19 {
+.c24 {
   background-color: #B1B4B6;
   border-top: solid #F3F2F1 2px;
 }
 
-.c14 {
+.c20 {
   text-align: left;
   width: 10%;
 }
@@ -144,7 +186,7 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
   align-items: center;
 }
 
-.c17 {
+.c22 {
   padding: 5px 8px 4px 8px;
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -158,23 +200,73 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
   border: 1px solid #0B0C0C;
 }
 
-.c6 {
+.c9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c8 {
+  text-transform: unset;
+  margin: 0.3125em;
+  color: #303436;
+  background-color: #E1E2E3;
+}
+
+.c11 {
+  margin-bottom: 0;
+  margin-left: 0.3125em;
+  font-family: "nta",Arial,sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  font-weight: 400;
+  font-size: 12px;
+  line-height: 1.25;
+}
+
+.c12 {
   width: 10%;
   padding: 1em 0;
   text-align: center;
 }
 
-.c10 {
+.c16 {
   width: 27%;
 }
 
-.c9 {
+.c15 {
   width: 22%;
   padding: 0.5em;
   text-align: center;
 }
 
-.c11 {
+.c6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: left;
+  -webkit-justify-content: left;
+  -ms-flex-pack: left;
+  justify-content: left;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  gap: 8px;
+  padding-left: 8px;
+}
+
+.c17 {
   display: block;
 }
 
@@ -183,21 +275,41 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
 }
 
 @media print {
-  .c16 {
+  .c10 {
+    font-size: 14px;
+    line-height: 1.15;
+  }
+}
+
+@media only screen and (min-width:641px) {
+  .c10 {
+    font-size: 19px;
+    line-height: 1.3157894736842106;
+  }
+}
+
+@media only screen and (min-width:641px) {
+  .c10 {
+    margin-bottom: 20px;
+  }
+}
+
+@media print {
+  .c7 {
     font-size: 14px;
     line-height: 1;
   }
 }
 
 @media only screen and (min-width:641px) {
-  .c16 {
+  .c7 {
     font-size: 16px;
     line-height: 1;
   }
 }
 
 @media print {
-  .c12 {
+  .c18 {
     font-family: sans-serif;
   }
 }
@@ -243,19 +355,33 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
 }
 
 @media print {
-  .c13 {
+  .c19 {
     font-size: 14px;
     line-height: 1.2;
   }
 }
 
 @media only screen and (min-width:641px) {
-  .c13 {
+  .c19 {
     font-size: 16px;
     line-height: 1.25;
   }
 }
 
+@media print {
+  .c11 {
+    font-size: 12px;
+    line-height: 1.2;
+  }
+}
+
+@media only screen and (min-width:641px) {
+  .c11 {
+    font-size: 14px;
+    line-height: 1.4285714285714286;
+  }
+}
+
 <div
     class="c0"
     data-testid="lineChartTable-component"
@@ -273,7 +399,33 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
             class="c2 c3 c4 c5"
             colspan="5"
           >
-            Greater Manchester ICB - 00T recent trend:
+            <div
+              class="c6"
+            >
+              Recent trend: 
+              <div
+                data-testid="trendTag-container"
+              >
+                <strong
+                  class="c7 c8"
+                >
+                  <div
+                    class="c9"
+                    data-testid="tag-component"
+                  >
+                    <div>
+                      <div
+                        class="c10 c11"
+                      >
+                        <p>
+                          No trend data available
+                        </p>
+                      </div>
+                    </div>
+                  </div>
+                </strong>
+              </div>
+            </div>
           </th>
         </tr>
         <tr
@@ -283,13 +435,13 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
             class="c2"
           />
           <th
-            class="c2 c3 c4 c6"
+            class="c2 c3 c4 c12"
             colspan="5"
           >
             Greater Manchester ICB - 00T
           </th>
           <th
-            class="c2 c3 c7 c8"
+            class="c2 c3 c13 c14"
             data-testid="england-header"
           >
             Benchmark: 
@@ -305,13 +457,13 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
             colspan="4"
           />
           <th
-            class="c2 c3 c4 c9"
+            class="c2 c3 c4 c15"
             colspan="2"
           >
             95% confidence limits
           </th>
           <th
-            class="c2 c3 c7 c8"
+            class="c2 c3 c13 c14"
           />
         </tr>
         <tr
@@ -324,47 +476,47 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
             Period
           </th>
           <th
-            class="c2 c3 c4 c10"
+            class="c2 c3 c4 c16"
             data-testid="header-Compared to benchmark-1"
           >
             Compared to benchmark
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Count-2"
           >
             Count
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Value-3"
           >
             Value
             <span
-              class="c11"
+              class="c17"
             >
               (%)
             </span>
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Lower-4"
           >
             Lower
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Upper-5"
           >
             Upper
           </th>
           <th
-            class="c2 c3 c7 c8"
+            class="c2 c3 c13 c14"
             data-testid="header-Value -6"
           >
             Value  
             <span
-              class="c11"
+              class="c17"
             >
               (%)
             </span>
@@ -378,41 +530,41 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
           class=""
         >
           <td
-            class="c12 c13 c14"
+            class="c18 c19 c20"
           >
             2004
           </td>
           <td
-            class="c15 c13 c14"
+            class="c21 c19 c20"
           >
             <strong
-              class="c16 c17"
+              class="c7 c22"
             >
               Not compared
             </strong>
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             267
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             703.420759
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             441.69151
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             578.32766
           </td>
           <td
-            class="c15 c13 c18 c19"
+            class="c21 c19 c23 c24"
             data-testid="grey-table-cell"
           >
             904.874
@@ -422,41 +574,41 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
           class=""
         >
           <td
-            class="c12 c13 c14"
+            class="c18 c19 c20"
           >
             2008
           </td>
           <td
-            class="c15 c13 c14"
+            class="c21 c19 c20"
           >
             <strong
-              class="c16 c17"
+              class="c7 c22"
             >
               Not compared
             </strong>
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             222
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             890.305692
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             441.69151
           </td>
           <td
-            class="c12 c13 c18"
+            class="c18 c19 c23"
           >
             578.32766
           </td>
           <td
-            class="c15 c13 c18 c19"
+            class="c21 c19 c23 c24"
             data-testid="grey-table-cell"
           >
             965.9843
@@ -470,7 +622,49 @@ exports[`Line chart table suite 1 Indicator, 1 Area snapshot test - should match
 
 exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should match snapshot 1`] = `
 <DocumentFragment>
-  .c18 {
+  .c10 {
+  margin: 0;
+  font-family: "nta",Arial,sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 1.25;
+  margin-bottom: 15px;
+}
+
+.c10 > p {
+  margin: 0;
+}
+
+.c10 > p > code {
+  padding: 0.2em 0.4em;
+  margin: 0;
+  font-size: 85%;
+  background-color: rgba(27,31,35,0.05);
+  border-radius: 3px;
+}
+
+.c10 > pre {
+  padding: 16px;
+  overflow: auto;
+  font-size: 85%;
+  line-height: 1.45;
+  background-color: #f6f8fa;
+  border-radius: 3px;
+}
+
+.c10 > pre > code {
+  display: inline;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  overflow: visible;
+  line-height: inherit;
+  word-wrap: normal;
+}
+
+.c7 {
   font-family: "nta",Arial,sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -506,7 +700,7 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
   padding-right: 0;
 }
 
-.c13 {
+.c19 {
   padding: 10px 20px 10px 0;
   border-bottom: 1px solid #bfc1c3;
   text-align: right;
@@ -516,17 +710,17 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
   font-weight: 400;
 }
 
-.c13:last-child {
+.c19:last-child {
   padding-right: 0;
 }
 
-.c16 {
+.c22 {
   padding: 10px 20px 10px 0;
   border-bottom: 1px solid #bfc1c3;
   text-align: left;
 }
 
-.c16:last-child {
+.c22:last-child {
   padding-right: 0;
 }
 
@@ -555,19 +749,19 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
   padding: 0.625em 0;
 }
 
-.c7 {
+.c13 {
   text-align: right;
   padding-right: 10px;
   vertical-align: top;
 }
 
-.c8 {
+.c14 {
   background-color: #B1B4B6;
   border-top: solid #F3F2F1 2px;
   width: 16%;
 }
 
-.c14 {
+.c20 {
   font-family: "nta",Arial,sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -577,17 +771,17 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
   padding-right: 0;
 }
 
-.c20 {
+.c25 {
   text-align: right;
   padding-right: 10px;
 }
 
-.c21 {
+.c26 {
   background-color: #B1B4B6;
   border-top: solid #F3F2F1 2px;
 }
 
-.c15 {
+.c21 {
   text-align: left;
   width: 10%;
 }
@@ -612,7 +806,7 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
   align-items: center;
 }
 
-.c19 {
+.c24 {
   padding: 5px 8px 4px 8px;
   -webkit-align-items: center;
   -webkit-box-align: center;
@@ -626,33 +820,83 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
   border: 1px solid #0B0C0C;
 }
 
-.c6 {
+.c9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c8 {
+  text-transform: unset;
+  margin: 0.3125em;
+  color: #303436;
+  background-color: #E1E2E3;
+}
+
+.c11 {
+  margin-bottom: 0;
+  margin-left: 0.3125em;
+  font-family: "nta",Arial,sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  font-weight: 400;
+  font-size: 12px;
+  line-height: 1.25;
+}
+
+.c12 {
   width: 10%;
   padding: 1em 0;
   text-align: center;
 }
 
-.c10 {
+.c16 {
   width: 27%;
 }
 
-.c11 {
+.c17 {
   border-left: solid black 1px;
   width: 18%;
   padding-left: 0.5em;
 }
 
-.c9 {
+.c15 {
   width: 22%;
   padding: 0.5em;
   text-align: center;
 }
 
-.c17 {
+.c6 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: left;
+  -webkit-justify-content: left;
+  -ms-flex-pack: left;
+  justify-content: left;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  gap: 8px;
+  padding-left: 8px;
+}
+
+.c23 {
   border-left: solid black 1px;
 }
 
-.c12 {
+.c18 {
   display: block;
 }
 
@@ -661,21 +905,41 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
 }
 
 @media print {
-  .c18 {
+  .c10 {
+    font-size: 14px;
+    line-height: 1.15;
+  }
+}
+
+@media only screen and (min-width:641px) {
+  .c10 {
+    font-size: 19px;
+    line-height: 1.3157894736842106;
+  }
+}
+
+@media only screen and (min-width:641px) {
+  .c10 {
+    margin-bottom: 20px;
+  }
+}
+
+@media print {
+  .c7 {
     font-size: 14px;
     line-height: 1;
   }
 }
 
 @media only screen and (min-width:641px) {
-  .c18 {
+  .c7 {
     font-size: 16px;
     line-height: 1;
   }
 }
 
 @media print {
-  .c13 {
+  .c19 {
     font-family: sans-serif;
   }
 }
@@ -721,19 +985,33 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
 }
 
 @media print {
-  .c14 {
+  .c20 {
     font-size: 14px;
     line-height: 1.2;
   }
 }
 
 @media only screen and (min-width:641px) {
-  .c14 {
+  .c20 {
     font-size: 16px;
     line-height: 1.25;
   }
 }
 
+@media print {
+  .c11 {
+    font-size: 12px;
+    line-height: 1.2;
+  }
+}
+
+@media only screen and (min-width:641px) {
+  .c11 {
+    font-size: 14px;
+    line-height: 1.4285714285714286;
+  }
+}
+
 <div
     class="c0"
     data-testid="lineChartTable-component"
@@ -754,13 +1032,65 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
             class="c2 c3 c4 c5"
             colspan="5"
           >
-            Greater Manchester ICB - 00T recent trend:
+            <div
+              class="c6"
+            >
+              Recent trend: 
+              <div
+                data-testid="trendTag-container"
+              >
+                <strong
+                  class="c7 c8"
+                >
+                  <div
+                    class="c9"
+                    data-testid="tag-component"
+                  >
+                    <div>
+                      <div
+                        class="c10 c11"
+                      >
+                        <p>
+                          No trend data available
+                        </p>
+                      </div>
+                    </div>
+                  </div>
+                </strong>
+              </div>
+            </div>
           </th>
           <th
             class="c2 c3 c4 c5"
             colspan="5"
           >
-            South FooBar recent trend:
+            <div
+              class="c6"
+            >
+              Recent trend: 
+              <div
+                data-testid="trendTag-container"
+              >
+                <strong
+                  class="c7 c8"
+                >
+                  <div
+                    class="c9"
+                    data-testid="tag-component"
+                  >
+                    <div>
+                      <div
+                        class="c10 c11"
+                      >
+                        <p>
+                          No trend data available
+                        </p>
+                      </div>
+                    </div>
+                  </div>
+                </strong>
+              </div>
+            </div>
           </th>
         </tr>
         <tr
@@ -770,19 +1100,19 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
             class="c2"
           />
           <th
-            class="c2 c3 c4 c6"
+            class="c2 c3 c4 c12"
             colspan="5"
           >
             Greater Manchester ICB - 00T
           </th>
           <th
-            class="c2 c3 c4 c6"
+            class="c2 c3 c4 c12"
             colspan="5"
           >
             South FooBar
           </th>
           <th
-            class="c2 c3 c7 c8"
+            class="c2 c3 c13 c14"
             data-testid="england-header"
           >
             Benchmark: 
@@ -798,7 +1128,7 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
             colspan="4"
           />
           <th
-            class="c2 c3 c4 c9"
+            class="c2 c3 c4 c15"
             colspan="2"
           >
             95% confidence limits
@@ -808,13 +1138,13 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
             colspan="3"
           />
           <th
-            class="c2 c3 c4 c9"
+            class="c2 c3 c4 c15"
             colspan="2"
           >
             95% confidence limits
           </th>
           <th
-            class="c2 c3 c7 c8"
+            class="c2 c3 c13 c14"
           />
         </tr>
         <tr
@@ -827,82 +1157,82 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
             Period
           </th>
           <th
-            class="c2 c3 c4 c10 c11"
+            class="c2 c3 c4 c16 c17"
             data-testid="header-Compared to benchmark-1"
           >
             Compared to benchmark
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Count-2"
           >
             Count
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Value-3"
           >
             Value
             <span
-              class="c12"
+              class="c18"
             >
               (%)
             </span>
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Lower-4"
           >
             Lower
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Upper-5"
           >
             Upper
           </th>
           <th
-            class="c2 c3 c4 c10 c11"
+            class="c2 c3 c4 c16 c17"
             data-testid="header-Compared to benchmark-1"
           >
             Compared to benchmark
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Count-2"
           >
             Count
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Value-3"
           >
             Value
             <span
-              class="c12"
+              class="c18"
             >
               (%)
             </span>
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Lower-4"
           >
             Lower
           </th>
           <th
-            class="c2 c3 c7"
+            class="c2 c3 c13"
             data-testid="header-Upper-5"
           >
             Upper
           </th>
           <th
-            class="c2 c3 c7 c8"
+            class="c2 c3 c13 c14"
             data-testid="header-Value -6"
           >
             Value  
             <span
-              class="c12"
+              class="c18"
             >
               (%)
             </span>
@@ -916,70 +1246,70 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
           class=""
         >
           <td
-            class="c13 c14 c15"
+            class="c19 c20 c21"
           >
             2004
           </td>
           <td
-            class="c16 c14 c15 c17"
+            class="c22 c20 c21 c23"
           >
             <strong
-              class="c18 c19"
+              class="c7 c24"
             >
               Not compared
             </strong>
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             267
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             703.420759
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             441.69151
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             578.32766
           </td>
           <td
-            class="c16 c14 c15 c17"
+            class="c22 c20 c21 c23"
           >
             <strong
-              class="c18 c19"
+              class="c7 c24"
             >
               Not compared
             </strong>
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             222
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             135.149304
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             441.69151
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             578.32766
           </td>
           <td
-            class="c16 c14 c20 c21"
+            class="c22 c20 c25 c26"
             data-testid="grey-table-cell"
           >
             904.874
@@ -989,70 +1319,70 @@ exports[`Line chart table suite 1 Indicator, 2 Areas snapshot test - should matc
           class=""
         >
           <td
-            class="c13 c14 c15"
+            class="c19 c20 c21"
           >
             2008
           </td>
           <td
-            class="c16 c14 c15 c17"
+            class="c22 c20 c21 c23"
           >
             <strong
-              class="c18 c19"
+              class="c7 c24"
             >
               Not compared
             </strong>
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             222
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             890.305692
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             441.69151
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             578.32766
           </td>
           <td
-            class="c16 c14 c15 c17"
+            class="c22 c20 c21 c23"
           >
             <strong
-              class="c18 c19"
+              class="c7 c24"
             >
               Not compared
             </strong>
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             222
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             135.149304
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             441.69151
           </td>
           <td
-            class="c13 c14 c20"
+            class="c19 c20 c25"
           >
             578.32766
           </td>
           <td
-            class="c16 c14 c20 c21"
+            class="c22 c20 c25 c26"
             data-testid="grey-table-cell"
           >
             965.9843
diff --git a/frontend/fingertips-frontend/components/organisms/LineChartTable/index.tsx b/frontend/fingertips-frontend/components/organisms/LineChartTable/index.tsx
index 38d45318b..a62512396 100644
--- a/frontend/fingertips-frontend/components/organisms/LineChartTable/index.tsx
+++ b/frontend/fingertips-frontend/components/organisms/LineChartTable/index.tsx
@@ -19,6 +19,7 @@ import {
 } from '@/lib/tableHelpers';
 import { BenchmarkLabel } from '@/components/organisms/BenchmarkLabel';
 import { BenchmarkLabelGroupType } from '@/components/organisms/BenchmarkLabel/BenchmarkLabelTypes';
+import { TrendTag } from '@/components/molecules/TrendTag';
 
 export enum LineChartTableHeadingEnum {
   AreaPeriod = 'Period',
@@ -74,6 +75,14 @@ const StyledConfidenceLimitsHeader = styled(StyledAlignLeftHeader)({
   textAlign: 'center',
 });
 
+const StyledDivContainer = styled('div')({
+  display: 'flex',
+  justifyContent: 'left',
+  alignItems: 'center',
+  gap: 8,
+  paddingLeft: 8,
+});
+
 const StyledLightGreyHeader = styled(StyledGreyHeader)({
   backgroundColor: GovukColours.LightGrey,
   borderTop: GovukColours.MidGrey,
@@ -222,7 +231,14 @@ export function LineChartTable({
                     <StyledTitleRow></StyledTitleRow>
                   )}
                   <StyledTitleRow colSpan={5}>
-                    {`${area.areaName} recent trend:`}
+                    <StyledDivContainer>
+                      {'Recent trend: '}
+                      <TrendTag
+                        trendFromResponse={
+                          area.healthData[area.healthData.length - 1].trend
+                        }
+                      />
+                    </StyledDivContainer>
                   </StyledTitleRow>
                 </React.Fragment>
               ))}
diff --git a/frontend/fingertips-frontend/lib/tableHelpers/mocks.ts b/frontend/fingertips-frontend/lib/tableHelpers/mocks.ts
index ff05475c8..9a1d539fa 100644
--- a/frontend/fingertips-frontend/lib/tableHelpers/mocks.ts
+++ b/frontend/fingertips-frontend/lib/tableHelpers/mocks.ts
@@ -151,3 +151,98 @@ export const GROUPED_YEAR_DATA = {
     Female: [MOCK_HEALTH_DATA[1].healthData[2]],
   },
 };
+
+export const MOCK_HEALTH_DATA_WITH_TRENDS = [
+  {
+    areaCode: '1472',
+    areaName: 'Manchester - Counties and Unitary Authorities',
+    healthData: [
+      {
+        year: 2019,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.NotYetCalculated,
+      },
+      {
+        year: 2022,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.NotYetCalculated,
+      },
+      {
+        year: 2023,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.NotYetCalculated,
+      },
+      {
+        year: 2024,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.NoSignificantChange,
+      },
+    ],
+  },
+  {
+    areaCode: 'A1426',
+    areaName: 'South FooBar',
+    healthData: [
+      {
+        year: 2019,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.NotYetCalculated,
+      },
+      {
+        year: 2022,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.NotYetCalculated,
+      },
+      {
+        year: 2023,
+        count: 1566,
+        value: 240.305692,
+        lowerCi: 237.69151,
+        upperCi: 245.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.NotYetCalculated,
+      },
+      {
+        year: 2024,
+        count: 1700,
+        value: 260.305692,
+        lowerCi: 258.69151,
+        upperCi: 262.32766,
+        ageBand: 'All',
+        sex: 'Persons',
+        trend: HealthDataPointTrendEnum.IncreasingAndGettingWorse,
+      },
+    ],
+  },
+];
diff --git a/frontend/fingertips-frontend/package-lock.json b/frontend/fingertips-frontend/package-lock.json
index d2068648f..81326496a 100644
--- a/frontend/fingertips-frontend/package-lock.json
+++ b/frontend/fingertips-frontend/package-lock.json
@@ -2096,10 +2096,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.5.tgz",
       "integrity": "sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2114,10 +2118,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.33.5.tgz",
       "integrity": "sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2132,10 +2140,14 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.0.4.tgz",
       "integrity": "sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2144,10 +2156,14 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.0.4.tgz",
       "integrity": "sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2156,10 +2172,14 @@
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.0.5.tgz",
       "integrity": "sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==",
-      "cpu": ["arm"],
+      "cpu": [
+        "arm"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2168,10 +2188,14 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.0.4.tgz",
       "integrity": "sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2180,10 +2204,14 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.0.4.tgz",
       "integrity": "sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==",
-      "cpu": ["s390x"],
+      "cpu": [
+        "s390x"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2192,10 +2220,14 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.0.4.tgz",
       "integrity": "sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2204,10 +2236,14 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.0.4.tgz",
       "integrity": "sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2216,10 +2252,14 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.0.4.tgz",
       "integrity": "sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "LGPL-3.0-or-later",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "funding": {
         "url": "https://opencollective.com/libvips"
       }
@@ -2228,10 +2268,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.33.5.tgz",
       "integrity": "sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==",
-      "cpu": ["arm"],
+      "cpu": [
+        "arm"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2246,10 +2290,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.33.5.tgz",
       "integrity": "sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2264,10 +2312,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.33.5.tgz",
       "integrity": "sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==",
-      "cpu": ["s390x"],
+      "cpu": [
+        "s390x"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2282,10 +2334,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.33.5.tgz",
       "integrity": "sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2300,10 +2356,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.33.5.tgz",
       "integrity": "sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2318,10 +2378,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.33.5.tgz",
       "integrity": "sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "Apache-2.0",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2336,7 +2400,9 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.33.5.tgz",
       "integrity": "sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==",
-      "cpu": ["wasm32"],
+      "cpu": [
+        "wasm32"
+      ],
       "license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT",
       "optional": true,
       "dependencies": {
@@ -2353,10 +2419,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.33.5.tgz",
       "integrity": "sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==",
-      "cpu": ["ia32"],
+      "cpu": [
+        "ia32"
+      ],
       "license": "Apache-2.0 AND LGPL-3.0-or-later",
       "optional": true,
-      "os": ["win32"],
+      "os": [
+        "win32"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -2368,10 +2438,14 @@
       "version": "0.33.5",
       "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.33.5.tgz",
       "integrity": "sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "Apache-2.0 AND LGPL-3.0-or-later",
       "optional": true,
-      "os": ["win32"],
+      "os": [
+        "win32"
+      ],
       "engines": {
         "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
       },
@@ -3156,10 +3230,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-15.2.2.tgz",
       "integrity": "sha512-HNBRnz+bkZ+KfyOExpUxTMR0Ow8nkkcE6IlsdEa9W/rI7gefud19+Sn1xYKwB9pdCdxIP1lPru/ZfjfA+iT8pw==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -3168,10 +3246,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-15.2.2.tgz",
       "integrity": "sha512-mJOUwp7al63tDpLpEFpKwwg5jwvtL1lhRW2fI1Aog0nYCPAhxbJsaZKdoVyPZCy8MYf/iQVNDuk/+i29iLCzIA==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -3180,10 +3262,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-15.2.2.tgz",
       "integrity": "sha512-5ZZ0Zwy3SgMr7MfWtRE7cQWVssfOvxYfD9O7XHM7KM4nrf5EOeqwq67ZXDgo86LVmffgsu5tPO57EeFKRnrfSQ==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -3192,10 +3278,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-15.2.2.tgz",
       "integrity": "sha512-cgKWBuFMLlJ4TWcFHl1KOaVVUAF8vy4qEvX5KsNd0Yj5mhu989QFCq1WjuaEbv/tO1ZpsQI6h/0YR8bLwEi+nA==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -3204,10 +3294,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-15.2.2.tgz",
       "integrity": "sha512-c3kWSOSsVL8rcNBBfOq1+/j2PKs2nsMwJUV4icUxRgGBwUOfppeh7YhN5s79enBQFU+8xRgVatFkhHU1QW7yUA==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -3216,10 +3310,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-15.2.2.tgz",
       "integrity": "sha512-PXTW9PLTxdNlVYgPJ0equojcq1kNu5NtwcNjRjHAB+/sdoKZ+X8FBu70fdJFadkxFIGekQTyRvPMFF+SOJaQjw==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["linux"],
+      "os": [
+        "linux"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -3228,10 +3326,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-15.2.2.tgz",
       "integrity": "sha512-nG644Es5llSGEcTaXhnGWR/aThM/hIaz0jx4MDg4gWC8GfTCp8eDBWZ77CVuv2ha/uL9Ce+nPTfYkSLG67/sHg==",
-      "cpu": ["arm64"],
+      "cpu": [
+        "arm64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["win32"],
+      "os": [
+        "win32"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -3240,10 +3342,14 @@
       "version": "15.2.2",
       "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.2.2.tgz",
       "integrity": "sha512-52nWy65S/R6/kejz3jpvHAjZDPKIbEQu4x9jDBzmB9jJfuOy5rspjKu4u77+fI4M/WzLXrrQd57hlFGzz1ubcQ==",
-      "cpu": ["x64"],
+      "cpu": [
+        "x64"
+      ],
       "license": "MIT",
       "optional": true,
-      "os": ["win32"],
+      "os": [
+        "win32"
+      ],
       "engines": {
         "node": ">= 10"
       }
@@ -7605,7 +7711,9 @@
       "integrity": "sha512-qSQpAw7RcSzE3zPp8FMGkthaCWovHZ/BsXtpmnGax9vQLIovlh1bsZHEa2+j2lv9DWhnyeLM/qZmp7ffQZfQvg==",
       "dev": true,
       "license": "MIT",
-      "workspaces": ["examples"],
+      "workspaces": [
+        "examples"
+      ],
       "dependencies": {
         "globals": "^13.23.0"
       },
@@ -8203,7 +8311,9 @@
       "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "engines": {
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
@@ -12279,7 +12389,9 @@
       "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
-      "os": ["darwin"],
+      "os": [
+        "darwin"
+      ],
       "engines": {
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
diff --git a/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/IndicatorTestData.cs b/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/IndicatorTestData.cs
index 07b705126..e8b675197 100644
--- a/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/IndicatorTestData.cs
+++ b/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/IndicatorTestData.cs
@@ -9,7 +9,7 @@ public class IndicatorTestData
         Name = "Diabetes prevalence aged 17 years and over (Quality and Outcomes Framework)",
         IndicatorId = 241,
         IndicatorKey = 123,
-        Polarity = "Not applicable",
+        Polarity = "No judgement",
         ValueType = "Proportion"
     };
 
@@ -67,7 +67,7 @@ public class IndicatorTestData
         Name = "Proportion of GP registered populations by age group",
         IndicatorId = 93468,
         IndicatorKey = 1234,
-        Polarity = "Not applicable",
+        Polarity = "No judgement",
         ValueType = "Proportion"
     };
 
diff --git a/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/TrendCalculatorTests.cs b/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/TrendCalculatorTests.cs
index e76f60124..2a610d9e8 100644
--- a/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/TrendCalculatorTests.cs
+++ b/trend-analysis/TrendAnalysisApp.UnitTests/Calculator/TrendCalculatorTests.cs
@@ -10,7 +10,7 @@ public class TrendCalculatorTests
     private readonly TrendCalculator tc = new(new TrendMarkerCalculator(), new LegacyMapper());
 
     [Theory]
-    [InlineData(Trend.Increasing, Constants.Polarity.NotApplicable)]
+    [InlineData(Trend.Increasing, Constants.Polarity.NoJudgement)]
     [InlineData(Trend.NoChange, Constants.Polarity.HighIsGood)]
     [InlineData(Trend.CannotBeCalculated, Constants.Polarity.LowIsGood)]
     [InlineData(Trend.IncreasingAndGettingBetter, Constants.Polarity.LowIsGood)]
diff --git a/trend-analysis/TrendAnalysisApp/Calculator/TrendCalculator.cs b/trend-analysis/TrendAnalysisApp/Calculator/TrendCalculator.cs
index 911f1f541..a5cb68d91 100644
--- a/trend-analysis/TrendAnalysisApp/Calculator/TrendCalculator.cs
+++ b/trend-analysis/TrendAnalysisApp/Calculator/TrendCalculator.cs
@@ -32,7 +32,7 @@ public static Trend AdjustForPolarity(Trend trend, string polarity) {
 
         if (
             polarity == null ||
-            polarity == Polarity.NotApplicable || 
+            polarity == Polarity.NoJudgement || 
             (!isIncreasing && !isDecreasing)
         ) {
             return trend;
diff --git a/trend-analysis/TrendAnalysisApp/Constants.cs b/trend-analysis/TrendAnalysisApp/Constants.cs
index 61a12f20c..fa3c899d6 100644
--- a/trend-analysis/TrendAnalysisApp/Constants.cs
+++ b/trend-analysis/TrendAnalysisApp/Constants.cs
@@ -12,7 +12,7 @@ public static class Database {
     public static class Polarity {
         public const string LowIsGood = "Low is good";
         public const string HighIsGood = "High is good";
-        public const string NotApplicable = "Not applicable";
+        public const string NoJudgement = "No judgement";
     }
 
     public static class Trend {


Reviews:
user: login: williamwillis11
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-17T13:23:54Z
user: login: dlzhry2
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-17T13:25:37Z
user: login: dlzhry2
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-17T14:23:43Z
user: login: adawari-thomas-bjss
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-17T15:44:17Z
user: login: dlzhry2
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-18T09:18:20Z
user: login: dlzhry2
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-18T09:18:39Z
user: login: adawari-thomas-bjss
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-03-18T09:49:59Z
user: login: williamwillis11
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-03-18T10:37:20Z

Review comments:
path: frontend/fingertips-frontend/package-lock.json
user: login: williamwillis11
body: why did this file change? looks like just formatting but it hard to be sure
created_at: 2025-03-17T13:23:54Z
author_association: CONTRIBUTOR
path: frontend/fingertips-frontend/package-lock.json
user: login: dlzhry2
body: Yup, read through and only is formatting. I ran `npm run lint, npm run prettier` and so on. In the past it never seems to have touched it...bit strange, but I didn't manually touch or even open it!
created_at: 2025-03-17T13:25:37Z
author_association: CONTRIBUTOR
diff_hunk: @@ -19,6 +19,8 @@ services:
     depends_on:
       db-setup:
         condition: service_completed_successfully
+      db-apply-trends:
path: compose.yaml
user: login: dlzhry2
body: This ensures that the API container does not start until the db has been seeded AND trend data has been calculated.

This ensures consistency for e2e tests and, now that we have trend data in the screenshots, tests are only executed once the DB is fully prepared.

Discussed with @williamwillis11 - this will add around 30 seconds to the running time, but I am looking into parallelising the trend-analysis app so it should get faster.
created_at: 2025-03-17T14:23:43Z
author_association: CONTRIBUTOR
diff_hunk: @@ -151,3 +151,98 @@ export const GROUPED_YEAR_DATA = {
     Female: [MOCK_HEALTH_DATA[1].healthData[2]],
   },
 };
+
+export const MOCK_HEALTH_DATA_WITH_TRENDS = [
+  {
+    areaCode: '1472',
+    areaName: 'Manchester - Counties and Unitary Authorities',
+    healthData: [
+      {
+        year: 2019,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'All',
path: frontend/fingertips-frontend/lib/tableHelpers/mocks.ts
user: login: adawari-thomas-bjss
body: Could all these be changed to `Persons` instead of `All` as the api no longer returns the `All` value for the sex field
```suggestion
        sex: 'Persons',
```
created_at: 2025-03-17T15:44:17Z
author_association: CONTRIBUTOR
diff_hunk: @@ -19,6 +19,8 @@ services:
     depends_on:
       db-setup:
         condition: service_completed_successfully
+      db-apply-trends:
path: compose.yaml
user: login: dlzhry2
body: This has been parallelised now. Resolving.
created_at: 2025-03-18T09:18:20Z
author_association: CONTRIBUTOR
diff_hunk: @@ -151,3 +151,98 @@ export const GROUPED_YEAR_DATA = {
     Female: [MOCK_HEALTH_DATA[1].healthData[2]],
   },
 };
+
+export const MOCK_HEALTH_DATA_WITH_TRENDS = [
+  {
+    areaCode: '1472',
+    areaName: 'Manchester - Counties and Unitary Authorities',
+    healthData: [
+      {
+        year: 2019,
+        count: 1400,
+        value: 222.305692,
+        lowerCi: 220.69151,
+        upperCi: 224.32766,
+        ageBand: 'All',
+        sex: 'All',
path: frontend/fingertips-frontend/lib/tableHelpers/mocks.ts
user: login: dlzhry2
body: Thanks - good point. I've updated. Please check you're happy with the changes.
created_at: 2025-03-18T09:18:39Z
author_association: CONTRIBUTOR

PR comments:
user: login: sonarqubecloud[bot]
created_at: 2025-03-18T10:39:15Z
body: ## [![Quality Gate Passed](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/checks/QualityGateBadge/qg-passed-20px.png 'Quality Gate Passed')](https://sonarcloud.io/dashboard?id=dhsc-govuk_FingertipsNext&pullRequest=285) **Quality Gate passed**  
Issues  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0 New issues](https://sonarcloud.io/project/issues?id=dhsc-govuk_FingertipsNext&pullRequest=285&issueStatuses=OPEN,CONFIRMED&sinceLeakPeriod=true)  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/accepted-16px.png '') [0 Accepted issues](https://sonarcloud.io/project/issues?id=dhsc-govuk_FingertipsNext&pullRequest=285&issueStatuses=ACCEPTED)

Measures  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0 Security Hotspots](https://sonarcloud.io/project/security_hotspots?id=dhsc-govuk_FingertipsNext&pullRequest=285&issueStatuses=OPEN,CONFIRMED&sinceLeakPeriod=true)  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0.0% Coverage on New Code](https://sonarcloud.io/component_measures?id=dhsc-govuk_FingertipsNext&pullRequest=285&metric=new_coverage&view=list)  
![](https://sonarsource.github.io/sonarcloud-github-static-resources/v2/common/passed-16px.png '') [0.0% Duplication on New Code](https://sonarcloud.io/component_measures?id=dhsc-govuk_FingertipsNext&pullRequest=285&metric=new_duplicated_lines_density&view=list)  
  
[See analysis details on SonarQube Cloud](https://sonarcloud.io/dashboard?id=dhsc-govuk_FingertipsNext&pullRequest=285)


author_association: NONE