- renamings to the new naming convetion for adonisjs version 6

- npm updates

app/Controllers/Http/Editor/DatasetController.ts

@@ -13,7 +13,7 @@ import { DateTime } from 'luxon';
 import Index from '#app/Library/Utils/Index';
 import { getDomain } from '#app/Utils/utility-functions';
 import { DoiClient } from '#app/Library/Doi/DoiClient';
-import DoiClientException from '#app/Exceptions/DoiClientException';
+import DoiClientException from '#app/exceptions/DoiClientException';
 import logger from '@adonisjs/core/services/logger';
 import { HttpException } from 'node-exceptions';
 import { ModelQueryBuilderContract } from "@adonisjs/lucid/types/model";

app/Controllers/Http/Oai/OaiController.ts

@@ -10,8 +10,8 @@ import { readFileSync } from 'fs';
 import { StatusCodes } from 'http-status-codes';
 import SaxonJS from 'saxon-js';
 // import { Xslt, xmlParse } from 'xslt-processor'
-import { OaiErrorCodes, OaiModelError } from '#app/Exceptions/OaiErrorCodes';
+import { OaiErrorCodes, OaiModelError } from '#app/exceptions/OaiErrorCodes';
-import { OaiModelException, BadOaiModelException } from '#app/Exceptions/OaiModelException';
+import { OaiModelException, BadOaiModelException } from '#app/exceptions/OaiModelException';
 import Dataset from '#app/Models/Dataset';
 import Collection from '#app/Models/Collection';
 import { getDomain, preg_match } from '#app/Utils/utility-functions';

app/Controllers/Http/Submitter/DatasetController.ts

@@ -154,7 +154,7 @@ export default class DatasetController {
             rights: schema.string([rules.equalTo('true')]),
         });
 
-        await request.validate({ schema: newDatasetSchema, messages: this.messages });
+        // await request.validate({ schema: newDatasetSchema, messages: this.messages });
         try {
             //  Step 2 - Validate request body against  the schema
 

app/Library/Doi/DoiClient.ts

@@ -2,7 +2,7 @@
 // import { Log } from '@adonisjs/core/build/standalone';
 // import { DoiInterface } from './interfaces/DoiInterface';
 import DoiClientContract from '#app/Library/Doi/DoiClientContract';
-import DoiClientException from '#app/Exceptions/DoiClientException';
+import DoiClientException from '#app/exceptions/DoiClientException';
 import { StatusCodes } from 'http-status-codes';
 import logger from '@adonisjs/core/services/logger';
 import { AxiosResponse } from 'axios';

app/Library/Oai/TokenWorkerSerice.ts

@@ -1,6 +1,6 @@
 import ResumptionToken from './ResumptionToken.js';
 import { createClient, RedisClientType } from 'redis';
-import InternalServerErrorException from '#app/Exceptions/InternalServerException';
+import InternalServerErrorException from '#app/exceptions/InternalServerException';
 import { sprintf } from 'sprintf-js';
 import dayjs from 'dayjs';
 import TokenWorkerContract from './TokenWorkerContract.js';

app/Models/utils.ts

@@ -1,18 +0,0 @@
-// import db from '@adonisjs/lucid/services/db';
-// // import Config from '@ioc:Adonis/Core/Config';
-// import config from '@adonisjs/core/services/config';
-// import { QueryClientContract } from "@adonisjs/lucid/types/database";
-// import { TransactionClientContract } from "@adonisjs/lucid/types/database";
-
-// export function getUserRoles(userId: number, trx?: TransactionClientContract): Promise<Array<string>> {
-//     const { userRole } = config.get('acl.joinTables');
-//     return ((trx || db) as QueryClientContract | TransactionClientContract)
-//         .query()
-//         .from('roles')
-//         .distinct('roles.slug')
-//         .leftJoin(userRole, `${userRole}.role_id`, 'roles.id')
-//         .where(`${userRole}.user_id`, userId)
-//         .then((res) => {
-//             return res.map((r) => r.slug);
-//         });
-// }

app/exceptions/handler.ts

@@ -29,7 +29,7 @@ export default class HttpExceptionHandler extends ExceptionHandler {
      * codes. You might want to enable them in production only, but feel
      * free to enable them in development as well.
      */
-    protected renderStatusPages = app.inProduction;
+    protected renderStatusPages = true; //app.inProduction;
 
     /**
      * Status pages is a collection of error code range and a callback
@@ -68,7 +68,7 @@ export default class HttpExceptionHandler extends ExceptionHandler {
     // }
 
     public async handle(error: any, ctx: HttpContext) {
-        // const { response, request, session, inertia } = ctx;
+        const { response, request, session, inertia } = ctx;
 
         /**
          * Handle failed authentication attempt
@@ -86,17 +86,18 @@ export default class HttpExceptionHandler extends ExceptionHandler {
         // let test = response.getStatus(); //200
         // let header = request.header('X-Inertia'); // true
         // if (request.header('X-Inertia') && [500, 503, 404, 403, 401, 200].includes(response.getStatus())) {
-        //     // session.flash('errors', error.messages.errors);
+        if (request.header('X-Inertia') && [422].includes(error.status)) {
-        //     session.flash('errors', error.messages);
+            // session.flash('errors', error.messages.errors);
-        //     return response.redirect().back();
+            session.flash('errors', error.messages);
-        //     // return inertia.render('errors/server_error', {
+            return response.redirect().back();
-        //     // return inertia.render('errors/server_error', {
+            // return inertia.render('errors/server_error', {
-        //     //     // status: response.getStatus(),
+            // return inertia.render('errors/server_error', {
-        //     //     error: error,
+            //     // status: response.getStatus(),
-        //     // });
+            //     error: error,
-        //     // ->toResponse($request)
+            // });
-        //     // ->setStatusCode($response->status());
+            // ->toResponse($request)
-        // }
+            // ->setStatusCode($response->status());
+        }
         // Dynamically change the error templates based on the absence of X-Inertia header
         // if (!ctx.request.header('X-Inertia')) {
         //     this.statusPages = {

bin/console.ts

@@ -11,14 +11,14 @@
 |
 */
 
-import 'reflect-metadata'
+import 'reflect-metadata';
-import { Ignitor, prettyPrintError } from '@adonisjs/core'
+import { Ignitor, prettyPrintError } from '@adonisjs/core';
 
 /**
  * URL to the application root. AdonisJS need it to resolve
  * paths to file and directories for scaffolding commands
  */
-const APP_ROOT = new URL('../', import.meta.url)
+const APP_ROOT = new URL('../', import.meta.url);
 
 /**
  * The importer is used to import files in context of the
@@ -26,22 +26,22 @@ const APP_ROOT = new URL('../', import.meta.url)
  */
 const IMPORTER = (filePath: string) => {
     if (filePath.startsWith('./') || filePath.startsWith('../')) {
-    return import(new URL(filePath, APP_ROOT).href)
+        return import(new URL(filePath, APP_ROOT).href);
     }
-  return import(filePath)
+    return import(filePath);
-}
+};
 
 new Ignitor(APP_ROOT, { importer: IMPORTER })
     .tap((app) => {
         app.booting(async () => {
-      await import('#start/env')
+            await import('#start/env');
-    })
+        });
-    app.listen('SIGTERM', () => app.terminate())
+        app.listen('SIGTERM', () => app.terminate());
-    app.listenIf(app.managedByPm2, 'SIGINT', () => app.terminate())
+        app.listenIf(app.managedByPm2, 'SIGINT', () => app.terminate());
     })
     .ace()
     .handle(process.argv.splice(2))
     .catch((error) => {
-    process.exitCode = 1
+        process.exitCode = 1;
-    prettyPrintError(error)
+        prettyPrintError(error);
-  })
+    });

