Support template variables in command menu item labels (#18707)

- Adds template variable interpolation (`${...}`) to command menu item
labels and short labels, enabling dynamic text like `Create new
${capitalize(objectMetadataItem.labelSingular)}` instead of static
`Create new record`.
- Supports `capitalize` and `lowercase` transform functions within
template expressions.

packages/twenty-front/src/modules/command-menu/components/CommandMenuButton.tsx

@@ -1,6 +1,6 @@
+import { getCommandMenuItemLabel } from '@/command-menu-item/utils/getCommandMenuItemLabel';
 import { styled } from '@linaria/react';
-import { i18n, type MessageDescriptor } from '@lingui/core';
-import { isString } from '@sniptt/guards';
+import { type MessageDescriptor } from '@lingui/core';
 import { type MouseEvent } from 'react';
 import { type Nullable } from 'twenty-shared/types';
 import { isDefined } from 'twenty-shared/utils';
@@ -20,7 +20,7 @@ const StyledWrapper = styled.div`
 export type CommandMenuButtonProps = {
   command: {
     key: string;
-    label: string | MessageDescriptor;
+    label: Nullable<string | MessageDescriptor>;
     shortLabel?: Nullable<string | MessageDescriptor>;
     Icon: IconComponent;
     isPrimaryCTA?: boolean;
@@ -30,22 +30,16 @@ export type CommandMenuButtonProps = {
   disabled?: boolean;
 };
 
-const getCommandMenuButtonLabel = (
-  label: string | MessageDescriptor,
-): string => {
-  return isString(label) ? label : i18n._(label);
-};
-
 export const CommandMenuButton = ({
   command,
   onClick,
   to,
   disabled = false,
 }: CommandMenuButtonProps) => {
-  const resolvedLabel = getCommandMenuButtonLabel(command.label);
+  const resolvedLabel = getCommandMenuItemLabel(command.label);
 
   const resolvedShortLabel = isDefined(command.shortLabel)
-    ? getCommandMenuButtonLabel(command.shortLabel)
+    ? getCommandMenuItemLabel(command.shortLabel)
     : undefined;
 
   const buttonAccent = command.isPrimaryCTA ? 'blue' : 'default';