From e7ce79acd3596aee48221ffd931537cfe563b611 Mon Sep 17 00:00:00 2001
From: Travis Briggs <audiodude@gmail.com>
Date: Wed, 6 Nov 2024 12:00:29 -0800
Subject: [PATCH] Fix Typescript errors

---
 rainfall-frontend/src/components/Release.vue   | 11 +++++------
 rainfall-frontend/src/components/SitesList.vue | 17 ++++++++++++-----
 rainfall-frontend/src/views/EditSiteView.vue   |  8 +++++++-
 3 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/rainfall-frontend/src/components/Release.vue b/rainfall-frontend/src/components/Release.vue
index 1c30940..4846ed1 100644
--- a/rainfall-frontend/src/components/Release.vue
+++ b/rainfall-frontend/src/components/Release.vue
@@ -115,6 +115,9 @@ export default defineComponent({
         this.$router.push(`/site/${this.release.site_id}`);
       }
     },
+    showDeleteModal() {
+      (this.$refs.deleteModal as typeof DeleteConfirmModal).show();
+    },
   },
   watch: {
     release(newRelease) {
@@ -185,11 +188,7 @@ export default defineComponent({
       <div v-if="!isEditing" class="p-2 bg-emerald-500 text-white">
         <div class="release-name text-xl flex justify-between">
           {{ release.name }}
-          <button
-            @click="$refs.deleteModal?.show()"
-            type="button"
-            class="delete-release-overview-button"
-          >
+          <button @click="showDeleteModal()" type="button" class="delete-release-overview-button">
             <svg
               class="inline text-red-600 w-6 h-6 relative -top-0.5 ml-px"
               xmlns="http://www.w3.org/2000/svg"
@@ -284,7 +283,7 @@ export default defineComponent({
     ></DeleteConfirmModal>
     <div v-if="isEditing" class="md:max-w-screen-md pr-4">
       <button
-        @click="$refs.deleteModal?.show()"
+        @click="showDeleteModal()"
         id="delete-release-button"
         class="block md:w-40 mx-auto md:ml-auto md:mr-0 cursor-pointer mt-4 w-10/12 p-4 md:py-2 text-xl md:text-base bg-red-700 dark:bg-red-500 text-gray-100 font-semibold rounded hover:text-white hover:bg-red-600"
       >
diff --git a/rainfall-frontend/src/components/SitesList.vue b/rainfall-frontend/src/components/SitesList.vue
index 61750fd..d7f5b82 100644
--- a/rainfall-frontend/src/components/SitesList.vue
+++ b/rainfall-frontend/src/components/SitesList.vue
@@ -6,7 +6,10 @@ import { deleteSite as deleteSiteHelper } from '@/helpers/site';
 export default {
   components: { DeleteConfirmModal },
   props: ['sites'],
-  data() {
+  data(): {
+    deleteError: string;
+    siteIdToDelete: string | null;
+  } {
     return {
       deleteError: '',
       siteIdToDelete: null,
@@ -17,10 +20,17 @@ export default {
       this.$router.push(`/site/${id}`);
     },
     async deleteSite() {
+      if (!this.siteIdToDelete) {
+        return;
+      }
       this.deleteError = await deleteSiteHelper(this.siteIdToDelete);
       this.siteIdToDelete = null;
       this.$emit('site-deleted');
     },
+    showDeleteModal(id: string) {
+      this.siteIdToDelete = id;
+      (this.$refs.deleteModal as typeof DeleteConfirmModal).show();
+    },
   },
 };
 </script>
@@ -38,10 +48,7 @@ export default {
         >
           {{ site.name }}
           <button
-            @click.stop="
-              siteIdToDelete = site.id;
-              $refs.deleteModal?.show();
-            "
+            @click.stop="showDeleteModal(site.id)"
             type="button"
             class="delete-site-overview-button"
           >
diff --git a/rainfall-frontend/src/views/EditSiteView.vue b/rainfall-frontend/src/views/EditSiteView.vue
index 3138081..d26a8b5 100644
--- a/rainfall-frontend/src/views/EditSiteView.vue
+++ b/rainfall-frontend/src/views/EditSiteView.vue
@@ -94,6 +94,9 @@ export default {
       this.sitesError = error;
     },
     async deleteSite(id: string) {
+      if (!this.site) {
+        return;
+      }
       this.deleteError = await deleteSiteHelper(this.site.id);
       this.$router.replace('/sites');
     },
@@ -127,6 +130,9 @@ export default {
       }
       this.site.name = this.newSiteName;
     },
+    showDeleteModal() {
+      (this.$refs.deleteModal as typeof DeleteConfirmModal).show();
+    },
   },
 };
 </script>
@@ -207,7 +213,7 @@ export default {
       ></DeleteConfirmModal>
       <div class="flex flex-col md:flex-row mt-8 justify-right">
         <button
-          @click="$refs.deleteModal?.show()"
+          @click="showDeleteModal()"
           id="delete-release-button"
           class="block md:w-40 mx-auto md:ml-auto md:mr-0 cursor-pointer w-10/12 md:w-48 p-4 md:py-2 text-xl md:text-base bg-red-700 dark:bg-red-500 text-gray-100 font-semibold rounded hover:text-white hover:bg-red-800"
         >