bin/server.ts

@@ -9,14 +9,14 @@
 |
 */
 
-import 'reflect-metadata'
+import 'reflect-metadata';
-import { Ignitor, prettyPrintError } from '@adonisjs/core'
+import { Ignitor, prettyPrintError } from '@adonisjs/core';
 
 /**
  * URL to the application root. AdonisJS need it to resolve
  * paths to file and directories for scaffolding commands
  */
-const APP_ROOT = new URL('../', import.meta.url)
+const APP_ROOT = new URL('../', import.meta.url);
 
 /**
  * The importer is used to import files in context of the
@@ -24,22 +24,22 @@ const APP_ROOT = new URL('../', import.meta.url)
  */
 const IMPORTER = (filePath: string) => {
     if (filePath.startsWith('./') || filePath.startsWith('../')) {
-    return import(new URL(filePath, APP_ROOT).href)
+        return import(new URL(filePath, APP_ROOT).href);
     }
-  return import(filePath)
+    return import(filePath);
-}
+};
 
 new Ignitor(APP_ROOT, { importer: IMPORTER })
     .tap((app) => {
         app.booting(async () => {
-      await import('#start/env')
+            await import('#start/env');
-    })
+        });
-    app.listen('SIGTERM', () => app.terminate())
+        app.listen('SIGTERM', () => app.terminate());
-    app.listenIf(app.managedByPm2, 'SIGINT', () => app.terminate())
+        app.listenIf(app.managedByPm2, 'SIGINT', () => app.terminate());
     })
     .httpServer()
     .start()
     .catch((error) => {
-    process.exitCode = 1
+        process.exitCode = 1;
-    prettyPrintError(error)
+        prettyPrintError(error);
-  })
+    });

bin/test.ts

@@ -10,17 +10,17 @@
 |
 */
 
-process.env.NODE_ENV = 'test'
+process.env.NODE_ENV = 'test';
 
-import 'reflect-metadata'
+import 'reflect-metadata';
-import { Ignitor, prettyPrintError } from '@adonisjs/core'
+import { Ignitor, prettyPrintError } from '@adonisjs/core';
-import { configure, processCLIArgs, run } from '@japa/runner'
+import { configure, processCLIArgs, run } from '@japa/runner';
 
 /**
  * URL to the application root. AdonisJS need it to resolve
  * paths to file and directories for scaffolding commands
  */
