adminforth 1.5.8-next.0 → 1.5.8-next.2

package/dist/spa/package-lock.json

@@ -45,6 +45,7 @@
         "tailwindcss": "^3.4.3",
         "typescript": "~5.4.0",
         "vite": "^5.2.13",
+        "vue-i18n-extract": "^2.0.7",
         "vue-tsc": "^2.0.11",
         "vue3-json-viewer": "^2.2.2"
       }
@@ -1799,6 +1800,16 @@
         "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
       }
     },
+    "node_modules/cac": {
+      "version": "6.7.14",
+      "resolved": "https://registry.npmjs.org/cac/-/cac-6.7.14.tgz",
+      "integrity": "sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/callsites": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
@@ -2132,6 +2143,30 @@
         "url": "https://github.com/fb55/domutils?sponsor=1"
       }
     },
+    "node_modules/dot-object": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmjs.org/dot-object/-/dot-object-2.1.5.tgz",
+      "integrity": "sha512-xHF8EP4XH/Ba9fvAF2LDd5O3IITVolerVV6xvkxoM8zlGEiCUrggpAnHyOoKJKCrhvPcGATFAUwIujj7bRG5UA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^6.1.0",
+        "glob": "^7.1.6"
+      },
+      "bin": {
+        "dot-object": "bin/dot-object"
+      }
+    },
+    "node_modules/dot-object/node_modules/commander": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-6.2.1.tgz",
+      "integrity": "sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
@@ -2923,6 +2958,16 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-valid-glob": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-1.0.0.tgz",
+      "integrity": "sha512-AhiROmoEFDSsjx8hW+5sGwgKVIORcXnrlAx/R0ZSeaPw70Vw0CqkGBBhHGL58Uox2eXnU1AnvXJl1XlyedO5bA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -4625,6 +4670,57 @@
         "vue": "^3.0.0"
       }
     },
+    "node_modules/vue-i18n-extract": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/vue-i18n-extract/-/vue-i18n-extract-2.0.7.tgz",
+      "integrity": "sha512-i1NW5R58S720iQ1BEk+6ILo3hT6UA8mtYNNolSH4rt9345qvXdvA6GHy2+jHozdDAKHwlu9VvS/+vIMKs1UYQw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cac": "^6.7.12",
+        "dot-object": "^2.1.4",
+        "glob": "^8.0.1",
+        "is-valid-glob": "^1.0.0",
+        "js-yaml": "^4.1.0"
+      },
+      "bin": {
+        "vue-i18n-extract": "bin/vue-i18n-extract.js"
+      }
+    },
+    "node_modules/vue-i18n-extract/node_modules/glob": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz",
+      "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==",
+      "deprecated": "Glob versions prior to v9 are no longer supported",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "fs.realpath": "^1.0.0",
+        "inflight": "^1.0.4",
+        "inherits": "2",
+        "minimatch": "^5.0.1",
+        "once": "^1.3.0"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/vue-i18n-extract/node_modules/minimatch": {
+      "version": "5.1.6",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
+      "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/vue-router": {
       "version": "4.3.2",
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.3.2.tgz",

package/dist/spa/package.json

@@ -9,7 +9,8 @@
     "preview": "vite preview",
     "build-only": "vite build",
     "type-check": "vue-tsc --build --force",
-    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
+    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
+    "i18n:extract": "echo '{}' > i18n-empty.json && vue-i18n-extract report --vueFiles './src/**/*.?(js|vue)' --output ./i18n-messages.json --languageFiles 'i18n-empty.json' --add"
   },
   "dependencies": {
     "@iconify-prerendered/vue-flowbite": "^0.23.1714023977",
@@ -49,6 +50,7 @@
     "tailwindcss": "^3.4.3",
     "typescript": "~5.4.0",
     "vite": "^5.2.13",
+    "vue-i18n-extract": "^2.0.7",
     "vue-tsc": "^2.0.11",
     "vue3-json-viewer": "^2.2.2"
   }

package/dist/spa/src/App.vue

