[BUG] Display updated commands when they change

[heymartinadams]

Describe the bug
I have a list of commands that change based on user input. Example: filters.

In this example, when user clicks “Critical”:

It’s supposed to change the icon, and the text to read “Showing critical tasks”.

Currently this can only be achieved by adding a setTimeout(() => setOpen(index), 100) to the perform function. This causes the command menu to close and reopen quickly, and thus re-renders the commands correctly.

However, this clearly is an antipattern, and also doesn’t lead to a good UX. Is there a way you can re-render commands as they change?

To Reproduce
Steps to reproduce the behavior:

1. Create a command in a useEffect:

useEffect(() => {
    setCommandsFilter([
      {
        category: 'Task Priority',
        commands: [
          ...(!filterImportant || !filterTimeSensitive
            ? [
                {
                  icon: <RocketLaunchIconOutline />,
                  keywords: 'task, critical, urgent, important',
                  perform: () => {
                    setFilterImportant(true)

                    setFilterTimeSensitive(true)

                    setTimeout(() => setOpen(4), 100)
                  },
                  text: 'Critical'
                }
              ]
            : [
                {
                  icon: <RocketLaunchIconSolid />,
                  keywords: 'task, critical, urgent, important',
                  perform: () => {
                    setFilterImportant(null)

                    setFilterTimeSensitive(null)

                    setTimeout(() => setOpen(4), 100)
                  },
                  text: 'Showing critical tasks'
                }
              ])
        ]
      }
    ])
  }, [filterImportant, filterTimeSensitive])

And feed these into the <CommandMenu /> component:

<CommandMenu
  commands={menuFilterTasks}
  index={4}
  placeholder='Filter tasks...'
/>

Expected behavior
I expect the commands to rerender and display correctly as they get changed.

Desktop (please complete the following information):

• OS: macOS
• Browser: Chrome
• Version 1.4.32

[haaarshsingh]

For sure, I can look into this for you.