Const ExportConsentsForm
ExportConsentsForm: FC<{}> = observer(() => {const [form] = Form.useForm();const [isBusy, setBusy] = useState(false);const [showSizeHint, setShowSizeHint] = useState(false);const initialValues: FormValues = {by: "",date: [],uuid: ""};// Download export as CSVconst handleDownloadButton: ComponentProps<typeof Form>["onFinish"] = useCallback(() => {(async () => {setBusy(true);setShowSizeHint(true);const { uuid, date } = form.getFieldsValue() as FormValues;const url = urlBuilder({location: locationRestExportConsentsGet,params: {uuid: uuid || "",from: date?.[0].format("YYYY-MM-DD") || "",to: date?.[1].format("YYYY-MM-DD") || ""}});window.open(url, "_blank");setBusy(false);})();}, [setBusy, setShowSizeHint, form]);return (<Spin spinning={isBusy}><Form name="export" form={form} {...LAYOUT} initialValues={initialValues} onFinish={handleDownloadButton}><Form.Item label={__("Export by")} required><Form.Item name="by" noStyle rules={[{ required: true, message: __("Please select an option!") }]}><Radio.Group><Radio.Button value="date">{__("Date range")}</Radio.Button><Radio.Button value="uuid">{__("UUID")}</Radio.Button></Radio.Group></Form.Item></Form.Item><Form.Item noStyle shouldUpdate={(prevValues, nextValues) => prevValues.by !== nextValues.by}>{({ getFieldValue }) =>(getFieldValue("by") as FormValues["by"]) === "date" && (<Form.Itemname="date"label={__("Date range")}requiredrules={[{ type: "array", required: true, message: __("Please provide a valid date range!") }]}><DateRangePicker disabledDate={(d) => !d || d.isAfter(moment())} /></Form.Item>)}</Form.Item><Form.Item noStyle shouldUpdate={(prevValues, nextValues) => prevValues.by !== nextValues.by}>{({ getFieldValue }) =>(getFieldValue("by") as FormValues["by"]) === "uuid" && (<Form.Itemname="uuid"label={__("UUID")}requiredrules={[{required: true,pattern: /^\w{8}-\w{4}-\w{4}-\w{4}-\w{12}$/,message: __("Please provide a valid UUID!")}]}><Input /></Form.Item>)}</Form.Item><Form.Item><inputtype="submit"className="button button-primary"style={{ marginTop: 10 }}value={__("Download CSV")}/></Form.Item>{showSizeHint && (<div className="notice notice-info inline below-h2 notice-alt" style={{ margin: "10px 0 0 0" }}><p>{__("The CSV file can be very large because data in this format is redundant per line. In your WordPress database the consents are much smaller.")}</p></div>)}</Form></Spin>);})