Added barcode scanning to populate contract form BOD-88
This commit is contained in:
Patrick Fic
@@ -7,12 +7,12 @@ export default function ContractsCarsComponent({
|
||||
loading,
|
||||
data,
|
||||
selectedCar,
|
||||
handleSelect
|
||||
handleSelect,
|
||||
}) {
|
||||
const [state, setState] = useState({
|
||||
sortedInfo: {},
|
||||
filteredInfo: { text: "" },
|
||||
search: ""
|
||||
search: "",
|
||||
});
|
||||
|
||||
const { t } = useTranslation();
|
||||
@@ -24,7 +24,7 @@ export default function ContractsCarsComponent({
|
||||
key: "fleetnumber",
|
||||
sorter: (a, b) => alphaSort(a.fleetnumber, b.fleetnumber),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "fleetnumber" && state.sortedInfo.order
|
||||
state.sortedInfo.columnKey === "fleetnumber" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.status"),
|
||||
@@ -32,21 +32,24 @@ export default function ContractsCarsComponent({
|
||||
key: "status",
|
||||
sorter: (a, b) => alphaSort(a.status, b.status),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "status" && state.sortedInfo.order
|
||||
state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
|
||||
render: (text, record) => <div>{t(record.status)}</div>,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.year"),
|
||||
dataIndex: "year",
|
||||
key: "year",
|
||||
sorter: (a, b) => alphaSort(a.year, b.year),
|
||||
sortOrder: state.sortedInfo.columnKey === "year" && state.sortedInfo.order
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "year" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.make"),
|
||||
dataIndex: "make",
|
||||
key: "make",
|
||||
sorter: (a, b) => alphaSort(a.make, b.make),
|
||||
sortOrder: state.sortedInfo.columnKey === "make" && state.sortedInfo.order
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "make" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.model"),
|
||||
@@ -54,7 +57,7 @@ export default function ContractsCarsComponent({
|
||||
key: "model",
|
||||
sorter: (a, b) => alphaSort(a.model, b.model),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "model" && state.sortedInfo.order
|
||||
state.sortedInfo.columnKey === "model" && state.sortedInfo.order,
|
||||
},
|
||||
{
|
||||
title: t("courtesycars.fields.plate"),
|
||||
@@ -62,8 +65,8 @@ export default function ContractsCarsComponent({
|
||||
key: "plate",
|
||||
sorter: (a, b) => alphaSort(a.plate, b.plate),
|
||||
sortOrder:
|
||||
state.sortedInfo.columnKey === "plate" && state.sortedInfo.order
|
||||
}
|
||||
state.sortedInfo.columnKey === "plate" && state.sortedInfo.order,
|
||||
},
|
||||
];
|
||||
|
||||
const handleTableChange = (pagination, filters, sorter) => {
|
||||
@@ -74,7 +77,7 @@ export default function ContractsCarsComponent({
|
||||
state.search === ""
|
||||
? data
|
||||
: data.filter(
|
||||
cc =>
|
||||
(cc) =>
|
||||
(cc.fleetnumber || "")
|
||||
.toLowerCase()
|
||||
.includes(state.search.toLowerCase()) ||
|
||||
@@ -100,19 +103,19 @@ export default function ContractsCarsComponent({
|
||||
<Input.Search
|
||||
placeholder={t("general.labels.search")}
|
||||
value={state.search}
|
||||
onChange={e => setState({ ...state, search: e.target.value })}
|
||||
onChange={(e) => setState({ ...state, search: e.target.value })}
|
||||
/>
|
||||
)}
|
||||
size="small"
|
||||
pagination={{ position: "top" }}
|
||||
columns={columns.map(item => ({ ...item }))}
|
||||
columns={columns.map((item) => ({ ...item }))}
|
||||
rowKey="id"
|
||||
dataSource={filteredData}
|
||||
onChange={handleTableChange}
|
||||
rowSelection={{
|
||||
onSelect: handleSelect,
|
||||
type: "radio",
|
||||
selectedRowKeys: [selectedCar]
|
||||
selectedRowKeys: [selectedCar],
|
||||
}}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -1,241 +1,255 @@
|
||||
import React, { useState } from "react";
|
||||
import { DatePicker, Form, Input, InputNumber } from "antd";
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { Form, Input, DatePicker, InputNumber, Button } from "antd";
|
||||
import aamva from "../../utils/aamva";
|
||||
import InputPhone from "../form-items-formatted/phone-form-item.component";
|
||||
import ContractStatusSelector from "../contract-status-select/contract-status-select.component";
|
||||
import InputPhone from "../form-items-formatted/phone-form-item.component";
|
||||
import LayoutFormRow from "../layout-form-row/layout-form-row.component";
|
||||
|
||||
export default function ContractFormComponent() {
|
||||
const [state, setState] = useState("");
|
||||
export default function ContractFormComponent({ form }) {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<div>
|
||||
<div style={{ background: "#f00" }}>
|
||||
TEST AREA
|
||||
<Input.TextArea
|
||||
//value={state}
|
||||
rows={3}
|
||||
onPressEnter={(e) => {
|
||||
console.log("e", e);
|
||||
setState(e.target.value);
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
onClick={() => {
|
||||
var res = aamva.parse(state);
|
||||
console.log("Entire object", res);
|
||||
}}>
|
||||
Decode
|
||||
</Button>
|
||||
</div>
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.status")}
|
||||
name="status"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<ContractStatusSelector />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.start")}
|
||||
name="start"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.scheduledreturn")}
|
||||
name="scheduledreturn"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.actualreturn")}
|
||||
name="actualreturn"
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<Form.Item
|
||||
label={t("contracts.fields.status")}
|
||||
name='status'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<ContractStatusSelector />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.start")}
|
||||
name='start'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.scheduledreturn")}
|
||||
name='scheduledreturn'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item label={t("contracts.fields.actualreturn")} name='actualreturn'>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.kmstart")}
|
||||
name='kmstart'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
<Form.Item label={t("contracts.fields.kmend")} name='kmend'>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlnumber")}
|
||||
name='driver_dlnumber'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlexpiry")}
|
||||
name='driver_dlexpiry'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlst")}
|
||||
name='driver_dlst'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_fn")}
|
||||
name='driver_fn'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_ln")}
|
||||
name='driver_ln'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_addr1")}
|
||||
name='driver_addr1'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item label={t("contracts.fields.driver_addr2")} name='driver_addr2'>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_city")}
|
||||
name='driver_city'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_state")}
|
||||
name='driver_state'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_zip")}
|
||||
name='driver_zip'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_ph1")}
|
||||
name='driver_ph1'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<InputPhone />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dob")}
|
||||
name='driver_dob'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_num")}
|
||||
name='cc_num'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_expiry")}
|
||||
name='cc_expiry'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_cardholder")}
|
||||
name='cc_cardholder'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.kmstart")}
|
||||
name="kmstart"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
<Form.Item label={t("contracts.fields.kmend")} name="kmend">
|
||||
<InputNumber />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlnumber")}
|
||||
name="driver_dlnumber"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlexpiry")}
|
||||
name="driver_dlexpiry"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dlst")}
|
||||
name="driver_dlst"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_fn")}
|
||||
name="driver_fn"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_ln")}
|
||||
name="driver_ln"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_addr1")}
|
||||
name="driver_addr1"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_addr2")}
|
||||
name="driver_addr2"
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_city")}
|
||||
name="driver_city"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_state")}
|
||||
name="driver_state"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_zip")}
|
||||
name="driver_zip"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_ph1")}
|
||||
name="driver_ph1"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<InputPhone />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.driver_dob")}
|
||||
name="driver_dob"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<DatePicker />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
|
||||
<LayoutFormRow>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_num")}
|
||||
name="cc_num"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_expiry")}
|
||||
name="cc_expiry"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("contracts.fields.cc_cardholder")}
|
||||
name="cc_cardholder"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t("general.validation.required"),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
</LayoutFormRow>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,120 @@
|
||||
import { Button, Input, Modal, Typography } from "antd";
|
||||
import moment from "moment";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import aamva from "../../utils/aamva";
|
||||
import aamva_npm from "aamva";
|
||||
import DataLabel from "../data-label/data-label.component";
|
||||
import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
|
||||
|
||||
export default function ContractLicenseDecodeButton({ form }) {
|
||||
const { t } = useTranslation();
|
||||
const [modalVisible, setModalVisible] = useState(false);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [decodedBarcode, setDecodedBarcode] = useState(null);
|
||||
console.log("form", form);
|
||||
const handleDecode = (e) => {
|
||||
setLoading(true);
|
||||
const aamvaParse = aamva.parse(e.currentTarget.value);
|
||||
console.log("AAMVA", aamvaParse);
|
||||
setDecodedBarcode(aamvaParse);
|
||||
setLoading(false);
|
||||
};
|
||||
const handleInsertForm = () => {
|
||||
const values = {
|
||||
driver_dlnumber: decodedBarcode.dl,
|
||||
driver_dlexpiry: moment(
|
||||
`20${decodedBarcode.expiration_date}${moment(
|
||||
decodedBarcode.birthday
|
||||
).format("DD")}`
|
||||
),
|
||||
driver_dlst: decodedBarcode.state,
|
||||
driver_fn: decodedBarcode.name.first,
|
||||
driver_ln: decodedBarcode.name.last,
|
||||
driver_addr1: decodedBarcode.address,
|
||||
driver_city: decodedBarcode.city,
|
||||
driver_state: decodedBarcode.state,
|
||||
driver_zip: decodedBarcode.postal_code,
|
||||
driver_dob: moment(decodedBarcode.birthday),
|
||||
};
|
||||
|
||||
form.setFieldsValue(values);
|
||||
setModalVisible(false);
|
||||
setDecodedBarcode(null);
|
||||
};
|
||||
const handleClick = () => {
|
||||
setModalVisible(true);
|
||||
};
|
||||
const handleCancel = () => {
|
||||
setModalVisible(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Modal
|
||||
visible={modalVisible}
|
||||
okText={t("contracts.actions.senddltoform")}
|
||||
onOk={handleInsertForm}
|
||||
okButtonProps={{ disabled: !!!decodedBarcode }}
|
||||
onCancel={handleCancel}
|
||||
>
|
||||
<div>
|
||||
<div>
|
||||
<Input
|
||||
autoFocus
|
||||
allowClear
|
||||
onChange={(e) => {
|
||||
if (!loading) setLoading(true);
|
||||
}}
|
||||
onPressEnter={handleDecode}
|
||||
/>
|
||||
</div>
|
||||
<LoadingSkeleton loading={loading}>
|
||||
{decodedBarcode ? (
|
||||
<div>
|
||||
<DataLabel label={t("contracts.fields.driver_dlst")}>
|
||||
{decodedBarcode.state}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_dlnumber")}>
|
||||
{decodedBarcode.dl}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_fn")}>
|
||||
{decodedBarcode.name.first}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_ln")}>
|
||||
{decodedBarcode.name.last}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_addr1")}>
|
||||
{decodedBarcode.address}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_addr2")}>
|
||||
{decodedBarcode.address}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_dlexpiry")}>
|
||||
{moment(
|
||||
`20${decodedBarcode.expiration_date}${moment(
|
||||
decodedBarcode.birthday
|
||||
).format("DD")}`
|
||||
).format("MM/DD/YYYY")}
|
||||
</DataLabel>
|
||||
<DataLabel label={t("contracts.fields.driver_dob")}>
|
||||
{moment(decodedBarcode.birthday).format("MM/DD/YYYY")}
|
||||
</DataLabel>
|
||||
<div>
|
||||
<Typography.Title level={4}>
|
||||
{t("contracts.labels.correctdataonform")}
|
||||
</Typography.Title>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div>{t("contracts.labels.waitingforscan")}</div>
|
||||
)}
|
||||
</LoadingSkeleton>
|
||||
</div>
|
||||
</Modal>
|
||||
<Button onClick={handleClick}>
|
||||
{t("contracts.actions.decodelicense")}
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user