Further UI Updates

client/src/components/courtesy-car-contract-list/courtesy-car-contract-list.component.jsx

@@ -1,4 +1,4 @@
-import { Table } from "antd";
+import { Card, Table } from "antd";
 import queryString from "query-string";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -84,19 +84,20 @@ export default function CourtesyCarContractListComponent({
   };
 
   return (
-    <Table
-      size="small"
-      scroll={{ x: true }}
-      pagination={{
-        position: "top",
-        pageSize: 25,
-        current: parseInt(page || 1),
-        total: totalContracts,
-      }}
-      columns={columns.map((item) => ({ ...item }))}
-      rowKey="id"
-      dataSource={contracts}
-      onChange={handleTableChange}
-    />
+    <Card title={t("menus.header.courtesycars-contracts")}>
+      <Table
+        scroll={{ x: true }}
+        pagination={{
+          position: "top",
+          pageSize: 25,
+          current: parseInt(page || 1),
+          total: totalContracts,
+        }}
+        columns={columns}
+        rowKey="id"
+        dataSource={contracts}
+        onChange={handleTableChange}
+      />
+    </Card>
   );
 }