Correctly show new badge in Elements panel and subgrid subitems

Before, the new badge wouldn't show up in the Elements panel, as we
passed it in as the wrong argument. Also, for subgrid items we
would show the grid and not the subgrid prompts, as a subgrid is also
a grid.

Fixed: 438129920
Change-Id: I0a5122a6d819360ce8e28c745f2cfc7fbbaed704
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6839780
Auto-Submit: Kim-Anh Tran <[email protected]>
Reviewed-by: Kateryna Prokopenko <[email protected]>
Commit-Queue: Kim-Anh Tran <[email protected]>

Author: ktran

front_end/panels/elements/ElementsTreeElement.test.ts

@@ -199,8 +199,8 @@ describeWithMockConnection('ElementsTreeElement ', () => {
   });
 
   it('shows subgrid submenu items', async () => {
-    const contextMenu =
-        await getContextMenuForElementWithLayoutProperties({...DEFAULT_LAYOUT_PROPERTIES, isSubgrid: true});
+    const contextMenu = await getContextMenuForElementWithLayoutProperties(
+        {...DEFAULT_LAYOUT_PROPERTIES, isGrid: true, isSubgrid: true});
     const debugWithAiItem = contextMenu.buildDescriptor().subItems?.find(item => item.label === 'Debug with AI');
     assert.exists(debugWithAiItem);
     assert.deepEqual(

front_end/panels/elements/ElementsTreeElement.ts

@@ -916,7 +916,7 @@ export class ElementsTreeElement extends UI.TreeOutline.TreeElement {
         const action = UI.ActionRegistry.ActionRegistry.instance().getAction(openAiAssistanceId);
         // Register new badge under the `devToolsAiSubmenuPrompts` feature, as the freestyler one is already used in ViewManager.
         const submenu = contextMenu.footerSection().appendSubMenuItem(
-            action.title(), false, Root.Runtime.hostConfig.devToolsAiSubmenuPrompts?.featureName);
+            action.title(), false, openAiAssistanceId, Root.Runtime.hostConfig.devToolsAiSubmenuPrompts?.featureName);
         submenu.defaultSection().appendAction(openAiAssistanceId, i18nString(UIStrings.startAChat));
 
         const submenuConfigs = [
@@ -941,7 +941,8 @@ export class ElementsTreeElement extends UI.TreeOutline.TreeElement {
             ],
           },
           {
-            condition: (props: SDK.CSSModel.LayoutProperties|null): boolean => Boolean(props?.isGrid),
+            condition: (props: SDK.CSSModel.LayoutProperties|null): boolean =>
+                Boolean(props?.isGrid && !props?.isSubgrid),
             items: [
               {
                 label: i18nString(UIStrings.alignItems),