IO-233 CDK Reformatting. First successful post.

client/src/components/dms-allocations-summary/dms-allocations-summary.component.jsx

@@ -1,4 +1,4 @@
-import { Button, Table, Typography } from "antd";
+import { Button, Card, Table, Typography } from "antd";
 import React, { useState, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -21,7 +21,7 @@ export default connect(
   mapDispatchToProps
 )(DmsAllocationsSummary);
 
-export function DmsAllocationsSummary({ socket, bodyshop, jobId }) {
+export function DmsAllocationsSummary({ socket, bodyshop, jobId, ro_number }) {
   const { t } = useTranslation();
   const [allocationsSummary, setAllocationsSummary] = useState([]);
 
@@ -76,8 +76,9 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId }) {
   ];
 
   return (
-    <Table
-      title={() => (
+    <Card
+      title={ro_number}
+      extra={
         <Button
           onClick={() => {
             socket.emit("cdk-calculate-allocations", jobId, (ack) =>
@@ -87,43 +88,46 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId }) {
         >
           <SyncOutlined />
         </Button>
-      )}
-      pagination={{ position: "top", defaultPageSize: 50 }}
-      columns={columns}
-      rowKey="center"
-      dataSource={allocationsSummary}
-      summary={() => {
-        const totals = allocationsSummary.reduce(
-          (acc, val) => {
-            return {
-              totalSale: acc.totalSale.add(Dinero(val.sale)),
-              totalCost: acc.totalCost.add(Dinero(val.cost)),
-            };
-          },
-          {
-            totalSale: Dinero(),
-            totalCost: Dinero(),
-          }
-        );
+      }
+    >
+      <Table
+        pagination={{ position: "top", defaultPageSize: 50 }}
+        columns={columns}
+        rowKey="center"
+        dataSource={allocationsSummary}
+        summary={() => {
+          const totals = allocationsSummary.reduce(
+            (acc, val) => {
+              return {
+                totalSale: acc.totalSale.add(Dinero(val.sale)),
+                totalCost: acc.totalCost.add(Dinero(val.cost)),
+              };
+            },
+            {
+              totalSale: Dinero(),
+              totalCost: Dinero(),
+            }
+          );
 
-        return (
-          <Table.Summary.Row>
-            <Table.Summary.Cell>
-              <Typography.Title level={4}>
-                {t("general.labels.totals")}
-              </Typography.Title>
-            </Table.Summary.Cell>
-            <Table.Summary.Cell>
-              {totals.totalSale.toFormat()}
-            </Table.Summary.Cell>
-            <Table.Summary.Cell>
-              {totals.totalCost.toFormat()}
-            </Table.Summary.Cell>
-            <Table.Summary.Cell></Table.Summary.Cell>
-            <Table.Summary.Cell></Table.Summary.Cell>
-          </Table.Summary.Row>
-        );
-      }}
-    />
+          return (
+            <Table.Summary.Row>
+              <Table.Summary.Cell>
+                <Typography.Title level={4}>
+                  {t("general.labels.totals")}
+                </Typography.Title>
+              </Table.Summary.Cell>
+              <Table.Summary.Cell>
+                {totals.totalSale.toFormat()}
+              </Table.Summary.Cell>
+              <Table.Summary.Cell>
+                {totals.totalCost.toFormat()}
+              </Table.Summary.Cell>
+              <Table.Summary.Cell></Table.Summary.Cell>
+              <Table.Summary.Cell></Table.Summary.Cell>
+            </Table.Summary.Row>
+          );
+        }}
+      />
+    </Card>
   );
 }

client/src/components/dms-cdk-makes/dms-cdk-makes.component.jsx

@@ -1,11 +1,11 @@
+import { useLazyQuery } from "@apollo/client";
+import { Button, Input, Modal, Table } from "antd";
 import React, { useState } from "react";
-import { Modal, Button, Table, Input } from "antd";
+import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors";
-import { useTranslation } from "react-i18next";
-import { useLazyQuery } from "@apollo/client";
 import { SEARCH_DMS_VEHICLES } from "../../graphql/dms.queries";
+import { selectBodyshop } from "../../redux/user/user.selectors";
 import AlertComponent from "../alert/alert.component";
 
 const mapStateToProps = createStructuredSelector({
@@ -102,7 +102,7 @@ export function DmsCdkVehicles({ bodyshop, form, socket, job }) {
           });
         }}
       >
-        {t("jobs.actions.dms.getmakes")}
+        {t("jobs.actions.dms.findmakemodelcode")}
       </Button>
     </div>
   );

