From aeb37ed0b7d89db5b8b2d997be15cfb5691f7381 Mon Sep 17 00:00:00 2001
From: Rijk van Zanten <rijkvanzanten@me.com>
Date: Tue, 2 May 2023 16:42:25 -0400
Subject: [PATCH] script[setup]: displays/image/image.vue (#18392)

---
 app/src/displays/image/image.vue | 31 ++++++++++---------------------
 1 file changed, 10 insertions(+), 21 deletions(-)

diff --git a/app/src/displays/image/image.vue b/app/src/displays/image/image.vue
index e5d706616e..0bae7dc7f3 100644
--- a/app/src/displays/image/image.vue
+++ b/app/src/displays/image/image.vue
@@ -11,8 +11,8 @@
 	<value-null v-else />
 </template>
 
-<script lang="ts">
-import { computed, defineComponent, PropType, ref } from 'vue';
+<script setup lang="ts">
+import { computed, ref } from 'vue';
 
 type Image = {
 	id: string;
@@ -20,27 +20,16 @@ type Image = {
 	title: string;
 };
 
-export default defineComponent({
-	props: {
-		value: {
-			type: Object as PropType<Image>,
-			default: null,
-		},
-		circle: {
-			type: Boolean,
-			default: false,
-		},
-	},
-	setup(props) {
-		const imageError = ref(false);
+const props = defineProps<{
+	value: Image | null;
+	circle?: boolean;
+}>();
 
-		const src = computed(() => {
-			if (props.value?.id === null || props.value?.id === undefined) return null;
-			return `/assets/${props.value.id}?key=system-small-cover`;
-		});
+const imageError = ref(false);
 
-		return { src, imageError };
-	},
+const src = computed(() => {
+	if (props.value?.id === null || props.value?.id === undefined) return null;
+	return `/assets/${props.value.id}?key=system-small-cover`;
 });
 </script>