feat: enhance custom actions with URL redirection and validation

Author: SerVitasik

adminforth/modules/configValidator.ts

@@ -342,8 +342,12 @@ export default class ConfigValidator implements IConfigValidator {
         errors.push(`Resource "${res.resourceId}" has action without name`);
       }
 
-      if (!action.action) {
-        errors.push(`Resource "${res.resourceId}" action "${action.name}" must have action function`);
+      if (!action.action && !action.url) {
+        errors.push(`Resource "${res.resourceId}" action "${action.name}" must have action or url`);
+      }
+      
+      if (action.action && action.url) {
+        errors.push(`Resource "${res.resourceId}" action "${action.name}" cannot have both action and url`);
       }
 
       // Generate ID if not present

adminforth/modules/restApi.ts

@@ -49,6 +49,7 @@ export async function interpretResource(
     [ActionCheckSource.CreateRequest]: ['create'],
     [ActionCheckSource.DisplayButtons]: ['show', 'edit', 'delete', 'create', 'filter'],
     [ActionCheckSource.BulkActionRequest]: ['show', 'edit', 'delete', 'create', 'filter'],
+    [ActionCheckSource.CustomActionRequest]: ['show', 'edit', 'delete', 'create', 'filter'],
   }[source];
 
   await Promise.all(
@@ -1058,13 +1059,33 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
         if (!resource) {
           return { error: await tr(`Resource {resourceId} not found`, 'errors', { resourceId }) };
         }
-        console.log("resource", actionId);
+        const { allowedActions } = await interpretResource(
+          adminUser, 
+          resource, 
+          { requestBody: body },
+          ActionCheckSource.CustomActionRequest,
+          this.adminforth
+        );
         const action = resource.options.actions.find((act) => act.id == actionId);
         if (!action) {
           return { error: await tr(`Action {actionId} not found`, 'errors', { actionId }) };
         }
-        
-        const response = await action.action({ recordId, adminUser, resource, tr });
+        if (action.allowed) {
+          const execAllowed = await action.allowed({ adminUser, standardAllowedActions: allowedActions });
+          if (!execAllowed) {
+            return { error: await tr(`Action "{actionId}" not allowed`, 'errors', { actionId: action.name }) };
+          }
+        }
+
+        if (action.url) {
+          return {
+            actionId,
+            recordId,
+            resourceId,
+            redirectUrl: action.url
+          }
+        }
+        const response = await action.action({ recordId, adminUser, resource, tr, adminforth: this.adminforth });
 
         return {
           actionId,

adminforth/spa/src/components/ResourceListTable.vue

@@ -536,6 +536,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);
 

adminforth/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({

adminforth/spa/src/views/ShowView.vue

@@ -245,6 +245,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, 

adminforth/types/Back.ts

@@ -720,6 +720,33 @@ interface AdminForthInputConfigCustomization {
   }
 }
 
+export interface AdminForthActionInput {
+  name: string;
+  showIn?: {
+      list?: boolean,
+      showButton?: boolean,
+      showThreeDotsMenu?: boolean,
+  };
+  allowed?: (params: {
+    adminUser: AdminUser;
+    standardAllowedActions: AllowedActionsEnum[];
+  }) => boolean;
+  url?: string;
+  action?: (params: {
+      adminforth: IAdminForth;
+      resource: AdminForthResource;
+      recordId: string;
+      adminUser: AdminUser;
+      extra?: HttpExtra;
+      tr: Function;
+  }) => Promise<{
+      ok: boolean;
+      error?: string;
+      message?: string;
+  }>;
+  icon?: string;
+  id?: string;
+}
 
 export interface AdminForthResourceInput extends Omit<AdminForthResourceInputCommon, 'columns' | 'hooks' | 'options'> {
 

adminforth/types/Common.ts

@@ -50,6 +50,7 @@ export enum ActionCheckSource {
   CreateRequest = 'createRequest',
   DeleteRequest = 'deleteRequest',
   BulkActionRequest = 'bulkActionRequest',
+  CustomActionRequest = 'customActionRequest',
 }
 
 export enum AllowedActionsEnum {