UI fixes for manual job creation + owners pages + vehicles pages + all jobs BOD-155

client/src/components/courtesy-cars-list/courtesy-cars-list.component.jsx

@@ -1,10 +1,10 @@
-import { Table, Button } from "antd";
+import { Table, Button, Input } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 import { alphaSort } from "../../utils/sorters";
-
-export default function CourtesyCarsList({ loading, courtesycars }) {
+import { SyncOutlined } from "@ant-design/icons";
+export default function CourtesyCarsList({ loading, courtesycars, refetch }) {
   const [state, setState] = useState({
     sortedInfo: {},
     filteredInfo: { text: "" },
@@ -74,14 +74,28 @@ export default function CourtesyCarsList({ loading, courtesycars }) {
     <Table
       loading={loading}
       title={() => (
-        <Link to={`/manage/courtesycars/new`}>
-          <Button>{t("courtesycars.actions.new")}</Button>
-        </Link>
+        <div className='imex-table-header'>
+          <Button onClick={() => refetch()}>
+            <SyncOutlined />
+          </Button>
+          <Link to={`/manage/courtesycars/new`}>
+            <Button>{t("courtesycars.actions.new")}</Button>
+          </Link>
+          <Input.Search
+            className='imex-table-header__search'
+            placeholder={t("general.labels.search")}
+            onChange={(e) => {
+              //setSearchText(e.target.value);
+            }}
+            //value={searchText}
+            enterButton
+          />
+        </div>
       )}
-      size="small"
+      size='small'
       pagination={{ position: "top" }}
       columns={columns.map((item) => ({ ...item }))}
-      rowKey="id"
+      rowKey='id'
       dataSource={courtesycars}
       onChange={handleTableChange}
     />