This tutorial will guide you through the process of creating trigger for a Gelato hub that fetches new icecream flavor.

​
Trigger Definition

To create trigger run the following command, 
npm run cli triggers create
  1. Hub Folder Name: This is the name associated with the folder where the trigger resides. It helps organize and categorize triggers within the hub.
  2. Trigger Display Name: The name users see in the interface, conveying the trigger’s purpose clearly.
  3. Trigger Description: A brief, informative text in the UI, guiding users about the trigger’s function and purpose.
  4. Trigger Technique: Specifies the trigger type - either polling or webhook.
Example: 
npm run cli triggers create

? Enter the hub folder name : gelato
? Enter the trigger display name : new flavor created
? Enter the trigger description : triggers when a new icecream flavor is created.
? Select the trigger technique: polling
This will create a new TypeScript file at packages/hubs/community/gelato/src/lib/triggers named new-flavor-created.ts. Inside this file, paste the following code: 
import { gelatoAuth } from '../../';
import {
  DedupeStrategy,
  HttpMethod,
  HttpRequest,
  Polling,
  httpClient,
  pollingHelper,
} from '@flo/hubs-common';
import {
  HubPropValueSchema,
  TriggerStrategy,
  createTrigger,
} from '@flo/hubs-framework';
import dayjs from 'dayjs';

const polling: Polling<
  HubPropValueSchema<typeof gelatoAuth>,
  Record<string, never>
> = {
  strategy: DedupeStrategy.TIMEBASED,
  items: async ({ auth, propsValue, lastFetchEpochMS }) => {
    const request: HttpRequest = {
      method: HttpMethod.GET,
      url: 'https://cloud.flo.andaihub.ai/api/v1/webhooks/aHlEaNLc6vcF1nY2XJ2ed/sync',
      headers: {
        authorization: auth,
      },
    };
    const res = await httpClient.sendRequest(request);
    return res.body['flavors'].map((flavor: string) => ({
      epochMilliSeconds: dayjs().valueOf(),
      data: flavor,
    }));
  },
};

export const newFlavorCreated = createTrigger({
  auth: gelatoAuth,
  name: 'newFlavorCreated',
  displayName: 'new flavor created',
  description: 'triggers when a new icecream flavor is created.',
  props: {},
  sampleData: {},
  type: TriggerStrategy.POLLING,
  async test(context) {
    return await pollingHelper.test(polling, context);
  },
  async onEnable(context) {
    const { store, auth, propsValue } = context;
    await pollingHelper.onEnable(polling, { store, auth, propsValue });
  },

  async onDisable(context) {
    const { store, auth, propsValue } = context;
    await pollingHelper.onDisable(polling, { store, auth, propsValue });
  },

  async run(context) {
    return await pollingHelper.poll(polling, context);
  },
});
The way polling triggers usually work is as follows: Run:The run method executes every 5 minutes, fetching data from the endpoint within a specified timestamp range or continuing until it identifies the last item ID. It then returns the new items as an array. In this example, the httpClient.sendRequest method is utilized to retrieve new flavors, which are subsequently stored in the store along with a timestamp.

​
Expose The Definition

To make the trigger readable by FLO, add it to the array of triggers in the hub definition. 
import { createHub } from '@flo/hubs-framework';
import { getIcecreamFlavor } from './lib/actions/get-icecream-flavor';
// Don't forget to add the following import.
import { newFlavorCreated } from './lib/triggers/new-flavor-created';

export const gelato = createHub({
  displayName: 'Gelato Tutorial',
  logoUrl: 'https://cdn.andaihub.ai/flo/hubs/gelato.png',
  authors: [],
  auth: gelatoAuth,
  actions: [getIcecreamFlavor],
  // Add the trigger here.
  triggers: [newFlavorCreated], // <--------
});

​
Testing

By default, the development setup only builds specific components. Open the file packages/server/api/.env and include “gelato” in the FLO_DEV_HUBS. For more details, check out the Hub Development section. Once you edit the environment variable, restart the backend. The hub will be rebuilt. After this process, you’ll need to refresh the frontend to see the changes. To test the trigger, use the load sample data from flow builder in FLO. It should function as shown in the screenshot. Gelato Action