From 61e00f1620526c727a455ff6508a9d40db8746b6 Mon Sep 17 00:00:00 2001
From: Geometrically <18202329+Geometrically@users.noreply.github.com>
Date: Mon, 19 Jun 2023 22:15:45 -0700
Subject: [PATCH] Add unclosable modals (#70)

---
 lib/components/base/Modal.vue        | 8 ++++++--
 lib/components/base/ModalConfirm.vue | 6 +++++-
 lib/components/base/ModalReport.vue  | 6 +++++-
 package.json                         | 2 +-
 4 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/lib/components/base/Modal.vue b/lib/components/base/Modal.vue
index 50d006a7b..a6c956add 100644
--- a/lib/components/base/Modal.vue
+++ b/lib/components/base/Modal.vue
@@ -6,13 +6,13 @@
         noblur: props.noblur,
       }"
       class="modal-overlay"
-      @click="hide"
+      @click="() => (closable ? hide() : {})"
     />
     <div class="modal-container" :class="{ shown: actuallyShown }">
       <div class="modal-body">
         <div v-if="props.header" class="header">
           <h1>{{ props.header }}</h1>
-          <button class="btn icon-only transparent" @click="hide">
+          <button v-if="closable" class="btn icon-only transparent" @click="hide">
             <XIcon />
           </button>
         </div>
@@ -38,6 +38,10 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  closable: {
+    type: Boolean,
+    default: true,
+  },
 })
 
 const shown = ref(false)
diff --git a/lib/components/base/ModalConfirm.vue b/lib/components/base/ModalConfirm.vue
index 058fe34dd..eaf5418d4 100644
--- a/lib/components/base/ModalConfirm.vue
+++ b/lib/components/base/ModalConfirm.vue
@@ -1,5 +1,5 @@
 <template>
-  <Modal ref="modal" :header="props.title">
+  <Modal ref="modal" :header="props.title" :noblur="noblur">
     <div class="modal-delete">
       <div class="markdown-body" v-html="renderString(props.description)" />
       <label v-if="props.hasToType" for="confirmation" class="confirmation-label">
@@ -61,6 +61,10 @@ const props = defineProps({
     type: String,
     default: 'Proceed',
   },
+  noblur: {
+    type: Boolean,
+    default: false,
+  },
 })
 
 const emit = defineEmits(['proceed'])
diff --git a/lib/components/base/ModalReport.vue b/lib/components/base/ModalReport.vue
index 1d07ad5d0..7d072d005 100644
--- a/lib/components/base/ModalReport.vue
+++ b/lib/components/base/ModalReport.vue
@@ -1,5 +1,5 @@
 <template>
-  <Modal ref="modal" :header="`Report ${props.itemType}`">
+  <Modal ref="modal" :header="`Report ${props.itemType}`" :noblur="noblur">
     <div class="modal-report">
       <div class="markdown-body">
         <p>
@@ -76,6 +76,10 @@ const props = defineProps({
     type: Function,
     default: () => {},
   },
+  noblur: {
+    type: Boolean,
+    default: false,
+  },
 })
 
 const reportType = ref('')
diff --git a/package.json b/package.json
index 23a4de53a..e3d424d44 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "omorphia",
   "type": "module",
-  "version": "0.4.28",
+  "version": "0.4.29",
   "files": [
     "dist",
     "lib"