Enviando um formulário com um tipo de campo de entidade (páginas, produtos...)

Neste exemplo, demonstramos como enviar um formulário que inclui um tipo de campo de entidade, como páginas ou produtos, usando a API OneEntry.

✅ Propósito do cenário:

• Obter a configuração do formulário da Plataforma OneEntry
• O usuário seleciona um dos elementos da entidade
• Enviar os dados coletados para a API OneEntry.

✅ O que você precisa:

• Uma PROJECT_URL e APP_TOKEN válidos para autenticação com a API OneEntry.
• Um formulário pré-configurado no OneEntry com um marcador (por exemplo, entidade) e campos incluindo um do tipo "entidade".
• Campos de formulário pré-configurados incluindo um do tipo "entidade".

📌 Importante:

• Estes exemplos não incluem tratamento de erros.
• Você pode gerenciar erros usando um bloco try-catch ou empregando uma construção como await Promise.catch((error) => error).

Cenário

1. Importar defineOneEntry do SDK e definir url e token

Exemplo:

import { defineOneEntry } from 'oneentry';

const PROJECT_URL = 'your-project-url';
const APP_TOKEN = 'your-app-token';

2. Criando um cliente API com a função defineOneEntry()

Exemplo:

const { Forms, FormData } = defineOneEntry(PROJECT_URL, {
  token: APP_TOKEN,
});

3. Recebemos os dados do formulário da Plataforma OneEntry para gerar um formulário no frontend com Forms.getFormByMarker()

Exemplo:

const formData = await Forms.getFormByMarker('entity');

Resultado:

{
  "id": 2,
  "attributeSetId": 1,
  "type": "data",
  "localizeInfos": {
    "title": "Entity",
    "titleForSite": "",
    "successMessage": "",
    "unsuccessMessage": "",
    "urlAddress": "",
    "database": "0",
    "script": "0"
  },
  "version": 17,
  "position": 1,
  "identifier": "entity",
  "processingType": "script",
  "templateId": null,
  "attributes": [
    {
      "type": "entity",
      "marker": "entity",
      "isLogin": null,
      "isSignUp": null,
      "position": 1,
      "settings": {},
      "isVisible": true,
      "listTitles": [
        {
          "id": 1,
          "depth": 0,
          "title": "Catalog",
          "parentId": null,
          "position": 1,
          "selected": true
        },
        {
          "id": 7,
          "depth": 0,
          "title": "Premium page",
          "parentId": null,
          "position": 2,
          "selected": true
        }
      ],
      "validators": {},
      "localizeInfos": {
        "title": "Entity"
      },
      "additionalFields": [],
      "isNotificationEmail": null,
      "isNotificationPhoneSMS": null,
      "isNotificationPhonePush": null
    }
  ],
  "moduleFormConfigs": [
    {
      "id": 1,
      "moduleIdentifier": "content",
      "isGlobal": false,
      "isClosed": false,
      "viewOnlyUserData": false,
      "commentOnlyUserData": false,
      "entityIdentifiers": [
        {
          "id": "services",
          "isNested": false
        }
      ]
    }
  ]
}

Obter configurações adicionais para o envio do formulário

Exemplo:

const moduleFormConfig = formData.moduleFormConfigs[0];

5. Selecione um dos elementos do atributo do tipo entidade e passe para o valor como um array de ids(números) para páginas ou array de strings para produtos

Exemplo:

[
  {
    "marker": "entity",
    "type": "entity",
    "value": [
      1
    ]
  }
]

6. Enviar dados do formulário com FormData.postFormsData()

Exemplo:

const response = FormData.postFormsData({
  formIdentifier: 'entity',
  formData: fieldsData,
  formModuleConfigId: moduleFormConfig.id,
  moduleEntityIdentifier:
    moduleFormConfig.entityIdentifiers[0].id,
  replayTo: null,
  status: 'sent',
});
console.log(response);

Resultado:

{
  "formData": {
    "formIdentifier": "entity",
    "time": "2025-12-02T19:08:18.617Z",
    "formData": [
      {
        "marker": "entity",
        "type": "entity",
        "value": [
          1
        ]
      }
    ],
    "entityIdentifier": "services",
    "fingerprint": "UQ_rrofe2",
    "isUserAdmin": false,
    "formModuleId": 1,
    "userIdentifier": null,
    "parentId": null,
    "id": 129
  },
  "actionMessage": ""
}

Exemplo final

// 1. Import defineOneEntry from SDK and define PROJECT_URL and APP_TOKEN
import { defineOneEntry } from 'oneentry';

const PROJECT_URL = 'your-project-url';
const APP_TOKEN = 'your-app-token';

// 2. Creating an API client:
const { Forms, FormData } = defineOneEntry(PROJECT_URL, {
  token: APP_TOKEN,
});

// 3. We receive form data from OneEntry Platform to generate a form on the frontend
const formData = await Forms.getFormByMarker('entity');

// 4. Get additional settings for the form submission
const moduleFormConfig = formData.moduleFormConfigs[0];

// 5. select one of the elements of the entity type attribute
const fieldsData = [
  {
    marker: 'entity',
    type: 'entity',
    value: [
      1,
    ],
  },
];

// 6. Post forms data with FormData.postFormsData()
let response = await FormData.postFormsData({
  formIdentifier: 'entity',
  formData: fieldsData,
  formModuleConfigId: moduleFormConfig.id,
  moduleEntityIdentifier:
    moduleFormConfig.entityIdentifiers[0].id,
  replayTo: null,
  status: 'sent',
});
// console.log(response);