@@ -8,7 +8,7 @@
           <div class="flex items-center justify-start rtl:justify-end">
             <button @click="sideBarOpen = !sideBarOpen"
               type="button" class="inline-flex items-center p-2 text-sm  rounded-lg sm:hidden hover:bg-lightSidebarItemHover focus:outline-none focus:ring-2 focus:ring-lightSidebarDevider dark:text-darkSidebarIcons dark:hover:bg-darkSidebarHover dark:focus:ring-lightSidebarDevider">
-                <span class="sr-only">Open sidebar</span>
+                <span class="sr-only">{{ $t('Open sidebar') }}</span>
                 <svg class="w-6 h-6" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                   <path clip-rule="evenodd" fill-rule="evenodd" d="M2 4.75A.75.75 0 012.75 4h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 4.75zm0 10.5a.75.75 0 01.75-.75h7.5a.75.75 0 010 1.5h-7.5a.75.75 0 01-.75-.75zM2 10a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 10z"></path>
                 </svg>
@@ -33,7 +33,7 @@
                 <button 
                   ref="dropdownUserButton"
                   type="button" class="flex text-sm bg- rounded-full focus:ring-4 focus:ring-lightSidebarDevider dark:focus:ring-darkSidebarDevider dark:bg-" aria-expanded="false" data-dropdown-toggle="dropdown-user">
-                  <span class="sr-only">Open user menu</span>
+                  <span class="sr-only">{{ $t('Open user menu') }}</span>
                   <svg class="w-8 h-8 text-lightNavbarIcons dark:text-darkNavbarIcons" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24">
                     <path fill-rule="evenodd" d="M12 20a7.966 7.966 0 0 1-5.002-1.756l.002.001v-.683c0-1.794 1.492-3.25 3.333-3.25h3.334c1.84 0 3.333 1.456 3.333 3.25v.683A7.966 7.966 0 0 1 12 20ZM2 12C2 6.477 6.477 2 12 2s10 4.477 10 10c0 5.5-4.44 9.963-9.932 10h-.138C6.438 21.962 2 17.5 2 12Zm10-5c-1.84 0-3.333 1.455-3.333 3.25S10.159 13.5 12 13.5c1.84 0 3.333-1.455 3.333-3.25S13.841 7 12 7Z" clip-rule="evenodd"/>
                   </svg>
@@ -59,7 +59,7 @@
                     />
                   </li>
                   <li>
-                    <button @click="logout" class="cursor-pointer flex items-center gap-1 block px-4 py-2 text-sm text-black hover:bg-html dark:text-darkSidebarTextHover dark:hover:bg-darkSidebarItemHover dark:hover:text-darkSidebarTextActive w-full" role="menuitem">Sign out</button>
+                    <button @click="logout" class="cursor-pointer flex items-center gap-1 block px-4 py-2 text-sm text-black hover:bg-html dark:text-darkSidebarTextHover dark:hover:bg-darkSidebarItemHover dark:hover:text-darkSidebarTextActive w-full" role="menuitem">{{ $t('Sign out') }}</button>
                   </li>
                 </ul>
               </div>
@@ -179,7 +179,7 @@
     <div v-else class="flex items-center justify-center h-screen">
       <div class="text-3xl text-gray-400 animate-bounce">
         <svg aria-hidden="true" class="w-8 h-8 text-gray-200 animate-spin dark:text-gray-600 fill-blue-600" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
-        <span class="sr-only">Loading...</span>
+        <span class="sr-only">{{ $t('Loading...') }}</span>
       </div>
     </div>
     <AcceptModal />

package/dist/spa/src/afcl/Dropzone.vue

@@ -29,7 +29,7 @@
 
               </div>
 
-              <p v-if="!selectedFiles.length" class="mb-2 text-sm text-gray-500 dark:text-gray-400"><span class="font-semibold">Click to upload</span> or drag and drop</p>
+              <p v-if="!selectedFiles.length" class="mb-2 text-sm text-gray-500 dark:text-gray-400"><span class="font-semibold">{{ $t('Click to upload') }}</span> {{ $t('or drag and drop') }}</p>
               <p class="text-xs text-gray-500 dark:text-gray-400">
                 {{ props.extensions.join(', ').toUpperCase().replace(/\./g, '') }}
                 <template v-if="props.maxSizeBytes">

package/dist/spa/src/afcl/Select.vue

