refactor: Rename ownerMachine to groupId in Command (#3010)

* refactor: Rename ownerMachine to groupId in Command

Commands don't need to be part of a state machine.

* Fix formatting

src/Toolbar.tsx

@@ -114,7 +114,7 @@ export function Toolbar({
     () =>
       commandBarSend({
         type: 'Find and select command',
-        data: { name: 'Extrude', ownerMachine: 'modeling' },
+        data: { name: 'Extrude', groupId: 'modeling' },
       }),
     { enabled: !disableAllButtons, scopes: ['modeling'] }
   )
@@ -378,7 +378,7 @@ export function Toolbar({
               onClick={() =>
                 commandBarSend({
                   type: 'Find and select command',
-                  data: { name: 'Extrude', ownerMachine: 'modeling' },
+                  data: { name: 'Extrude', groupId: 'modeling' },
                 })
               }
               disabled={!state.can('Extrude') || disableAllButtons}

src/components/ProjectSidebarMenu.tsx

@@ -82,11 +82,11 @@ function ProjectMenuPopover({
 }) {
   const { commandBarState, commandBarSend } = useCommandsContext()
   const { onProjectClose } = useLspContext()
-  const exportCommandInfo = { name: 'Export', ownerMachine: 'modeling' }
+  const exportCommandInfo = { name: 'Export', groupId: 'modeling' }
-  const findCommand = (obj: { name: string; ownerMachine: string }) =>
+  const findCommand = (obj: { name: string; groupId: string }) =>
     Boolean(
       commandBarState.context.commands.find(
-        (c) => c.name === obj.name && c.ownerMachine === obj.ownerMachine
+        (c) => c.name === obj.name && c.groupId === obj.groupId
       )
     )
 

src/hooks/useStateMachineCommands.ts

@@ -60,7 +60,8 @@ export default function useStateMachineCommands<
       .filter((e) => !['done.', 'error.'].some((n) => e.includes(n)))
       .map((type) =>
         createMachineCommand<T, S>({
-          ownerMachine: machineId,
+          // The group is the owner machine's ID.
+          groupId: machineId,
           type,
           state,
           send,

src/lib/commandBarConfigs/settingsCommandConfig.ts

@@ -124,7 +124,7 @@ export function createSettingsCommand({
     displayName: `Settings · ${decamelize(type.replaceAll('.', ' · '), {
       separator: ' ',
     })}`,
-    ownerMachine: 'settings',
+    groupId: 'settings',
     icon: 'settings',
     needsReview: false,
     onSubmit: (data) => {

src/lib/commandTypes.ts

@@ -65,7 +65,7 @@ export type Command<
   CommandSchema extends CommandSetSchema<T>[CommandName] = CommandSetSchema<T>[CommandName]
 > = {
   name: CommandName
-  ownerMachine: T['id']
+  groupId: T['id']
   needsReview: boolean
   onSubmit: (data?: CommandSchema) => void
   onCancel?: () => void
@@ -84,7 +84,7 @@ export type CommandConfig<
   CommandSchema extends CommandSetSchema<T>[CommandName] = CommandSetSchema<T>[CommandName]
 > = Omit<
   Command<T, CommandName, CommandSchema>,
-  'name' | 'ownerMachine' | 'onSubmit' | 'onCancel' | 'args' | 'needsReview'
+  'name' | 'groupId' | 'onSubmit' | 'onCancel' | 'args' | 'needsReview'
 > & {
   needsReview?: true
   args?: {

src/lib/createMachineCommand.ts

@@ -20,7 +20,7 @@ interface CreateMachineCommandProps<
   S extends CommandSetSchema<T>
 > {
   type: EventFrom<T>['type']
-  ownerMachine: T['id']
+  groupId: T['id']
   state: StateFrom<T>
   send: Function
   actor: InterpreterFrom<T>
@@ -34,7 +34,7 @@ export function createMachineCommand<
   T extends AnyStateMachine,
   S extends CommandSetSchema<T>
 >({
-  ownerMachine,
+  groupId,
   type,
   state,
   send,
@@ -62,7 +62,7 @@ export function createMachineCommand<
 
   const command: Command<T, typeof type, S[typeof type]> = {
     name: type,
-    ownerMachine: ownerMachine,
+    groupId,
     icon,
     needsReview: commandConfig.needsReview || false,
     onSubmit: (data?: S[typeof type]) => {

src/machines/commandBarMachine.ts

@@ -57,7 +57,7 @@ export type CommandBarMachineEvent =
     }
   | {
       type: 'Find and select command'
-      data: { name: string; ownerMachine: string }
+      data: { name: string; groupId: string }
     }
   | {
       type: 'Change current argument'
@@ -120,9 +120,7 @@ export const commandBarMachine = createMachine(
                   context.commands.filter(
                     (c) =>
                       !event.data.commands.some(
-                        (c2) =>
+                        (c2) => c2.name === c.name && c2.groupId === c.groupId
-                          c2.name === c.name &&
-                          c2.ownerMachine === c.ownerMachine
                       )
                   ),
               }),
@@ -393,9 +391,7 @@ export const commandBarMachine = createMachine(
         selectedCommand: (c, e) => {
           if (e.type !== 'Find and select command') return c.selectedCommand
           const found = c.commands.find(
-            (cmd) =>
+            (cmd) => cmd.name === e.data.name && cmd.groupId === e.data.groupId
-              cmd.name === e.data.name &&
-              cmd.ownerMachine === e.data.ownerMachine
           )
 
           return !!found ? found : c.selectedCommand
@@ -514,7 +510,7 @@ export const commandBarMachine = createMachine(
 )
 
 function sortCommands(a: Command, b: Command) {
-  if (b.ownerMachine === 'auth') return -1
+  if (b.groupId === 'auth') return -1
-  if (a.ownerMachine === 'auth') return 1
+  if (a.groupId === 'auth') return 1
   return a.name.localeCompare(b.name)
 }