From 2580d0874fb0b099d1c7f29c89a025e4133fdc5b Mon Sep 17 00:00:00 2001
From: James Collins <james.collins@outlook.com.au>
Date: Tue, 25 Apr 2023 19:34:01 +1000
Subject: [PATCH] bug fixes

---
 resources/js/components/SMImage.vue        |  1 +
 resources/js/components/SMInput.vue        |  2 +-
 resources/js/router/index.js               |  2 +-
 resources/js/views/dashboard/MediaEdit.vue | 20 +++++++-------------
 4 files changed, 10 insertions(+), 15 deletions(-)

diff --git a/resources/js/components/SMImage.vue b/resources/js/components/SMImage.vue
index b0327c0..1011283 100644
--- a/resources/js/components/SMImage.vue
+++ b/resources/js/components/SMImage.vue
@@ -45,6 +45,7 @@ const imgError = ref(false);
         flex-direction: column;
         align-items: center;
         justify-content: center;
+        margin: 0 auto;
 
         ion-icon {
             font-size: 300%;
diff --git a/resources/js/components/SMInput.vue b/resources/js/components/SMInput.vue
index 5681a05..f3a7f54 100644
--- a/resources/js/components/SMInput.vue
+++ b/resources/js/components/SMInput.vue
@@ -572,7 +572,7 @@ const handleMediaSelect = async () => {
                 border-style: solid;
                 border-color: var(--base-color-darker);
                 border-radius: 0 8px 8px 0;
-                padding: 15px 30px;
+                padding: 16px 30px;
                 width: auto;
             }
 
diff --git a/resources/js/router/index.js b/resources/js/router/index.js
index b843034..2c6d034 100644
--- a/resources/js/router/index.js
+++ b/resources/js/router/index.js
@@ -324,7 +324,7 @@ export const routes = [
                             import("@/views/dashboard/MediaEdit.vue"),
                     },
                     {
-                        path: "edit/:id",
+                        path: ":id",
                         name: "dashboard-media-edit",
                         meta: {
                             title: "Edit Media",
diff --git a/resources/js/views/dashboard/MediaEdit.vue b/resources/js/views/dashboard/MediaEdit.vue
index 9bf84c2..9785afa 100644
--- a/resources/js/views/dashboard/MediaEdit.vue
+++ b/resources/js/views/dashboard/MediaEdit.vue
@@ -11,11 +11,9 @@
                 :model-value="form"
                 @submit="handleSubmit"
                 @failed-validation="handleFailValidation">
-                <SMRow>
+                <SMRow v-if="route.params.id">
                     <SMColumn class="media-container">
-                        <!-- <div class="media-container"> -->
                         <SMImage :src="imageUrl" />
-                        <!-- </div> -->
                     </SMColumn>
                 </SMRow>
                 <SMRow>
@@ -79,7 +77,7 @@
                     <template #left>
                         <SMButton
                             :form="form"
-                            v-if="route.params.id !== 'create'"
+                            v-if="route.params.id"
                             type="danger"
                             label="Delete"
                             @click="handleDelete" />
@@ -91,7 +89,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, reactive, ref, watch } from "vue";
+import { computed, reactive, ref } from "vue";
 import { useRoute, useRouter } from "vue-router";
 import { api } from "../../helpers/api";
 import { Form, FormControl } from "../../helpers/form";
@@ -116,8 +114,7 @@ const router = useRouter();
 
 const pageError = ref(200);
 const pageLoading = ref(true);
-const pageHeading =
-    route.params.id !== "create" ? "Edit Media" : "Upload Media";
+const pageHeading = route.params.id ? "Edit Media" : "Upload Media";
 
 const form = reactive(
     Form({
@@ -141,7 +138,7 @@ const fileData = reactive({
 const imageUrl = ref("");
 
 const handleLoad = async () => {
-    if (route.params.id !== "create") {
+    if (route.params.id) {
         try {
             let result = await api.get({
                 url: "/media/{id}",
@@ -196,7 +193,7 @@ const handleSubmit = async () => {
             form.controls.description.value as string
         );
 
-        if (route.params.id !== "create") {
+        if (route.params.id) {
             await api.put({
                 url: "/media/{id}",
                 params: {
@@ -222,10 +219,7 @@ const handleSubmit = async () => {
         }
 
         useToastStore().addToast({
-            title:
-                route.params.id !== "create"
-                    ? "Media Updated"
-                    : "Media Created",
+            title: route.params.id ? "Media Updated" : "Media Created",
             content: route.params.id
                 ? "The media item has been updated."
                 : "The media item been created.",