IO-2028 LMS Deletion.

client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.container.jsx

@@ -14,6 +14,7 @@ import { selectAllMedia } from "../../redux/media/media.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { CreateExplorerLinkForJob } from "../../utils/localmedia";
 import DocumentsLocalUploadComponent from "../documents-local-upload/documents-local-upload.component";
+import JobsDocumentsLocalDeleteButton from "./jobs-documents-local-gallery.delete.component";
 import JobsLocalGalleryDownloadButton from "./jobs-documents-local-gallery.download";
 import JobsDocumentsLocalGalleryReassign from "./jobs-documents-local-gallery.reassign.component";
 import JobsDocumentsLocalGallerySelectAllComponent from "./jobs-documents-local-gallery.selectall.component";
@@ -101,6 +102,7 @@ export function JobsDocumentsLocalGallery({
         <JobsDocumentsLocalGalleryReassign jobid={job.id} />
         <JobsDocumentsLocalGallerySelectAllComponent jobid={job.id} />
         <JobsLocalGalleryDownloadButton job={job} />
+        <JobsDocumentsLocalDeleteButton jobid={job.id} />
       </Space>
       <Card>
         <DocumentsLocalUploadComponent

client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.delete.component.jsx

@@ -0,0 +1,81 @@
+import { QuestionCircleOutlined } from "@ant-design/icons";
+import { Button, notification, Popconfirm } from "antd";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { logImEXEvent } from "../../firebase/firebase.utils";
+import cleanAxios from "../../utils/CleanAxios";
+//Context: currentUserEmail, bodyshop, jobid, invoiceid
+
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { getJobMedia } from "../../redux/media/media.actions";
+import { selectAllMedia } from "../../redux/media/media.selectors";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+const mapStateToProps = createStructuredSelector({
+  allMedia: selectAllMedia,
+
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  getJobMedia: (id) => dispatch(getJobMedia(id)),
+});
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(JobsDocumentsLocalDeleteButton);
+
+export function JobsDocumentsLocalDeleteButton({
+  bodyshop,
+  getJobMedia,
+  allMedia,
+  jobid,
+}) {
+  const { t } = useTranslation();
+
+  const [loading, setLoading] = useState(false);
+
+  const handleDelete = async () => {
+    logImEXEvent("job_documents_delete");
+    setLoading(true);
+
+    const delres = await cleanAxios.post(
+      `${bodyshop.localmediaserverhttp}/jobs/delete`,
+      {
+        jobid: jobid,
+        files: ((allMedia && allMedia[jobid]) || [])
+          .filter((i) => i.isSelected)
+          .map((i) => i.filename),
+      },
+      { headers: { ims_token: bodyshop.localmediatoken } }
+    );
+
+    if (delres.errors) {
+      notification["error"]({
+        message: t("documents.errors.deleting", {
+          message: JSON.stringify(delres.errors),
+        }),
+      });
+    } else {
+      notification.open({
+        key: "docdeletedsuccesfully",
+        type: "success",
+        message: t("documents.successes.delete"),
+      });
+    }
+    getJobMedia(jobid);
+    setLoading(false);
+  };
+
+  return (
+    <Popconfirm
+      icon={<QuestionCircleOutlined style={{ color: "red" }} />}
+      onConfirm={handleDelete}
+      title={t("documents.labels.confirmdelete")}
+      okText={t("general.actions.delete")}
+      okButtonProps={{ type: "danger" }}
+      cancelText={t("general.actions.cancel")}
+    >
+      <Button loading={loading}>{t("documents.actions.delete")}</Button>
+    </Popconfirm>
+  );
+}