feature/feature/IO-3554-Form-Row-Layout - Responsive overhaul

client/src/components/dashboard-components/job-lifecycle/job-lifecycle-dashboard.component.jsx

@@ -1,4 +1,5 @@
-import { Card, Table, Tag } from "antd";
+import { Card, Tag } from "antd";
+import ResponsiveTable from "../../responsive-table/responsive-table.component";
 import axios from "axios";
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -182,10 +183,11 @@ export default function JobLifecycleDashboardComponent({ data, bodyshop, ...card
             </div>
           </Card>
           <Card style={{ marginTop: "5px" }} type="inner" title={t("job_lifecycle.titles.top_durations")}>
-            <Table
+            <ResponsiveTable
               size="small"
               pagination={false}
               columns={columns}
+              mobileColumnKeys={["status", "humanReadable", "averageHumanReadable", "statusCount"]}
               rowKey={(record) => record.status}
               dataSource={lifecycleData.summations.sort((a, b) => b.value - a.value).slice(0, 3)}
             />