@@ -44,7 +44,7 @@
         <label v-if="!$slots.item" :for="item.value">{{ item.label }}</label>
       </div>
       <div v-if="!filteredItems.length" class="px-4 py-2 cursor-pointer text-gray-400 dark:text-gray-300">
-        No results found
+        {{ $t('No results found') }}
       </div>
 
       <div v-if="$slots['extra-item']"  class="px-4 py-2 dark:text-gray-400">
@@ -66,7 +66,7 @@
             @click="toogleItem(item)"
             class="z-index-100 flex-shrink-0 ml-1 h-4 w-4 -mr-1 rounded-full inline-flex items-center justify-center text-gray-400 hover:text-gray-500 focus:outline-none focus:text-gray-500 focus:bg-gray-100"
           >
-            <span class="sr-only">Remove item</span>
+            <span class="sr-only">{{ $t('Remove item') }}</span>
             <svg class="h-2 w-2" stroke="currentColor" fill="none" viewBox="0 0 8 8">
               <path
                 stroke-linecap="round"

package/dist/spa/src/components/AcceptModal.vue

@@ -13,7 +13,7 @@ const modalStore = useModalStore();
                     <svg class="w-3 h-3"  xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
                         <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"/>
                     </svg>
-                    <span class="sr-only">Close modal</span>
+                    <span class="sr-only">{{ $t('Close modal') }}</span>
                 </button>
                 <div class="p-4 md:p-5 text-center">
                     <svg class="mx-auto mb-4 text-gray-400 w-12 h-12 dark:text-gray-200"  xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">

package/dist/spa/src/components/Breadcrumbs.vue

@@ -6,7 +6,7 @@
             <svg class="w-3 h-3 me-2.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
               <path d="m19.707 9.293-2-2-7-7a1 1 0 0 0-1.414 0l-7 7-2 2a1 1 0 0 0 1.414 1.414L2 10.414V18a2 2 0 0 0 2 2h3a1 1 0 0 0 1-1v-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v4a1 1 0 0 0 1 1h3a2 2 0 0 0 2-2v-7.586l.293.293a1 1 0 0 0 1.414-1.414Z"/>
             </svg>
-            Home
+            {{ $t('Home') }}
           </RouterLink>
         </li>
         <li>

package/dist/spa/src/components/BreadcrumbsWithButtons.vue

@@ -8,7 +8,7 @@
     </div>
     <div class="flex items-center justify-between mb-3 flex-wrap gap-y-2 gap-2" v-if="coreStore.resourceColumnsError">
       <div class="p-4 mb-4 text-sm text-red-800 rounded-lg bg-red-50 dark:bg-gray-800 dark:text-red-400" role="alert">
-        <span class="font-medium">Error!</span> {{ coreStore.resourceColumnsError }}
+        <span class="font-medium">{{ $t('Error!')}}</span> {{ coreStore.resourceColumnsError }}
       </div>
     </div>
   </div>

package/dist/spa/src/components/Filters.vue

@@ -9,11 +9,11 @@
       :style="{ height: `calc(100vh ` }"
   >
     <h5 id="drawer-navigation-label" class="text-base font-semibold text-gray-500 uppercase dark:text-gray-400">
-      Filters
+      {{ $t('Filters') }}
 
       <button type="button" @click="$emit('hide')" class="text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 absolute end-2.5 inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white" >
         <svg aria-hidden="true" class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
-        <span class="sr-only">Close menu</span>
+        <span class="sr-only">{{ $t('Close menu') }}</span>
       </button>
     </h5>
    
@@ -109,7 +109,7 @@
         :disabled="!filtersStore.filters.length"
         type="button" 
         class="flex items-center py-1 px-3 text-sm font-medium text-gray-900 focus:outline-none bg-white rounded border border-gray-300 hover:bg-gray-100 hover:text-lightPrimary focus:z-10 focus:ring-4 focus:ring-gray-100 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700 disabled:opacity-50 disabled:cursor-not-allowed"
-        @click="clear">Clear all</button>
+        @click="clear">{{ $t('Clear all') }}</button>
 
    </div>
   </div>

package/dist/spa/src/components/GroupsTable.vue

