Release: Prerelease 8.5.0-alpha.8 #29657
Conversation
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
…cting anything into context menu
…torybookjs/storybook into norbert/addon-api-context-menu
Made some amendments to the documentation
…js/storybook into norbert/addon-api-context-menu
…torybookjs/storybook into norbert/addon-api-context-menu
Docs: Resolutions documentation minor cleanup
Docs: Readme - Fix the Twitter links
…menu UI: Sidebar context menu addon API
github-actions
bot
added
the
release
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
49 file(s) reviewed, 17 comment(s)
Edit PR Review Bot Settings | Greptile
| } else if (state.failed && !errorMessage) { | ||
| description = ''; | ||
| } else if (state.crashed || (state.failed && errorMessage)) { | ||
| description = 'An error occured'; |
There was a problem hiding this comment.
syntax: 'occured' is misspelled, should be 'occurred'
| const id = useRef(context.id); | ||
| id.current = context.id; |
There was a problem hiding this comment.
style: Storing id in ref and immediately updating current is redundant since id never changes. Could just use context.id directly.
|
|
||
| export function PanelTitle() { | ||
| const [addonState = {}] = useAddonState(ADDON_ID); | ||
| const { hasException, interactionsCount } = addonState as any; |
There was a problem hiding this comment.
style: Replace as any with proper type definition for addonState to improve type safety
| {interactionsCount && !hasException ? ( | ||
| <Badge status="neutral">{interactionsCount}</Badge> | ||
| ) : null} | ||
| {hasException ? <Badge status="negative">{interactionsCount}</Badge> : null} | ||
| </Spaced> |
There was a problem hiding this comment.
style: Badge rendering logic could be simplified to a single conditional with ternary operator to determine status
| import { getRelativeTimeString } from '../manager'; | ||
|
|
||
| export const RelativeTime = ({ timestamp, testCount }: { timestamp: Date; testCount: number }) => { | ||
| const [relativeTimeString, setRelativeTimeString] = useState(null); |
There was a problem hiding this comment.
style: useState initial value should be typed as string | null
| const Description = state.description!; | ||
| const Title = state.title!; |
There was a problem hiding this comment.
logic: Non-null assertions (!) on state.description and state.title are unsafe. Should validate these exist before accessing.
| const SidebarMenuList: FC<{ | ||
| menu: MenuList; | ||
| onHide: () => void; | ||
| }> = ({ menu, onHide }) => { | ||
| const links = useMemo( | ||
| () => | ||
| menu.map((group) => | ||
| group.map(({ onClick, ...rest }) => ({ | ||
| ...rest, | ||
| onClick: ((event, item) => { | ||
| if (onClick) { | ||
| onClick(event, item); | ||
| } | ||
| onHide(); | ||
| }) as ClickHandler, | ||
| })) | ||
| ), | ||
| [menu, onHide] | ||
| ); | ||
| return <TooltipLinkList links={links} />; | ||
| onClick: () => void; | ||
| }> = ({ menu, onClick }) => { | ||
| return <TooltipLinkList links={menu} onClick={onClick} />; | ||
| }; |
There was a problem hiding this comment.
logic: Menu click handling has been simplified but may lose event/item data that was previously passed through. Verify this change doesn't break existing menu item click behaviors.
| @@ -118,7 +101,7 @@ export const SidebarMenu: FC<SidebarMenuProps> = ({ menu, isHighlighted, onClick | |||
| <WithTooltip | |||
| placement="top" | |||
| closeOnOutsideClick | |||
| tooltip={({ onHide }) => <SidebarMenuList onHide={onHide} menu={menu} />} | |||
| tooltip={({ onHide }) => <SidebarMenuList onClick={onHide} menu={menu} />} | |||
There was a problem hiding this comment.
logic: Passing onHide directly as onClick loses the event object that may be needed by menu item handlers
| })), | ||
| }, | ||
| getElements: fn(() => ({})), | ||
| } as any as API, |
There was a problem hiding this comment.
style: Consider using a proper type instead of any as API to maintain type safety
| const managerContext: any = { | ||
| api: { | ||
| runTestProvider: fn().mockName('api::runTestProvider'), | ||
| cancelTestProvider: fn().mockName('api::cancelTestProvider'), | ||
| updateTestProviderState: fn().mockName('api::updateTestProviderState'), | ||
| setTestProviderWatchMode: fn().mockName('api::setTestProviderWatchMode'), | ||
| }, | ||
| }; |
There was a problem hiding this comment.
style: managerContext is typed as 'any' - consider creating a proper type for the API interface
JReinhold
added
freeze
☁️ Nx Cloud ReportCI is running/has finished running commands for commit 48a7a51. As they complete they will appear below. Click to see the status, the terminal output, and the build insights. 📂 See all runs for this CI Pipeline Execution ✅ Successfully ran 2 targetsSent with 💌 from NxCloud. |
Package BenchmarksCommit: The following packages have significant changes to their size or dependencies:
|
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 46 | 46 | 0 |
| Self size | 19.08 MB | 19.24 MB | 🚨 +168 KB 🚨 |
| Dependency size | 14.29 MB | 14.29 MB | 0 B |
| Bundle Size Analyzer | Link | Link |
storybook
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 47 | 47 | 0 |
| Self size | 22 KB | 22 KB | 0 B |
| Dependency size | 33.37 MB | 33.54 MB | 🚨 +168 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
sb
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 48 | 48 | 0 |
| Self size | 1 KB | 1 KB | 0 B |
| Dependency size | 33.39 MB | 33.56 MB | 🚨 +168 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
@storybook/cli
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 390 | 390 | 0 |
| Self size | 483 KB | 483 KB | 0 B |
| Dependency size | 74.43 MB | 74.60 MB | 🚨 +168 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
@storybook/codemod
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 270 | 270 | 0 |
| Self size | 612 KB | 612 KB | 0 B |
| Dependency size | 64.43 MB | 64.60 MB | 🚨 +168 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
create-storybook
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 105 | 105 | 0 |
| Self size | 1.11 MB | 1.11 MB | 0 B |
| Dependency size | 42.37 MB | 42.54 MB | 🚨 +168 KB 🚨 |
| Bundle Size Analyzer | Link | Link |
This is an automated pull request that bumps the version from
8.5.0-alpha.7to8.5.0-alpha.8.Once this pull request is merged, it will trigger a new release of version
8.5.0-alpha.8.If you're not a core maintainer with permissions to release you can ignore this pull request.
To do
Before merging the PR, there are a few QA steps to go through:
And for each change below:
This is a list of all the PRs merged and commits pushed directly to
next, that will be part of this release:If you've made any changes doing the above QA (change PR titles, revert PRs), manually trigger a re-generation of this PR with this workflow and wait for it to finish. It will wipe your progress in this to do, which is expected.
Feel free to manually commit any changes necessary to this branch after you've done the last re-generation, following the Make Manual Changes section in the docs, especially if you're making changes to the changelog.
When everything above is done:
Generated changelog
8.5.0-alpha.8
Greptile Summary
This PR introduces a new sidebar context menu addon API in Storybook 8.5.0-alpha.8, enabling addons to inject custom links and actions through an experimental test provider interface.
sidebarContextMenuproperty toAddon_TestProviderTypeincode/core/src/types/modules/addons.tsfor custom menu itemsContextMenucomponent incode/core/src/manager/components/sidebar/ContextMenu.tsxfor managing addon menu itemscode/core/src/manager-api/modules/experimental_testmodule.tsfor test provider state managementTooltipLinkListincode/core/src/components/components/tooltip/TooltipLinkList.tsxto support custom content