- added @adonisjs/mail

- mail_settings_controller for setting smtp settings
- added view ror rjecting dataset for editor
- added new model AppConfig for stroing appwide config values
- better validate_chesum.ts command with process chunking
- added vue3 apps 'BasicSettings' like email, profile settings
- started with 2 multilingual capabilities
- npm updates

resources/js/Pages/Admin/Settings.vue

@@ -1,18 +1,18 @@
-<script setup>
+<script lang="ts" setup>
 import { ref, computed } from 'vue';
 import { StyleService } from '@/Stores/style.service';
 
-import {
-	mdiContrastCircle,
-	mdiInformation,
-	mdiCheckCircle,
-	mdiAlert,
-	mdiAlertCircle,
-	mdiOpenInNew,
-	mdiClose,
-	mdiReload,
-	mdiTrendingUp,
-} from '@mdi/js';
+// import {
+// 	mdiContrastCircle,
+// 	mdiInformation,
+// 	mdiCheckCircle,
+// 	mdiAlert,
+// 	mdiAlertCircle,
+// 	mdiOpenInNew,
+// 	mdiClose,
+// 	mdiReload,
+// 	mdiTrendingUp,
+// } from '@mdi/js';
 import SectionMain from '@/Components/SectionMain.vue';
 import CardBox from '@/Components/CardBox.vue';
 // import BaseButtons from '@/Components/BaseButtons.vue';
@@ -28,18 +28,22 @@ import LayoutAuthenticated from "@/Layouts/LayoutAuthenticated.vue";
 // import CardBoxComponentEmpty from "@/components/CardBoxComponentEmpty.vue";
 // import CardBoxComponentTitle from "@/components/CardBoxComponentTitle.vue";
 // import PillTag from "@/components/PillTag.vue";
+import BackgroundJob from '@/apps/settings/basic_settings/BackgroundJob.vue';
+import MailSettings from '@/apps/settings/basic_settings/MailSettings.vue';
 
 // const modalOneActive = ref(false);
 // const modalTwoActive = ref(false);
 // const modalThreeActive = ref(false);
 // const notificationSettingsModel = ref([]);
 
+
 const styleService = StyleService();
 </script>
 
 <template>
 	<LayoutAuthenticated>
-		<SectionTitle first>Dark mode</SectionTitle>
+		<!-- <SectionTitle first>Dark mode</SectionTitle> -->
+		<!-- 
 
 		<SectionMain>
 			<CardBox class="md:w-7/12 lg:w-5/12 xl:w-4/12 shadow-2xl md:mx-auto">
@@ -47,6 +51,9 @@ const styleService = StyleService();
 					<BaseButton label="Toggle" color="contrast" @click="styleService.setDarkMode()" />
 				</div>
 			</CardBox>
-		</SectionMain>
+		</SectionMain> -->
+		<BackgroundJob></BackgroundJob>
+		<MailSettings></MailSettings>
+
 	</LayoutAuthenticated>
 </template>

resources/js/Pages/Admin/User/Edit.vue

@@ -55,8 +55,6 @@ const handleScore = (score: number) => {
     } else {
         enabled.value = false;
     }
-//   strengthLabel.value = scoreLabel;
-//   score.value = scoreValue;
 };
 </script>
 
