WIP Photo Editor

client/src/components/document-editor/document-editor.container.jsx

@@ -0,0 +1,33 @@
+import { useQuery } from "@apollo/client";
+import { Modal, Result } from "antd";
+import queryString from "query-string";
+import React from "react";
+import { useLocation } from "react-router";
+import { GET_DOCUMENT_BY_PK } from "../../graphql/documents.queries";
+import AlertComponent from "../alert/alert.component";
+import LoadingSpinner from "../loading-spinner/loading-spinner.component";
+import DocumentEditor from "./document-editor.component";
+import { useTranslation } from "react-i18next";
+
+export default function DocumentEditorContainer() {
+  //Get the image details for the image to be saved.
+  //Get the document id from the search string.
+  const { documentId } = queryString.parse(useLocation().search);
+  const { t } = useTranslation();
+
+  const { loading, error, data } = useQuery(GET_DOCUMENT_BY_PK, {
+    variables: { documentId },
+    skip: !documentId,
+  });
+
+  if (loading) return <LoadingSpinner />;
+  if (error) return <AlertComponent message={error.message} type="error" />;
+
+  if (!data.documents_by_pk)
+    return <Result status="404" title={t("general.errors.notfound")} />;
+  return (
+    <div>
+      <DocumentEditor document={data ? data.documents_by_pk : null} />
+    </div>
+  );
+}