External component events

The following events are available:

• Entity events:

  Event	Description	Event Data
  ENTITY_UPDATED	Fired when the entity (id) is updated.	Entity object
  ENTITY_CREATED	Fired when an entity is created.	Entity object
  ENTITY_SAVED	Fired when the entity (id) is saved.	Entity object
  ENTITY_REFRESHED	Fired when the entity (id) is refreshed.	Entity object
  ENTITY_DELETED	Fired when the entity (id) is deleted.	Entity object
  ENTITY_CHANGED	Fired when the memberName is changed on the entity (id).	Member value
  SEARCH_FINISHED	Fired when a search is completed.

• Realtime events:

  Event	Description	Event Data
  realtime (notificationType)	Fired when a real-time notification is received	notification parameters

The following data is passed to the events:

ENTITY_CREATED: {
    definitionName: string;
    id?: number;
    modified?: Date;
    stopPropagation?: boolean;
};

ENTITY_DELETED: {
    definitionName: string;
    id?: number;
};

ENTITY_SAVED: {
    id: number;
    definitionName: string;
    modified?: Date;
};

ENTITY_REFRESHED: {
    id: number;
    modified: Date;
};

ENTITY_UPDATED: {
    id: number;
    definitionName?: string;
    modified: Date;
};

ENTITY_CHANGED: {
    id: number;
    type: "systemProperty | property | relation";
    memberName: string;
    value: unknown;
};

SEARCH_FINISHED: {
    searchIdentifier: string;
    fullText: string;
    filters: Array<FieldFilterResponseResource>;
    ids: Array<number>;
}

Entity created event

To subscribe to the ENTITY_CREATED event, use the following code:

const onEntitySaved = (evt: Event): void => {
    const { definitionName, id } = (evt as CustomEvent<{ definitionName: string; id: number }>).detail;

    alert(`Entity with id ${id} and definition ${definitionName} was saved`);
};

window.addEventListener("ENTITY_SAVED", onEntitySaved);

Entity changed event

The data received from the ENTITY_CHANGED event changed depending on the data type that has changed.

If a system property changes, the following is received:

{
  id: number;
  type: "systemProperty",
  memberName: string;
  value: unknown;
}

If a normal property changes, the following is received:

{
  id: number;
  type: "property",
  memberName: string;
  value: unknown;
}

If a relation with the allow_navigation enabled changes, the following is received:

{
  id: number;
  type: "relation",
  memberName: string;
  value: Array<number>;
  allowNavigation: true;
  role?: "Parent" | "Child" | undefined;
}

If a relation with the allow_navigation disabled changes, the following is received:

{
  id: number;
  type: "relation",
  memberName: string;
  allowNavigation: false;
  role?: "Parent" | "Child" | undefined;
}

Search finished event

When monitoring the SEARCH_FINISHED event, make sure that you use the getEventSearchIdentifier method to compare the searchIdentifier with the one from the event.

Example:

 const onSearchFinished = (evt: Event): void => {
      const {
        filters,
        searchIdentifier: eventSearchIdentifier, // We rename the property to eventSearchIdentifier.
        fullText,
      } = (
        evt as CustomEvent<{
          searchIdentifier: string;
          fullText: string;
          filters: Array<FieldFilterResponseResource>;
          ids: Array<number>;
        }>
      ).detail;

      // We check if the searchIdentifier on the event is the one we are interested in.
      if (
        eventSearchIdentifier === getEventSearchIdentifier(searchIdentifier)
      ) {
        setAppliedSearchFilters(filters);
        setFullTextFilterValue(fullText);
      }
    };

    window.addEventListener("SEARCH_FINISHED", onSearchFinished);