hotfix-feat(dataset): implement file upload with validation and error handling

- Implemented file upload functionality for datasets using multipart requests.
- Added file size and type validation using VineJS.
- Added file name length validation.
- Added file scan to remove infected files.
- Implemented aggregated upload limit to prevent exceeding the server's capacity.
- Added error handling for file upload failures, including temporary file cleanup.
- Updated the `DatasetController` to handle file uploads, validation, and database transactions.
- Updated the `bodyparser.ts` config to process the file upload manually.
- Updated the `api.ts` routes to fetch the statistic data.
- Updated the `main.ts` store to fetch the statistic data.
- Updated the `Dashboard.vue` to display the submitters only for administrator role.
- Updated the `CardBoxWidget.vue` to display the submitters.
- Updated the `ServerError.vue` to use the LayoutGuest.vue.
- Updated the `AuthController.ts` and `start/routes.ts` to handle the database connection errors.
- Updated the `app/exceptions/handler.ts` to handle the database connection errors.
- Updated the `package.json` to use the correct version of the `@adonisjs/bodyparser`.

resources/js/Pages/Dashboard.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { Head } from '@inertiajs/vue3';
-import { computed, onMounted } from 'vue';
+import { Head, usePage } from '@inertiajs/vue3';
+import { computed } from 'vue';
 import { MainService } from '@/Stores/main';
 import {
     mdiAccountMultiple,
@@ -9,7 +9,6 @@ import {
     mdiFinance,
     mdiMonitorCellphone,
     mdiReload,
-    mdiGithub,
     mdiChartPie,
 } from '@mdi/js';
 import LineChart from '@/Components/Charts/LineChart.vue';
@@ -23,14 +22,15 @@ import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
 import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
 // import SectionBannerStarOnGitHub from '@/Components/SectionBannerStarOnGitea.vue';
 import CardBoxDataset from '@/Components/CardBoxDataset.vue';
+import type { User } from '@/Dataset';
 const mainService = MainService()
 
 // const chartData = ref();
-// const fillChartData = async () => {
-//     await mainService.fetchChartData("2022");
-//     // chartData.value = chartConfig.sampleChartData();
-//     // chartData.value = mainService.graphData;
-// };
+const fillChartData = async () => {
+    await mainService.fetchChartData();
+    // chartData.value = chartConfig.sampleChartData();
+    // chartData.value = mainService.graphData;
+};
 const chartData = computed(() => mainService.graphData);
 // onMounted(async () => {
 //     await mainService.fetchChartData("2022");
@@ -49,9 +49,14 @@ const authorBarItems = computed(() => mainService.authors.slice(0, 5));
 const authors = computed(() => mainService.authors);
 const datasets = computed(() => mainService.datasets);
 const datasetBarItems = computed(() => mainService.datasets.slice(0, 5));
-// let test = datasets.value;
-// console.log(test);
+const submitters = computed(() => mainService.clients);
+const user = computed(() => {
+    return usePage().props.authUser as User;
+});
 
+const userHasRoles = (roleNames: Array<string>): boolean => {
+    return user.value.roles.some(role => roleNames.includes(role.name));
+};
 </script>
 
 <template>
@@ -80,21 +85,21 @@ const datasetBarItems = computed(() => mainService.datasets.slice(0, 5));
                     :number="authors.length"
                     label="Authors"
                 />
-                <CardBoxWidget
-                    trend="193"
+                <!-- trend="193" -->
+                <CardBoxWidget                    
                     trend-type="info"
                     color="text-blue-500"
                     :icon="mdiDatabaseOutline"
                     :number="datasets.length"
                     label="Publications"
                 />
-                <CardBoxWidget
-                    trend="+25%"
+                <!-- trend="+25%" -->
+                <CardBoxWidget                    
                     trend-type="up"
                     color="text-purple-500"
                     :icon="mdiChartTimelineVariant"
-                    :number="52"
-                    label="Citations"
+                    :number="submitters.length"
+                    label="Submitters"
                 />
             </div>
 
@@ -128,11 +133,9 @@ const datasetBarItems = computed(() => mainService.datasets.slice(0, 5));
                 </div>
             </CardBox>
 
-            <SectionTitleLineWithButton :icon="mdiAccountMultiple" title="Submitters" />
-
+            <SectionTitleLineWithButton v-if="userHasRoles(['administrator'])" :icon="mdiAccountMultiple" title="Submitters" />
             <!-- <NotificationBar color="info" :icon="mdiMonitorCellphone"> <b>Responsive table.</b> Collapses on mobile </NotificationBar> -->
-
-            <CardBox :icon="mdiMonitorCellphone" title="Responsive table" has-table>
+            <CardBox v-if="userHasRoles(['administrator'])" :icon="mdiMonitorCellphone" title="Responsive table" has-table>
                 <TableSampleClients />
             </CardBox>
         </SectionMain>

resources/js/Pages/Errors/ServerError.vue

@@ -20,11 +20,13 @@ import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.
 import BaseButton from '@/Components/BaseButton.vue';
 import { mdiLightbulbAlert, mdiArrowLeftBoldOutline } from '@mdi/js';
 import { stardust } from '@eidellev/adonis-stardust/client';
-
-@Component({
-    // options: {
-    //     layout: DefaultLayout,
-    // },
+import LayoutGuest from '@/Layouts/LayoutGuest.vue';
+    
+    
+    @Component({
+    options: {
+        layout: LayoutGuest,
+    },
     name: 'AppComponent',
 
     components: {

resources/js/Pages/Errors/postgres_error.vue

@@ -0,0 +1,71 @@
+<template>
+    <div class="min-h-screen flex items-center justify-center bg-gray-100">
+        <div class="max-w-md w-full p-6 bg-white rounded-md shadow-md">
+            <h1 class="text-2xl font-bold text-red-500 mb-4">{{ status }}</h1>
+            <p class="text-gray-700 mb-4">{{ message }}</p>
+            <div class="text-sm text-gray-500 mb-4">
+                <p>Error Code: {{ details.code }}</p>
+                <p>Type: {{ details.type }}</p>
+                <div v-for="(port, index) in details.ports" :key="index">
+                    <p>Connection attempt {{ index + 1 }}: {{ port.address }}:{{ port.port }}</p>
+                </div>
+            </div>
+            <SectionTitleLineWithButton :icon="mdiLightbulbAlert" :title="'Database Error'" :main="true">
+                <BaseButton @click.prevent="handleAction" :icon="mdiArrowLeftBoldOutline" label="Dashboard"
+                    color="white" rounded-full small />
+            </SectionTitleLineWithButton>
+        </div>
+    </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue, Prop } from 'vue-facing-decorator';
+import { Link, router } from '@inertiajs/vue3';
+import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
+import BaseButton from '@/Components/BaseButton.vue';
+import { mdiLightbulbAlert, mdiArrowLeftBoldOutline } from '@mdi/js';
+import { stardust } from '@eidellev/adonis-stardust/client';
+import LayoutGuest from '@/Layouts/LayoutGuest.vue';
+
+@Component({
+    options: {
+        layout: LayoutGuest,
+    },
+    name: 'PostgresError',
+    components: {
+        Link,
+        BaseButton,
+        SectionTitleLineWithButton,
+    },
+})
+export default class AppComponent extends Vue {
+    @Prop({
+        type: String,
+        default: '',
+    })
+    status: string;
+
+    @Prop({
+        type: String,
+        default: '',
+    })
+    message: string;
+
+    @Prop({
+        type: Object,
+        default: () => ({}),
+    })
+    details: {
+        code: string;
+        type: string;
+        ports: Array<{ port: number; address: string }>;
+    };
+
+    mdiLightbulbAlert = mdiLightbulbAlert;
+    mdiArrowLeftBoldOutline = mdiArrowLeftBoldOutline;
+
+    public async handleAction() {
+        await router.get(stardust.route('dashboard'));
+    }
+}
+</script>