discord.js - Imagine an app•2y ago

autocomplete slash commands matching feature.

When a user uses slash commands and there are options that are given but they can also search for options. Discord ui shows 'matching'. it basically searchs the data and gives u ones that match the search. how would u do this with autocomplete interactions though? imagine u have an array of 70 options. regular slash commands does not allow you to have that many so you would have to use autocomplete slash commands so how would u create a "matching" feature just like this one that regular slash commands offer

33 Replies

d.js docs•2y ago

• What's your exact discord.js npm list discord.js and node node -v version? • Post the full error stack trace, not just the top part! • Show your code! • Explain what exactly your issue is. • Not a discord.js issue? Check out guide

Interactions: Autocomplete read more mdn

String.prototype.includes() The includes() method performs a case-sensitive search to determine whether one string may be found within another string, returning true or false as appropriate.

Unknown User•2y ago

Message Not Public

d.js docs•2y ago

Array.prototype.filter() The filter() method creates a shallow copy of a portion of a given array, filtered down to just the elements from the given array that pass the test implemented by the provided function.

Creeper•2y ago

But for the one discord validates they r just using string.includes() ?

Unknown User•2y ago

Message Not Public

d.js docs•2y ago

AutocompleteInteraction (extends Interaction) Represents an autocomplete interaction.

Creeper•2y ago

I mean in regular string options. The one in my screen shot. When u type in values it's just filtering from the array the developer passed with .includes() ? Actually this makes sense ty.

Unknown User•2y ago

Message Not Public

Creeper•2y ago

Can u provide a description on a autocomplete field like a regular one?

Unknown User•2y ago

Message Not Public

Seren_Modz 21•2y ago

getFocused() is better

Creeper•2y ago

What does that method return instead

d.js docs•2y ago

CommandInteractionOptionResolver#getSubcommand() Gets the selected subcommand.

Seren_Modz 21•2y ago

getFocused() without options returns a string or number, it just depends on the option type

// get the focused option (string or number)
const focused = interaction.options.getFocused();
const results = ["hello", "world"]
  // filter the results to only match what the user types
  .filter(str => str.includes(focused))
  // map to results so the interaction can be responded to
  .map(str => ({ name: str, value: str })) // map the results
  // slice the first 25 results because discord only allows 25 results at once
  .slice(0, 25);

// respond to the interaction
return interaction.respond(results);

// get the focused option (string or number)
const focused = interaction.options.getFocused();
const results = ["hello", "world"]
  // filter the results to only match what the user types
  .filter(str => str.includes(focused))
  // map to results so the interaction can be responded to
  .map(str => ({ name: str, value: str })) // map the results
  // slice the first 25 results because discord only allows 25 results at once
  .slice(0, 25);

// respond to the interaction
return interaction.respond(results);

here is an example

Creeper•2y ago

But why that instead of .getString()

Seren_Modz 21•2y ago

because it will get the option that has the autocomplete option, it's not nullable, u don't have to provide the option id and is recommended in the djs guide https://discordjs.guide/interactions/autocomplete.html#enabling-autocomplete

discord.js Guide

Imagine a guide... that explores the many possibilities for your discord.js bot.

Seren_Modz 21•2y ago

getFocused() will default to an empty string

Creeper•2y ago

What if there are multiple autocomplete fields

Seren_Modz 21•2y ago

getFocused(true) which will return the option object (ApplicationCommandOptionChoice), where u can then condition the option name

d.js docs•2y ago

ApplicationCommandOptionChoice A choice for an application command option.

Creeper•2y ago

Also what's the option name max length because imagine one of the fields is very long and app crashes

Seren_Modz 21•2y ago

https://discord.com/developers/docs/interactions/application-commands#application-command-object-application-command-option-structure

Discord Developer Portal

Discord Developer Portal — API Docs for Bots and Developers

Integrate your service with Discord — whether it's a bot or a game or whatever your wildest imagination can come up with.

Seren_Modz 21•2y ago

an option name can be 1-32 characters long

Creeper•2y ago

So u would also trim off the string here if u got all the data from a DB or something

Seren_Modz 21•2y ago

oops, i ran the command with getSubcommand() instead of getFocused()

Seren_Modz 21•2y ago

i recommend u take a look at https://discordjs.guide/interactions/autocomplete.html#handling-multiple-autocomplete-options

discord.js Guide

Imagine a guide... that explores the many possibilities for your discord.js bot.

Creeper•2y ago

Would it crash if string is too long or be automatically cut off by discord? And also is there a way to pass a default option so as soon as user clicks on the autocomplete option it suggests some top results that others r searching or whatever

Seren_Modz 21•2y ago

if ur filtering an array with string includes, it'll show results without typing anything because string#includes() returns true on an empty string (eg. "hello".includes("") returns true) if the option name was longer than 32 characters, djs would throw an error when registering the command

Creeper•2y ago

That's true ty Is it possible to get other fields through autocomplete Like let's say user puts a certain option as someone can we access that option when they r searching in the autocomplete field So they don't actually have to send it for it to be accessible? All they have to do is type something in an autocomplete field Ty This works just like discords but it doesn't actually sort the array correctly which is what I want to do Using the same condition for the filter?

Unknown User•2y ago

Message Not Public

d.js docs•2y ago

String.prototype.localeCompare() The localeCompare() method returns a number indicating whether a reference string comes before, or after, or is the same as the given string in sort order. In implementations with Intl.Collator API support, this method simply calls Intl.Collator.

Creeper•2y ago

yes but i need to sort it to the query of the user. so im not sure how to sort it by the closest results

Unknown User•2y ago

Message Not Public

Gaming

Programming

autocomplete slash commands matching feature.