adminforth 1.13.0-next.8 → 1.13.0

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

@@ -1,10 +1,10 @@
 <template>
   <div class="rounded-lg shadow-resourseFormShadow dark:shadow-darkResourseFormShadow dark:shadow-2xl">
-    <div v-if="group.groupName" class="text-md font-semibold px-6 py-3 flex flex-1 items-center dark:border-gray-600 text-gray-700 bg-lightFormHeading dark:bg-gray-700 dark:text-gray-400 rounded-t-lg">
+    <div v-if="group.groupName && !group.noTitle" class="text-md font-semibold px-6 py-3 flex flex-1 items-center dark:border-gray-600 text-gray-700 bg-lightFormHeading dark:bg-gray-700 dark:text-gray-400 rounded-t-lg">
       {{ group.groupName }}
     </div>
     <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
-      <thead class="text-xs text-gray-700 uppercase dark:text-gray-400 bg-lightFormHeading dark:bg-gray-700 block md:table-row-group ">
+      <thead v-if="!allColumnsHaveCustomComponent" 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">
               {{ $t('Field') }}
@@ -42,50 +42,17 @@
             class="px-6 py-4  whitespace-pre-wrap relative block md:table-cell"
             :class="{'rounded-br-lg': i === group.columns.length - 1}"
           >
-            <template v-if="column.isArray?.enabled">
-              <ColumnValueInput
-                v-for="(arrayItemValue, arrayItemIndex) in currentValues[column.name]"
-                :key="`${column.name}-${arrayItemIndex}`"
-                ref="arrayItemRefs"
-                :class="{'mt-2': arrayItemIndex}"
-                :source="source"
-                :column="column"
-                :type="column.isArray.itemType"
-                :value="arrayItemValue"
-                :currentValues="currentValues"
-                :mode="mode"
-                :columnOptions="columnOptions"
-                :deletable="!column.editReadonly"
-                @update:modelValue="setCurrentValue(column.name, $event, arrayItemIndex)"
-                @update:unmasked="unmasked[column.name] = !unmasked[column.name]"
-                @update:inValidity="customComponentsInValidity[column.name] = $event"
-                @update:emptiness="customComponentsEmptiness[column.name] = $event"
-                @delete="setCurrentValue(column.name, currentValues[column.name].filter((_, index) => index !== arrayItemIndex))"
-              />
-              <button
-                v-if="!column.editReadonly"
-                type="button"
-                @click="setCurrentValue(column.name, currentValues[column.name], currentValues[column.name].length); focusOnLastInput(column.name)"
-                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"
-                :class="{'mt-2': currentValues[column.name].length}"
-              >
-                <IconPlusOutline class="w-4 h-4 me-2"/>
-                {{ $t('Add') }}
-              </button>
-            </template>
-            <ColumnValueInput
-              v-else
+            <ColumnValueInputWrapper
               :source="source"
               :column="column"
-              :value="currentValues[column.name]"
               :currentValues="currentValues"
               :mode="mode"
               :columnOptions="columnOptions"
               :unmasked="unmasked"
-              @update:modelValue="setCurrentValue(column.name, $event)"
-              @update:unmasked="unmasked[column.name] = !unmasked[column.name]"
-              @update:inValidity="customComponentsInValidity[column.name] = $event"
-              @update:emptiness="customComponentsEmptiness[column.name] = $event"
+              :setCurrentValue="setCurrentValue"
+              @update:unmasked="unmasked[$event] = !unmasked[$event]"
+              @update:inValidity="customComponentsInValidity[$event.name] = $event.value"
+              @update:emptiness="customComponentsEmptiness[$event.name] = $event.value"
             />
             <div v-if="columnError(column) && validating" class="mt-1 text-xs text-red-500 dark:text-red-400">{{ columnError(column) }}</div>
             <div v-if="column.editingNote && column.editingNote[mode]" class="mt-1 text-xs text-gray-400 dark:text-gray-500">{{ column.editingNote[mode] }}</div>
