Reformat all project files to use the prettier config file.
This commit is contained in:
Patrick Fic
@@ -1,138 +1,133 @@
|
||||
import {SyncOutlined} from "@ant-design/icons";
|
||||
import {Button, Card, Input, Space, Table, Typography} from "antd";
|
||||
import { SyncOutlined } from "@ant-design/icons";
|
||||
import { Button, Card, Input, Space, Table, Typography } from "antd";
|
||||
import queryString from "query-string";
|
||||
import React, {useState} from "react";
|
||||
import {useTranslation} from "react-i18next";
|
||||
import {Link, useLocation, useNavigate} from "react-router-dom";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Link, useLocation, useNavigate } from "react-router-dom";
|
||||
import PhoneFormatter from "../../utils/PhoneFormatter";
|
||||
import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
|
||||
import {pageLimit} from "../../utils/config";
|
||||
import { pageLimit } from "../../utils/config";
|
||||
|
||||
export default function OwnersListComponent({
|
||||
loading,
|
||||
owners,
|
||||
total,
|
||||
refetch,
|
||||
}) {
|
||||
const search = queryString.parse(useLocation().search);
|
||||
const {
|
||||
page,
|
||||
// sortcolumn, sortorder
|
||||
} = search;
|
||||
const history = useNavigate();
|
||||
export default function OwnersListComponent({ loading, owners, total, refetch }) {
|
||||
const search = queryString.parse(useLocation().search);
|
||||
const {
|
||||
page
|
||||
// sortcolumn, sortorder
|
||||
} = search;
|
||||
const history = useNavigate();
|
||||
|
||||
const [state, setState] = useState({
|
||||
sortedInfo: {},
|
||||
filteredInfo: {text: ""},
|
||||
});
|
||||
const [state, setState] = useState({
|
||||
sortedInfo: {},
|
||||
filteredInfo: { text: "" }
|
||||
});
|
||||
|
||||
const {t} = useTranslation();
|
||||
const { t } = useTranslation();
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: t("owners.fields.name"),
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
render: (text, record) => (
|
||||
<Link to={"/manage/owners/" + record.id}>
|
||||
<OwnerNameDisplay ownerObject={record}/>
|
||||
</Link>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.ownr_ph1"),
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
render: (text, record) => {
|
||||
return <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.ownr_ph2"),
|
||||
dataIndex: "ownr_ph2",
|
||||
key: "ownr_ph2",
|
||||
render: (text, record) => {
|
||||
return <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter>;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.ownr_ea"),
|
||||
dataIndex: "ownr_ea",
|
||||
key: "ownr_ea",
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.address"),
|
||||
dataIndex: "address",
|
||||
key: "address",
|
||||
render: (text, record) => {
|
||||
return (
|
||||
<div>{`${record.ownr_addr1 || ""} ${record.ownr_addr2 || ""} ${
|
||||
record.ownr_city || ""
|
||||
} ${record.ownr_st || ""} ${record.ownr_zip || ""}`}</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
const columns = [
|
||||
{
|
||||
title: t("owners.fields.name"),
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
render: (text, record) => (
|
||||
<Link to={"/manage/owners/" + record.id}>
|
||||
<OwnerNameDisplay ownerObject={record} />
|
||||
</Link>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.ownr_ph1"),
|
||||
dataIndex: "ownr_ph1",
|
||||
key: "ownr_ph1",
|
||||
render: (text, record) => {
|
||||
return <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.ownr_ph2"),
|
||||
dataIndex: "ownr_ph2",
|
||||
key: "ownr_ph2",
|
||||
render: (text, record) => {
|
||||
return <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter>;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.ownr_ea"),
|
||||
dataIndex: "ownr_ea",
|
||||
key: "ownr_ea"
|
||||
},
|
||||
{
|
||||
title: t("owners.fields.address"),
|
||||
dataIndex: "address",
|
||||
key: "address",
|
||||
render: (text, record) => {
|
||||
return (
|
||||
<div>{`${record.ownr_addr1 || ""} ${record.ownr_addr2 || ""} ${
|
||||
record.ownr_city || ""
|
||||
} ${record.ownr_st || ""} ${record.ownr_zip || ""}`}</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
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)});
|
||||
};
|
||||
return (
|
||||
<Card
|
||||
title={t("menus.header.owners")}
|
||||
extra={
|
||||
<Space wrap>
|
||||
{search.search && (
|
||||
<>
|
||||
<Typography.Title level={4}>
|
||||
{t("general.labels.searchresults", {search: search.search})}
|
||||
</Typography.Title>
|
||||
<Button
|
||||
onClick={() => {
|
||||
delete search.search;
|
||||
history({search: queryString.stringify(search)});
|
||||
}}
|
||||
>
|
||||
{t("general.actions.clear")}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
<Button onClick={() => refetch()}>
|
||||
<SyncOutlined/>
|
||||
</Button>
|
||||
<Input.Search
|
||||
placeholder={search.search || t("general.labels.search")}
|
||||
onSearch={(value) => {
|
||||
if (value?.length >= 3) {
|
||||
search.search = value;
|
||||
} else {
|
||||
delete search.search;
|
||||
}
|
||||
history({search: queryString.stringify(search)});
|
||||
}}
|
||||
enterButton
|
||||
/>
|
||||
</Space>
|
||||
}
|
||||
>
|
||||
<Table
|
||||
loading={loading}
|
||||
pagination={{
|
||||
position: "top",
|
||||
pageSize: pageLimit,
|
||||
current: parseInt(page || 1),
|
||||
total: total,
|
||||
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) });
|
||||
};
|
||||
return (
|
||||
<Card
|
||||
title={t("menus.header.owners")}
|
||||
extra={
|
||||
<Space wrap>
|
||||
{search.search && (
|
||||
<>
|
||||
<Typography.Title level={4}>
|
||||
{t("general.labels.searchresults", { search: search.search })}
|
||||
</Typography.Title>
|
||||
<Button
|
||||
onClick={() => {
|
||||
delete search.search;
|
||||
history({ search: queryString.stringify(search) });
|
||||
}}
|
||||
columns={columns}
|
||||
rowKey="id"
|
||||
scroll={{x: true}}
|
||||
dataSource={owners}
|
||||
onChange={handleTableChange}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
>
|
||||
{t("general.actions.clear")}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
<Button onClick={() => refetch()}>
|
||||
<SyncOutlined />
|
||||
</Button>
|
||||
<Input.Search
|
||||
placeholder={search.search || t("general.labels.search")}
|
||||
onSearch={(value) => {
|
||||
if (value?.length >= 3) {
|
||||
search.search = value;
|
||||
} else {
|
||||
delete search.search;
|
||||
}
|
||||
history({ search: queryString.stringify(search) });
|
||||
}}
|
||||
enterButton
|
||||
/>
|
||||
</Space>
|
||||
}
|
||||
>
|
||||
<Table
|
||||
loading={loading}
|
||||
pagination={{
|
||||
position: "top",
|
||||
pageSize: pageLimit,
|
||||
current: parseInt(page || 1),
|
||||
total: total
|
||||
}}
|
||||
columns={columns}
|
||||
rowKey="id"
|
||||
scroll={{ x: true }}
|
||||
dataSource={owners}
|
||||
onChange={handleTableChange}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,44 +1,37 @@
|
||||
import {useQuery} from "@apollo/client";
|
||||
import { useQuery } from "@apollo/client";
|
||||
import React from "react";
|
||||
import {QUERY_ALL_OWNERS_PAGINATED} from "../../graphql/owners.queries";
|
||||
import { QUERY_ALL_OWNERS_PAGINATED } from "../../graphql/owners.queries";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import OwnersListComponent from "./owners-list.component";
|
||||
import queryString from "query-string";
|
||||
import {useLocation} from "react-router-dom";
|
||||
import {pageLimit} from "../../utils/config";
|
||||
import { useLocation } from "react-router-dom";
|
||||
import { pageLimit } from "../../utils/config";
|
||||
|
||||
export default function OwnersListContainer() {
|
||||
const searchParams = queryString.parse(useLocation().search);
|
||||
const {page, sortcolumn, sortorder, search} = searchParams;
|
||||
const {loading, error, data, refetch} = useQuery(
|
||||
QUERY_ALL_OWNERS_PAGINATED,
|
||||
const searchParams = queryString.parse(useLocation().search);
|
||||
const { page, sortcolumn, sortorder, search } = searchParams;
|
||||
const { loading, error, data, refetch } = useQuery(QUERY_ALL_OWNERS_PAGINATED, {
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
variables: {
|
||||
search: search || "",
|
||||
offset: page ? (page - 1) * pageLimit : 0,
|
||||
limit: pageLimit,
|
||||
order: [
|
||||
{
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
variables: {
|
||||
search: search || "",
|
||||
offset: page ? (page - 1) * pageLimit : 0,
|
||||
limit: pageLimit,
|
||||
order: [
|
||||
{
|
||||
[sortcolumn || "created_at"]: sortorder
|
||||
? sortorder === "descend"
|
||||
? "desc"
|
||||
: "asc"
|
||||
: "desc",
|
||||
},
|
||||
],
|
||||
},
|
||||
[sortcolumn || "created_at"]: sortorder ? (sortorder === "descend" ? "desc" : "asc") : "desc"
|
||||
}
|
||||
);
|
||||
]
|
||||
}
|
||||
});
|
||||
|
||||
if (error) return <AlertComponent message={error.message} type="error"/>;
|
||||
return (
|
||||
<OwnersListComponent
|
||||
loading={loading}
|
||||
owners={data ? data.search_owners : null}
|
||||
total={data ? data.search_owners_aggregate.aggregate.count : 0}
|
||||
refetch={refetch}
|
||||
/>
|
||||
);
|
||||
if (error) return <AlertComponent message={error.message} type="error" />;
|
||||
return (
|
||||
<OwnersListComponent
|
||||
loading={loading}
|
||||
owners={data ? data.search_owners : null}
|
||||
total={data ? data.search_owners_aggregate.aggregate.count : 0}
|
||||
refetch={refetch}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user