UN-3234 [FIX] Added beta tag to agentic prompt studio#1794
Conversation
Deepak-Kesavan
requested review from
athul-rs,
harini-venkataraman,
jagadeeswaran-zipstack and
vishnuszipstack
Summary by CodeRabbit
WalkthroughAdds a blue BETA tag next to the Agentic Prompt Studio entry in the side navigation and two CSS helpers for title layout and badge spacing; JSX imports antd Tag and wraps the menu item title with the badge. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes 🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx (1)
339-361:⚠️ Potential issue | 🟡 MinorCollapsed sidebar tooltip will render the BETA tag inside it.
When the sidebar is collapsed,
el.titleis used as the Tooltip content (Line 462). For the agentic item,titleis now a JSX fragment containing both the text and the<Tag>. This means the tooltip will render "Agentic Prompt Studio" with a styled BETA badge crammed inside it, which likely isn't the intended UX.Consider keeping the original string title for tooltip use and only rendering the JSX version in the expanded sidebar.
Proposed fix
const agenticMenuItem = { id: 1.2, title: "Agentic Prompt Studio", description: "Build and manage AI-powered extraction workflows", image: CustomTools, path: `/${orgName}/agentic-prompt-studio`, active: globalThis.location.pathname.startsWith( `/${orgName}/agentic-prompt-studio` ), + isBeta: true, }; - - // Add beta tag to title - agenticMenuItem.title = ( - <> - {agenticMenuItem.title} - <Tag color="blue" className="sidebar-beta-tag"> - BETA - </Tag> - </> - ); data[0]?.subMenu?.splice(1, 0, agenticMenuItem);Then in the rendering section (around Line 481), render the tag conditionally:
<Typography className="sidebar-item-text fs-14 sidebar-title-row"> {el.title} {el.isBeta && ( <Tag color="blue" className="sidebar-beta-tag"> BETA </Tag> )} </Typography>This keeps
el.titleas a plain string for tooltip display while showing the badge only in the expanded sidebar.
🧹 Nitpick comments (1)
frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx (1)
481-483:sidebar-title-rowapplied to all menu items, not just the one with a badge.The
sidebar-title-rowclass (which setsdisplay: flex; align-items: center) is now on every menu item's title Typography. It's harmless for plain-text items but unnecessary — and if you adopt theisBetaflag approach above, you could scope this class conditionally to only items that need the flex layout.
…o-navigation-item
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx (1)
343-366:⚠️ Potential issue | 🟠 MajorMake Agentic menu insertion idempotent to avoid duplicate entries.
At Line 365,
spliceruns on each render. Ifdata[0].subMenuis backed by persistent menu state (plugin hook), the "Agentic Prompt Studio" item can be inserted multiple times.💡 Proposed fix
if (agenticPromptStudioEnabled && isUnstract) { + const agenticPath = `/${orgName}/agentic-prompt-studio`; const agenticMenuItem = { id: 1.2, title: "Agentic Prompt Studio", description: "Build and manage AI-powered extraction workflows", image: CustomTools, - path: `/${orgName}/agentic-prompt-studio`, + path: agenticPath, active: globalThis.location.pathname.startsWith( - `/${orgName}/agentic-prompt-studio`, + agenticPath, ), }; // Add beta tag to title agenticMenuItem.title = ( <> {agenticMenuItem.title} <Tag color="blue" className="sidebar-beta-tag"> BETA </Tag> </> ); - data[0]?.subMenu?.splice(1, 0, agenticMenuItem); + const buildSubMenu = data[0]?.subMenu; + const alreadyExists = buildSubMenu?.some((item) => item.path === agenticPath); + if (!alreadyExists) { + buildSubMenu?.splice(1, 0, agenticMenuItem); + } }🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx` around lines 343 - 366, The Agentic Prompt Studio menu is inserted unconditionally causing duplicates because data[0]?.subMenu?.splice(1, 0, agenticMenuItem) runs on every render; before splicing, check for an existing entry (e.g., match on agenticMenuItem.path or id like 1.2 or title) in data[0].subMenu and only insert if not already present, using the existing symbols agenticPromptStudioEnabled, isUnstract, agenticMenuItem and the data[0]?.subMenu array to locate and guard the insertion.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In `@frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx`:
- Around line 343-366: The Agentic Prompt Studio menu is inserted
unconditionally causing duplicates because data[0]?.subMenu?.splice(1, 0,
agenticMenuItem) runs on every render; before splicing, check for an existing
entry (e.g., match on agenticMenuItem.path or id like 1.2 or title) in
data[0].subMenu and only insert if not already present, using the existing
symbols agenticPromptStudioEnabled, isUnstract, agenticMenuItem and the
data[0]?.subMenu array to locate and guard the insertion.
ℹ️ Review info
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Cache: Disabled due to Reviews > Disable Cache setting
Knowledge base: Disabled due to Reviews -> Disable Knowledge Base setting
📒 Files selected for processing (1)
frontend/src/components/navigations/side-nav-bar/SideNavBar.jsx
…o-navigation-item
…o-navigation-item
…o-navigation-item
Frontend Lint Report (Biome)✅ All checks passed! No linting or formatting issues found. |
|
Deepak-Kesavan
deleted the
UN-3234-Add-beta-tag-to-agentic-prompt-studio-navigation-item
branch
4 participants
What
Why
How
Can this PR break any existing features. If yes, please list possible items. If no, please explain why. (PS: Admins do not merge the PR without this section filled)
Database Migrations
Env Config
Relevant Docs
Related Issues or PRs
Dependencies Versions
Notes on Testing
Screenshots
Checklist
I have read and understood the Contribution Guidelines.