@@ -98,10 +65,10 @@
 
 <script setup lang="ts">
   import { IconExclamationCircleSolid, IconPlusOutline } from '@iconify-prerendered/vue-flowbite';
-  import ColumnValueInput from "@/components/ColumnValueInput.vue";
   import { Tooltip } from '@/afcl';
   import { ref, computed, watch, nextTick, type Ref } from 'vue';
   import { useI18n } from 'vue-i18n';
+  import ColumnValueInputWrapper from "@/components/ColumnValueInputWrapper.vue";
 
   const { t } = useI18n();
 
@@ -117,19 +84,17 @@
     columnOptions: any,
   }>();
 
-  const arrayItemRefs = ref([]);
-
   const customComponentsInValidity: Ref<Record<string, boolean>> = ref({});
   const customComponentsEmptiness: Ref<Record<string, boolean>> = ref({});
+  const allColumnsHaveCustomComponent = computed(() => {
+    return props.group.columns.every(column => {
+      const componentKey = `${props.source}Row` as keyof typeof column.components;
+      return column.components?.[componentKey];
+    });
+  });
 
   const emit = defineEmits(['update:customComponentsInValidity', 'update:customComponentsEmptiness']);
 
-  async function focusOnLastInput(column) {
-    // wait for element to register
-    await nextTick();
-    arrayItemRefs.value[arrayItemRefs.value.length - 1].focus();
-  }
-
   watch(customComponentsInValidity.value, (newVal) => {
     emit('update:customComponentsInValidity', newVal);
   });
@@ -138,4 +103,4 @@
     emit('update:customComponentsEmptiness', newVal);
   });
 
-</script>
+</script>

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

