(feat)O3-2211: draw using a custom simple svg editor

package.json

@@ -45,11 +45,15 @@
   },
   "dependencies": {
     "@carbon/react": "^1.33.0",
-    "lodash-es": "^4.17.21",
-    "react-image-annotate": "^1.8.0"
+    "@openmrs/esm-patient-common-lib": "^5.0.0",
+    "@openmrs/openmrs-form-engine-lib": "latest",
+    "canvas-to-image": "^2.0.3",
+    "fabric": "^5.3.0",
+    "lodash-es": "^4.17.21"
   },
   "peerDependencies": {
     "@openmrs/esm-framework": "*",
+    "@openmrs/esm-patient-common-lib": "5.x",
     "dayjs": "1.x",
     "react": "18.x",
     "react-i18next": "11.x",

src/attachments-types.ts

@@ -0,0 +1,24 @@
+export interface UploadedFile {
+  file?: File;
+  base64Content: string;
+  fileName: string;
+  fileType: string;
+  fileDescription: string;
+  status?: "uploading" | "complete";
+}
+export interface Attachment {
+  id: string;
+  src: string;
+  title: string;
+  description: string;
+  dateTime: string;
+  bytesMimeType: string;
+  bytesContentFamily: string;
+}
+export interface AttachmentResponse {
+  bytesContentFamily: string;
+  bytesMimeType: string;
+  comment: string;
+  dateTime: string;
+  uuid: string;
+}

src/attachments/attachments.resource.tsx

@@ -0,0 +1,88 @@
+import { useMemo } from "react";
+import useSWR from "swr";
+import { FetchResponse, openmrsFetch } from "@openmrs/esm-framework";
+import { AttachmentResponse, UploadedFile } from "../attachments-types";
+
+export const attachmentUrl = "/ws/rest/v1/attachment";
+
+export function getAttachmentByUuid(
+  attachmentUuid: string,
+  abortController: AbortController
+) {
+  return openmrsFetch(`${attachmentUrl}/${attachmentUuid}`, {
+    signal: abortController.signal,
+  });
+}
+
+export function useAttachments(
+  patientUuid: string,
+  includeEncounterless: boolean
+) {
+  const { data, error, mutate, isLoading, isValidating } = useSWR<
+    FetchResponse<{ results: Array<AttachmentResponse> }>
+  >(
+    `${attachmentUrl}?patient=${patientUuid}&includeEncounterless=${includeEncounterless}`,
+    openmrsFetch
+  );
+
+  const results = useMemo(
+    () => ({
+      isLoading,
+      data: data?.data.results ?? [],
+      error,
+      mutate,
+      isValidating,
+    }),
+    [data, error, isLoading, isValidating, mutate]
+  );
+
+  return results;
+}
+
+export function getAttachments(
+  patientUuid: string,
+  includeEncounterless: boolean,
+  abortController: AbortController
+) {
+  return openmrsFetch(
+    `${attachmentUrl}?patient=${patientUuid}&includeEncounterless=${includeEncounterless}`,
+    {
+      signal: abortController.signal,
+    }
+  );
+}
+
+export async function createAttachment(
+  patientUuid: string,
+  fileToUpload: UploadedFile
+) {
+  const formData = new FormData();
+
+  formData.append("fileCaption", fileToUpload.fileName);
+  formData.append("patient", patientUuid);
+
+  if (fileToUpload.file) {
+    formData.append("file", fileToUpload.file);
+  } else {
+    formData.append(
+      "file",
+      new File([""], fileToUpload.fileName),
+      fileToUpload.fileName
+    );
+    formData.append("base64Content", fileToUpload.base64Content);
+  }
+  return openmrsFetch(attachmentUrl, {
+    method: "POST",
+    body: formData,
+  });
+}
+
+export function deleteAttachmentPermanently(
+  attachmentUuid: string,
+  abortController: AbortController
+) {
+  return openmrsFetch(`${attachmentUrl}/${attachmentUuid}`, {
+    method: "DELETE",
+    signal: abortController.signal,
+  });
+}