Updating an ephemeral message causes "Unknown Message" API error

[tomli380576]

Hi! I'm trying to use reacord for ephemeral messages but whenever an interaction is received and reacord tries to update the message, it always causes an Unknown Message api error.

To recreate this:

import { Client, Events, GatewayIntentBits } from "discord.js";
import { ReacordDiscordJs, Button } from "reacord";
import * as React from "react";

function Clicker(): JSX.Element {
  const [count, setCount] = React.useState(0);
  return (
    <>
      Clicked {count} times!
      <Button onClick={() => setCount(count + 1)} label="click" />
    </>
  );
}

const TOKEN = ""; // bot token here

const client: Client<true> = new Client({
  intents: [
    GatewayIntentBits.Guilds,
    GatewayIntentBits.GuildMessages
  ],
});
const reacord = new ReacordDiscordJs(client);

client.on(Events.InteractionCreate, (interaction) => {
  if (!interaction.isChatInputCommand()) {
    return;
  }
  reacord
    .createInteractionReply(interaction, { ephemeral: true })
    .render(<Clicker />);
});

client.once(Events.ClientReady, async () => {
  console.log("Ready!");
  client.application?.commands.create({
    name: "ping",
    description: "pong!",
  });
});

client
  .login(TOKEN)
  .then(() => console.log(`Logged in as ${client.user.username}!`))
  .catch((err: Error) => {
    console.error("Login Unsuccessful. Check the credentials.");
    throw err;
  });

Once the bot is ready, run the /ping command and click the click button. The error that comes back is:

DiscordAPIError[10008]: Unknown Message
   ...stack traces here
   requestBody: {
    files: [],
    json: {
      content: 'Clicked 1 times!',
      tts: false,
      nonce: undefined,
      embeds: [],
      components: [Array],
      username: undefined,
      avatar_url: undefined,
      allowed_mentions: undefined,
      flags: 64,
      message_reference: undefined,
      attachments: undefined,
      sticker_ids: undefined,
      thread_name: undefined
    }
  },
  rawError: { message: 'Unknown Message', code: 10008 },
  code: 10008,
  status: 404,
  method: 'PATCH',
  url:'request url here'
}

Please let me know what I did wrong here. Thanks!

[tomli380576]

So I dug around the code base a bit and it seems like reacord is handling the message update first with message.edit then calls the interaction handler. But in the updateMessage method this.componentInteraction is always undefined hence the interaction.update method was never called. Maybe this could be the cause?

[itsMapleLeaf]

Thanks for the additional info! If it hasn't been figured out already, I'll look into this when I have the time

[Inbestigator]

IIRC Discord doesn’t let you update ephemeral messages outside of the original interaction response