wowowowowo

resources/js/pages/services/updates/Create.vue

@@ -1,32 +1,40 @@
-<script setup>
+<script setup lang="ts">
 import InputError from "@/components/InputError.vue";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import AppLayout from "@/layouts/AppLayout.vue";
-import { Head, useForm } from "@inertiajs/vue3";
+import { Head, router, useForm } from "@inertiajs/vue3";
 import { AlertTriangleIcon } from "lucide-vue-next";
 
-const props = defineProps({
-    server: {
-        type: Object,
-        required: true,
-    },
-    service: {
-        type: Object,
-        required: true,
-    },
-    backupAvailable: {
-        type: Boolean,
-        required: true,
-    },
-});
+const props = defineProps<{
+    server: Record<string, any>;
+    service: Record<string, any>;
+    backupAvailable: boolean;
+}>();
 
 const form = useForm({
     image_digest: props.service.available_image_digest ?? props.service.current_image_digest ?? "",
     backup_requested: false,
+    confirmation: "",
 });
+
+const useAvailableDigest = () => {
+    form.image_digest = props.service.available_image_digest ?? form.image_digest;
+};
+
+const resolveLatestDigest = (): void => {
+    router.post(
+        route("service-updates.resolve", {
+            organisation: route().params.organisation,
+            server: props.server.id,
+            service: props.service.id,
+        }),
+        {},
+        { preserveScroll: true },
+    );
+};
 </script>
 
 <template>
@@ -71,6 +79,28 @@ const form = useForm({
                         place, starts the new image, and then runs a health check.
                     </div>
 
+                    <div class="rounded-md border bg-muted/30 p-3 text-sm">
+                        Latest known digest:
+                        <code>{{ service.available_image_digest ?? "not resolved yet" }}</code>
+                        <Button
+                            size="xs"
+                            variant="secondary"
+                            class="ml-2"
+                            @click="resolveLatestDigest"
+                        >
+                            Resolve latest minor
+                        </Button>
+                        <Button
+                            v-if="service.available_image_digest"
+                            size="xs"
+                            variant="secondary"
+                            class="ml-2"
+                            @click="useAvailableDigest"
+                        >
+                            Use latest known
+                        </Button>
+                    </div>
+
                     <div class="grid gap-2">
                         <Label for="image_digest">Image digest</Label>
                         <Input
@@ -81,6 +111,12 @@ const form = useForm({
                         <InputError :message="form.errors.image_digest" />
                     </div>
 
+                    <div class="grid gap-2">
+                        <Label for="confirmation">Type {{ service.name }} to confirm downtime</Label>
+                        <Input id="confirmation" v-model="form.confirmation" />
+                        <InputError :message="form.errors.confirmation" />
+                    </div>
+
                     <label v-if="backupAvailable" class="flex items-center gap-2 text-sm">
                         <input
                             v-model="form.backup_requested"
@@ -92,7 +128,7 @@ const form = useForm({
 
                     <div class="flex justify-end">
                         <Button
-                            :disabled="form.processing"
+                            :disabled="form.processing || form.confirmation !== service.name"
                             @click="
                                 form.post(
                                     route('service-updates.store', {