-const APP_ROOT = new URL('../', import.meta.url)
+const APP_ROOT = new URL('../', import.meta.url);
 
 /**
  * The importer is used to import files in context of the
@@ -28,24 +28,24 @@ const APP_ROOT = new URL('../', import.meta.url)
  */
 const IMPORTER = (filePath: string) => {
     if (filePath.startsWith('./') || filePath.startsWith('../')) {
-    return import(new URL(filePath, APP_ROOT).href)
+        return import(new URL(filePath, APP_ROOT).href);
     }
-  return import(filePath)
+    return import(filePath);
-}
+};
 
 new Ignitor(APP_ROOT, { importer: IMPORTER })
     .tap((app) => {
         app.booting(async () => {
-      await import('#start/env')
+            await import('#start/env');
-    })
+        });
-    app.listen('SIGTERM', () => app.terminate())
+        app.listen('SIGTERM', () => app.terminate());
-    app.listenIf(app.managedByPm2, 'SIGINT', () => app.terminate())
+        app.listenIf(app.managedByPm2, 'SIGINT', () => app.terminate());
     })
     .testRunner()
     .configure(async (app) => {
-    const { runnerHooks, ...config } = await import('../tests/bootstrap.js')
+        const { runnerHooks, ...config } = await import('../tests/bootstrap.js');
 
-    processCLIArgs(process.argv.splice(2))
+        processCLIArgs(process.argv.splice(2));
         configure({
             ...app.rcFile.tests,
             ...config,
@@ -53,10 +53,10 @@ new Ignitor(APP_ROOT, { importer: IMPORTER })
                 setup: runnerHooks.setup,
                 teardown: runnerHooks.teardown.concat([() => app.terminate()]),
             },
-    })
+        });
     })
     .run(() => run())
     .catch((error) => {
-    process.exitCode = 1
+        process.exitCode = 1;
-    prettyPrintError(error)
+        prettyPrintError(error);
-  })
+    });

config/inertia.ts