@@ -190,8 +190,12 @@ const setCurrentValue = (key, value, index=null) => {
     } else if (index === currentValues.value[key].length) {
       currentValues.value[key].push(null);
     } else {
-      if (['integer', 'float'].includes(col.isArray.itemType) && (value || value === 0)) {
-        currentValues.value[key][index] = +value;
+      if (['integer', 'float', 'decimal'].includes(col.isArray.itemType)) {
+        if (value || value === 0) {
+          currentValues.value[key][index] = +value;
+        } else {
+          currentValues.value[key][index] = null;
+        }
       } else {
         currentValues.value[key][index] = value;
       }
@@ -200,8 +204,12 @@ const setCurrentValue = (key, value, index=null) => {
       }
     }
   } else {
-    if (['integer', 'float'].includes(col.type) && (value || value === 0)) {
-      currentValues.value[key] = +value;
+    if (['integer', 'float', 'decimal'].includes(col.type)) {
+      if (value || value === 0) {
+        currentValues.value[key] = +value;
+      } else {
+        currentValues.value[key] = null;
+      }
     } else {
       currentValues.value[key] = value;
     }
@@ -237,7 +245,12 @@ onMounted(() => {
           currentValues.value[column.name] = [];
         } else {
           // else copy array to prevent mutation
-          currentValues.value[column.name] = [...currentValues.value[column.name]];
+          if (Array.isArray(currentValues.value[column.name])) {
+            currentValues.value[column.name] = [...currentValues.value[column.name]];
+          } else {
+            // fallback for old data
+            currentValues.value[column.name] = [`${currentValues.value[column.name]}`];
+          }
         }
       } else if (currentValues.value[column.name]) {
         currentValues.value[column.name] = JSON.stringify(currentValues.value[column.name], null, 2);

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

@@ -18,15 +18,16 @@
         <!-- table header -->
         <tr class="t-header sticky z-10 top-0 text-xs  bg-lightListTableHeading dark:bg-darkListTableHeading dark:text-gray-400">
           <td scope="col" class="p-4">
-            <div v-if="rows && rows.length" class="flex items-center">
+            <div class="flex items-center">
               <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
+                    :disabled="!rows || !rows.length"
+                    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">
               <label for="checkbox-all-search" class="sr-only">{{ $t('checkbox') }}</label>
             </div>
           </td>
 
-          <td v-for="c in columnsListed" scope="col" class="px-2 md:px-3 lg:px-6 py-3">
+          <td v-for="c in columnsListed" ref="headerRefs" scope="col" class="px-2 md:px-3 lg:px-6 py-3">
           
             <div @click="(evt) => c.sortable && onSortButtonClick(evt, c.name)" 
                 class="flex items-center " :class="{'cursor-pointer':c.sortable}">
@@ -65,6 +66,7 @@
           :columns="resource?.columns.filter(c => c.showIn.list).length + 2"
           :rows="rowHeights.length || 3"
           :row-heights="rowHeights"
+          :column-widths="columnWidths"
         />
         <tr v-else-if="rows.length === 0" class="bg-lightListTable dark:bg-darkListTable dark:border-darkListTableBorder">
           <td :colspan="resource?.columns.length + 2">
@@ -178,7 +180,7 @@
                   <button
                     @click="startCustomAction(action.id, row)"
                   >
-                    <component v-if="action.icon" :is="getIcon(action.icon)" class="w-5 h-5 text-lightPrimary dark:text-darkPrimary"></component>
+                    <component v-if="action.icon" :is="getIcon(action.icon)" class="w-5 h-5 mr-2 text-lightPrimary dark:text-darkPrimary"></component>
                   </button>
                   <template v-slot:tooltip>
                     {{ action.name }}
@@ -376,10 +378,13 @@ watch(() => props.page, (newPage) => {
 });
 
 const rowRefs = useTemplateRef('rowRefs');
+const headerRefs = useTemplateRef('headerRefs');
 const rowHeights = ref([]);
+const columnWidths = ref([]);
 watch(() => props.rows, (newRows) => {
   // rows are set to null when new records are loading
   rowHeights.value = newRows || !rowRefs.value ? [] : rowRefs.value.map((el) => el.offsetHeight);
+  columnWidths.value = newRows || !headerRefs.value ? [] : [48, ...headerRefs.value.map((el) => el.offsetWidth)];
 });
 
 function addToCheckedValues(id) {
@@ -411,7 +416,7 @@ async function selectAll(value) {
 const totalPages = computed(() => Math.ceil(props.totalRows / props.pageSize));
 
 const allFromThisPageChecked = computed(() => {
-  if (!props.rows) return false;
+  if (!props.rows || !props.rows.length) return false;
   return props.rows.every((r) => checkboxesInternal.value.includes(r._primaryKeyValue));
 });
 const ascArr = computed(() => sort.value.filter((s) => s.direction === 'asc').map((s) => s.field));
@@ -536,6 +541,20 @@ async function startCustomAction(actionId, row) {
   
   actionLoadingStates.value[actionId] = false;
   
+  if (data?.redirectUrl) {
+    // Check if the URL should open in a new tab
+    if (data.redirectUrl.includes('target=_blank')) {
+      window.open(data.redirectUrl.replace('&target=_blank', '').replace('?target=_blank', ''), '_blank');
+    } else {
+      // Navigate within the app
+      if (data.redirectUrl.startsWith('http')) {
+        window.location.href = data.redirectUrl;
+      } else {
+        router.push(data.redirectUrl);
+      }
+    }
+    return;
+  }
   if (data?.ok) {
     emits('update:records', true);
 
@@ -553,4 +572,13 @@ async function startCustomAction(actionId, row) {
 }
 
 
-</script>
+</script>
+
+<style lang="scss" scoped>
+input[type="checkbox"][disabled] {
+  @apply opacity-50;
+}
+input[type="checkbox"]:not([disabled]) {
+  @apply cursor-pointer;
+}
+</style>

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

@@ -1,10 +1,10 @@
 <template>
     <div class="overflow-x-auto rounded-default shadow-resourseFormShadow dark:shadow-darkResourseFormShadow">
-        <div v-if="groupName" class="text-md font-semibold px-6 py-3 flex flex-1 items-center dark:border-gray-600 text-gray-700 bg-lightFormHeading dark:bg-gray-700 dark:text-gray-400 rounded-t-lg">
+        <div v-if="groupName && !noTitle"  class="text-md font-semibold px-6 py-3 flex flex-1 items-center dark:border-gray-600 text-gray-700 bg-lightFormHeading dark:bg-gray-700 dark:text-gray-400 rounded-t-lg">
         {{ groupName }}
         </div>
       <table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400 table-fixed">
-        <thead class="text-gray-700 dark:text-gray-400 bg-lightFormHeading dark:bg-gray-700 block md:table-row-group">
+        <thead v-if="!allColumnsHaveCustomComponent"  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">
               {{ $t('Field') }}
@@ -59,7 +59,8 @@
   import ValueRenderer from '@/components/ValueRenderer.vue';
   import { getCustomComponent } from '@/utils';
   import { useCoreStore } from '@/stores/core';
-  defineProps<{ 
+  import { computed } from 'vue';
+  const props = defineProps<{ 
     columns: Array<{
         name: string;
         label: string;
@@ -74,10 +75,17 @@
           };
         };
     }>;
+    source: string;
     groupName?: string | null;
+    noTitle?: boolean;
     resource: Record<string, any>;
     record: Record<string, any>;
   }>();
 
   const coreStore = useCoreStore();
+  const allColumnsHaveCustomComponent = computed(() => {
+    return props.columns.every(column => {
+      return column.components?.showRow;
+    });
+  });
   </script>

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

@@ -1,10 +1,16 @@
 <template>
     <tr
         v-for="(r, ri) in new Array(props.rows)"
-        class="bg-lightListTable border-b dark:bg-darkListTable dark:border-darkListBorder"
-        :style="[props.rowHeights[ri] !== undefined ? `height: ${props.rowHeights[ri]}px` : '' ]"
+        class="bg-lightListTable dark:bg-darkListTable dark:border-darkListBorder"
+        :class="{'border-b': ri !== props.rows - 1}"
+        :style="[`height: ${props.rowHeights[ri] !== undefined ? props.rowHeights[ri] : 52.5}px`]"
     >
-        <td v-for="c in new Array(props.columns)" class="items-center px-6 py-8 cursor-default" >
+        <td
+            v-for="(c, ci) in new Array(props.columns)" class="items-center px-6 py-4 cursor-default"
+            :style="[props.columnWidths[ci] !== undefined
+                ? `min-width: ${props.columnWidths[ci]}px; width: ${props.columnWidths[ci]}px;`
+                : '']"
+        >
             <div role="status" class="max-w-sm animate-pulse">
                 <div class="h-2 bg-gray-200 rounded-full dark:bg-gray-700 max-w-[360px]"></div>
             </div>
@@ -18,8 +24,10 @@ const props = withDefaults(defineProps<{
     columns: number;
     rows: number;
     rowHeights?: number[];
+    columnWidths?: number[];
 }>(), {
     rowHeights: [],
+    columnWidths: [],
 });
 
 </script>

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

@@ -46,10 +46,11 @@ import { getCustomComponent, getIcon } from '@/utils';
 import { useCoreStore } from '@/stores/core';
 import adminforth from '@/adminforth';
 import { callAdminForthApi } from '@/utils';
-import { useRoute } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
 
 const route = useRoute();
 const coreStore = useCoreStore();
+const router = useRouter();
 
 const props = defineProps({
   threeDotsDropdownItems: Array,
@@ -69,6 +70,21 @@ async function handleActionClick(action) {
       recordId: route.params.primaryKey
     }
   });
+
+  if (data?.redirectUrl) {
+    // Check if the URL should open in a new tab
+    if (data.redirectUrl.includes('target=_blank')) {
+      window.open(data.redirectUrl.replace('&target=_blank', '').replace('?target=_blank', ''), '_blank');
+    } else {
+      // Navigate within the app
+      if (data.redirectUrl.startsWith('http')) {
+        window.location.href = data.redirectUrl;
+      } else {
+        router.push(data.redirectUrl);
+      }
+    }
+    return;
+  }
   
   if (data?.ok) {
     await coreStore.fetchRecord({

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

@@ -1,7 +1,23 @@
 <template>
   <div>
-    <span @click="(e)=>{e.stopPropagation()}" v-if="column.foreignResource">
-      <RouterLink v-if="record[column.name]" class="font-medium text-lightPrimary dark:text-darkPrimary hover:brightness-110 whitespace-nowrap"
+    <span
+      v-if="column.foreignResource"
+      :class="{'flex flex-wrap': column.isArray?.enabled}"
+      @click="(e)=>{e.stopPropagation()}"
+    >
+      <span
+        v-if="record[column.name] && column.isArray?.enabled"
+        v-for="foreignResource in record[column.name]"
+        class="rounded-md m-0.5 bg-lightAnnouncementBG dark:bg-darkAnnouncementBG text-lightAnnouncementText dark:text-darkAnnouncementText py-0.5 px-2.5 text-sm"
+      >
+        <RouterLink
+          class="font-medium text-lightSidebarText dark:text-darkSidebarText hover:brightness-110 whitespace-nowrap"
+          :to="{ name: 'resource-show', params: { primaryKey: foreignResource.pk, resourceId: column.foreignResource.resourceId || column.foreignResource.polymorphicResources.find((pr) => pr.whenValue === record[column.foreignResource.polymorphicOn]).resourceId } }"
+        >
+          {{ foreignResource.label }}
+        </RouterLink>
+      </span>
+      <RouterLink v-else-if="record[column.name]" class="font-medium text-lightPrimary dark:text-darkPrimary hover:brightness-110 whitespace-nowrap"
         :to="{ name: 'resource-show', params: { primaryKey: record[column.name].pk, resourceId: column.foreignResource.resourceId || column.foreignResource.polymorphicResources.find((pr) => pr.whenValue === record[column.foreignResource.polymorphicOn]).resourceId } }">
         {{ record[column.name].label }}
       </RouterLink>

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

@@ -206,9 +206,9 @@ export interface IAdminForthDataSourceConnector {
 
 
   /**
-   * Used to create record in database.
+   * Used to create record in database. Should return value of primary key column of created record.
    */
-  createRecordOriginalValues({ resource, record }: { resource: AdminForthResource, record: any }): Promise<void>;
+  createRecordOriginalValues({ resource, record }: { resource: AdminForthResource, record: any }): Promise<string>;
 
   /**
    * Update record in database. newValues might have not all fields in record, but only changed ones.
@@ -727,7 +727,12 @@ export interface AdminForthActionInput {
       showButton?: boolean,
       showThreeDotsMenu?: boolean,
   };
-  action: (params: {
+  allowed?: (params: {
+    adminUser: AdminUser;
+    standardAllowedActions: AllowedActions;
+  }) => boolean;
+  url?: string;
+  action?: (params: {
       adminforth: IAdminForth;
       resource: AdminForthResource;
       recordId: string;
@@ -1146,8 +1151,6 @@ export interface ResourceOptionsInput extends Omit<AdminForthResourceCommon['opt
    */
   bulkActions?: Array<AdminForthBulkAction>,
 
-  actions?: Array<AdminForthActionInput>,
-
   /**
    * Allowed actions for resource.
    * 
@@ -1165,10 +1168,38 @@ export interface ResourceOptionsInput extends Omit<AdminForthResourceCommon['opt
    * 
    */
   allowedActions?: AllowedActionsInput,
+
+  /**
+   * Array of actions which will be displayed in the resource.
+   * 
+   * Example:
+   * 
+   * ```ts
+   * actions: [
+   *  {
+   *    name: 'Auto submit',
+   *    allowed: ({ adminUser, standardAllowedActions }) => {
+   *      return adminUser.dbUser.role === 'superadmin';
+   *    },
+   *    action: ({ adminUser, resource, recordId, adminforth, extra, tr }) => {
+   *      console.log("auto submit", recordId, adminUser);
+   *      return { ok: true, successMessage: "Auto submitted" };
+   *    },
+   *    showIn: {
+   *      list: true,
+   *      showButton: true,
+   *      showThreeDotsMenu: true,
+   *    },
+   *  },
+   * ]
+   * ```
+   */
+  actions?: Array<AdminForthActionInput>,
 };
 
 export interface ResourceOptions extends Omit<ResourceOptionsInput, 'allowedActions'> {
   allowedActions: AllowedActions,
+  actions?: Array<AdminForthActionInput>,
 }
 
 /**

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

@@ -50,6 +50,7 @@ export enum ActionCheckSource {
   CreateRequest = 'createRequest',
   DeleteRequest = 'deleteRequest',
   BulkActionRequest = 'bulkActionRequest',
+  CustomActionRequest = 'customActionRequest',
 }
 
 export enum AllowedActionsEnum {
@@ -357,18 +358,22 @@ export interface AdminForthResourceInputCommon {
       fieldGroups?: {
         groupName: string;
         columns: string[];
+        noTitle?: boolean;
       }[];
       createFieldGroups?: {
         groupName: string;
         columns: string[];
+        noTitle?: boolean;
       }[];
       editFieldGroups?: {
         groupName: string;
         columns: string[];
+        noTitle?: boolean;
       }[];
       showFieldGroups?: {
         groupName: string;
         columns: string[];
+        noTitle?: boolean;
       }[];
 
       /** 
@@ -551,6 +556,11 @@ export interface AdminForthForeignResourceCommon {
   unsetLabel?: string,
 }
 
+export type FillOnCreateFunction = (params: {
+  initialRecord: any,
+  adminUser: AdminUser,
+}) => any;
+
 /**
  * Column describes one field in the table or collection in database.
  */
@@ -681,7 +691,7 @@ export interface AdminForthResourceColumnInputCommon {
   /**
    * Called on the backend when the record is saved to a database. Value returned by `fillOnCreate` will be saved to the database. 
    */
-  fillOnCreate?: Function,
+  fillOnCreate?: FillOnCreateFunction,
 
   /**
    * Single value that will be substituted in create form. User can change it before saving the record.

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

@@ -107,7 +107,11 @@ const editableRecord = computed(() => {
   }
   coreStore.resource.columns.forEach(column => {
     if (column.foreignResource) {
-      newRecord[column.name] = newRecord[column.name]?.pk
+      if (column.isArray?.enabled) {
+        newRecord[column.name] = newRecord[column.name]?.map(fr => fr.pk);
+      } else {
+        newRecord[column.name] = newRecord[column.name]?.pk;
+      }
     }
   });
   return newRecord;
@@ -145,7 +149,7 @@ async function saveRecord() {
 
     const column = coreStore.resource.columns.find((c) => c.name === key);
     if (column?.foreignResource) {
-      columnIsUpdated = record.value[key] !== coreStore.record[key].pk;
+      columnIsUpdated = record.value[key] !== coreStore.record[key]?.pk;
     }
 
     if (columnIsUpdated) {
@@ -172,7 +176,7 @@ async function saveRecord() {
     });
   }
   saving.value = false;
-  router.push({ name: 'resource-show', params: { resourceId: route.params.resourceId, primaryKey: coreStore.record[coreStore.primaryKey] } });
+  router.push({ name: 'resource-show', params: { resourceId: route.params.resourceId, primaryKey: resp.recordId } });
 }
 
 </script>

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

@@ -83,11 +83,12 @@
         :record="coreStore.record"
       />
     </div>
-    <template v-else>
+    <template v-else> 
       <template v-for="group in groups" :key="group.groupName">
         <ShowTable
           :columns="group.columns"
           :groupName="group.groupName"
+          :noTitle="group.noTitle"
           :resource="coreStore.resource"
           :record="coreStore.record"
         />
@@ -245,6 +246,21 @@ async function startCustomAction(actionId) {
   
   actionLoadingStates.value[actionId] = false;
   
+  if (data?.redirectUrl) {
+    // Check if the URL should open in a new tab
+    if (data.redirectUrl.includes('target=_blank')) {
+      window.open(data.redirectUrl.replace('&target=_blank', '').replace('?target=_blank', ''), '_blank');
+    } else {
+      // Navigate within the app
+      if (data.redirectUrl.startsWith('http')) {
+        window.location.href = data.redirectUrl;
+      } else {
+        router.push(data.redirectUrl);
+      }
+    }
+    return;
+  }
+  
   if (data?.ok) {
     await coreStore.fetchRecord({
       resourceId: route.params.resourceId, 

package/dist/types/Back.d.ts

@@ -169,12 +169,12 @@ export interface IAdminForthDataSourceConnector {
         };
     }>;
     /**
-     * Used to create record in database.
+     * Used to create record in database. Should return value of primary key column of created record.
      */
     createRecordOriginalValues({ resource, record }: {
         resource: AdminForthResource;
         record: any;
-    }): Promise<void>;
+    }): Promise<string>;
     /**
      * Update record in database. newValues might have not all fields in record, but only changed ones.
      * recordId is value of field which is marked as {@link AdminForthResourceColumn.primaryKey}
@@ -697,7 +697,12 @@ export interface AdminForthActionInput {
         showButton?: boolean;
         showThreeDotsMenu?: boolean;
     };
-    action: (params: {
+    allowed?: (params: {
+        adminUser: AdminUser;
+        standardAllowedActions: AllowedActions;
+    }) => boolean;
+    url?: string;
+    action?: (params: {
         adminforth: IAdminForth;
         resource: AdminForthResource;
         recordId: string;
@@ -1025,7 +1030,6 @@ export interface ResourceOptionsInput extends Omit<AdminForthResourceCommon['opt
      * using checkboxes.
      */
     bulkActions?: Array<AdminForthBulkAction>;
-    actions?: Array<AdminForthActionInput>;
     /**
      * Allowed actions for resource.
      *
@@ -1043,9 +1047,36 @@ export interface ResourceOptionsInput extends Omit<AdminForthResourceCommon['opt
      *
      */
     allowedActions?: AllowedActionsInput;
+    /**
+     * Array of actions which will be displayed in the resource.
+     *
+     * Example:
+     *
+     * ```ts
+     * actions: [
+     *  {
+     *    name: 'Auto submit',
+     *    allowed: ({ adminUser, standardAllowedActions }) => {
+     *      return adminUser.dbUser.role === 'superadmin';
+     *    },
+     *    action: ({ adminUser, resource, recordId, adminforth, extra, tr }) => {
+     *      console.log("auto submit", recordId, adminUser);
+     *      return { ok: true, successMessage: "Auto submitted" };
+     *    },
+     *    showIn: {
+     *      list: true,
+     *      showButton: true,
+     *      showThreeDotsMenu: true,
+     *    },
+     *  },
+     * ]
+     * ```
+     */
+    actions?: Array<AdminForthActionInput>;
 }
 export interface ResourceOptions extends Omit<ResourceOptionsInput, 'allowedActions'> {
     allowedActions: AllowedActions;
+    actions?: Array<AdminForthActionInput>;
 }
 /**
  * Resource describes one table or collection in database.