@@ -135,7 +133,7 @@ const handleScore = (score: number) => {
                             color="info"
                             label="Submit"
                             :class="{ 'opacity-25': form.processing }"
-                            :disabled="form.processing == true || enabled == false"
+                            :disabled="form.processing == true|| (form.password != '' && enabled == false)"
                         />
                     </BaseButtons>
                 </template>

resources/js/Pages/Editor/Dataset/Index.vue

@@ -2,7 +2,7 @@
 // import { Head, Link, useForm, usePage } from '@inertiajs/inertia-vue3';
 import { Head, usePage } from '@inertiajs/vue3';
 import { ComputedRef } from 'vue';
-import { mdiSquareEditOutline, mdiAlertBoxOutline, mdiShareVariant, mdiBookEdit } from '@mdi/js';
+import { mdiSquareEditOutline, mdiAlertBoxOutline, mdiShareVariant, mdiBookEdit, mdiUndo } from '@mdi/js';
 import { computed } from 'vue';
 import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
 import SectionMain from '@/Components/SectionMain.vue';
@@ -10,7 +10,7 @@ import BaseButton from '@/Components/BaseButton.vue';
 import CardBox from '@/Components/CardBox.vue';
 import BaseButtons from '@/Components/BaseButtons.vue';
 import NotificationBar from '@/Components/NotificationBar.vue';
-import Pagination from '@/Components/Admin/Pagination.vue';
+import Pagination from '@/Components/Pagination.vue';
 import { stardust } from '@eidellev/adonis-stardust/client';
 
 const props = defineProps({
@@ -39,17 +39,33 @@ const flash: ComputedRef<any> = computed(() => {
 });
 
 
+// const getRowClass = (dataset) => {
+//     // (props.options ? 'select' : props.type)
+//     let rowclass = '';
+//     if (dataset.server_state == 'accepted') {
+//         rowclass = 'bg-accepted';
+//     } else if (dataset.server_state == 'rejected_reviewer') {
+//         rowclass = 'bg-rejected-reviewer';
+//     } else if (dataset.server_state == 'reviewed') {
+//         rowclass = 'bg-reviewed';
+//     } else if (dataset.server_state == 'released') {
+//         rowclass = 'bg-released';
+//     } else if (dataset.server_state == 'published') {
+//         rowclass = 'bg-published';
+//     } else {
+//         rowclass = '';
+//     }
+//     return rowclass;
+// };
 const getRowClass = (dataset) => {
     // (props.options ? 'select' : props.type)
     let rowclass = '';
-    if (dataset.server_state == 'accepted') {
-        rowclass = 'bg-accepted';
-    } else if (dataset.server_state == 'rejected_reviewer') {
-        rowclass = 'bg-rejected-reviewer';
+    if (dataset.server_state == 'released') {
+        rowclass = 'bg-released';
+    } else if (dataset.server_state == 'editor_accepted' || dataset.server_state == 'rejected_reviewer') {
+        rowclass = 'bg-editor-accepted';
     } else if (dataset.server_state == 'reviewed') {
         rowclass = 'bg-reviewed';
-    } else if (dataset.server_state == 'released') {
-        rowclass = 'bg-released';
     } else if (dataset.server_state == 'published') {
         rowclass = 'bg-published';
     } else {
@@ -58,6 +74,20 @@ const getRowClass = (dataset) => {
     return rowclass;
 };
 
+// New method to format server state
+const formatServerState = (state: string) => {
+    if (state === 'inprogress') {
+        return 'draft';
+    } else if (state === 'released') {
+        return 'submitted';
+    } else if (state === 'approved') {
+        return 'ready for review';
+    } else if (state === 'reviewer_accepted') {
+        return 'in review';
+    }
+    return state; // Return the original state for other cases
+};
+
 
 </script>
 
@@ -105,7 +135,8 @@ const getRowClass = (dataset) => {
                         </thead>
 
                         <tbody class="bg-white divide-y divide-gray-200">
-                            <tr v-for="dataset in props.datasets.data" :key="dataset.id" :class="[getRowClass(dataset)]">
+                            <tr v-for="dataset in props.datasets.data" :key="dataset.id"
+                                :class="[getRowClass(dataset)]">
                                 <td data-label="Login" class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
                                     <!-- <Link v-bind:href="stardust.route('user.show', [user.id])"
                                     class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">
@@ -117,7 +148,7 @@ const getRowClass = (dataset) => {
                                     <div class="text-sm">{{ dataset.user.login }}</div>
                                 </td>
                                 <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
-                                    <div class="text-sm">{{ dataset.server_state }}</div>
+                                    <div class="text-sm"> {{ formatServerState(dataset.server_state) }}</div>
                                 </td>
 
                                 <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white"
@@ -146,17 +177,23 @@ const getRowClass = (dataset) => {
                                     <BaseButtons type="justify-start lg:justify-end" no-wrap>
                                         <BaseButton v-if="can.receive && (dataset.server_state == 'released')"
                                             :route-name="stardust.route('editor.dataset.receive', [dataset.id])"
-                                            color="info" :icon="mdiSquareEditOutline" :label="'Receive edit task'" small />
+                                            color="info" :icon="mdiSquareEditOutline" :label="'Receive edit task'"
+                                            small />
 
                                         <BaseButton
                                             v-if="can.approve && (dataset.server_state == 'editor_accepted' || dataset.server_state == 'rejected_reviewer')"
                                             :route-name="stardust.route('editor.dataset.approve', [dataset.id])"
                                             color="info" :icon="mdiShareVariant" :label="'Approve'" small />
-                                        
+
                                         <BaseButton
-                                            v-if="can.publish && (dataset.server_state == 'reviewed')"
+                                            v-if="can.approve && (dataset.server_state == 'editor_accepted' || dataset.server_state == 'rejected_reviewer')"
+                                             :route-name="stardust.route('editor.dataset.reject', [dataset.id])"
+                                            color="info" :icon="mdiUndo" label="Reject" small>
+                                        </BaseButton>
+
+                                        <BaseButton v-if="can.publish && (dataset.server_state == 'reviewed')"
                                             :route-name="stardust.route('editor.dataset.publish', [dataset.id])"
-                                            color="info" :icon="mdiBookEdit" :label="'Publish'" small /> 
+                                            color="info" :icon="mdiBookEdit" :label="'Publish'" small />
 
                                         <BaseButton
                                             v-if="can.publish && (dataset.server_state == 'published' && !dataset.identifier)"

resources/js/Pages/Editor/Dataset/Reject.vue

@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
+import SectionMain from '@/Components/SectionMain.vue';
+import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
+import { useForm, Head, usePage } from '@inertiajs/vue3';
+import { computed, Ref } from 'vue';
+import CardBox from '@/Components/CardBox.vue';
+import FormField from '@/Components/FormField.vue';
+import FormControl from '@/Components/FormControl.vue';
+import BaseButton from '@/Components/BaseButton.vue';
+import BaseButtons from '@/Components/BaseButtons.vue';
+import { stardust } from '@eidellev/adonis-stardust/client';
+import { mdiArrowLeftBoldOutline, mdiReiterate } from '@mdi/js';
+import FormValidationErrors from '@/Components/FormValidationErrors.vue';
+
+const props = defineProps({
+    dataset: {
+        type: Object,
+        default: () => ({}),
+    },
+});
+
+// Define the computed property for the label
+const computedLabel = computed(() => {
+  return `Reject to ${props.dataset.user?.login || 'Unknown User'}`;
+});
+
+const flash: Ref<any> = computed(() => {
+    return usePage().props.flash;
+});
+const errors: Ref<any> = computed(() => {
+    return usePage().props.errors;
+});
+
+const form = useForm({
+    server_state: 'rejected_editor',
+    reject_editor_note: '',
+});
+
+const handleSubmit = async (e: SubmitEvent) => {
+    e.preventDefault();
+    await form.put(stardust.route('editor.dataset.rejectUpdate', [props.dataset.id]));
+    // await form.put(stardust.route('editor.dataset.update', [props.dataset.id]));
+};
+</script>
+
+<template>
+    <LayoutAuthenticated>
+
+        <Head title="Reject submitted dataset" />
+        <SectionMain>
+            <SectionTitleLineWithButton :icon="mdiReiterate" title="Reject submitted dataset" main>
+                <BaseButton :route-name="stardust.route('editor.dataset.list')" :icon="mdiArrowLeftBoldOutline"
+                    label="Back" color="white" rounded-full small />
+            </SectionTitleLineWithButton>
+
+            <CardBox form @submit.prevent="handleSubmit">
+                <FormValidationErrors v-bind:errors="errors" />
+
+
+                <FormField label="server state" :class="{ 'text-red-400': form.errors.server_state }">
+                    <FormControl v-model="form.server_state" type="text" placeholder="-- server state --"
+                        :is-read-only="true" :error="form.errors.server_state">
+                        <div class="text-red-400 text-sm" v-if="form.errors.server_state">
+                            {{ form.errors.server_state }}
+                        </div>
+                    </FormControl>
+                </FormField>
+                <FormField label="reject note" :class="{ 'text-red-400': form.errors.reject_editor_note }">
+                    <FormControl v-model="form.reject_editor_note" type="textarea"
+                        placeholder="-- reject note for submitter --" :error="form.errors.reject_editor_note">
+                        <div class="text-red-400 text-sm" v-if="form.errors.reject_editor_note">
+                            {{ form.errors.reject_editor_note }}
+                        </div>
+                    </FormControl>
+                </FormField>
+
+
+                <!-- <NotificationBar v-if="flash && flash.message" color="warning" :icon="mdiAlertBoxOutline">
+					{{ flash.message }}
+					class="bg-orange-100 border-l-4 border-orange-500 text-orange-700 p-4"
+				</NotificationBar> -->
+                <div v-if="flash && flash.warning" class="flex flex-col mt-6 animate-fade-in">
+                    <div class="bg-yellow-500 border-l-4 border-orange-400 text-white p-4" role="alert">
+                        <p class="font-bold">Be Warned</p>
+                        <p>{{ flash.warning }}</p>
+                    </div>
+                </div>
+
+                <template #footer>
+                    <BaseButtons>
+                        <BaseButton type="submit" color="info" :label="computedLabel"
+                            :class="{ 'opacity-25': form.processing }" :disabled="form.processing" />
+                    </BaseButtons>
+                </template>
+            </CardBox>
+        </SectionMain>
+    </LayoutAuthenticated>
+</template>

resources/js/Pages/Reviewer/Dataset/Index.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-// import { Head, Link, useForm, usePage } from '@inertiajs/inertia-vue3';
 import { Head, usePage } from '@inertiajs/vue3';
 import { ComputedRef } from 'vue';
 import { mdiAlertBoxOutline, mdiGlasses, mdiReiterate } from '@mdi/js';
@@ -58,6 +57,20 @@ const getRowClass = (dataset) => {
     return rowclass;
 };
 
+// New method to format server state
+const formatServerState = (state: string) => {
+    if (state === 'inprogress') {
+        return 'draft';
+    } else if (state === 'released') {
+        return 'submitted';
+    } else if (state === 'approved') {
+        return 'ready for review';
+    } else if (state === 'reviewer_accepted') {
+        return 'in review';
+    }
+    return state; // Return the original state for other cases
+};
+
 
 </script>
 
@@ -117,7 +130,7 @@ const getRowClass = (dataset) => {
                                     <div class="text-sm">{{ dataset.id }}</div>
                                 </td>
                                 <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
-                                    <div class="text-sm">{{ dataset.server_state }}</div>
+                                    <div class="text-sm">{{ formatServerState(dataset.server_state) }}</div>
                                 </td>
                               
                                

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

@@ -2,7 +2,7 @@
 import { Head, useForm, usePage } from '@inertiajs/vue3';
 import { ref, watch, computed, ComputedRef } from 'vue';
 import FormValidationErrors from '@/Components/FormValidationErrors.vue';
-import { Dataset, Description, Title, Subject } from '@/Dataset';
+import { Dataset, Title, Subject } from '@/Dataset';
 import {
     mdiDatabasePlus,
     mdiMinusCircle,
@@ -44,6 +44,7 @@ import { LayerOptions } from '@/Components/Map/LayerOptions';
 import TableKeywords from '@/Components/TableKeywords.vue';
 import NotificationBar from '@/Components/NotificationBar.vue';
 import FileUploadComponent from '@/Components/FileUpload.vue';
+import Person from '#models/person';
 
 const props = defineProps({
     licenses: {
@@ -276,7 +277,7 @@ const mapId = 'test';
 // };
 
 const nextStep = async () => {
-    let route;
+    let route ="";
     if (formStep.value == 1) {
         route = stardust.route('dataset.first.step');
     } else if (formStep.value == 2) {
@@ -381,7 +382,7 @@ const addTitle = () => {
     //this.dataset.files.push(uploadedFiles[i]);
     form.titles.push(newTitle);
 };
-const removeTitle = (key) => {
+const removeTitle = (key: number) => {
     form.titles.splice(key, 1);
 };
 
@@ -390,11 +391,11 @@ const addDescription = () => {
     //this.dataset.files.push(uploadedFiles[i]);
     form.descriptions.push(newDescription);
 };
-const removeDescription = (key) => {
+const removeDescription = (key: number) => {
     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) {
@@ -404,7 +405,7 @@ const onAddAuthor = (person) => {
         notify({ type: 'info', text: 'person has been successfully added as author' });
     }
 };
-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) {
@@ -417,7 +418,7 @@ const onAddContributor = (person) => {
     }
 };
 // const onMapInitializedEvent = "onMapInitializedEvent";
-const onMapInitialized = (newItem) => {
+const onMapInitialized = (newItem: any) => {
     // notify({ type: 'info', text: message });
     console.log(newItem);
 };
@@ -439,7 +440,7 @@ const addReference = () => {
 /*
 Removes a selected reference
 */
-const removeReference = (key) => {
+const removeReference = (key: number) => {
     form.references.splice(key, 1);
 };
 /*
@@ -593,8 +594,8 @@ Removes a selected keyword
                                 <FormField label="Main Title *" help="required: main title"
                                     :class="{ 'text-red-400': form.errors['titles.0.value'] }"
                                     class="w-full mx-2 flex-1">
-                                    <FormControl required v-model="form.titles[0].value" type="text"
-                                        placeholder="[enter main title]">
+                                    <FormControl required v-model="form.titles[0].value" type="textarea"
+                                        placeholder="[enter main title]" :show-char-count="true" :max-input-length="255">
                                         <div class="text-red-400 text-sm"
                                             v-if="form.errors['titles.0.value'] && Array.isArray(form.errors['titles.0.value'])">
                                             {{ form.errors['titles.0.value'].join(', ') }}
@@ -739,7 +740,7 @@ Removes a selected keyword
                         </CardBox>
 
                         <!-- authors -->
-                        <CardBox class="mb-6 shadow" has-table title="Authors" :icon="mdiBookOpenPageVariant">
+                        <CardBox class="mb-6 shadow" has-table title="Creators" :icon="mdiBookOpenPageVariant">
                             <SearchAutocomplete source="/api/persons" :response-property="'first_name'"
                                 placeholder="search in person table...." v-on:person="onAddAuthor"></SearchAutocomplete>
 

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

@@ -239,11 +239,11 @@
                     </CardBox>
 
                     <!-- (7) authors -->
-                    <CardBox class="mb-6 shadow" has-table title="Authors" :icon="mdiBookOpenPageVariant">
+                    <CardBox class="mb-6 shadow" has-table title="Creators" :icon="mdiBookOpenPageVariant">
                         <SearchAutocomplete source="/api/persons" :response-property="'first_name'"
                             placeholder="search in person table...." v-on:person="onAddAuthor"></SearchAutocomplete>
 
-                        <TablePersons :persons="form.authors" v-if="form.authors.length > 0" />
+                        <TablePersons :persons="form.authors" v-if="form.authors.length > 0" :relation="'authors'"/>
                         <div class="text-red-400 text-sm" v-if="form.errors.authors && Array.isArray(form.errors.authors)">
                             {{ form.errors.authors.join(', ') }}
                         </div>
@@ -257,7 +257,7 @@
                         </SearchAutocomplete>
 
                         <TablePersons :persons="form.contributors" v-if="form.contributors.length > 0"
-                            :contributortypes="contributorTypes" :errors="form.errors" />
+                            :contributortypes="contributorTypes" :errors="form.errors" :relation="'contributors'" />
                         <div class="text-red-400 text-sm"
                             v-if="form.errors.contributors && Array.isArray(form.errors.contributors)">
                             {{ form.errors.contributors.join(', ') }}

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

@@ -10,7 +10,7 @@ import BaseButton from '@/Components/BaseButton.vue';
 import CardBox from '@/Components/CardBox.vue';
 import BaseButtons from '@/Components/BaseButtons.vue';
 import NotificationBar from '@/Components/NotificationBar.vue';
-import Pagination from '@/Components/Admin/Pagination.vue';
+import Pagination from '@/Components/Pagination.vue';
 import { stardust } from '@eidellev/adonis-stardust/client';
 
 const props = defineProps({
@@ -61,6 +61,20 @@ const getRowClass = (dataset) => {
     return rowclass;
 };
 
+// New method to format server state
+const formatServerState = (state: string) => {
+    if (state === 'inprogress') {
+        return 'draft';
+    } else if (state === 'released') {
+        return 'submitted';
+    } else if (state === 'approved') {
+        return 'ready for review';
+    } else if (state === 'reviewer_accepted') {
+        return 'in review';
+    }
+    return state; // Return the original state for other cases
+};
+
 </script>
 
 <template>
@@ -109,7 +123,7 @@ const getRowClass = (dataset) => {
                                 {{ dataset.main_title }}
                             </td>
                             <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
-                                {{ dataset.server_state }}
+                                {{ formatServerState(dataset.server_state) }}
                             </td>
 
                             <td data-label="modified" class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
@@ -135,42 +149,26 @@ const getRowClass = (dataset) => {
                     </tbody>
                 </table>
                 <div class="py-4">
-                    <Pagination v-bind:data="datasets.meta" />
-                    <!-- <ul>
-                        <li>
-                            <a href="{{ users.page == 1 ? '#' : '?page=' + (users.page - 1) }}">Previous</a>
-                        </li>
-                        @each(page in ???)
-                        <li>
-                            <a href="?page={{ page }}">{{ page }}</a>
-                        </li>
-                        @endeach
-                        <li>
-                            <a href="{{ users.lastPage == users.page ? '#' : '?page=' + (users.page + 1) }}">Next</a>
-                        </li>
-                    </ul> -->
+                    <Pagination v-bind:data="datasets.meta" />                    
                 </div>
             </CardBox>
         </SectionMain>
     </LayoutAuthenticated>
 </template>
 
-<style scoped lang="css">
-.pure-table tr.released {
-    /* background-color: greenyellow;    */
+<!-- <style scoped lang="css">
+.pure-table tr.released {  
     background-color: rgb(52 211 153);
     color: gray;
 }
 
 .pure-table tr.inprogress {
-    padding: 0.8em;
-    /* bg-teal-300 */
+    padding: 0.8em;   
     background-color: rgb(94 234 212);
     color: gray;
 }
 
-.pure-table tr.editor_accepted {
-    /* background-color: lightblue; */
+.pure-table tr.editor_accepted {   
     background-color: rgb(125 211 252);
     color: gray;
 }
@@ -181,24 +179,21 @@ const getRowClass = (dataset) => {
     color: gray;
 }
 
-.pure-table tr.rejected_editor {
-    /* padding: 0.8em; */
+.pure-table tr.rejected_editor {  
     background-color: orange;
     color: gray;
 }
 
-.pure-table tr.reviewed {
-    /* padding: 0.8em; */
+.pure-table tr.reviewed {   
     background-color: yellow;
     color: gray;
 }
 
-.pure-table tr.approved {
-    /* padding: 0.8em; */
+.pure-table tr.approved {  
     background-color: rgb(86, 86, 241);
     color: whitesmoke;
 
 }
 
 
-</style>
+</style> -->

resources/js/Pages/Submitter/Person/Index.vue

@@ -108,13 +108,13 @@ const flash: ComputedRef<any> = computed(() => {
                                     class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">
                                 {{ user.login }}
                                 </Link> -->
-                            <td class="p-4 flex items-center whitespace-nowrap space-x-6 mr-12 lg:mr-0">
+                            <div class="p-4 flex items-center whitespace-nowrap space-x-6 mr-12 lg:mr-0">
                                 <!-- <img class="h-10 w-10 rounded-full" src="/images/users/{{ .avatar }}" alt="{{ .name }} avatar"> -->
                                 <div class="text-sm font-normal">
                                     <div class="text-base font-semibold">{{ person.name }}</div>
                                     <div class="text-sm font-normal">{{ person.email }}</div>
                                 </div>
-                            </td>
+                            </div>
                             </td>
                             <td class="p-4 whitespace-nowrap text-base font-medium">{{ person.identifier_orcid ?
                                 person.identifier_orcid : '#' }}</td>