Webhook Displays [object Object] Instead of Custom Question

[MashdorDev]

Description

I'm currently using a webhook to send interview notifications to Discord. The webhook works as expected for default questions, but when I add a custom question, it does not display correctly and instead shows [object Object]. I tried to use the metadata but I can't really peak into it to retrieve the correct info I need

Webhook Payload

Here's an example of the webhook payload I'm sending:

{
	"content": "Hey <@199537112133926913> and <@1247356692136726611>, an interview has been {{triggerEvent}}!",
	"embeds": [
		{
			"title": "Interview to Astro with {{attendees.0.name}}",
			"fields": [
				{
					"name": "👤 Attendee Name",
					"value": "{{attendees.0.name}}",
					"inline": true
				},
				{
					"name": "📧 Attendee Email",
					"value": "{{attendees.0.email}}",
					"inline": true
				},
				{
					"name": "📜 Resume",
					"value": "[Resume Storage](https://storage.astrogamestudios.com/index.php/f/6954)"
				},
				{
					"name": "Is it for Co-Op | Metadata check?",
					"value": "{{metadata}}"
				},
				{
					"name": "📍 Location",
					"value": "Join The Call - [Link]({{metadata.videoCallUrl}})",
					"inline": false
				},
				{
					"name": "🔗 Booking Link",
					"value": "[View Booking](https://app.cal.com/booking/{{uid}})",
					"inline": true
				},
				{
					"name": "📅 Reschedule",
					"value": "[Click to Reschedule the Booking](https://app.cal.com/booking/{{rescheduleUid}})",
					"inline": true
				}
			],
			"color": 3066993,
			"timestamp": "{{createdAt}}"
		}
	]
}

Issue Details

• The webhook successfully sends all default questions and values.
• However, when I add a custom question, instead of displaying the actual response, Discord only shows [object Object].
• This suggests that the custom question data is being sent as an object instead of a string.

Expected Behavior

I expect the webhook to display the actual custom question's value instead of [object Object]. But I can't peak into it

Questions

1. How can I correctly format the custom question to appear as text in Discord?
2. Can properly extract and stringify the value before sending it to the webhook?

An image of how it looks on discord side

[dosubot[bot]]

Hey @MashdorDev! 👋 I'm here to help you with bugs, questions, and even becoming a contributor. Let's squash those bugs together!

To ensure your custom question appears as text in Discord instead of displaying as [object Object], you need to stringify the object before including it in the webhook payload. Here's how you can do it:

1. Stringify the Custom Question: Use a function like JSON.stringify or a custom safeStringify function to convert the custom question object into a string.

2. Modify the Webhook Payload: Update the payload to include the stringified custom question.

Here's an example of how you might modify your webhook payload:

// Assuming you have a custom question object
const customQuestion = { question: "Is it for Co-Op?", answer: "Yes" };

// Convert the custom question object to a string
const customQuestionString = JSON.stringify(customQuestion);

// Update your webhook payload
const webhookPayload = {
  "content": "Hey <@199537112133926913> and <@1247356692136726611>, an interview has been {{triggerEvent}}!",
  "embeds": [
    {
      "title": "Interview to Astro with {{attendees.0.name}}",
      "fields": [
        {
          "name": "👤 Attendee Name",
          "value": "{{attendees.0.name}}",
          "inline": true
        },
        {
          "name": "📧 Attendee Email",
          "value": "{{attendees.0.email}}",
          "inline": true
        },
        {
          "name": "📜 Resume",
          "value": "[Resume Storage](https://storage.astrogamestudios.com/index.php/f/6954)"
        },
        {
          "name": "Is it for Co-Op | Metadata check?",
          "value": customQuestionString // Use the stringified custom question here
        },
        {
          "name": "📍 Location",
          "value": "Join The Call - [Link]({{metadata.videoCallUrl}})",
          "inline": false
        },
        {
          "name": "🔗 Booking Link",
          "value": "[View Booking](https://app.cal.com/booking/{{uid}})",
          "inline": true
        },
        {
          "name": "📅 Reschedule",
          "value": "[Click to Reschedule the Booking](https://app.cal.com/booking/{{rescheduleUid}})",
          "inline": true
        }
      ],
      "color": 3066993,
      "timestamp": "{{createdAt}}"
    }
  ]
};

By stringifying the custom question, you ensure it is sent as a text string in the webhook payload, which Discord can display correctly ^[1].

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Bug Report | Other}

[MashdorDev]

Hey @dosu

I’m currently using the payload directly from the website to send it to Discord, so I don’t think I can modify it to include code like JSON.stringify before sending. Is there another way to ensure that the custom question appears correctly in Discord without manually modifying the payload?

[dosubot[bot]]

To ensure that the custom question appears correctly in Discord without manually modifying the payload, you can use the customTemplate function provided in the integrationTemplate.tsx file. This function automatically formats the payload for Discord webhooks using predefined templates. Here's how it works:

The customTemplate function determines the appropriate template based on the webhook URL:

const customTemplate = (props: WebhookIntegrationProps) => {
  const ind = supportedWebhookIntegrationList.findIndex((integration) => {
    return props.url.includes(integration);
  });
  return integrationTemplate(supportedWebhookIntegrationList[ind]) || "";
};

For Discord, the integrationTemplate function formats the payload to include fields like "Event Trigger", "What", "When", "Who", "Description", and "Where", ensuring that the custom question and other details appear correctly:

const integrationTemplate = (webhookIntegration: string) => {
  switch (webhookIntegration) {
    case "https://discord.com/api/webhooks/":
      return '{"content": "An event has been scheduled/updated","embeds": [{"color": 2697513,"fields": [{"name": "Event Trigger","value": "{{triggerEvent}}"}, {"name": "What","value": "{{title}} ({{type}})"},{"name": "When","value": "Start: {{startTime}} \\n End: {{endTime}} \\n Timezone: ({{organizer.timeZone}})"},{"name": "Who","value": "Organizer: {{organizer.name}} ({{organizer.email}}) \\n Booker: {{attendees.0.name}} ({{attendees.0.email}})" },{"name":"Description", "value":": {{description}}"},{"name":"Where","value":": {{location}} "}]}]}';
  }
};

By using this template, the payload is automatically formatted, ensuring that the custom question appears correctly in Discord ^[1].

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Bug Report | Other}