feat: media page T1

web/src/components/MediaEmptyState.vue

@@ -4,9 +4,11 @@ import { computed } from 'vue'
 const QUERY_MAX_LENGTH = 40
 
 const props = defineProps<{
-	variant: 'first-run' | 'no-results'
+	variant: 'first-run' | 'no-results' | 'no-duplicates'
 	query?: string
 	filterLabel?: string
+	offline?: boolean
+	limited?: boolean
 }>()
 
 const emit = defineEmits<{ action: [] }>()
@@ -22,6 +24,14 @@ const current = computed(() => {
 			action: 'Upload an image',
 		}
 	}
+	if (props.variant === 'no-duplicates') {
+		return {
+			icon: 'i-lucide-copy',
+			title: 'No duplicates',
+			description: 'Every image in your library is different.',
+			action: 'Back to all images',
+		}
+	}
 	return {
 		icon: 'i-lucide-search',
 		title: truncatedQuery.value
@@ -51,8 +61,9 @@ const current = computed(() => {
 			<UButton
 				v-if="variant === 'first-run'"
 				icon="i-lucide-upload"
-				disabled
+				:disabled="offline || limited"
 				class="h-11 px-4 md:h-8"
+				@click="emit('action')"
 			>
 				{{ current.action }}
 			</UButton>