@@ -7,10 +7,10 @@
       <thead class="text-xs text-gray-700 uppercase dark:text-gray-400 bg-lightFormHeading dark:bg-gray-700 block md:table-row-group ">
         <tr>
           <th scope="col" :class="{'rounded-tl-lg': !group.groupName}" class="px-6 py-3 hidden md:w-52 md:table-cell">
-              Field
+              {{ $t('Field') }}
           </th>
           <th scope="col" :class="{'rounded-tr-lg': !group.groupName}" class="px-6 py-3 hidden md:table-cell">
-              Value
+              {{ $t('Value') }}
           </th>
         </tr>
       </thead>
@@ -33,7 +33,7 @@
                 />
 
                 <template #tooltip>
-                  Required field
+                  {{ $t('Required field') }}
                 </template>
               </Tooltip>
             </span>

package/dist/spa/src/components/HelloWorld.vue

@@ -8,7 +8,7 @@ defineProps<{
   <div class="greetings">
     <h1 class="green">{{ msg }}</h1>
     <h3>
-      You’ve successfully created a project with
+      {{ $t('You’ve successfully created a project with') }}
     </h3>
   </div>
 </template>

package/dist/spa/src/components/ResourceListTable.vue

@@ -22,7 +22,7 @@
               <input id="checkbox-all-search" type="checkbox" :checked="allFromThisPageChecked" @change="selectAll()" 
                     class="w-4 h-4 cursor-pointer text-blue-600 bg-gray-100 border-gray-300 rounded
                     focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
-              <label for="checkbox-all-search" class="sr-only">checkbox</label>
+              <label for="checkbox-all-search" class="sr-only">{{ $t('checkbox') }}</label>
             </div>
           </td>
 
@@ -56,7 +56,7 @@
           </td>
 
           <td scope="col" class="px-6 py-3">
-            Actions
+            {{ $t('Actions') }}
           </td>
         </tr>
         <!-- table header end -->
@@ -72,7 +72,7 @@
                 class=" mx-auto my-5 flex items-center w-full max-w-xs p-4 space-x-4 rtl:space-x-reverse text-gray-500 divide-x rtl:divide-x-reverse divide-gray-200  dark:text-gray-400 dark:divide-gray-700 space-x dark:bg-gray-800"
                 role="alert">
               <IconInboxOutline class="w-6 h-6 text-gray-500 dark:text-gray-400"/>
-              <div class="ps-4 text-sm font-normal">No items here yet</div>
+              <div class="ps-4 text-sm font-normal">{{ $t('No items here yet') }}</div>
             </div>
 
           </td>
@@ -93,7 +93,7 @@
                 :checked="checkboxesInternal.includes(row._primaryKeyValue)"
                 @change="(e)=>{addToCheckedValues(row._primaryKeyValue)}"
                 class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 dark:focus:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600 cursor-pointer">
-              <label for="checkbox-table-search-1" class="sr-only">checkbox</label>
+              <label for="checkbox-table-search-1" class="sr-only">{{ $t('checkbox') }}</label>
             </div>
           </td>
           <td v-for="c in columnsListed" class="px-2 md:px-3 lg:px-6 py-4">
@@ -125,7 +125,7 @@
                 </RouterLink>
 
                 <template v-slot:tooltip>
-                  Show item
+                  {{ $t('Show item') }}
                 </template>
               </Tooltip>
 
@@ -143,7 +143,7 @@
                   <IconPenSolid class="w-5 h-5 me-2"/>
                 </RouterLink>
                 <template v-slot:tooltip>
-                  Edit item
+                  {{ $t('Edit item') }}
                 </template>
               </Tooltip>
 
@@ -156,7 +156,7 @@
                 </button>
 
                 <template v-slot:tooltip>
-                  Delete item
+                  {{ $t('Delete item') }}
                 </template>
               </Tooltip>
                 
@@ -194,7 +194,7 @@
                   d="M13 5H1m0 0 4 4M1 5l4-4"/>
           </svg>
           <span class="hidden sm:inline">
-            Prev
+            {{ $t('Prev') }}
           </span>
         </button>
         <button
@@ -221,7 +221,7 @@
         <button
           class="flex items-center py-1 px-3 gap-1 text-sm font-medium text-gray-900 focus:outline-none bg-white border-l-0 rounded-e border border-gray-300 hover:bg-gray-100 hover:text-lightPrimary focus:z-10 focus:ring-4 focus:ring-gray-100 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700 disabled:opacity-50"
           @click="page++" :disabled="page >= totalPages">
-          <span class="hidden sm:inline">Next</span>
+          <span class="hidden sm:inline">{{ $t('Next') }}</span>
           <svg class="w-3.5 h-3.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
               viewBox="0 0 14 10">
             <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -232,14 +232,14 @@
 
     <!-- Help text -->
     <span class="text-sm text-gray-700 dark:text-gray-400">
-        <span v-if="((page || 1) - 1) * pageSize + 1 > totalRows">Wrong Page </span>
-        <span v-else>Showing </span> 
+        <span v-if="((page || 1) - 1) * pageSize + 1 > totalRows">{{ $t('Wrong Page') }} </span>
+        <span v-else>{{ $t('Showing') }} </span> 
         <span class="font-semibold text-gray-900 dark:text-white">
           {{ ((page || 1) - 1) * pageSize + 1 }}
-        </span> to <span class="font-semibold text-gray-900 dark:text-white">
+        </span> {{ $t('to') }} <span class="font-semibold text-gray-900 dark:text-white">
           {{ Math.min((page || 1) * pageSize, totalRows) }}
-        </span> of <span class="font-semibold text-gray-900 dark:text-white">{{
-          totalRows }}</span> <span class="hidden sm:inline">Entries</span>
+        </span> {{ $t('of') }} <span class="font-semibold text-gray-900 dark:text-white">{{
+          totalRows }}</span> <span class="hidden sm:inline">{{ $t('Entries') }}</span>
     </span>
   </div>
 </template>

package/dist/spa/src/components/ShowTable.vue

@@ -7,10 +7,10 @@
         <thead class="text-gray-700 dark:text-gray-400 bg-lightFormHeading dark:bg-gray-700 block md:table-row-group">
           <tr>
             <th scope="col" class="px-6 py-3 text-xs uppercase hidden md:w-52 md:table-cell">
-              Field
+              {{ $t('Field') }}
             </th>
             <th scope="col" class="px-6 py-3 text-xs uppercase hidden md:table-cell">
-              Value
+              {{ $t('Value') }}
             </th>
           </tr>
         </thead>

package/dist/spa/src/components/SingleSkeletLoader.vue

@@ -8,6 +8,6 @@
       <div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[330px] mb-2.5"></div>
       <div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[300px] mb-2.5"></div>
       <div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[360px]"></div>
-      <span class="sr-only">Loading...</span>
+      <span class="sr-only">{{ $t('Loading...') }}</span>
     </div>
 </template>

package/dist/spa/src/components/Toast.vue

@@ -13,25 +13,25 @@
         <svg class="w-4 h-4"  xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 18 20">
             <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.147 15.085a7.159 7.159 0 0 1-6.189 3.307A6.713 6.713 0 0 1 3.1 15.444c-2.679-4.513.287-8.737.888-9.548A4.373 4.373 0 0 0 5 1.608c1.287.953 6.445 3.218 5.537 10.5 1.5-1.122 2.706-3.01 2.853-6.14 1.433 1.049 3.993 5.395 1.757 9.117Z"/>
         </svg>
-        <span class="sr-only">Fire icon</span>
+        <span class="sr-only">{{ $t('Fire icon') }}</span>
     </div>
     <div v-else-if="toast.variant == 'danger'" class="inline-flex items-center justify-center flex-shrink-0 w-8 h-8 text-red-500 bg-red-100 rounded-lg dark:bg-red-800 dark:text-red-200">
         <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
             <path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5Zm3.707 11.793a1 1 0 1 1-1.414 1.414L10 11.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L8.586 10 6.293 7.707a1 1 0 0 1 1.414-1.414L10 8.586l2.293-2.293a1 1 0 0 1 1.414 1.414L11.414 10l2.293 2.293Z"/>
         </svg>
-        <span class="sr-only">Error icon</span>
+        <span class="sr-only">{{ $t('Error icon') }}</span>
     </div>
     <div v-else-if="toast.variant == 'warning'"class="inline-flex items-center justify-center flex-shrink-0 w-8 h-8 text-orange-500 bg-orange-100 rounded-lg dark:bg-orange-700 dark:text-orange-200">
         <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
             <path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM10 15a1 1 0 1 1 0-2 1 1 0 0 1 0 2Zm1-4a1 1 0 0 1-2 0V6a1 1 0 0 1 2 0v5Z"/>
         </svg>
-        <span class="sr-only">Warning icon</span>
+        <span class="sr-only">{{ $t('Warning icon') }}</span>
     </div>
     <div v-else class="inline-flex items-center justify-center flex-shrink-0 w-8 h-8 text-green-500 bg-green-100 rounded-lg dark:bg-green-800 dark:text-green-200">
         <svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
             <path d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5Zm3.707 8.207-4 4a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L9 10.586l3.293-3.293a1 1 0 0 1 1.414 1.414Z"/>
         </svg>
-        <span class="sr-only">Check icon</span>
+        <span class="sr-only">{{ $t('Check icon') }}</span>
     </div>
 
     <div class="ms-3 text-sm font-normal max-w-xs pr-2" v-if="toast.messageHtml" v-html="toast.messageHtml"></div>

package/dist/spa/src/components/ValueRenderer.vue

@@ -11,8 +11,8 @@
     </span>
         
     <span v-else-if="column.type === 'boolean'">
-      <span v-if="record[column.name]" class="bg-green-100 text-green-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-gray-700 dark:text-green-400 border border-green-400">Yes</span>
-      <span v-else class="bg-red-100 text-red-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-gray-700 dark:text-red-400 border border-red-400">No</span>
+      <span v-if="record[column.name]" class="bg-green-100 text-green-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-gray-700 dark:text-green-400 border border-green-400">{{ $t('Yes') }}</span>
+      <span v-else class="bg-red-100 text-red-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-gray-700 dark:text-red-400 border border-red-400">{{ $t('No') }}</span>
     </span>
     <span v-else-if="column.enum">
       {{ checkEmptyValues(column.enum.find(e => e.value === record[column.name])?.label || record[column.name], route.meta.type) }}

package/dist/spa/src/router/index.ts

@@ -11,7 +11,10 @@ const router = createRouter({
       path: '/login',
       name: 'login',
       component: () => import('@/views/LoginView.vue'),
-      meta: { title: 'login', customLayout: true },
+      meta: { 
+        title: 'Login', 
+        customLayout: true 
+      },
       beforeEnter: async (to, from, next) => {
         if(localStorage.getItem('isAuthorized') === 'true'){
           next({name: 'home'})

package/dist/spa/src/types/Back.ts

@@ -20,6 +20,8 @@ export interface ICodeInjector {
   devServerPort: number;
 
   getServeDir(): string;
+
+  spaTmpPath(): string;
 }
 
 export interface IConfigValidator {
@@ -1103,7 +1105,7 @@ export interface AdminForthResource extends Omit<AdminForthResourceInput, 'optio
        * Typical use-cases: 
        * - request additional data from database before returning to frontend for soft-join 
        */
-      beforeDatasourceRequest?: BeforeDataSourceRequestFunction | Array<BeforeDataSourceRequestFunction>,
+      beforeDatasourceRequest?: Array<BeforeDataSourceRequestFunction>,
 
       /**
        * Typical use-cases:
@@ -1111,7 +1113,7 @@ export interface AdminForthResource extends Omit<AdminForthResourceInput, 'optio
        * - If some-why you can't use `backendOnly` you can cleanup sensitive fields here
        * - Attach additional data to record before returning to frontend 
        */
-      afterDatasourceResponse?: AfterDataSourceResponseFunction | Array<AfterDataSourceResponseFunction>,
+      afterDatasourceResponse?: Array<AfterDataSourceResponseFunction>,
     },
     list?: {
       /**
@@ -1119,14 +1121,14 @@ export interface AdminForthResource extends Omit<AdminForthResourceInput, 'optio
        * - add additional filters in addition to what user selected before fetching data from database.
        * - same as hooks.show.beforeDatasourceRequest 
        */
-      beforeDatasourceRequest?: BeforeDataSourceRequestFunction | Array<BeforeDataSourceRequestFunction>,
+      beforeDatasourceRequest?: Array<BeforeDataSourceRequestFunction>,
 
       /**
        * Typical use-cases:
        * - Same as hooks.show.afterDatasourceResponse but applied for all records returned from database for 
        * showing in list view, e.g. add new field to each record in list view
        */
-      afterDatasourceResponse?: AfterDataSourceResponseFunction | Array<AfterDataSourceResponseFunction>,
+      afterDatasourceResponse?: Array<AfterDataSourceResponseFunction>,
     },
     create?: {
       /**
@@ -1135,38 +1137,38 @@ export interface AdminForthResource extends Omit<AdminForthResourceInput, 'optio
        * - fill-in adminUser as creator of record
        * - Attach additional data to record before saving to database (mostly fillOnCreate should be used instead)
        */
-      beforeSave?: BeforeSaveFunction | Array<BeforeSaveFunction>,
+      beforeSave?: Array<BeforeSaveFunction>,
 
       /**
        * Typical use-cases:
        * - Initiate some trigger after record saved to database (e.g sync to another datasource)
        */
-      afterSave?: AfterSaveFunction | Array<AfterSaveFunction>,
+      afterSave?: Array<AfterSaveFunction>,
     },
     edit?: {
       /**
        * Typical use-cases:
        * - Same as hooks.create.beforeSave but for edit page
        */
-      beforeSave?: BeforeSaveFunction | Array<BeforeSaveFunction>,
+      beforeSave?: Array<BeforeSaveFunction>,
 
       /**
        * Typical use-cases:
        * - Same as hooks.create.afterSave but for edit page
        */
-      afterSave?: AfterSaveFunction | Array<AfterSaveFunction>,
+      afterSave?: Array<AfterSaveFunction>,
     },
     delete?: {
       /**
        * Typical use-cases:
        * - Validate that record can be deleted and interrupt execution if validation failed (`allowedActions.delete` should be preferred in most cases)
        */
-      beforeSave?: BeforeSaveFunction | Array<BeforeSaveFunction>,
+      beforeSave?: Array<BeforeSaveFunction>,
       /**
        * Typical use-cases:
        * - Initiate some trigger after record deleted from database (e.g sync to another datasource)
        */
-      afterSave?: BeforeSaveFunction | Array<BeforeSaveFunction>,
+      afterSave?: Array<BeforeSaveFunction>,
     },
   },
 

package/dist/spa/src/types/Common.ts

@@ -723,6 +723,10 @@ export interface AdminForthResourceColumnCommon extends AdminForthResourceColumn
    */
   _underlineType?: string,
 
+  required?: { create?: boolean, edit?: boolean },
+
+  editingNote?: { create?: string, edit?: string },
+
 }
 
 export enum AdminForthMenuTypes {

package/dist/spa/src/utils.ts

@@ -30,11 +30,12 @@ export async function callApi({path, method, body=undefined}: {
   return await r.json();
 }
 
-export async function callAdminForthApi({ path, method, body=undefined }: {
+export async function callAdminForthApi({ path, method, body=undefined, headers=undefined }: {
   path: string,
   method: 'GET' | 'POST' | 'PUT' | 'DELETE',
-  body?: any
-}) {
+  body?: any,
+  headers?: Record<string, string>
+}): Promise<any> {
   try {
     return callApi({path: `/adminapi/v1${path}`, method, body} );
   } catch (e) {

package/dist/spa/src/views/CreateView.vue

@@ -15,7 +15,7 @@
       <button @click="$router.back()"
         class="flex items-center py-1 px-3 me-2 text-sm font-medium rounded-default text-gray-900 focus:outline-none bg-white rounded border border-gray-300 hover:bg-gray-100 hover:text-lightPrimary focus:z-10 focus:ring-4 focus:ring-gray-100 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700"
       >
-        Cancel
+        {{ $t('Cancel') }}
       </button>
 
       <button  
@@ -27,7 +27,7 @@
          aria-hidden="true" class="w-4 h-4 mr-1 text-gray-200 animate-spin dark:text-gray-600 fill-red-600" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
         
         <IconFloppyDiskSolid v-else class="w-4 h-4 mr-1" />
-        Save
+        {{ $t('Save') }}
       </button>
 
       <ThreeDotsMenu