@@ -11,6 +11,9 @@ export default defineConfig({
      * Data that should be shared with all rendered pages
      */
     sharedData: {
+        //This will be available in all views
+        appName: 'Tethys Cloud',
+
         errors: (ctx) => ctx.session?.flashMessages.get('errors'),
 
         user_id: (ctx) => {

config/shield.ts

@@ -1,134 +1,51 @@
-import { defineConfig } from '@adonisjs/shield';
+import { defineConfig } from '@adonisjs/shield'
 
-export default defineConfig({
+const shieldConfig = defineConfig({
+  /**
+   * Configure CSP policies for your app. Refer documentation
+   * to learn more
+   */
   csp: {
-        /*
-  |--------------------------------------------------------------------------
-  | Enable/disable CSP
-  |--------------------------------------------------------------------------
-  |
-  | The CSP rules are disabled by default for seamless onboarding.
-  |
-  */
     enabled: false,
-
-        /*
-  |--------------------------------------------------------------------------
-  | Directives
-  |--------------------------------------------------------------------------
-  |
-  | All directives are defined in camelCase and here is the list of
-  | available directives and their possible values.
-  |
-  | https://content-security-policy.com
-  |
-  | @example
-  | directives: {
-  |   defaultSrc: ["'self'", '@nonce', 'cdnjs.cloudflare.com']
-  | }
-  |
-  */
     directives: {},
-
-        /*
-  |--------------------------------------------------------------------------
-  | Report only
-  |--------------------------------------------------------------------------
-  |
-  | Setting `reportOnly=true` will not block the scripts from running and
-  | instead report them to a URL.
-  |
-  */
     reportOnly: false,
   },
+
+  /**
+   * Configure CSRF protection options. Refer documentation
+   * to learn more
+   */
   csrf: {
-        /*
-  |--------------------------------------------------------------------------
-  | Enable/Disable CSRF
-  |--------------------------------------------------------------------------
-  */
     enabled: true,
-
-        /*
-  |--------------------------------------------------------------------------
-  | Routes to Ignore
-  |--------------------------------------------------------------------------
-  |
-  | Define an array of route patterns that you want to ignore from CSRF
-  | validation. Make sure the route patterns are started with a leading
-  | slash. Example:
-  |
-  | `/foo/bar`
-    |
-    | Also you can define a function that is evaluated on every HTTP Request.
-    | ```
-    |  exceptRoutes: ({ request }) => request.url().includes('/api')
-    | ```
-  |
-  */
     exceptRoutes: [],
-
-        /*
-  |--------------------------------------------------------------------------
-  | Enable Sharing Token Via Cookie
-  |--------------------------------------------------------------------------
-  |
-  | When the following flag is enabled, AdonisJS will drop `XSRF-TOKEN`
-  | cookie that frontend frameworks can read and return back as a
-  | `X-XSRF-TOKEN` header.
-  |
-  | The cookie has `httpOnly` flag set to false, so it is little insecure and
-  | can be turned off when you are not using a frontend framework making
-  | AJAX requests.
-  |
-  */
     enableXsrfCookie: true,
-
-        /*
-  |--------------------------------------------------------------------------
-  | Methods to Validate
-  |--------------------------------------------------------------------------
-  |
-  | Define an array of HTTP methods to be validated for a valid CSRF token.
-  |
-  */
     methods: ['POST', 'PUT', 'PATCH', 'DELETE'],
   },
+
+  /**
+   * Control how your website should be embedded inside
+   * iFrames
+   */
+  xFrame: {
+    enabled: true,
+    action: 'DENY',
+  },
+
+  /**
+   * Force browser to always use HTTPS
+   */
   hsts: {
     enabled: true,
-        /*
-  |--------------------------------------------------------------------------
-  | Max Age
-  |--------------------------------------------------------------------------
-  |
-  | Control, how long the browser should remember that a site is only to be
-  | accessed using HTTPS.
-  |
-  */
     maxAge: '180 days',
-
-        /*
-  |--------------------------------------------------------------------------
-  | Include Subdomains
-  |--------------------------------------------------------------------------
-  |
-  | Apply rules on the subdomains as well.
-  |
-  */
-        includeSubDomains: true,
-
-        /*
-  |--------------------------------------------------------------------------
-  | Preloading
-  |--------------------------------------------------------------------------
-  |
-  | Google maintains a service to register your domain and it will preload
-  | the HSTS policy. Learn more https://hstspreload.org/
-  |
-  */
-        preload: false,
   },
+
+  /**
+   * Disable browsers from sniffing the content type of a
+   * response and always rely on the "content-type" header.
+   */
   contentTypeSniffing: {
     enabled: true,
   },
-});
+})
+
+export default shieldConfig

package.json

@@ -49,7 +49,6 @@
     "@types/source-map-support": "^0.5.6",
     "@types/sprintf-js": "^1.1.4",
     "@types/supertest": "^6.0.2",
-    "@vue/tsconfig": "^0.4.0",
     "autoprefixer": "^10.4.13",
     "babel-preset-typescript-vue3": "^2.0.17",
     "chart.js": "^4.2.0",
@@ -69,7 +68,7 @@
     "ts-loader": "^9.4.2",
     "ts-node": "^10.9.2",
     "typescript": "^5.1.3",
-    "vue": "^3.2.47",
+    "vue": "^3.4.26",
     "vue-facing-decorator": "^3.0.0",
     "vue-loader": "^17.0.1",
     "xslt3": "^2.5.0"
@@ -120,12 +119,12 @@
   "type": "module",
   "imports": {
     "#controllers/*": "./app/Controllers/*.js",
-    "#exceptions/*": "./app/Exceptions/*.js",
+    "#exceptions/*": "./app/exceptions/*.js",
     "#models/*": "./app/Models/*.js",
     "#services/*": "./app/services/*.js",
     "#listeners/*": "./app/listeners/*.js",
     "#events/*": "./app/events/*.js",
-    "#middleware/*": "./app/Middleware/*.js",
+    "#middleware/*": "./app/middleware/*.js",
     "#validators/*": "./app/Validators/*.js",
     "#start/*": "./start/*.js",
     "#config/*": "./config/*.js",

public/assets/manifest.json

@@ -60,7 +60,6 @@
   "assets/resources_js_Components_Admin_Pagination_vue-resources_js_Components_BaseButtons_vue-resource-8134e7.js": "http://localhost:8080/assets/resources_js_Components_Admin_Pagination_vue-resources_js_Components_BaseButtons_vue-resource-8134e7.js",
   "assets/resources_js_Components_Map_draw_component_vue-resources_js_Components_Map_zoom_component_vue-196747.js": "http://localhost:8080/assets/resources_js_Components_Map_draw_component_vue-resources_js_Components_Map_zoom_component_vue-196747.js",
   "assets/resources_js_Components_Admin_Sort_vue-resources_js_Components_SectionTitleLineWithButton_vue.js": "http://localhost:8080/assets/resources_js_Components_Admin_Sort_vue-resources_js_Components_SectionTitleLineWithButton_vue.js",
-  "assets/resources_js_Components_CardBoxModal_vue.js": "http://localhost:8080/assets/resources_js_Components_CardBoxModal_vue.js",
   "assets/resources_js_Components_FileUpload_vue-resources_js_Components_FormCheckRadioGroup_vue-resour-d5e5fc.js": "http://localhost:8080/assets/resources_js_Components_FileUpload_vue-resources_js_Components_FormCheckRadioGroup_vue-resour-d5e5fc.js",
   "assets/fonts/inter-latin-ext-400-normal.woff": "http://localhost:8080/assets/fonts/inter-latin-ext-400-normal.40b3b0d5.woff",
   "assets/fonts/inter-latin-ext-400-normal.woff2": "http://localhost:8080/assets/fonts/inter-latin-ext-400-normal.0f9e8d4e.woff2",

resources/js/Components/AsideMenuItem.vue

@@ -5,7 +5,7 @@ import { Link, usePage } from '@inertiajs/vue3';
 
 import { StyleService } from '@/Stores/style.service';
 import { mdiMinus, mdiPlus } from '@mdi/js';
-import { getButtonColor } from '@/colors.js';
+import { getButtonColor } from '@/colors';
 import BaseIcon from '@/Components/BaseIcon.vue';
 // import AsideMenuList from '@/Components/AsideMenuList.vue';
 import { stardust } from '@eidellev/adonis-stardust/client';

resources/js/Components/BaseButton.vue

@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 import { Link } from '@inertiajs/vue3';
 // import { Link } from '@inertiajs/inertia-vue3';
-import { getButtonColor } from '@/colors.js';
+import { getButtonColor } from '@/colors';
 import BaseIcon from '@/Components/BaseIcon.vue';
 
 const props = defineProps({

resources/js/Components/FooterBar.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { computed } from 'vue';
-import { containerMaxW } from '@/config.js';
+import { containerMaxW } from '@/config';
 import BaseLevel from '@/Components/BaseLevel.vue';
 import JustboilLogo from '@/Components/JustboilLogo.vue';
 

resources/js/Components/FormField.vue

@@ -1,6 +1,7 @@
 <script setup>
 import { computed, useSlots } from 'vue';
 
+
 defineProps({
     label: {
         type: String,

resources/js/Components/IconRounded.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { colorsText, colorsBgLight } from '@/colors.js';
+import { colorsText, colorsBgLight } from '@/colors';
 import BaseIcon from '@/Components/BaseIcon.vue';
 
 defineProps({

resources/js/Components/NavBar.vue

@@ -2,10 +2,10 @@
 import { usePage, router } from '@inertiajs/vue3';
 // import { usePage } from '@inertiajs/inertia-vue3';
 // import { Inertia } from '@inertiajs/inertia';
-import { ComputedRef } from 'vue';
+import type { ComputedRef } from 'vue';
 
 import { computed, ref } from 'vue';
-import { containerMaxW } from '@/config.js';
+import { containerMaxW } from '@/config';
 import { StyleService } from '@/Stores/style.service';
 import { LayoutService } from '@/Stores/layout';
 import {

resources/js/Components/NotificationBar.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { ref, computed, useSlots } from 'vue';
 import { mdiClose } from '@mdi/js';
-import { colorsBgLight, colorsOutline } from '@/colors.js';
+import { colorsBgLight, colorsOutline } from '@/colors';
 import BaseLevel from '@/Components/BaseLevel.vue';
 import BaseIcon from '@/Components/BaseIcon.vue';
 import BaseButton from '@/Components/BaseButton.vue';

resources/js/Components/NotificationBarInCard.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { colorsBgLight } from '@/colors.js';
+import { colorsBgLight } from '@/colors';
 
 defineProps({
     color: {

resources/js/Components/PillTag.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { computed } from 'vue';
-import { colorsBgLight, colorsOutline } from '@/colors.js';
+import { colorsBgLight, colorsOutline } from '@/colors';
 import BaseIcon from '@/Components/BaseIcon.vue';
 
 const props = defineProps({

resources/js/Components/SectionMain.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { containerMaxW } from '@/config.js';
+import { containerMaxW } from '@/config';
 </script>
 
 <template>

resources/js/Dataset.ts

@@ -19,7 +19,10 @@ export interface Role {
     created_at: DateTime;
     updated_at: DateTime;
 }
-
+export interface License {
+    id: any;
+    // Add other properties as needed
+}
 export interface Dataset {
     [key: string]:
         | string
@@ -33,9 +36,10 @@ export interface Dataset {
         | Coverage
         | Array<DatasetReference>
         | Array<File>
-        | (Array<number> | Array<Object>);
+        | (Array<number> | Array<License>)
+        |  Array<TethysFile>;
     language: string;
-    licenses: Array<number> | Array<Object>;
+    licenses: Array<number> | Array<License>;
     rights: boolean;
     type: string;
     creating_corporation: string;

resources/js/Pages/App.vue

@@ -54,7 +54,7 @@ export default {
 
 <script lang="ts">
 import { Component, Vue, Prop } from 'vue-facing-decorator';
-import type User from 'App/Models/User';
+import type User from '#app/Models/User';
 import { Link } from '@inertiajs/vue3';
 import DefaultLayout from '@/Layouts/Default.vue';
 // import { NInput, NButton } from 'naive-ui';

resources/js/Pages/Dashboard.vue

@@ -31,13 +31,13 @@ const mainService = MainService()
 
 // const chartData = ref();
 const fillChartData = async () => {
-    await mainService.fetchChartData(2022);
+    await mainService.fetchChartData("2022");
     // chartData.value = chartConfig.sampleChartData();
     // chartData.value = mainService.graphData;
 };
 const chartData = computed(() => mainService.graphData);
 onMounted(async () => {
-    await mainService.fetchChartData(2022);
+    await mainService.fetchChartData("2022");
 });
 ;
 /* Fetch sample data */

resources/js/Pages/Submitter/Dataset/Edit.vue

@@ -28,9 +28,10 @@
                     <div class="flex flex-col md:flex-row">
                         <!-- (1) language field -->
                         <FormField label="Language *" help="required: select dataset main language"
-                            :class="{ 'text-red-400': errors.language }" class="w-full flex-1">
+                            :class="{ 'text-red-400': form.errors.language }" class="w-full flex-1">
-                            <FormControl required v-model="form.language" :type="'select'" placeholder="[Enter Language]"
+                            <FormControl required v-model="form.language" :type="'select'"
-                                :errors="form.errors.language" :options="{ de: 'de', en: 'en' }">
+                                placeholder="[Enter Language]" :errors="form.errors.language"
+                                :options="{ de: 'de', en: 'en' }">
                                 <div class="text-red-400 text-sm" v-if="form.errors.language">
                                     {{ form.errors.language.join(', ') }}
                                 </div>
@@ -49,7 +50,7 @@
                         <FormField label="Dataset Type *" help="required: dataset type"
                             :class="{ 'text-red-400': form.errors.type }" class="w-full mx-2 flex-1">
                             <FormControl required v-model="form.type" :type="'select'" placeholder="-- select type --"
-                                :errors="errors.type" :options="doctypes">
+                                :errors="form.errors.type" :options="doctypes">
                                 <div class="text-red-400 text-sm"
                                     v-if="form.errors.type && Array.isArray(form.errors.type)">
                                     {{ form.errors.type.join(', ') }}
@@ -86,8 +87,10 @@
                                 </FormControl>
                             </FormField>
                             <FormField label="Main Title Language*" help="required: main title language"
-                                :class="{ 'text-red-400': form.errors['titles.0.language'] }" class="w-full ml-1 flex-1">
+                                :class="{ 'text-red-400': form.errors['titles.0.language'] }"
-                                <FormControl required v-model="form.titles[0].language" type="text" :is-read-only="true">
+                                class="w-full ml-1 flex-1">
+                                <FormControl required v-model="form.titles[0].language" type="text"
+                                    :is-read-only="true">
                                     <div class="text-red-400 text-sm"
                                         v-if="form.errors['titles.0.language'] && Array.isArray(form.errors['titles.0.language'])">
                                         {{ form.errors['titles.0.language'].join(', ') }}
@@ -157,7 +160,8 @@
                         :header-icon="mdiPlusCircle" v-on:header-icon-click="addDescription()">
                         <div class="flex flex-col md:flex-row">
                             <FormField label="Main Abstract *" help="required: main abstract"
-                                :class="{ 'text-red-400': form.errors['descriptions.0.value'] }" class="w-full mr-1 flex-1">
+                                :class="{ 'text-red-400': form.errors['descriptions.0.value'] }"
+                                class="w-full mr-1 flex-1">
                                 <FormControl required v-model="form.descriptions[0].value" type="textarea"
                                     placeholder="[enter main abstract]">
                                     <div class="text-red-400 text-sm"
@@ -211,8 +215,9 @@
                                             </FormControl>
                                         </td>
                                         <td data-label="Description Language">
-                                            <FormControl required v-model="form.descriptions[index].language" type="select"
+                                            <FormControl required v-model="form.descriptions[index].language"
-                                                :options="{ de: 'de', en: 'en' }" placeholder="[select title language]">
+                                                type="select" :options="{ de: 'de', en: 'en' }"
+                                                placeholder="[select title language]">
                                                 <div class="text-red-400 text-sm"
                                                     v-if="form.errors[`descriptions.${index}.language`]">
                                                     {{ form.errors[`descriptions.${index}.language`].join(', ') }}
@@ -223,7 +228,8 @@
                                             <BaseButtons type="justify-start lg:justify-end" no-wrap>
                                                 <!-- <BaseButton color="info" :icon="mdiEye" small @click="isModalActive = true" /> -->
                                                 <BaseButton color="danger" :icon="mdiTrashCan" small
-                                                    v-if="item.id == undefined" @click.prevent="removeDescription(index)" />
+                                                    v-if="item.id == undefined"
+                                                    @click.prevent="removeDescription(index)" />
                                             </BaseButtons>
                                         </td>
                                     </tr>
@@ -238,8 +244,8 @@
                             placeholder="search in person table...." v-on:person="onAddAuthor"></SearchAutocomplete>
 
                         <TablePersons :persons="form.authors" v-if="form.authors.length > 0" />
-                        <div class="text-red-400 text-sm" v-if="errors.authors && Array.isArray(errors.authors)">
+                        <div class="text-red-400 text-sm" v-if="form.errors.authors && Array.isArray(form.errors.authors)">
-                            {{ errors.authors.join(', ') }}
+                            {{ form.errors.authors.join(', ') }}
                         </div>
                     </CardBox>
 
@@ -261,9 +267,9 @@
                     <div class="flex flex-col md:flex-row">
                         <!-- (9) project_id -->
                         <FormField label="Project.." help="project is optional"
-                            :class="{ 'text-red-400': errors.project_id }" class="w-full mx-2 flex-1">
+                            :class="{ 'text-red-400': form.errors.project_id }" class="w-full mx-2 flex-1">
-                            <FormControl required v-model="form.project_id" :type="'select'" placeholder="[Select Project]"
+                            <FormControl required v-model="form.project_id" :type="'select'"
-                                :errors="form.errors.project_id" :options="projects">
+                                placeholder="[Select Project]" :errors="form.errors.project_id" :options="projects">
                                 <div class="text-red-400 text-sm" v-if="form.errors.project_id">
                                     {{ form.errors.project_id.join(', ') }}
                                 </div>
@@ -271,7 +277,7 @@
                         </FormField>
                         <!-- (10) embargo_date -->
                         <FormField label="Embargo Date.." help="embargo date is optional"
-                            :class="{ 'text-red-400': errors.embargo_date }" class="w-full mx-2 flex-1">
+                            :class="{ 'text-red-400': form.errors.embargo_date }" class="w-full mx-2 flex-1">
                             <FormControl v-model="form.embargo_date" :type="'date'" placeholder="date('y-m-d')"
                                 :errors="form.errors.embargo_date">
                                 <div class="text-red-400 text-sm" v-if="form.errors.embargo_date">
@@ -283,8 +289,9 @@
 
                     <BaseDivider />
 
-                    <MapComponent v-if="form.coverage" :mapOptions="mapOptions" :baseMaps="baseMaps" :fitBounds="fitBounds"
+                    <MapComponent v-if="form.coverage" :mapOptions="mapOptions" :baseMaps="baseMaps"
-                        :coverage="form.coverage" :mapId="mapId" v-bind-event:onMapInitializedEvent="onMapInitialized">
+                        :fitBounds="fitBounds" :coverage="form.coverage" :mapId="mapId"
+                        v-bind-event:onMapInitializedEvent="onMapInitialized">
                     </MapComponent>
                     <div class="flex flex-col md:flex-row">
                         <!-- x min and max -->
@@ -478,7 +485,7 @@ import { computed, ComputedRef } from 'vue';
 // import { ref } from 'vue';
 // import { MainService } from '@/Stores/main';
 // import FormInput from '@/Components/FormInput.vue'; //          @/Components/FormInput.vue'
-import { Dataset, Title, Subject, TethysFile } from '@/Dataset';
+import { Dataset, Title, Subject, TethysFile, Person, License } from '@/Dataset';
 import { stardust } from '@eidellev/adonis-stardust/client';
 
 import FormField from '@/Components/FormField.vue';
@@ -513,10 +520,10 @@ import { notify } from '@/notiwind';
 import NotificationBar from '@/Components/NotificationBar.vue';
 
 const props = defineProps({
-    errors: {
+    // errors: {
-        type: Object,
+    //     type: Object,
-        default: () => ({}),
+    //     default: () => ({}),
-    },
+    // },
     licenses: {
         type: Object,
         default: () => ({}),
@@ -570,6 +577,12 @@ const flash: ComputedRef<any> = computed(() => {
     // console.log(test);
     return usePage().props.flash;
 });
+const errors: ComputedRef<any> = computed(() => {
+    return usePage().props.errors;
+});
+// const errors: ComputedRef<any> = computed(() => {
+//     return usePage().props.errors;
+// });
 
 // const projects = reactive([]);
 // const licenses = reactive([]);
@@ -647,9 +660,16 @@ const submit = async (): Promise<void> => {
     // await Inertia.post('/app/register', this.form);
     // await router.post('/app/register', this.form);
 
-    if (form.licenses.every((item) => hasIdAttribute(item))) {
+
-        form.licenses = form.licenses.map((obj) => obj.id.toString());
+    let licenses = form.licenses.map((obj) => {
+        if (hasIdAttribute(obj)) {
+            return obj.id.toString()
+        } else {
+            return obj;
         }
+    });
+
+
 
     // const files = form.files.map((obj) => {
     //     return new File([obj.blob], obj.label, { type: obj.type, lastModified: obj.lastModified });
@@ -679,9 +699,7 @@ const submit = async (): Promise<void> => {
     await form
         .transform((data) => ({
             ...data,
-            licenses: form.licenses.every((item) => hasIdAttribute(item))
+            licenses: licenses,
-                ? form.licenses.map((obj) => obj.id.toString())
-                : form.licenses,
             files: fileUploads,
             fileInputs: fileInputs,
             // files: form.files.map((obj) => {
@@ -701,7 +719,7 @@ const submit = async (): Promise<void> => {
         .put(route);
 };
 
-const hasIdAttribute = (obj: any): obj is { id: any } => {
+const hasIdAttribute = (obj: License | number): obj is License => {
     return typeof obj === 'object' && 'id' in obj;
 };
 
@@ -709,7 +727,7 @@ const addTitle = () => {
     let newTitle: Title = { value: '', language: '', type: '' };
     form.titles.push(newTitle);
 };
-const removeTitle = (key) => {
+const removeTitle = (key: any) => {
     form.titles.splice(key, 1);
 };
 
@@ -717,11 +735,11 @@ const addDescription = () => {
     let newDescription = { value: '', language: '', type: '' };
     form.descriptions.push(newDescription);
 };
-const removeDescription = (key) => {
+const removeDescription = (key: any) => {
     form.descriptions.splice(key, 1);
 };
 
-const onAddAuthor = (person) => {
+const onAddAuthor = (person: Person) => {
     if (form.authors.filter((e) => e.id === person.id).length > 0) {
         notify({ type: 'warning', title: 'Warning', text: 'person is already defined as author' }, 4000);
     } else if (form.contributors.filter((e) => e.id === person.id).length > 0) {
@@ -732,7 +750,7 @@ const onAddAuthor = (person) => {
     }
 };
 
-const onAddContributor = (person) => {
+const onAddContributor = (person: Person) => {
     if (form.contributors.filter((e) => e.id === person.id).length > 0) {
         notify({ type: 'warning', title: 'Warning', text: 'person is already defined as contributor' }, 4000);
     } else if (form.authors.filter((e) => e.id === person.id).length > 0) {
@@ -757,11 +775,11 @@ const addReference = () => {
     form.references.push(newReference);
 };
 
-const removeReference = (key) => {
+const removeReference = (key: any) => {
     form.references.splice(key, 1);
 };
 
-const onMapInitialized = (newItem) => {
+const onMapInitialized = (newItem: any) => {
     console.log(newItem);
 };
 </script>

resources/js/app.ts

@@ -1,5 +1,5 @@
 import '../css/app.css';
-import { createApp, h, App, Plugin } from 'vue';
+import { createApp, h } from 'vue';
 import { Inertia } from '@inertiajs/inertia';
 
 import { createInertiaApp } from '@inertiajs/vue3';
@@ -16,12 +16,12 @@ import { EmitterPlugin } from '@/EmitterDirective';
 import { initRoutes } from '@eidellev/adonis-stardust/client/index.js';
 initRoutes();
 
-interface SetupOptions {
+// interface SetupOptions {
-    el: Element;
+//     el: Element;
-    App: App;
+//     App: App;
-    props: Record<string, any>;
+//     props: Record<string, any>;
-    plugin: Plugin;
+//     plugin: Plugin;
-}
+// }
 
 // import '@fontsource/archivo-black/index.css';
 // import '@fontsource/inter/index.css';
@@ -58,7 +58,7 @@ createInertiaApp({
     //     )
     //   },
 
-    setup({ el, App, props, plugin} : SetupOptions) {
+    setup({ el, App, props, plugin}) {
         createApp({ render: () => h(App, props) })
             .use(plugin)
             .use(pinia)

resources/js/colors.ts

@@ -35,7 +35,7 @@ export const colorsOutline = {
     info: [colorsText.info, 'border-blue-500'],
 };
 
-export const getButtonColor = (color, isOutlined, hasHover) => {
+export const getButtonColor = (color: 'white' | 'contrast' | 'light' | 'success' | 'danger' | 'warning' | 'info' | 'modern', isOutlined: boolean, hasHover: boolean) => {
     const colors = {
         bg: {
             white: 'bg-white text-black',

resources/js/tsconfig.json

@@ -0,0 +1,18 @@
+{
+    "extends": "@adonisjs/tsconfig/tsconfig.client.json",
+    "compilerOptions": {
+      "baseUrl": ".",
+      "jsx": "preserve",
+      "module": "ESNext",
+      "jsxImportSource": "vue",
+      "allowJs": true,
+      // "target": "ESNext",
+      "experimentalDecorators": true,
+      "strictPropertyInitialization": false,
+      "paths": {
+        "@/*": ["./*"],
+        "~/*": ["../*"]
+      },
+    },
+    "include": ["./**/*.ts", "./**/*.vue"],
+  }

resources/js/tsconfig.old.json

@@ -1,6 +1,6 @@
 {
     // tsconfig.vue.json
-    "extends": "@vue/tsconfig/tsconfig.json",
+    "extends": "@vue/tsconfig/tsconfig.json", // 0.4.0
     // "include": ["./resources/js/**/*"],
     "include": ["env.d.ts", "./**/*.ts", "./**/*.vue"],
     "compilerOptions": {

start/kernel.ts

@@ -13,7 +13,7 @@ import server from '@adonisjs/core/services/server'
 import router from '@adonisjs/core/services/router'
 
 server.errorHandler(
-  () => import('#exceptions/Handler')
+  () => import('#exceptions/handler')
 )
 
 /**

webpack.config.cjs

@@ -302,18 +302,18 @@ Encore.addLoader({
 // 	vue$: 'vue/dist/vue.runtime.esm-bundler.js',
 // });
 
-Encore.addLoader(babelLoader)
+// Encore.addLoader(babelLoader)
-    // Encore.enableTypeScriptLoader(config => {
+    Encore.enableTypeScriptLoader(config => {
-    // 	 // Loader-specific options
+    	 // Loader-specific options
-    // 	config.configFile = 'resources/js/tsconfig.vue.json';
+    	config.configFile = 'resources/js/tsconfig.json';
-    // 	config.appendTsSuffixTo = [/\.vue$/];
+    	config.appendTsSuffixTo = [/\.vue$/];
-    // 	config.transpileOnly = true;
+    	config.transpileOnly = true;
-    // 	config.happyPackMode = false;
+    	config.happyPackMode = false;
-    // }, {
+    }, {
-    // 	// Directly change the exclude rule
+    	// Directly change the exclude rule
-    // 	exclude: /node_modules/,
+    	exclude: /node_modules/,
 
-    // })
+    })
     .addAliases({
         '@': join(__dirname, 'resources/js'),
         'vue$': 'vue/dist/vue.runtime.esm-bundler.js',