From 7c6018d77d1f68ea6567f5832e8a992ea94cf706 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Tue, 4 Feb 2025 11:36:53 +0000
Subject: [PATCH 01/16] Basic display functionality for pay uplift

---
 front_end/src/Apps/Payroll.jsx                | 18 +++++++++-
 .../EditPayroll/DisplayPayModifier/index.jsx  | 34 +++++++++++++++++++
 .../EditPayroll/EditPayModifier/index.jsx     | 17 +++-------
 .../EditPayroll/PayModifierHeaders/index.jsx  | 19 +++++++++++
 payroll/services/payroll.py                   | 25 +++++++++++---
 5 files changed, 94 insertions(+), 19 deletions(-)
 create mode 100644 front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
 create mode 100644 front_end/src/Components/EditPayroll/PayModifierHeaders/index.jsx

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index 0d9ab940d..1837238f5 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -10,6 +10,7 @@ import VacancyRow from "../Components/EditPayroll/VacancyRow";
 import PayrollTable from "../Components/EditPayroll/PayrollTable";
 import Tabs, { Tab } from "../Components/EditPayroll/Tabs";
 import EditPayModifier from "../Components/EditPayroll/EditPayModifier";
+import DisplayPayModifier from "../Components/EditPayroll/DisplayPayModifier";
 import ToggleCheckbox from "../Components/Common/ToggleCheckbox";
 import ErrorSummary from "../Components/Common/ErrorSummary";
 import SuccessBanner from "../Components/Common/SuccessBanner";
@@ -72,6 +73,20 @@ export default function Payroll() {
     () => allPayroll.employees.filter((payroll) => payroll.basic_pay <= 0),
     [allPayroll],
   );
