Node.js Developer Guide
Other documentationsDemoCommunityGitHub
  • Forest Admin
  • Getting started
    • How it works
    • Quick start
    • Install
      • Create your agent
      • Expose an HTTP endpoint
        • For standalone agents
        • On Express
        • On Koa
        • On Fastify
        • On NestJS
      • Autocompletion & Typings
      • Troubleshooting
    • Migrating legacy agents
      • What's new
      • Pre-requisites
      • Recommendations
      • Migration steps
        • Run new agent in parallel
        • Configure database connection
        • Code transformations
          • API Charts
          • Live Queries
          • Smart Charts
          • Route overrides
          • Smart Actions
          • Smart Fields
          • Smart Relationships
          • Smart Segments
        • Compare schemas
        • Swap agents
      • Post-migration
        • Dropping Sequelize
        • Optimize your agent
  • Data Sources
    • Getting Started
      • Collection selection
      • Naming conflicts
      • Cross-data source relationships
      • Query interface and Native Queries
        • Fields and projections
        • Filters
        • Aggregations
    • Provided data sources
      • SQL (without ORM)
      • Sequelize
      • Mongoose
      • MongoDB
    • Write your own
      • Replication strategy
        • Persistent cache
        • Updating the replica
          • Scheduled rebuilds
          • Change polling
          • Push & Webhooks
        • Schema & References
        • Write handlers
      • Translation strategy
        • Structure declaration
        • Capabilities declaration
        • Read implementation
        • Write implementation
        • Intra-data source Relationships
      • Contribute
  • Agent customization
    • Getting Started
    • Actions
      • Scope and context
      • Result builder
      • Static Forms
      • Widgets in Forms
      • Dynamic Forms
      • Form layout customization
      • Related data invalidation
    • Charts
      • Value
      • Objective
      • Percentage
      • Distribution
      • Leaderboard
      • Time-based
    • Fields
      • Add fields
      • Move, rename and remove fields
      • Override binary field mode
      • Override writing behavior
      • Override filtering behavior
      • Override sorting behavior
      • Validation
    • Hooks
      • Collection hook
      • Collection override
    • Pagination
    • Plugins
      • Provided plugins
        • AWS S3
        • Advanced Export
        • Flattener
      • Write your own
    • Relationships
      • To a single record
      • To multiple records
      • Computed foreign keys
      • Under the hood
    • Search
    • Segments
  • Frontend customization
    • Smart Charts
      • Create a table chart
      • Create a bar chart
      • Create a cohort chart
      • Create a density map
    • Smart Views
      • Create a Map view
      • Create a Calendar view
      • Create a Shipping view
      • Create a Gallery view
      • Create a custom tinder-like validation view
      • Create a custom moderation view
  • Deploying to production
    • Environments
      • Deploy on AWS
      • Deploy on Heroku
      • Deploy on GCP
      • Deploy on Ubuntu
      • Deploy on Azure
    • Development workflow
    • Using branches
    • Deploying your changes
    • Forest Admin CLI commands
      • init
      • login
      • branch
      • switch
      • set-origin
      • push
      • environments:create
      • environments:reset
      • deploy
  • Under the hood
    • .forestadmin-schema.json
    • Data Model
      • Typing
      • Relationships
    • Security & Privacy
Powered by GitBook
On this page
  • In your code
  • In the admin panel

Was this helpful?

  1. Agent customization

Actions

PreviousGetting StartedNextScope and context

Last updated 4 months ago

Was this helpful?

This is the official documentation of the @forestadmin/agent Node.js agent.

Sooner or later, you will need to perform actions on your data that are specific to your business.

Moderating comments, generating invoices, logging into a customer’s account, or banning users are exactly the kind of important tasks to unlock to manage your day-to-day operations.

In your code

To create an Action, you will first need to declare it in your code for a specific collection. Here we declare a "Mark as Live" Action for the companies collection.

The action behavior is implemented in the execute function.

agent.customizeCollection('companies', collection =>
  collection.addAction('Mark as live', {
    scope: 'Single',
    description: 'Mark the company as live',
    submitButtonLabel: 'Turn on',
    execute: async context => {
      // Implement your controller here.
    },
    form: [
      {
        type: 'Layout',
        component: 'Page',
        nextButtonLabel: 'Go to address',
        elements: [
          { type: 'Date', label: 'Live date', id: 'LiveDate' },
          { type: 'DateOnly', label: 'Exist since', id: 'CreationDate' },
          { type: 'Layout', component: 'Separator' },
          {
            type: 'Layout',
            component: 'Row',
            fields: [
              { type: 'Boolean', label: 'Credit Card ?', id: 'WithCreditCard' },
              {
                type: 'String',
                if: ctx => ctx.formValues?.WithCreditCard == true,
                label: 'Number',
                id: 'CreditCardNumber',
              },
            ],
          },
        ],
      },
      {
        type: 'Layout',
        component: 'Page',
        previousButtonLabel: 'Go back to general information',
        elements: [
          {
            type: 'Layout',
            component: 'HtmlBlock',
            content:
              async context => `If the company headquarter didn't change continue.<br/>
                    Otherwise set the new address. <br/>
                    <strong>The current address of the company is ${await context.getRecord(
                      ['fullAddress'],
                    ).fullAddress}.
                    `,
          },
          {
            type: 'Layout',
            component: 'Row',
            fields: [
              { type: 'Number', label: 'StreetNumber' },
              { type: 'String', label: 'StreetName' },
            ],
          },
          { type: 'Layout', component: 'Separator' },
          { type: 'String', label: 'PostalCode' },
          { type: 'Number', label: 'City' },
          { type: 'Layout', component: 'Separator' },
          { type: 'String', label: 'Country' },
        ],
      },
    ],
  }),
);
Property
Usage
Description

scope

require

execute

require

form

optional

description

optional

An optional description of the action. Default: null

submitButtonLabel

optional

A custom label for the submit button. Default: the action name

In the admin panel

After declaring it, the Action will appear in the Smart Actions tab within your Collection Settings.

An Action is displayed in the UI only if:

  • it is set as "visible" (see screenshot below) AND

  • in non-development environments, the user's role must grant the "trigger" permission

You must make the Action visible there if you wish users to be able to see it in this Team.

Single, Global or Bulk. See for more detail

The callable called when the action is executed, with context and result builder as parameters. See and pages for more details.

A list of static fields to be input by the user or a function called with context as parameters which returns a list of fields. See page for more details.

here
form
result builder
Custom Action displayed in a Table View
Making the Action visible
context