initial commit

resources/js/Components/FormValidationErrors.vue

@@ -0,0 +1,22 @@
+<script setup>
+import { computed, defineProps } from 'vue';
+import { usePage } from '@inertiajs/vue3';
+import NotificationBarInCard from '@/Components/NotificationBarInCard.vue';
+
+// const errors = computed(() => usePage().props.errors);
+// const hasErrors = computed(() => Object.keys(props.errors.value).length > 0);
+
+const props = defineProps({
+	errors: Object,
+});
+const hasErrors = computed(() =>{
+	return props.errors != null && Object.keys(props.errors).length > 0;
+});
+</script>
+
+<template>
+	<NotificationBarInCard  v-if="hasErrors" color="danger">
+		<b>Whoops! Something went wrong.</b>
+		<span v-for="(error, key) in errors" :key="key">{{ error }}</span>
+	</NotificationBarInCard>
+</template>