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-item/server-items/hooks/useCommandMenuItemsFromBackend.tsx

@@ -16,6 +16,7 @@ import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomState
 import { type CommandMenuContextApi } from 'twenty-shared/types';
 import {
   evaluateConditionalAvailabilityExpression,
+  interpolateCommandMenuItemLabel,
   isDefined,
 } from 'twenty-shared/utils';
 import { type IconComponent, useIcons } from 'twenty-ui/display';
@@ -73,7 +74,15 @@ const buildCommandMenuItemFromFrontComponent = ({
   mountContext,
   commandMenuContextApi,
 }: BuildCommandMenuItemFromFrontComponentParams) => {
-  const displayLabel = item.label;
+  const displayLabel = interpolateCommandMenuItemLabel({
+    label: item.label,
+    context: commandMenuContextApi,
+  });
+
+  const displayShortLabel = interpolateCommandMenuItemLabel({
+    label: item.shortLabel,
+    context: commandMenuContextApi,
+  });
 
   const Icon = getIcon(item.icon, COMMAND_MENU_DEFAULT_ICON);
 
@@ -85,7 +94,7 @@ const buildCommandMenuItemFromFrontComponent = ({
     } else {
       openFrontComponentInSidePanel({
         frontComponentId: item.frontComponentId,
-        pageTitle: displayLabel,
+        pageTitle: displayLabel ?? '',
         pageIcon: Icon,
         recordContext: isDefined(mountContext)
           ? {
@@ -102,7 +111,7 @@ const buildCommandMenuItemFromFrontComponent = ({
     key: `command-menu-item-front-component-${item.id}`,
     scope,
     label: displayLabel,
-    shortLabel: item.shortLabel,
+    shortLabel: displayShortLabel,
     position: item.position,
     isPinned,
     Icon,
@@ -160,8 +169,14 @@ const buildCommandItemFromEngineKey = ({
     type,
     key: `command-menu-item-engine-${item.id}`,
     scope,
-    label: item.label,
-    shortLabel: item.shortLabel,
+    label: interpolateCommandMenuItemLabel({
+      label: item.label,
+      context: commandMenuContextApi,
+    }),
+    shortLabel: interpolateCommandMenuItemLabel({
+      label: item.shortLabel,
+      context: commandMenuContextApi,
+    }),
     position: item.position,
     isPinned,
     Icon,