DIA
discord.js - Imagine an app•2d ago
#ToiYeuSweetLiquor <3

Problem with Action Row

I have a problem with building new ActionRowBuilders from existed message. I am creating a tool for user to customize message, button, etc... First, I fetch a message via user provided url. Then I create an array of ActionRowBuilders from message.components value (as code below). 
let actionRows: (ActionRowBuilder<ButtonBuilder | StringSelectMenuBuilder> | undefined)[] =
  message.components?.map((row) =>
    new ActionRowBuilder(
      'toJson' in row && typeof row.toJson == "function"
        ? row.toJson()
         : row
    )
  ) || [];
let actionRows: (ActionRowBuilder<ButtonBuilder | StringSelectMenuBuilder> | undefined)[] =
  message.components?.map((row) =>
    new ActionRowBuilder(
      'toJson' in row && typeof row.toJson == "function"
        ? row.toJson()
         : row
    )
  ) || [];
After letting the user edit, I will send the sample message to the user for confirmation. When I send the confirmation message an error occurs: 
RangeError: Non-premium buttons must have a label and/or an emoji.
RangeError: Non-premium buttons must have a label and/or an emoji.
After some testing, I noticed that when a button is fetched from a message that contains no emoji, just text, there is no label field, only an emoji field (emoji: null). Instead, the text field is stored in the data value. Like in this case, the button with emoji will have a corresponding emoji field but the button with text only will not have a label field. 
ActionRowBuilder {
    data: {
      type: 1,
      data: {
        type: 1,
        id: 7,
      },
    },
    components: [
      ButtonBuilder {
        data: {
          type: 2,
          data: {
            type: 2,
            id: 8,
            custom_id: "automations.button.1330764948477059072",
            style: 2,
            emoji: {
              id: "1330747710399189052",
              name: "zMw_doremi",
            },
          },
          emoji: {
            id: "1330747710399189052",
            name: "zMw_doremi",
          },
          custom_id: "Automation:4b22a1cb-36c6-459b-86b2-f92abb099712",
        },
        setEmoji: [Function: setEmoji],
        setStyle: [Function: setStyle],
        setURL: [Function: setURL],
        setCustomId: [Function: setCustomId],
        setSKUId: [Function: setSKUId],
        setDisabled: [Function: setDisabled],
        setLabel: [Function: setLabel],
        toJSON: [Function: toJSON],
      }, ButtonBuilder {
        data: {
          type: 2,
          data: {
            type: 2,
            id: 9,
            custom_id: "automations.button.1330764948514799616",
            style: 4,
            label: "Clear Drm",
          },
          emoji: null,
          custom_id: "Automation:32d13ccb-8634-46d2-a677-67c8e2a06fbc",
        },
        setEmoji: [Function: setEmoji],
        setStyle: [Function: setStyle],
        setURL: [Function: setURL],
        setCustomId: [Function: setCustomId],
        setSKUId: [Function: setSKUId],
        setDisabled: [Function: setDisabled],
        setLabel: [Function: setLabel],
        toJSON: [Function: toJSON],
      }
    ],
    addComponents: [Function: addComponents],
    setComponents: [Function: setComponents],
    toJSON: [Function: toJSON],
  }
ActionRowBuilder {
    data: {
      type: 1,
      data: {
        type: 1,
        id: 7,
      },
    },
    components: [
      ButtonBuilder {
        data: {
          type: 2,
          data: {
            type: 2,
            id: 8,
            custom_id: "automations.button.1330764948477059072",
            style: 2,
            emoji: {
              id: "1330747710399189052",
              name: "zMw_doremi",
            },
          },
          emoji: {
            id: "1330747710399189052",
            name: "zMw_doremi",
          },
          custom_id: "Automation:4b22a1cb-36c6-459b-86b2-f92abb099712",
        },
        setEmoji: [Function: setEmoji],
        setStyle: [Function: setStyle],
        setURL: [Function: setURL],
        setCustomId: [Function: setCustomId],
        setSKUId: [Function: setSKUId],
        setDisabled: [Function: setDisabled],
        setLabel: [Function: setLabel],
        toJSON: [Function: toJSON],
      }, ButtonBuilder {
        data: {
          type: 2,
          data: {
            type: 2,
            id: 9,
            custom_id: "automations.button.1330764948514799616",
            style: 4,
            label: "Clear Drm",
          },
          emoji: null,
          custom_id: "Automation:32d13ccb-8634-46d2-a677-67c8e2a06fbc",
        },
        setEmoji: [Function: setEmoji],
        setStyle: [Function: setStyle],
        setURL: [Function: setURL],
        setCustomId: [Function: setCustomId],
        setSKUId: [Function: setSKUId],
        setDisabled: [Function: setDisabled],
        setLabel: [Function: setLabel],
        toJSON: [Function: toJSON],
      }
    ],
    addComponents: [Function: addComponents],
    setComponents: [Function: setComponents],
    toJSON: [Function: toJSON],
  }
So is there any way to fix this error? Version: * Discord.JS: [email protected] * Bun: docker image oven/bun:alpine P/s: I'm sorry if I confused you because my English is quite bad ;-;
No description
3 Replies
d.js toolkit
d.js toolkit•2d ago
- What's your exact discord.js npm list discord.js and node node -v version? - Not a discord.js issue? Check out #other-js-ts. - Consider reading #how-to-get-help to improve your question! - Explain what exactly your issue is. - Post the full error stack trace, not just the top part! - Show your code! - Issue solved? Press the button! - ✅ Marked as resolved by OP
d.js docs
d.js docs•2d ago
:method: (static) ActionRowBuilder#from() [email protected] Creates a new action row builder from JSON data Structures from the API cannot be edited directly. To do so, you can create a new structure (a builder) using the .from() method 
const newEmbed = EmbedBuilder.from(embed).setTitle("title")
const newRow = ActionRowBuilder.from(row).addComponents(component)
const newEmbed = EmbedBuilder.from(embed).setTitle("title")
const newRow = ActionRowBuilder.from(row).addComponents(component)
#ToiYeuSweetLiquor <3
#ToiYeuSweetLiquor <3OP•2d ago
It works. Thanks for the quick support :luv:

Did you find this page helpful?