client/src/components/dms-cdk-makes/dms-cdk-makes.refetch.component.jsx

@@ -4,6 +4,7 @@ import React, { useState } from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { useTranslation } from "react-i18next";
 const mapStateToProps = createStructuredSelector({
   //currentUser: selectCurrentUser
   bodyshop: selectBodyshop,
@@ -15,6 +16,7 @@ export default connect(mapStateToProps, mapDispatchToProps)(DmsCdkMakesRefetch);
 
 export function DmsCdkMakesRefetch({ bodyshop, form, socket }) {
   const [loading, setLoading] = useState(false);
+  const { t } = useTranslation();
   const handleRefetch = async () => {
     setLoading(true);
     const response = await axios.post("/cdk/getvehicles", {
@@ -26,7 +28,7 @@ export function DmsCdkMakesRefetch({ bodyshop, form, socket }) {
   };
   return (
     <Button loading={loading} onClick={handleRefetch}>
-      Refetch Models
+      {t("jobs.actions.dms.refetchmakesmodels")}
     </Button>
   );
 }

client/src/components/dms-customer-selector/dms-customer-selector.component.jsx

@@ -1,4 +1,4 @@
-import { Button, Table } from "antd";
+import { Button, Table, Col } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -69,40 +69,42 @@ export function DmsCustomerSelector({ bodyshop }) {
 
   if (!visible) return <></>;
   return (
-    <Table
-      title={() => (
-        <div>
-          <Button onClick={onUseSelected} disabled={!selectedCustomer}>
-            {t("jobs.actions.dms.useselected")}
-          </Button>
-          <Button
-            onClick={onUseGeneric}
-            disabled={
-              !(
-                bodyshop.cdk_configuration &&
-                bodyshop.cdk_configuration.generic_customer_number
-              )
-            }
-          >
-            {t("jobs.actions.dms.usegeneric")}
-          </Button>
-          <Button onClick={onCreateNew}>
-            {t("jobs.actions.dms.createnewcustomer")}
-          </Button>
-        </div>
-      )}
-      pagination={{ position: "top" }}
-      columns={columns}
-      rowKey={(record) => record.id.value}
-      dataSource={customerList}
-      //onChange={handleTableChange}
-      rowSelection={{
-        onSelect: (props) => {
-          setSelectedCustomer(props.id.value);
-        },
-        type: "radio",
-        selectedRowKeys: [selectedCustomer],
-      }}
-    />
+    <Col span={24}>
+      <Table
+        title={() => (
+          <div>
+            <Button onClick={onUseSelected} disabled={!selectedCustomer}>
+              {t("jobs.actions.dms.useselected")}
+            </Button>
+            <Button
+              onClick={onUseGeneric}
+              disabled={
+                !(
+                  bodyshop.cdk_configuration &&
+                  bodyshop.cdk_configuration.generic_customer_number
+                )
+              }
+            >
+              {t("jobs.actions.dms.usegeneric")}
+            </Button>
+            <Button onClick={onCreateNew}>
+              {t("jobs.actions.dms.createnewcustomer")}
+            </Button>
+          </div>
+        )}
+        pagination={{ position: "top" }}
+        columns={columns}
+        rowKey={(record) => record.id.value}
+        dataSource={customerList}
+        //onChange={handleTableChange}
+        rowSelection={{
+          onSelect: (props) => {
+            setSelectedCustomer(props.id.value);
+          },
+          type: "radio",
+          selectedRowKeys: [selectedCustomer],
+        }}
+      />
+    </Col>
   );
 }

client/src/components/dms-post-form/dms-post-form.component.jsx

@@ -1,24 +1,26 @@
 import { DeleteFilled } from "@ant-design/icons";
 import {
   Button,
+  Card,
+  Divider,
   Form,
   Input,
   InputNumber,
   Select,
   Space,
   Statistic,
+  Typography,
 } from "antd";
+import Dinero from "dinero.js";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { determineDmsType } from "../../pages/dms/dms.container";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import DmsCdkMakes from "../dms-cdk-makes/dms-cdk-makes.component";
 import CurrencyInput from "../form-items-formatted/currency-form-item.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
-import Dinero from "dinero.js";
-import { determineDmsType } from "../../pages/dms/dms.container";
-import DmsCdkMakesRefetch from "../dms-cdk-makes/dms-cdk-makes.refetch.component";
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
 });
@@ -58,24 +60,90 @@ export function DmsPostForm({ bodyshop, socket, job }) {
   };
 
   return (
-    <Form form={form} layout="vertical" onFinish={handleFinish}>
-      <LayoutFormRow>
-        <Form.Item
-          name="journal"
-          label={t("jobs.fields.dms.journal")}
-          initialValue={
-            bodyshop.cdk_configuration &&
-            bodyshop.cdk_configuration.default_journal
-          }
-          rules={[
-            {
-              required: true,
-              //message: t("general.validation.required"),
-            },
-          ]}
-        >
-          <Input />
-        </Form.Item>
+    <Card title={t("jobs.labels.dms.postingform")}>
+      <Form
+        form={form}
+        layout="vertical"
+        onFinish={handleFinish}
+        initialValues={{
+          story: t("jobs.labels.dms.defaultstory", {
+            ro_number: job.ro_number,
+            area_of_damage: job.area_of_damage && job.area_of_damage.impact1,
+          }).substr(0, 249),
+        }}
+      >
+        <LayoutFormRow grow>
+          <Form.Item
+            name="journal"
+            label={t("jobs.fields.dms.journal")}
+            initialValue={
+              bodyshop.cdk_configuration &&
+              bodyshop.cdk_configuration.default_journal
+            }
+            rules={[
+              {
+                required: true,
+                //message: t("general.validation.required"),
+              },
+            ]}
+          >
+            <Input />
+          </Form.Item>
+          <Form.Item
+            name="kmin"
+            label={t("jobs.fields.kmin")}
+            initialValue={job && job.kmin}
+            rules={[
+              {
+                required: true,
+                //message: t("general.validation.required"),
+              },
+            ]}
+          >
+            <InputNumber disabled />
+          </Form.Item>
+          <Form.Item
+            name="kmout"
+            label={t("jobs.fields.kmout")}
+            initialValue={job && job.kmout}
+            rules={[
+              {
+                required: true,
+                //message: t("general.validation.required"),
+              },
+            ]}
+          >
+            <InputNumber disabled />
+          </Form.Item>
+        </LayoutFormRow>
+
+        <LayoutFormRow style={{ justifyContent: "center" }} grow>
+          <Form.Item
+            name="dms_make"
+            label={t("jobs.fields.dms.dms_make")}
+            rules={[
+              {
+                required: true,
+              },
+            ]}
+          >
+            <Input disabled />
+          </Form.Item>
+          <Form.Item
+            name="dms_model"
+            label={t("jobs.fields.dms.dms_model")}
+            rules={[
+              {
+                required: true,
+              },
+            ]}
+          >
+            <Input disabled />
+          </Form.Item>
+
+          <DmsCdkMakes form={form} socket={socket} job={job} />
+          {/* <DmsCdkMakesRefetch /> */}
+        </LayoutFormRow>
         <Form.Item
           name="story"
           label={t("jobs.fields.dms.story")}
@@ -85,237 +153,186 @@ export function DmsPostForm({ bodyshop, socket, job }) {
             },
           ]}
         >
-          <Input.TextArea />
+          <Input.TextArea maxLength={250} />
         </Form.Item>
-        <Form.Item
-          name="kmin"
-          label={t("jobs.fields.kmin")}
-          initialValue={job && job.kmin}
-          rules={[
-            {
-              required: true,
-              //message: t("general.validation.required"),
-            },
-          ]}
-        >
-          <InputNumber disabled />
-        </Form.Item>
-        <Form.Item
-          name="kmout"
-          label={t("jobs.fields.kmout")}
-          initialValue={job && job.kmout}
-          rules={[
-            {
-              required: true,
-              //message: t("general.validation.required"),
-            },
-          ]}
-        >
-          <InputNumber disabled />
-        </Form.Item>
-        <Form.Item
-          name="dms_make"
-          label={t("jobs.fields.dms.dms_make")}
-          rules={[
-            {
-              required: true,
-            },
-          ]}
-        >
-          <Input disabled />
-        </Form.Item>
-        <Form.Item
-          name="dms_model"
-          label={t("jobs.fields.dms.dms_model")}
-          rules={[
-            {
-              required: true,
-            },
-          ]}
-        >
-          <Input disabled />
-        </Form.Item>
-        <DmsCdkMakes form={form} socket={socket} job={job} />
-        <DmsCdkMakesRefetch />
-      </LayoutFormRow>
-
-      <Form.List name={["payers"]}>
-        {(fields, { add, remove }) => {
-          return (
-            <div>
-              {fields.map((field, index) => (
-                <Form.Item key={field.key}>
-                  <LayoutFormRow>
-                    <Form.Item
-                      label={t("jobs.fields.dms.payer.name")}
-                      key={`${index}name`}
-                      name={[field.name, "name"]}
-                      rules={[
-                        {
-                          required: true,
-                        },
-                      ]}
-                    >
-                      <Select
-                        onSelect={(value) => handlePayerSelect(value, index)}
+        <Divider />
+        <Form.List name={["payers"]}>
+          {(fields, { add, remove }) => {
+            return (
+              <div>
+                {fields.map((field, index) => (
+                  <Form.Item key={field.key}>
+                    <Space wrap>
+                      <Form.Item
+                        label={t("jobs.fields.dms.payer.name")}
+                        key={`${index}name`}
+                        name={[field.name, "name"]}
+                        rules={[
+                          {
+                            required: true,
+                          },
+                        ]}
                       >
-                        {bodyshop.cdk_configuration &&
-                          bodyshop.cdk_configuration.payers &&
-                          bodyshop.cdk_configuration.payers.map((payer) => (
-                            <Select.Option key={payer.name}>
-                              {payer.name}
-                            </Select.Option>
-                          ))}
-                      </Select>
-                    </Form.Item>
+                        <Select
+                          style={{ minWidth: "15rem" }}
+                          onSelect={(value) => handlePayerSelect(value, index)}
+                        >
+                          {bodyshop.cdk_configuration &&
+                            bodyshop.cdk_configuration.payers &&
+                            bodyshop.cdk_configuration.payers.map((payer) => (
+                              <Select.Option key={payer.name}>
+                                {payer.name}
+                              </Select.Option>
+                            ))}
+                        </Select>
+                      </Form.Item>
 
-                    <Form.Item
-                      label={t("jobs.fields.dms.payer.dms_acctnumber")}
-                      key={`${index}dms_acctnumber`}
-                      name={[field.name, "dms_acctnumber"]}
-                      rules={[
-                        {
-                          required: true,
-                        },
-                      ]}
-                    >
-                      <Input disabled />
-                    </Form.Item>
+                      <Form.Item
+                        label={t("jobs.fields.dms.payer.dms_acctnumber")}
+                        key={`${index}dms_acctnumber`}
+                        name={[field.name, "dms_acctnumber"]}
+                        rules={[
+                          {
+                            required: true,
+                          },
+                        ]}
+                      >
+                        <Input disabled />
+                      </Form.Item>
 
-                    <Form.Item
-                      label={t("jobs.fields.dms.payer.amount")}
-                      key={`${index}amount`}
-                      name={[field.name, "amount"]}
-                      rules={[
-                        {
-                          required: true,
-                        },
-                      ]}
-                    >
-                      <CurrencyInput min={0} />
-                    </Form.Item>
+                      <Form.Item
+                        label={t("jobs.fields.dms.payer.amount")}
+                        key={`${index}amount`}
+                        name={[field.name, "amount"]}
+                        rules={[
+                          {
+                            required: true,
+                          },
+                        ]}
+                      >
+                        <CurrencyInput min={0} />
+                      </Form.Item>
 
-                    <Form.Item
-                      label={t("jobs.fields.dms.payer.controlnumber")}
-                      key={`${index}controlnumber`}
-                      name={[field.name, "controlnumber"]}
-                      rules={[
-                        {
-                          required: true,
-                        },
-                      ]}
-                    >
-                      <Input />
-                    </Form.Item>
+                      <Form.Item
+                        label={t("jobs.fields.dms.payer.controlnumber")}
+                        key={`${index}controlnumber`}
+                        name={[field.name, "controlnumber"]}
+                        rules={[
+                          {
+                            required: true,
+                          },
+                        ]}
+                      >
+                        <Input />
+                      </Form.Item>
 
-                    <Form.Item shouldUpdate>
-                      {() => {
-                        const payers = form.getFieldValue("payers");
+                      <Form.Item shouldUpdate>
+                        {() => {
+                          const payers = form.getFieldValue("payers");
 
-                        const row = payers && payers[index];
+                          const row = payers && payers[index];
 
-                        const cdkPayer =
-                          bodyshop.cdk_configuration.payers &&
-                          bodyshop.cdk_configuration.payers.find(
-                            (i) => i && row && i.name === row.name
+                          const cdkPayer =
+                            bodyshop.cdk_configuration.payers &&
+                            bodyshop.cdk_configuration.payers.find(
+                              (i) => i && row && i.name === row.name
+                            );
+
+                          return (
+                            <div>
+                              {cdkPayer &&
+                                t(`jobs.fields.${cdkPayer.control_type}`)}
+                            </div>
                           );
+                        }}
+                      </Form.Item>
 
-                        return (
-                          <div>
-                            {cdkPayer &&
-                              t(`jobs.fields.${cdkPayer.control_type}`)}
-                          </div>
-                        );
-                      }}
-                    </Form.Item>
-
-                    <DeleteFilled
-                      onClick={() => {
-                        remove(field.name);
-                      }}
-                    />
-                  </LayoutFormRow>
+                      <DeleteFilled
+                        onClick={() => {
+                          remove(field.name);
+                        }}
+                      />
+                    </Space>
+                  </Form.Item>
+                ))}
+                <Form.Item>
+                  <Button
+                    type="dashed"
+                    disabled={!(fields.length < 3)}
+                    onClick={() => {
+                      if (fields.length < 3) add();
+                    }}
+                    style={{ width: "100%" }}
+                  >
+                    {t("jobs.actions.dms.addpayer")}
+                  </Button>
                 </Form.Item>
-              ))}
-              <Form.Item>
-                <Button
-                  type="dashed"
-                  disabled={!(fields.length < 3)}
-                  onClick={() => {
-                    if (fields.length < 3) add();
-                  }}
-                  style={{ width: "100%" }}
-                >
-                  {t("jobs.actions.dms.addpayer")}
-                </Button>
-              </Form.Item>
-            </div>
-          );
-        }}
-      </Form.List>
-      <Form.Item shouldUpdate>
-        {() => {
-          //Perform Calculation to determine discrepancy.
-          let totalAllocated = Dinero();
-
-          const payers = form.getFieldValue("payers");
-          payers &&
-            payers.forEach((payer) => {
-              totalAllocated = totalAllocated.add(
-                Dinero({ amount: Math.round((payer?.amount || 0) * 100) })
-              );
-            });
-
-          const totals =
-            socket.allocationsSummary &&
-            socket.allocationsSummary.reduce(
-              (acc, val) => {
-                return {
-                  totalSale: acc.totalSale.add(Dinero(val.sale)),
-                  totalCost: acc.totalCost.add(Dinero(val.cost)),
-                };
-              },
-              {
-                totalSale: Dinero(),
-                totalCost: Dinero(),
-              }
+              </div>
             );
-          const discrep = totals
-            ? totals.totalSale.subtract(totalAllocated)
-            : Dinero();
-          return (
-            <Space>
-              <Statistic
-                title={t("jobs.labels.dms.totalallocated")}
-                value={totalAllocated.toFormat()}
-              />
-              <Statistic
-                title={t("jobs.labels.subtotal")}
-                value={(totals ? totals.totalSale : Dinero()).toFormat()}
-              />
-              <Statistic
-                title={t("jobs.labels.dms.notallocated")}
-                valueStyle={{
-                  color: discrep.getAmount() === 0 ? "green" : "red",
-                }}
-                value={discrep.toFormat()}
-              />
-              <Button disabled={discrep.getAmount() !== 0} htmlType="submit">
-                {t("jobs.actions.dms.post")}
-              </Button>
-              <Button
-                onClick={() => {
-                  socket.emit(`${determineDmsType(bodyshop)}-export-job`, {
-                    jobid: job.id,
-                  });
-                }}
-              >
-                Bypass
-              </Button>
-            </Space>
-          );
-        }}
-      </Form.Item>
-    </Form>
+          }}
+        </Form.List>
+        <Form.Item shouldUpdate>
+          {() => {
+            //Perform Calculation to determine discrepancy.
+            let totalAllocated = Dinero();
+
+            const payers = form.getFieldValue("payers");
+            payers &&
+              payers.forEach((payer) => {
+                totalAllocated = totalAllocated.add(
+                  Dinero({ amount: Math.round((payer?.amount || 0) * 100) })
+                );
+              });
+
+            const totals =
+              socket.allocationsSummary &&
+              socket.allocationsSummary.reduce(
+                (acc, val) => {
+                  return {
+                    totalSale: acc.totalSale.add(Dinero(val.sale)),
+                    totalCost: acc.totalCost.add(Dinero(val.cost)),
+                  };
+                },
+                {
+                  totalSale: Dinero(),
+                  totalCost: Dinero(),
+                }
+              );
+            const discrep = totals
+              ? totals.totalSale.subtract(totalAllocated)
+              : Dinero();
+            return (
+              <Space size="large" wrap align="center">
+                <Statistic
+                  title={t("jobs.labels.subtotal")}
+                  value={(totals ? totals.totalSale : Dinero()).toFormat()}
+                />
+                <Typography.Title>-</Typography.Title>
+                <Statistic
+                  title={t("jobs.labels.dms.totalallocated")}
+                  value={totalAllocated.toFormat()}
+                />
+                <Typography.Title>=</Typography.Title>
+                <Statistic
+                  title={t("jobs.labels.dms.notallocated")}
+                  valueStyle={{
+                    color: discrep.getAmount() === 0 ? "green" : "red",
+                  }}
+                  value={discrep.toFormat()}
+                />
+                <Button
+                  disabled={
+                    !socket.allocationsSummary || discrep.getAmount() !== 0
+                  }
+                  htmlType="submit"
+                >
+                  {t("jobs.actions.dms.post")}
+                </Button>
+              </Space>
+            );
+          }}
+        </Form.Item>
+      </Form>
+    </Card>
   );
 }

client/src/components/jobs-close-export-button/jobs-close-export-button.component.jsx

@@ -13,6 +13,7 @@ import {
 } from "../../redux/user/user.selectors";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 import { INSERT_EXPORT_LOG } from "../../graphql/accounting.queries";
+import { useHistory } from "react-router-dom";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -26,11 +27,17 @@ export function JobsCloseExportButton({
   disabled,
   setSelectedJobs,
 }) {
+  const history = useHistory();
   const { t } = useTranslation();
   const [updateJob] = useMutation(UPDATE_JOB);
   const [insertExportLog] = useMutation(INSERT_EXPORT_LOG);
   const [loading, setLoading] = useState(false);
+
   const handleQbxml = async () => {
+    if (bodyshop.cdk_dealerid) {
+      history.push(`/manage/dms?jobId=${jobId}`);
+      return;
+    }
     logImEXEvent("jobs_close_export");
 
     setLoading(true);
@@ -159,12 +166,7 @@ export function JobsCloseExportButton({
   };
 
   return (
-    <Button
-      onClick={handleQbxml}
-      loading={loading}
-      disabled={disabled}
-      type="dashed"
-    >
+    <Button onClick={handleQbxml} loading={loading} disabled={disabled}>
       {t("jobs.actions.export")}
     </Button>
   );