- the great reformat

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/components/csi-response-list-paginated/csi-response-list-paginated.component.jsx

@@ -1,135 +1,135 @@
-import { SyncOutlined } from "@ant-design/icons";
-import { Button, Card, Table } from "antd";
+import {SyncOutlined} from "@ant-design/icons";
+import {Button, Card, Table} from "antd";
 import queryString from "query-string";
-import React, { useState } from "react";
-import { useTranslation } from "react-i18next";
-import { Link, useNavigate, useLocation } from "react-router-dom";
-import { DateFormatter } from "../../utils/DateFormatter";
-import { alphaSort } from "../../utils/sorters";
+import React, {useState} from "react";
+import {useTranslation} from "react-i18next";
+import {Link, useLocation, useNavigate} from "react-router-dom";
+import {DateFormatter} from "../../utils/DateFormatter";
+import {alphaSort} from "../../utils/sorters";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 import {pageLimit} from "../../utils/config";
 
 export default function CsiResponseListPaginated({
-  refetch,
-  loading,
-  responses,
-  total,
-}) {
-  const search = queryString.parse(useLocation().search);
-  const { responseid, page, sortcolumn, sortorder } = search;
-  const history = useNavigate();
-  const [state, setState] = useState({
-    sortedInfo: {},
-    filteredInfo: { text: "" },
-  });
+                                                     refetch,
+                                                     loading,
+                                                     responses,
+                                                     total,
+                                                 }) {
+    const search = queryString.parse(useLocation().search);
+    const {responseid, page, sortcolumn, sortorder} = search;
+    const history = useNavigate();
+    const [state, setState] = useState({
+        sortedInfo: {},
+        filteredInfo: {text: ""},
+    });
 
-  const { t } = useTranslation();
-  const columns = [
-    {
-      title: t("jobs.fields.ro_number"),
-      dataIndex: "ro_number",
-      key: "ro_number",
-      width: "8%",
-      sorter: (a, b) => alphaSort(a.job.ro_number, b.job.ro_number),
-      sortOrder: sortcolumn === "ro_number" && sortorder,
+    const {t} = useTranslation();
+    const columns = [
+        {
+            title: t("jobs.fields.ro_number"),
+            dataIndex: "ro_number",
+            key: "ro_number",
+            width: "8%",
+            sorter: (a, b) => alphaSort(a.job.ro_number, b.job.ro_number),
+            sortOrder: sortcolumn === "ro_number" && sortorder,
 
-      render: (text, record) => (
-        <Link to={"/manage/jobs/" + record.job.id}>
-          {record.job.ro_number || t("general.labels.na")}
-        </Link>
-      ),
-    },
-    {
-      title: t("jobs.fields.owner"),
-      dataIndex: "owner",
-      key: "owner",
-      ellipsis: true,
-      sorter: (a, b) => alphaSort(a.job.ownr_ln, b.job.ownr_ln),
-      width: "25%",
-      sortOrder: sortcolumn === "owner" && sortorder,
-      render: (text, record) => {
-        return record.job.owner ? (
-          <Link to={"/manage/owners/" + record.job.owner.id}>
-            <OwnerNameDisplay ownerObject={record.job} />
-          </Link>
-        ) : (
-          <span>
-            <OwnerNameDisplay ownerObject={record.job} />
+            render: (text, record) => (
+                <Link to={"/manage/jobs/" + record.job.id}>
+                    {record.job.ro_number || t("general.labels.na")}
+                </Link>
+            ),
+        },
+        {
+            title: t("jobs.fields.owner"),
+            dataIndex: "owner",
+            key: "owner",
+            ellipsis: true,
+            sorter: (a, b) => alphaSort(a.job.ownr_ln, b.job.ownr_ln),
+            width: "25%",
+            sortOrder: sortcolumn === "owner" && sortorder,
+            render: (text, record) => {
+                return record.job.owner ? (
+                    <Link to={"/manage/owners/" + record.job.owner.id}>
+                        <OwnerNameDisplay ownerObject={record.job}/>
+                    </Link>
+                ) : (
+                    <span>
+            <OwnerNameDisplay ownerObject={record.job}/>
           </span>
-        );
-      },
-    },
-    {
-      title: t("csi.fields.completedon"),
-      dataIndex: "completedon",
-      key: "completedon",
-      ellipsis: true,
-      sorter: (a, b) => a.completedon - b.completedon,
-      width: "25%",
-      sortOrder: sortcolumn === "completedon" && sortorder,
-      render: (text, record) => {
-        return record.completedon ? (
-          <DateFormatter>{record.completedon}</DateFormatter>
-        ) : null;
-      },
-    },
-  ];
+                );
+            },
+        },
+        {
+            title: t("csi.fields.completedon"),
+            dataIndex: "completedon",
+            key: "completedon",
+            ellipsis: true,
+            sorter: (a, b) => a.completedon - b.completedon,
+            width: "25%",
+            sortOrder: sortcolumn === "completedon" && sortorder,
+            render: (text, record) => {
+                return record.completedon ? (
+                    <DateFormatter>{record.completedon}</DateFormatter>
+                ) : null;
+            },
+        },
+    ];
 
-  const handleTableChange = (pagination, filters, sorter) => {
-    setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
-    search.page = pagination.current;
-    search.sortcolumn = sorter.columnKey;
-    search.sortorder = sorter.order;
-    history({ search: queryString.stringify(search) });
-  };
+    const handleTableChange = (pagination, filters, sorter) => {
+        setState({...state, filteredInfo: filters, sortedInfo: sorter});
+        search.page = pagination.current;
+        search.sortcolumn = sorter.columnKey;
+        search.sortorder = sorter.order;
+        history({search: queryString.stringify(search)});
+    };
 
-  const handleOnRowClick = (record) => {
-    if (record) {
-      if (record.id) {
-        search.responseid = record.id;
-        history({ search: queryString.stringify(search) });
-      }
-    } else {
-      delete search.responseid;
-      history({ search: queryString.stringify(search) });
-    }
-  };
+    const handleOnRowClick = (record) => {
+        if (record) {
+            if (record.id) {
+                search.responseid = record.id;
+                history({search: queryString.stringify(search)});
+            }
+        } else {
+            delete search.responseid;
+            history({search: queryString.stringify(search)});
+        }
+    };
 
-  return (
-    <Card
-      extra={
-        <Button onClick={() => refetch()}>
-          <SyncOutlined />
-        </Button>
-      }
-    >
-      <Table
-        loading={loading}
-        pagination={{
-          position: "top",
-          pageSize: pageLimit,
-          current: parseInt(page || 1),
-          total: total,
-        }}
-        columns={columns}
-        rowKey="id"
-        dataSource={responses}
-        onChange={handleTableChange}
-        rowSelection={{
-          onSelect: (record) => {
-            handleOnRowClick(record);
-          },
-          selectedRowKeys: [responseid],
-          type: "radio",
-        }}
-        onRow={(record, rowIndex) => {
-          return {
-            onClick: (event) => {
-              handleOnRowClick(record);
-            }, // click row
-          };
-        }}
-      />
-    </Card>
-  );
+    return (
+        <Card
+            extra={
+                <Button onClick={() => refetch()}>
+                    <SyncOutlined/>
+                </Button>
+            }
+        >
+            <Table
+                loading={loading}
+                pagination={{
+                    position: "top",
+                    pageSize: pageLimit,
+                    current: parseInt(page || 1),
+                    total: total,
+                }}
+                columns={columns}
+                rowKey="id"
+                dataSource={responses}
+                onChange={handleTableChange}
+                rowSelection={{
+                    onSelect: (record) => {
+                        handleOnRowClick(record);
+                    },
+                    selectedRowKeys: [responseid],
+                    type: "radio",
+                }}
+                onRow={(record, rowIndex) => {
+                    return {
+                        onClick: (event) => {
+                            handleOnRowClick(record);
+                        }, // click row
+                    };
+                }}
+            />
+        </Card>
+    );
 }