+  const attrition = useMemo(
+    () =>
+      allPayroll.pay_modifiers.filter(
+        (modifier) => modifier.name == "Attrition",
+      ),
+    [allPayroll],
+  );
+  const pay_uplift = useMemo(
+    () =>
+      allPayroll.pay_modifiers.filter(
+        (modifier) => modifier.name == "Pay Uplift",
+      ),
+    [allPayroll],
+  );
 
   const forecastAndActuals = useMemo(() => {
     const total_results = [];
@@ -195,10 +210,11 @@ export default function Payroll() {
         </Tab>
         <Tab label="Pay modifiers" key="4">
           <EditPayModifier
-            data={allPayroll.pay_modifiers}
+            data={attrition}
             onInputChange={handleUpdatePayModifiers}
             onCreate={handleCreatePayModifiers}
           />
+          <DisplayPayModifier data={pay_uplift} />
         </Tab>
       </Tabs>
       <button className="govuk-button" onClick={handleSavePayroll}>
diff --git a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
new file mode 100644
index 000000000..f491f7547
--- /dev/null
+++ b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
@@ -0,0 +1,34 @@
+import PayModifierHeaders from "../PayModifierHeaders";
+
+const DisplayPayModifier = ({ data }) => {
+  if (data.length === 0) {
+    return (
+      <>
+        <h3 className="govuk-heading-s">Pay uplift</h3>
+        <p className="govuk-body">No pay uplift set</p>
+      </>
+    );
+  }
+
+  return data.map((row, index) => (
+    <div className="govuk-form-group" key={index}>
+      <h3 className="govuk-heading-s">{row.name}</h3>
+      <table className="govuk-table">
+        <PayModifierHeaders />
+        <tbody className="govuk-table__body">
+          <tr className="govuk-table__row">
+            {row.pay_modifiers.map((value, index) => {
+              return (
+                <td className="govuk-table__cell" key={index}>
+                  {value}
+                </td>
+              );
+            })}
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  ));
+};
+
+export default DisplayPayModifier;
diff --git a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
index f19e63b54..c8c338f91 100644
--- a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
@@ -1,10 +1,11 @@
-import { monthsToTitleCase } from "../../../Util";
+import PayModifierHeaders from "../PayModifierHeaders";
 
 const EditPayModifier = ({ data, onInputChange, onCreate }) => {
   if (data.length === 0) {
     return (
       <>
-        <p className="govuk-body">No modifiers set</p>
+        <h3 className="govuk-heading-s">Attrition</h3>
+        <p className="govuk-body">No attrition set</p>
         <button
           className="govuk-button govuk-button--secondary"
           onClick={onCreate}
@@ -19,17 +20,7 @@ const EditPayModifier = ({ data, onInputChange, onCreate }) => {
     <div className="govuk-form-group" key={index}>
       <h3 className="govuk-heading-s">Attrition</h3>
       <table className="govuk-table">
-        <thead className="govuk-table__head">
-          <tr className="govuk-table__row">
-            {monthsToTitleCase.map((header) => {
-              return (
-                <th scope="col" className="govuk-table__header" key={header}>
-                  {header}
-                </th>
-              );
-            })}
-          </tr>
-        </thead>
+        <PayModifierHeaders />
         <tbody className="govuk-table__body">
           <tr className="govuk-table__row">
             {row.pay_modifiers.map((value, index) => {
diff --git a/front_end/src/Components/EditPayroll/PayModifierHeaders/index.jsx b/front_end/src/Components/EditPayroll/PayModifierHeaders/index.jsx
new file mode 100644
index 000000000..a7f8a8bfa
--- /dev/null
+++ b/front_end/src/Components/EditPayroll/PayModifierHeaders/index.jsx
@@ -0,0 +1,19 @@
+import { monthsToTitleCase } from "../../../Util";
+
+const PayModifierHeaders = () => {
+  return (
+    <thead className="govuk-table__head">
+      <tr className="govuk-table__row">
+        {monthsToTitleCase.map((header) => {
+          return (
+            <th scope="col" className="govuk-table__header" key={header}>
+              {header}
+            </th>
+          );
+        })}
+      </tr>
+    </thead>
+  );
+};
+
+export default PayModifierHeaders;
diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 64562324b..1015a42dd 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -1,6 +1,6 @@
 import operator
 from collections import defaultdict
-from itertools import accumulate
+from itertools import accumulate, chain
 from statistics import mean
 from typing import Iterator, TypedDict
 
@@ -351,6 +351,7 @@ def update_vacancies_data(
 
 class PayModifiers(TypedDict):
     id: int
+    name: str
     pay_modifiers: list[float]
 
 
@@ -358,12 +359,22 @@ def get_pay_modifiers_data(
     cost_centre: CostCentre,
     financial_year: FinancialYear,
 ) -> Iterator[PayModifiers]:
-    qs = Attrition.objects.filter(
+    attrition = Attrition.objects.filter(
         cost_centre=cost_centre,
         financial_year=financial_year,
     )
-    for obj in qs:
-        yield PayModifiers(id=obj.pk, pay_modifiers=obj.periods)
+    pay_uplift = PayUplift.objects.filter(
+        financial_year=financial_year,
+    )
+    pay_modifiers = chain(attrition, pay_uplift)
+
+    for obj in pay_modifiers:
+        print(type(obj) is Attrition)
+        name = "Attrition" if type(obj) is Attrition else "Pay Uplift"
+
+        print(name)
+
+        yield PayModifiers(id=obj.pk, name=name, pay_modifiers=obj.periods)
 
 
 def create_default_pay_modifiers(
@@ -385,7 +396,8 @@ def update_pay_modifiers_data(
     financial_year: FinancialYear,
     data: list[PayModifiers],
 ) -> None:
-    """Update pay modifiers for a given year and cost centre using the provided list.
+    """Update attrition pay modifiers for a given year and cost centre using the provided list.
+    Pay uplift is for display only.
 
     This function is wrapped with a transaction, so if any of the pay modifier updates fail,
     the whole batch will be rolled back.
@@ -397,6 +409,9 @@ def update_pay_modifiers_data(
     """
 
     for pay_modifier in data:
+        if pay_modifier.get("name") == "Pay Uplift":
+            break
+
         if not pay_modifier.get("id"):
             raise ValueError("id is empty")
 

From b5a4aa926c8fc3c2c26e9127c4a603940d891f3f Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Tue, 4 Feb 2025 11:47:01 +0000
Subject: [PATCH 02/16] Remove print statements

---
 payroll/services/payroll.py | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 1015a42dd..59c284189 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -369,11 +369,8 @@ def get_pay_modifiers_data(
     pay_modifiers = chain(attrition, pay_uplift)
 
     for obj in pay_modifiers:
-        print(type(obj) is Attrition)
         name = "Attrition" if type(obj) is Attrition else "Pay Uplift"
 
-        print(name)
-
         yield PayModifiers(id=obj.pk, name=name, pay_modifiers=obj.periods)
 
 

From 7425042691937ab1523f24514cd850e79f45541a Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Wed, 12 Feb 2025 11:59:50 +0000
Subject: [PATCH 03/16] Refactor pay_modifier endpoint

---
 payroll/services/payroll.py | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 2c5fef4a6..01d942958 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -1,6 +1,6 @@
 import operator
 from collections import defaultdict
-from itertools import accumulate, chain
+from itertools import accumulate
 from statistics import mean
 from typing import Iterator, TypedDict
 
@@ -395,9 +395,8 @@ def update_vacancies_data(
 
 
 class PayModifiers(TypedDict):
-    id: int
-    name: str
-    pay_modifiers: list[float]
+    attrition: list[float]
+    pay_uplift: list[float]
 
 
 def get_pay_modifiers_data(
@@ -411,12 +410,10 @@ def get_pay_modifiers_data(
     pay_uplift = PayUplift.objects.filter(
         financial_year=financial_year,
     )
-    pay_modifiers = chain(attrition, pay_uplift)
-
-    for obj in pay_modifiers:
-        name = "Attrition" if type(obj) is Attrition else "Pay Uplift"
+    attrition_periods = attrition.periods if attrition else []
+    pay_uplift_periods = pay_uplift.periods if pay_uplift else []
 
-        yield PayModifiers(id=obj.pk, name=name, pay_modifiers=obj.periods)
+    return {"attrition": attrition_periods, "pay_uplift": pay_uplift_periods}
 
 
 def create_default_pay_modifiers(

From 3b8cc01e74a11d1354d554b250af0be3d6250c6a Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Wed, 12 Feb 2025 13:12:54 +0000
Subject: [PATCH 04/16] wip

---
 front_end/src/Apps/Payroll.jsx                | 19 ++-----------------
 .../EditPayroll/EditPayModifier/index.jsx     |  2 +-
 payroll/api.py                                |  9 ++++-----
 payroll/services/payroll.py                   |  5 +++--
 4 files changed, 10 insertions(+), 25 deletions(-)

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index 1837238f5..2ab6d75c2 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -73,21 +73,6 @@ export default function Payroll() {
     () => allPayroll.employees.filter((payroll) => payroll.basic_pay <= 0),
     [allPayroll],
   );
-  const attrition = useMemo(
-    () =>
-      allPayroll.pay_modifiers.filter(
-        (modifier) => modifier.name == "Attrition",
-      ),
-    [allPayroll],
-  );
-  const pay_uplift = useMemo(
-    () =>
-      allPayroll.pay_modifiers.filter(
-        (modifier) => modifier.name == "Pay Uplift",
-      ),
-    [allPayroll],
-  );
-
   const forecastAndActuals = useMemo(() => {
     const total_results = [];
 
@@ -210,11 +195,11 @@ export default function Payroll() {
         </Tab>
         <Tab label="Pay modifiers" key="4">
           <EditPayModifier
-            data={attrition}
+            data={allPayroll.pay_modifiers}
             onInputChange={handleUpdatePayModifiers}
             onCreate={handleCreatePayModifiers}
           />
-          <DisplayPayModifier data={pay_uplift} />
+          {/* <DisplayPayModifier data={allPayroll.pay_modifiers.pay_uplift} /> */}
         </Tab>
       </Tabs>
       <button className="govuk-button" onClick={handleSavePayroll}>
diff --git a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
index c8c338f91..8b9616bf0 100644
--- a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
@@ -1,7 +1,7 @@
 import PayModifierHeaders from "../PayModifierHeaders";
 
 const EditPayModifier = ({ data, onInputChange, onCreate }) => {
-  if (data.length === 0) {
+  if (!data) {
     return (
       <>
         <h3 className="govuk-heading-s">Attrition</h3>
diff --git a/payroll/api.py b/payroll/api.py
index 494c51337..3bd2b0914 100644
--- a/payroll/api.py
+++ b/payroll/api.py
@@ -23,12 +23,11 @@ def get(self, request, *args, **kwargs):
                 self.financial_year,
             )
         )
-        pay_modifiers = list(
-            payroll_service.get_pay_modifiers_data(
-                self.cost_centre,
-                self.financial_year,
-            )
+        pay_modifiers = payroll_service.get_pay_modifiers_data(
+            self.cost_centre,
+            self.financial_year,
         )
+
         forecast = list(
             payroll_service.payroll_forecast_report(
                 self.cost_centre, self.financial_year
diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 01d942958..1635a4d43 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -410,8 +410,9 @@ def get_pay_modifiers_data(
     pay_uplift = PayUplift.objects.filter(
         financial_year=financial_year,
     )
-    attrition_periods = attrition.periods if attrition else []
-    pay_uplift_periods = pay_uplift.periods if pay_uplift else []
+
+    attrition_periods = attrition.periods if hasattr(attrition, "periods") else []
+    pay_uplift_periods = pay_uplift.periods if hasattr(pay_uplift, "periods") else []
 
     return {"attrition": attrition_periods, "pay_uplift": pay_uplift_periods}
 

From c8ad12487ebd4e865f4e21ceef7321ad9a739003 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Wed, 12 Feb 2025 16:20:32 +0000
Subject: [PATCH 05/16] Fix get, update and save for refactored attrition

---
 front_end/src/Apps/Payroll.jsx                | 36 +++++-----
 .../EditPayroll/DisplayPayModifier/index.jsx  |  2 +-
 .../EditPayroll/EditPayModifier/index.jsx     | 12 ++--
 payroll/api.py                                |  5 +-
 payroll/services/payroll.py                   | 65 +++++++++----------
 5 files changed, 53 insertions(+), 67 deletions(-)

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index 2ab6d75c2..dcaa9ff66 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -124,8 +124,8 @@ export default function Payroll() {
     dispatch({ type: "updatePayPeriodsVacancies", id, index, enabled });
   }
 
-  function handleUpdatePayModifiers(id, index, value) {
-    dispatch({ type: "updatePayModifiers", id, index, value });
+  function handleUpdatePayModifier(index, value) {
+    dispatch({ type: "updatePayModifier", index, value });
   }
 
   function handleCreatePayModifiers() {
@@ -195,8 +195,8 @@ export default function Payroll() {
         </Tab>
         <Tab label="Pay modifiers" key="4">
           <EditPayModifier
-            data={allPayroll.pay_modifiers}
-            onInputChange={handleUpdatePayModifiers}
+            data={allPayroll.pay_modifiers.attrition}
+            onInputChange={handleUpdatePayModifier}
             onCreate={handleCreatePayModifiers}
           />
           {/* <DisplayPayModifier data={allPayroll.pay_modifiers.pay_uplift} /> */}
@@ -231,22 +231,15 @@ function updatePayPeriods(data, action) {
   });
 }
 
-function updatePayModifiers(data, action) {
-  return data.map((row) => {
-    if (row.id === action.id) {
-      const updatedPayModifier = row.pay_modifiers.map((modifier, index) => {
-        if (index === action.index) {
-          return parseFloat(action.value);
-        }
-        return modifier;
-      });
-      return {
-        ...row,
-        pay_modifiers: updatedPayModifier,
-      };
+function updatePayModifier(data, action) {
+  const updatedPayModifier = data.map((value, index) => {
+    if (index === action.index) {
+      return parseFloat(action.value);
     }
-    return row;
+    return value;
   });
+
+  return updatedPayModifier;
 }
 
 const payrollReducer = (data, action) => {
@@ -266,10 +259,13 @@ const payrollReducer = (data, action) => {
         vacancies: updatePayPeriods(data.vacancies, action),
       };
     }
-    case "updatePayModifiers": {
+    case "updatePayModifier": {
       return {
         ...data,
-        pay_modifiers: updatePayModifiers(data.pay_modifiers, action),
+        pay_modifiers: {
+          attrition: updatePayModifier(data.pay_modifiers.attrition, action),
+          pay_uplift: data.pay_modifiers.pay_uplift,
+        },
       };
     }
   }
diff --git a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
index f491f7547..78ab8701d 100644
--- a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
@@ -1,7 +1,7 @@
 import PayModifierHeaders from "../PayModifierHeaders";
 
 const DisplayPayModifier = ({ data }) => {
-  if (data.length === 0) {
+  if (!data) {
     return (
       <>
         <h3 className="govuk-heading-s">Pay uplift</h3>
diff --git a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
index 8b9616bf0..f5d839e53 100644
--- a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
@@ -16,14 +16,14 @@ const EditPayModifier = ({ data, onInputChange, onCreate }) => {
     );
   }
 
-  return data.map((row, index) => (
-    <div className="govuk-form-group" key={index}>
+  return (
+    <div className="govuk-form-group">
       <h3 className="govuk-heading-s">Attrition</h3>
       <table className="govuk-table">
         <PayModifierHeaders />
         <tbody className="govuk-table__body">
           <tr className="govuk-table__row">
-            {row.pay_modifiers.map((value, index) => {
+            {data.map((value, index) => {
               return (
                 <td className="govuk-table__cell" key={index}>
                   <input
@@ -32,9 +32,7 @@ const EditPayModifier = ({ data, onInputChange, onCreate }) => {
                     name={`modifier-${index}`}
                     type="number"
                     defaultValue={value}
-                    onChange={(e) =>
-                      onInputChange(row.id, index, e.target.value)
-                    }
+                    onChange={(e) => onInputChange(index, e.target.value)}
                   ></input>
                 </td>
               );
@@ -43,7 +41,7 @@ const EditPayModifier = ({ data, onInputChange, onCreate }) => {
         </tbody>
       </table>
     </div>
-  ));
+  );
 };
 
 export default EditPayModifier;
diff --git a/payroll/api.py b/payroll/api.py
index 3bd2b0914..f1b4c9fda 100644
--- a/payroll/api.py
+++ b/payroll/api.py
@@ -51,7 +51,6 @@ def get(self, request, *args, **kwargs):
 
     def post(self, request, *args, **kwargs):
         data = json.loads(request.body)
-
         payroll_service.update_employee_data(
             self.cost_centre,
             self.financial_year,
@@ -62,10 +61,10 @@ def post(self, request, *args, **kwargs):
             self.financial_year,
             data["vacancies"],
         )
-        payroll_service.update_pay_modifiers_data(
+        payroll_service.update_pay_modifier_data(
             self.cost_centre,
             self.financial_year,
-            data["pay_modifiers"],
+            data["pay_modifiers"]["attrition"],
         )
 
         if settings.PAYROLL.ENABLE_FORECAST is True:
diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 1635a4d43..e3af2159a 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -406,13 +406,18 @@ def get_pay_modifiers_data(
     attrition = Attrition.objects.filter(
         cost_centre=cost_centre,
         financial_year=financial_year,
-    )
+    ).first()
     pay_uplift = PayUplift.objects.filter(
         financial_year=financial_year,
-    )
+    ).first()
 
-    attrition_periods = attrition.periods if hasattr(attrition, "periods") else []
-    pay_uplift_periods = pay_uplift.periods if hasattr(pay_uplift, "periods") else []
+    attrition_periods = []
+    pay_uplift_periods = []
+
+    if attrition:
+        attrition_periods = attrition.periods
+    if pay_uplift:
+        pay_uplift_periods = pay_uplift.periods
 
     return {"attrition": attrition_periods, "pay_uplift": pay_uplift_periods}
 
@@ -431,50 +436,38 @@ def create_default_pay_modifiers(
 
 
 @transaction.atomic
-def update_pay_modifiers_data(
+def update_pay_modifier_data(
     cost_centre: CostCentre,
     financial_year: FinancialYear,
-    data: list[PayModifiers],
+    data: list[float],
 ) -> None:
-    """Update attrition pay modifiers for a given year and cost centre using the provided list.
-    Pay uplift is for display only.
-
-    This function is wrapped with a transaction, so if any of the pay modifier updates fail,
-    the whole batch will be rolled back.
+    """Update attrition pay modifier for a given year and cost centre.
 
     Raises:
-        ValueError: If a pay modifier id is empty.
-        ValueError: If there are not 12 items in the pay_modifiers list.
-        ValueError: If any of the pay_modifiers are not of type int or float.
+        ValueError: If there are not 12 items in the list.
+        ValueError: If any of the values are not of type int or float.
     """
 
-    for pay_modifier in data:
-        if pay_modifier.get("name") == "Pay Uplift":
-            break
-
-        if not pay_modifier.get("id"):
-            raise ValueError("id is empty")
-
-        if len(pay_modifier["pay_modifiers"]) != 12:
-            raise ValueError("pay_modifiers list should be of length 12")
+    if len(data) != 12:
+        raise ValueError("Attrition object should be of length 12")
 
-        if not all(isinstance(x, (int, float)) for x in pay_modifier["pay_modifiers"]):
-            raise ValueError("pay_modifiers items should be of type int or float")
+    if not all(isinstance(x, (int, float)) for x in data):
+        raise ValueError("Attrition object should be of type int or float")
 
-        attrition = Attrition.objects.get(
-            cost_centre=cost_centre,
-            financial_year=financial_year,
-        )
+    attrition = Attrition.objects.get(
+        cost_centre=cost_centre,
+        financial_year=financial_year,
+    )
 
-        for index, month in enumerate(MONTHS):
-            setattr(attrition, month, pay_modifier["pay_modifiers"][index])
+    for index, month in enumerate(MONTHS):
+        setattr(attrition, month, data[index])
 
-        try:
-            attrition.clean()
-        except Exception as ex:
-            raise ValueError(ex)
+    try:
+        attrition.clean()
+    except Exception as ex:
+        raise ValueError(ex)
 
-        attrition.save()
+    attrition.save()
 
 
 def get_actuals_data(

From 09d4c6822b5a2dcc77ac65a79b1e0e2210da87c0 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Wed, 12 Feb 2025 16:39:03 +0000
Subject: [PATCH 06/16] Fix pay uplift after refactor and account for no
 attrition on save

---
 front_end/src/Apps/Payroll.jsx                       |  2 +-
 .../EditPayroll/DisplayPayModifier/index.jsx         | 12 ++++++------
 .../Components/EditPayroll/EditPayModifier/index.jsx |  2 +-
 payroll/api.py                                       | 11 ++++++-----
 4 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index dcaa9ff66..744491edb 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -199,7 +199,7 @@ export default function Payroll() {
             onInputChange={handleUpdatePayModifier}
             onCreate={handleCreatePayModifiers}
           />
-          {/* <DisplayPayModifier data={allPayroll.pay_modifiers.pay_uplift} /> */}
+          <DisplayPayModifier data={allPayroll.pay_modifiers.pay_uplift} />
         </Tab>
       </Tabs>
       <button className="govuk-button" onClick={handleSavePayroll}>
diff --git a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
index 78ab8701d..670c98454 100644
--- a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
@@ -1,7 +1,7 @@
 import PayModifierHeaders from "../PayModifierHeaders";
 
 const DisplayPayModifier = ({ data }) => {
-  if (!data) {
+  if (!data || data <= 0) {
     return (
       <>
         <h3 className="govuk-heading-s">Pay uplift</h3>
@@ -10,14 +10,14 @@ const DisplayPayModifier = ({ data }) => {
     );
   }
 
-  return data.map((row, index) => (
-    <div className="govuk-form-group" key={index}>
-      <h3 className="govuk-heading-s">{row.name}</h3>
+  return (
+    <div className="govuk-form-group">
+      <h3 className="govuk-heading-s">Pay Uplift</h3>
       <table className="govuk-table">
         <PayModifierHeaders />
         <tbody className="govuk-table__body">
           <tr className="govuk-table__row">
-            {row.pay_modifiers.map((value, index) => {
+            {data.map((value, index) => {
               return (
                 <td className="govuk-table__cell" key={index}>
                   {value}
@@ -28,7 +28,7 @@ const DisplayPayModifier = ({ data }) => {
         </tbody>
       </table>
     </div>
-  ));
+  );
 };
 
 export default DisplayPayModifier;
diff --git a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
index f5d839e53..06ca5f543 100644
--- a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
@@ -1,7 +1,7 @@
 import PayModifierHeaders from "../PayModifierHeaders";
 
 const EditPayModifier = ({ data, onInputChange, onCreate }) => {
-  if (!data) {
+  if (!data || data <= 0) {
     return (
       <>
         <h3 className="govuk-heading-s">Attrition</h3>
diff --git a/payroll/api.py b/payroll/api.py
index f1b4c9fda..a624f614e 100644
--- a/payroll/api.py
+++ b/payroll/api.py
@@ -61,11 +61,12 @@ def post(self, request, *args, **kwargs):
             self.financial_year,
             data["vacancies"],
         )
-        payroll_service.update_pay_modifier_data(
-            self.cost_centre,
-            self.financial_year,
-            data["pay_modifiers"]["attrition"],
-        )
+        if data["pay_modifiers"]["attrition"]:
+            payroll_service.update_pay_modifier_data(
+                self.cost_centre,
+                self.financial_year,
+                data["pay_modifiers"]["attrition"],
+            )
 
         if settings.PAYROLL.ENABLE_FORECAST is True:
             payroll_service.update_payroll_forecast(

From ad6708a1cd04ef253a68babbd59f1eb96e3e5241 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Wed, 12 Feb 2025 16:41:06 +0000
Subject: [PATCH 07/16] Rename service method

---
 payroll/api.py              | 2 +-
 payroll/services/payroll.py | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/payroll/api.py b/payroll/api.py
index a624f614e..71dec0b4e 100644
--- a/payroll/api.py
+++ b/payroll/api.py
@@ -62,7 +62,7 @@ def post(self, request, *args, **kwargs):
             data["vacancies"],
         )
         if data["pay_modifiers"]["attrition"]:
-            payroll_service.update_pay_modifier_data(
+            payroll_service.update_attrition_data(
                 self.cost_centre,
                 self.financial_year,
                 data["pay_modifiers"]["attrition"],
diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index e3af2159a..974382e24 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -436,7 +436,7 @@ def create_default_pay_modifiers(
 
 
 @transaction.atomic
-def update_pay_modifier_data(
+def update_attrition_data(
     cost_centre: CostCentre,
     financial_year: FinancialYear,
     data: list[float],

From 7d537503e9a83f80ef323513698b89c1d595798a Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Wed, 12 Feb 2025 16:43:26 +0000
Subject: [PATCH 08/16] Use attrition instance method

---
 payroll/services/payroll.py | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 974382e24..0e27618ec 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -403,10 +403,7 @@ def get_pay_modifiers_data(
     cost_centre: CostCentre,
     financial_year: FinancialYear,
 ) -> Iterator[PayModifiers]:
-    attrition = Attrition.objects.filter(
-        cost_centre=cost_centre,
-        financial_year=financial_year,
-    ).first()
+    attrition = get_attrition_instance(financial_year, cost_centre)
     pay_uplift = PayUplift.objects.filter(
         financial_year=financial_year,
     ).first()

From 60d9048c2ad59df186c3a5f914a1551669b553d9 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Thu, 13 Feb 2025 11:07:22 +0000
Subject: [PATCH 09/16] Rename to specify attrition

---
 front_end/src/Apps/Payroll.jsx | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index 744491edb..6c828d4f7 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -124,11 +124,11 @@ export default function Payroll() {
     dispatch({ type: "updatePayPeriodsVacancies", id, index, enabled });
   }
 
-  function handleUpdatePayModifier(index, value) {
-    dispatch({ type: "updatePayModifier", index, value });
+  function handleUpdateAttrition(index, value) {
+    dispatch({ type: "updateAttrition", index, value });
   }
 
-  function handleCreatePayModifiers() {
+  function handleCreateAttrition() {
     api.createPayModifiers().then((r) => {
       getAllPayroll();
     });
@@ -196,8 +196,8 @@ export default function Payroll() {
         <Tab label="Pay modifiers" key="4">
           <EditPayModifier
             data={allPayroll.pay_modifiers.attrition}
-            onInputChange={handleUpdatePayModifier}
-            onCreate={handleCreatePayModifiers}
+            onInputChange={handleUpdateAttrition}
+            onCreate={handleCreateAttrition}
           />
           <DisplayPayModifier data={allPayroll.pay_modifiers.pay_uplift} />
         </Tab>
@@ -231,15 +231,15 @@ function updatePayPeriods(data, action) {
   });
 }
 
-function updatePayModifier(data, action) {
-  const updatedPayModifier = data.map((value, index) => {
+function updateAttrition(data, action) {
+  const updatedAttrition = data.map((value, index) => {
     if (index === action.index) {
       return parseFloat(action.value);
     }
     return value;
   });
 
-  return updatedPayModifier;
+  return updatedAttrition;
 }
 
 const payrollReducer = (data, action) => {
@@ -259,11 +259,11 @@ const payrollReducer = (data, action) => {
         vacancies: updatePayPeriods(data.vacancies, action),
       };
     }
-    case "updatePayModifier": {
+    case "updateAttrition": {
       return {
         ...data,
         pay_modifiers: {
-          attrition: updatePayModifier(data.pay_modifiers.attrition, action),
+          attrition: updateAttrition(data.pay_modifiers.attrition, action),
           pay_uplift: data.pay_modifiers.pay_uplift,
         },
       };

From 655a63c2e3b26703fbdcb806a6787876141958e3 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Thu, 13 Feb 2025 11:21:03 +0000
Subject: [PATCH 10/16] Fix types

---
 front_end/src/Components/EditPayroll/types.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/front_end/src/Components/EditPayroll/types.js b/front_end/src/Components/EditPayroll/types.js
index 7fc8577a4..a701e4a84 100644
--- a/front_end/src/Components/EditPayroll/types.js
+++ b/front_end/src/Components/EditPayroll/types.js
@@ -27,8 +27,8 @@
 
 /**
  * @typedef {Object} PayModifierData
- * @property {number} id - The pay modifier's pk.
- * @property {number[]} pay_modifiers - The pay modifier's monthly percentages
+ * @property {float[]} attrition - The monthly percentages for attrition
+ * @property {float[]} pay_uplift - The monthly percentages for pay uplift
  */
 
 /**
@@ -60,7 +60,7 @@
  * @typedef {Object} PayrollData
  * @property {EmployeeData[]} employees - A list of employees
  * @property {VacancyData[]} vacancies - A list of vacancies
- * @property {PayModifierData[]} pay_modifiers - A list of pay modifiers
+ * @property {PayModifierData[]} pay_modifiers - An object with attrition and pay uplift
  * @property {ForecastData[]} forecast - A list of forecast data
  * @property {PreviousMonthsData[]} previous_months - A list of months with actuals loaded
  */

From 5c38cf900de5da6939a240357ed535e18025c5fc Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Thu, 13 Feb 2025 11:56:29 +0000
Subject: [PATCH 11/16] Refactor endpoint to include global attrition object

---
 payroll/services/payroll.py | 23 ++++++++++++++---------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 0e27618ec..359d31e25 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -403,20 +403,25 @@ def get_pay_modifiers_data(
     cost_centre: CostCentre,
     financial_year: FinancialYear,
 ) -> Iterator[PayModifiers]:
-    attrition = get_attrition_instance(financial_year, cost_centre)
+    global_attrition = Attrition.objects.filter(
+        financial_year=financial_year, cost_centre=None
+    ).first()
+    attrition = Attrition.objects.filter(
+        financial_year=financial_year, cost_centre=cost_centre
+    ).first()
     pay_uplift = PayUplift.objects.filter(
         financial_year=financial_year,
     ).first()
 
-    attrition_periods = []
-    pay_uplift_periods = []
-
-    if attrition:
-        attrition_periods = attrition.periods
-    if pay_uplift:
-        pay_uplift_periods = pay_uplift.periods
+    global_attrition_periods = [] if not global_attrition else global_attrition.periods
+    attrition_periods = [] if not attrition else attrition.periods
+    pay_uplift_periods = [] if not pay_uplift else pay_uplift.periods
 
-    return {"attrition": attrition_periods, "pay_uplift": pay_uplift_periods}
+    return {
+        "global_attrition": global_attrition_periods,
+        "attrition": attrition_periods,
+        "pay_uplift": pay_uplift_periods,
+    }
 
 
 def create_default_pay_modifiers(

From f26a519058162d1d8772e6035f684bb603719096 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Thu, 13 Feb 2025 13:58:26 +0000
Subject: [PATCH 12/16] First pass on read only global attrition

---
 front_end/src/Apps/Payroll.jsx                | 23 ++++++++---
 .../EditPayroll/DisplayPayModifier/index.jsx  | 39 ++++++++++++++++---
 2 files changed, 51 insertions(+), 11 deletions(-)

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index 6c828d4f7..e36a52bcc 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -194,12 +194,25 @@ export default function Payroll() {
           </a>
         </Tab>
         <Tab label="Pay modifiers" key="4">
-          <EditPayModifier
-            data={allPayroll.pay_modifiers.attrition}
-            onInputChange={handleUpdateAttrition}
-            onCreate={handleCreateAttrition}
+          {allPayroll.pay_modifiers.attrition &&
+          allPayroll.pay_modifiers.attrition.length ? (
+            <EditPayModifier
+              data={allPayroll.pay_modifiers.attrition}
+              onInputChange={handleUpdateAttrition}
+              onCreate={handleCreateAttrition}
+            />
+          ) : (
+            <DisplayPayModifier
+              data={allPayroll.pay_modifiers.global_attrition}
+              title="Global attrition"
+              isAttrition={true}
+              onCreate={handleCreateAttrition}
+            />
+          )}
+          <DisplayPayModifier
+            data={allPayroll.pay_modifiers.pay_uplift}
+            title="Pay uplift"
           />
-          <DisplayPayModifier data={allPayroll.pay_modifiers.pay_uplift} />
         </Tab>
       </Tabs>
       <button className="govuk-button" onClick={handleSavePayroll}>
diff --git a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
index 670c98454..56c304161 100644
--- a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
@@ -1,18 +1,31 @@
 import PayModifierHeaders from "../PayModifierHeaders";
 
-const DisplayPayModifier = ({ data }) => {
+const DisplayPayModifier = ({
+  data,
+  title,
+  isAttrition = false,
+  onCreate = [],
+}) => {
   if (!data || data <= 0) {
     return (
       <>
-        <h3 className="govuk-heading-s">Pay uplift</h3>
-        <p className="govuk-body">No pay uplift set</p>
+        <h3 className="govuk-heading-s">{title}</h3>
+        <p className="govuk-body">No {title.toLowerCase()} set</p>
+        {isAttrition && (
+          <button
+            className="govuk-button govuk-button--secondary"
+            onClick={onCreate}
+          >
+            Add Attrition
+          </button>
+        )}
       </>
     );
   }
 
   return (
-    <div className="govuk-form-group">
-      <h3 className="govuk-heading-s">Pay Uplift</h3>
+    <>
+      <h3 className="govuk-heading-s">{title}</h3>
       <table className="govuk-table">
         <PayModifierHeaders />
         <tbody className="govuk-table__body">
@@ -27,7 +40,21 @@ const DisplayPayModifier = ({ data }) => {
           </tr>
         </tbody>
       </table>
-    </div>
+      {isAttrition && (
+        <>
+          <p className="govuk-body">
+            This attrition is for the current financial year. You can add one
+            for this specific cost centre instead.
+          </p>
+          <button
+            className="govuk-button govuk-button--secondary"
+            onClick={onCreate}
+          >
+            Add Attrition
+          </button>
+        </>
+      )}
+    </>
   );
 };
 

From 9d0693020c911c43c95ccd5889356c846263b675 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Thu, 13 Feb 2025 15:35:25 +0000
Subject: [PATCH 13/16] Refactor editModifier to be specific to displaying
 attrition

---
 front_end/src/Apps/Payroll.jsx                | 23 ++----
 .../EditPayroll/DisplayAttrition/index.jsx    | 71 +++++++++++++++++++
 .../EditPayroll/DisplayPayModifier/index.jsx  | 29 +-------
 .../EditPayroll/EditPayModifier/index.jsx     | 47 ------------
 4 files changed, 79 insertions(+), 91 deletions(-)
 create mode 100644 front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx
 delete mode 100644 front_end/src/Components/EditPayroll/EditPayModifier/index.jsx

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index e36a52bcc..dec7f878c 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -9,7 +9,7 @@ import EmployeeRow from "../Components/EditPayroll/EmployeeRow";
 import VacancyRow from "../Components/EditPayroll/VacancyRow";
 import PayrollTable from "../Components/EditPayroll/PayrollTable";
 import Tabs, { Tab } from "../Components/EditPayroll/Tabs";
-import EditPayModifier from "../Components/EditPayroll/EditPayModifier";
+import DisplayAttrition from "../Components/EditPayroll/DisplayAttrition";
 import DisplayPayModifier from "../Components/EditPayroll/DisplayPayModifier";
 import ToggleCheckbox from "../Components/Common/ToggleCheckbox";
 import ErrorSummary from "../Components/Common/ErrorSummary";
@@ -194,21 +194,12 @@ export default function Payroll() {
           </a>
         </Tab>
         <Tab label="Pay modifiers" key="4">
-          {allPayroll.pay_modifiers.attrition &&
-          allPayroll.pay_modifiers.attrition.length ? (
-            <EditPayModifier
-              data={allPayroll.pay_modifiers.attrition}
-              onInputChange={handleUpdateAttrition}
-              onCreate={handleCreateAttrition}
-            />
-          ) : (
-            <DisplayPayModifier
-              data={allPayroll.pay_modifiers.global_attrition}
-              title="Global attrition"
-              isAttrition={true}
-              onCreate={handleCreateAttrition}
-            />
-          )}
+          <DisplayAttrition
+            attrition={allPayroll.pay_modifiers.attrition}
+            global_attrition={allPayroll.pay_modifiers.global_attrition}
+            onInputChange={handleUpdateAttrition}
+            onCreate={handleCreateAttrition}
+          />
           <DisplayPayModifier
             data={allPayroll.pay_modifiers.pay_uplift}
             title="Pay uplift"
diff --git a/front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx b/front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx
new file mode 100644
index 000000000..7e5c8f01a
--- /dev/null
+++ b/front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx
@@ -0,0 +1,71 @@
+import PayModifierHeaders from "../PayModifierHeaders";
+import DisplayPayModifier from "../DisplayPayModifier";
+
+const DisplayAttrition = ({
+  attrition,
+  global_attrition,
+  onInputChange,
+  onCreate,
+}) => {
+  if (attrition && attrition.length > 0) {
+    return (
+      <div className="govuk-form-group">
+        <h3 className="govuk-heading-s">Attrition</h3>
+        <table className="govuk-table">
+          <PayModifierHeaders />
+          <tbody className="govuk-table__body">
+            <tr className="govuk-table__row">
+              {attrition.map((value, index) => {
+                return (
+                  <td className="govuk-table__cell" key={index}>
+                    <input
+                      className="govuk-input"
+                      id={`modifier-${index}`}
+                      name={`modifier-${index}`}
+                      type="number"
+                      defaultValue={value}
+                      onChange={(e) => onInputChange(index, e.target.value)}
+                    ></input>
+                  </td>
+                );
+              })}
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    );
+  }
+
+  if (global_attrition && global_attrition.length > 0) {
+    return (
+      <>
+        <DisplayPayModifier data={global_attrition} title="Global attrition" />
+        <p className="govuk-body">
+          This attrition is for the current financial year. You can add one for
+          this specific cost centre instead.
+        </p>
+        <button
+          className="govuk-button govuk-button--secondary"
+          onClick={onCreate}
+        >
+          Add Attrition
+        </button>
+      </>
+    );
+  }
+
+  return (
+    <>
+      <h3 className="govuk-heading-s">Attrition</h3>
+      <p className="govuk-body">No attrition set</p>
+      <button
+        className="govuk-button govuk-button--secondary"
+        onClick={onCreate}
+      >
+        Add Attrition
+      </button>
+    </>
+  );
+};
+
+export default DisplayAttrition;
diff --git a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
index 56c304161..f4af0caac 100644
--- a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
@@ -1,24 +1,11 @@
 import PayModifierHeaders from "../PayModifierHeaders";
 
-const DisplayPayModifier = ({
-  data,
-  title,
-  isAttrition = false,
-  onCreate = [],
-}) => {
+const DisplayPayModifier = ({ data, title }) => {
   if (!data || data <= 0) {
     return (
       <>
         <h3 className="govuk-heading-s">{title}</h3>
         <p className="govuk-body">No {title.toLowerCase()} set</p>
-        {isAttrition && (
-          <button
-            className="govuk-button govuk-button--secondary"
-            onClick={onCreate}
-          >
-            Add Attrition
-          </button>
-        )}
       </>
     );
   }
@@ -40,20 +27,6 @@ const DisplayPayModifier = ({
           </tr>
         </tbody>
       </table>
-      {isAttrition && (
-        <>
-          <p className="govuk-body">
-            This attrition is for the current financial year. You can add one
-            for this specific cost centre instead.
-          </p>
-          <button
-            className="govuk-button govuk-button--secondary"
-            onClick={onCreate}
-          >
-            Add Attrition
-          </button>
-        </>
-      )}
     </>
   );
 };
diff --git a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx b/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
deleted file mode 100644
index 06ca5f543..000000000
--- a/front_end/src/Components/EditPayroll/EditPayModifier/index.jsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import PayModifierHeaders from "../PayModifierHeaders";
-
-const EditPayModifier = ({ data, onInputChange, onCreate }) => {
-  if (!data || data <= 0) {
-    return (
-      <>
-        <h3 className="govuk-heading-s">Attrition</h3>
-        <p className="govuk-body">No attrition set</p>
-        <button
-          className="govuk-button govuk-button--secondary"
-          onClick={onCreate}
-        >
-          Add Attrition
-        </button>
-      </>
-    );
-  }
-
-  return (
-    <div className="govuk-form-group">
-      <h3 className="govuk-heading-s">Attrition</h3>
-      <table className="govuk-table">
-        <PayModifierHeaders />
-        <tbody className="govuk-table__body">
-          <tr className="govuk-table__row">
-            {data.map((value, index) => {
-              return (
-                <td className="govuk-table__cell" key={index}>
-                  <input
-                    className="govuk-input"
-                    id={`modifier-${index}`}
-                    name={`modifier-${index}`}
-                    type="number"
-                    defaultValue={value}
-                    onChange={(e) => onInputChange(index, e.target.value)}
-                  ></input>
-                </td>
-              );
-            })}
-          </tr>
-        </tbody>
-      </table>
-    </div>
-  );
-};
-
-export default EditPayModifier;

From fbab379a1f15f578af01f3804ac9cef6ac5f73b0 Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Thu, 13 Feb 2025 15:43:25 +0000
Subject: [PATCH 14/16] Update types

---
 front_end/src/Components/EditPayroll/types.js | 5 +++--
 payroll/services/payroll.py                   | 1 +
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/front_end/src/Components/EditPayroll/types.js b/front_end/src/Components/EditPayroll/types.js
index a701e4a84..063398c6a 100644
--- a/front_end/src/Components/EditPayroll/types.js
+++ b/front_end/src/Components/EditPayroll/types.js
@@ -27,7 +27,8 @@
 
 /**
  * @typedef {Object} PayModifierData
- * @property {float[]} attrition - The monthly percentages for attrition
+ * @property {float[]} global_attrition - The monthly percentages for attrition for that financial year
+ * @property {float[]} attrition - The monthly percentages for attrition scoped to the cost centre
  * @property {float[]} pay_uplift - The monthly percentages for pay uplift
  */
 
@@ -60,7 +61,7 @@
  * @typedef {Object} PayrollData
  * @property {EmployeeData[]} employees - A list of employees
  * @property {VacancyData[]} vacancies - A list of vacancies
- * @property {PayModifierData[]} pay_modifiers - An object with attrition and pay uplift
+ * @property {PayModifierData[]} pay_modifiers - An object with attrition, global attrition and pay uplift
  * @property {ForecastData[]} forecast - A list of forecast data
  * @property {PreviousMonthsData[]} previous_months - A list of months with actuals loaded
  */
diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index 359d31e25..ad3cfe4be 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -395,6 +395,7 @@ def update_vacancies_data(
 
 
 class PayModifiers(TypedDict):
+    global_attrition: list[float]
     attrition: list[float]
     pay_uplift: list[float]
 

From 754a6bd35ebb83fa3d8edd56670f06f3cc0e62ac Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Thu, 13 Feb 2025 16:14:20 +0000
Subject: [PATCH 15/16] Flip logic of pay modifiers in service method

---
 payroll/services/payroll.py | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/payroll/services/payroll.py b/payroll/services/payroll.py
index ad3cfe4be..4e8e56c33 100644
--- a/payroll/services/payroll.py
+++ b/payroll/services/payroll.py
@@ -414,9 +414,9 @@ def get_pay_modifiers_data(
         financial_year=financial_year,
     ).first()
 
-    global_attrition_periods = [] if not global_attrition else global_attrition.periods
-    attrition_periods = [] if not attrition else attrition.periods
-    pay_uplift_periods = [] if not pay_uplift else pay_uplift.periods
+    global_attrition_periods = global_attrition.periods if global_attrition else []
+    attrition_periods = attrition.periods if attrition else []
+    pay_uplift_periods = pay_uplift.periods if pay_uplift else []
 
     return {
         "global_attrition": global_attrition_periods,

From c8af9cc4bd43ae1861d74fc948e94d593785411e Mon Sep 17 00:00:00 2001
From: Caitlin Barnard <caitlin@madetech.com>
Date: Fri, 14 Feb 2025 09:56:31 +0000
Subject: [PATCH 16/16] Refactor

---
 front_end/src/Apps/Payroll.jsx                      |  2 +-
 .../EditPayroll/DisplayAttrition/index.jsx          | 13 ++++++++-----
 .../EditPayroll/DisplayPayModifier/index.jsx        |  6 +++---
 3 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/front_end/src/Apps/Payroll.jsx b/front_end/src/Apps/Payroll.jsx
index dec7f878c..471ecb148 100644
--- a/front_end/src/Apps/Payroll.jsx
+++ b/front_end/src/Apps/Payroll.jsx
@@ -201,7 +201,7 @@ export default function Payroll() {
             onCreate={handleCreateAttrition}
           />
           <DisplayPayModifier
-            data={allPayroll.pay_modifiers.pay_uplift}
+            modifier={allPayroll.pay_modifiers.pay_uplift}
             title="Pay uplift"
           />
         </Tab>
diff --git a/front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx b/front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx
index 7e5c8f01a..9b8a3723c 100644
--- a/front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx
+++ b/front_end/src/Components/EditPayroll/DisplayAttrition/index.jsx
@@ -2,12 +2,12 @@ import PayModifierHeaders from "../PayModifierHeaders";
 import DisplayPayModifier from "../DisplayPayModifier";
 
 const DisplayAttrition = ({
-  attrition,
-  global_attrition,
+  attrition = [],
+  global_attrition = [],
   onInputChange,
   onCreate,
 }) => {
-  if (attrition && attrition.length > 0) {
+  if (attrition.length > 0) {
     return (
       <div className="govuk-form-group">
         <h3 className="govuk-heading-s">Attrition</h3>
@@ -36,10 +36,13 @@ const DisplayAttrition = ({
     );
   }
 
-  if (global_attrition && global_attrition.length > 0) {
+  if (global_attrition.length > 0) {
     return (
       <>
-        <DisplayPayModifier data={global_attrition} title="Global attrition" />
+        <DisplayPayModifier
+          modifier={global_attrition}
+          title="Global attrition"
+        />
         <p className="govuk-body">
           This attrition is for the current financial year. You can add one for
           this specific cost centre instead.
diff --git a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
index f4af0caac..fe6e297e3 100644
--- a/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
+++ b/front_end/src/Components/EditPayroll/DisplayPayModifier/index.jsx
@@ -1,7 +1,7 @@
 import PayModifierHeaders from "../PayModifierHeaders";
 
-const DisplayPayModifier = ({ data, title }) => {
-  if (!data || data <= 0) {
+const DisplayPayModifier = ({ modifier = [], title }) => {
+  if (modifier.length === 0) {
     return (
       <>
         <h3 className="govuk-heading-s">{title}</h3>
@@ -17,7 +17,7 @@ const DisplayPayModifier = ({ data, title }) => {
         <PayModifierHeaders />
         <tbody className="govuk-table__body">
           <tr className="govuk-table__row">
-            {data.map((value, index) => {
+            {modifier.map((value, index) => {
               return (
                 <td className="govuk-table__cell" key={index}>
                   {value}