Addon-actions: Fix ESM by upgrading from uuid-browser to uuid

[misino]

Closes #21916

What I did

The library uuid-browser doesn't support esm, so running storybook with webpack could produce an error Can't resolve 'uuid-browser/v4

How to test

Checklist

• Make sure your changes are tested (stories and/or unit, integration, or end-to-end tests)
• Make sure to add/update documentation regarding your changes
• If you are deprecating/removing a feature, make sure to update
  MIGRATION.MD

Maintainers

• If this PR should be tested against many or all sandboxes,
  make sure to add the ci:merged or ci:daily GH label to it.
• Make sure this PR contains one of the labels below.

["cleanup", "BREAKING CHANGE", "feature request", "bug", "documentation", "maintenance", "dependencies", "other"]

[socket-security]

New dependency changes detected. Learn more about Socket for GitHub ↗︎

---

👍 No new dependency issues detected in pull request

Bot Commands

To ignore an alert, reply with a comment starting with @SocketSecurity ignore followed by a space separated list of package-name@version specifiers. e.g. @SocketSecurity ignore foo@1.0.0 bar@* or ignore all packages with @SocketSecurity ignore-all

Pull request alert summary

Issue	Status
Install scripts	✅ 0 issues
Native code	✅ 0 issues
Bin script confusion	✅ 0 issues
Bin script shell injection	✅ 0 issues
Shell access	✅ 0 issues
Uses eval	✅ 0 issues
Unresolved require	✅ 0 issues
Invalid package.json	✅ 0 issues
HTTP dependency	✅ 0 issues
Git dependency	✅ 0 issues
GitHub dependency	✅ 0 issues
New author	✅ 0 issues
Potential typo squat	✅ 0 issues
Known Malware	✅ 0 issues
Telemetry	✅ 0 issues
Protestware/Troll package	✅ 0 issues

---

📊 Modified Dependency Overview:

➕ Added Package	Capability Access	+/- Transitive Count	Publisher
@types/uuid@9.0.1	None	+0	types
uuid@9.0.0	None	+0	ctavan

[valscion]

I wonder if uuid package also needs to be here? It seems that this list has been updated in the past to avoid some issues:

• Fix: vite dev and yarn pnp + vite by unreverting and adding lodash files to optimizeDeps.include #21535
• [Bug]: Your application tried to access @storybook/builder-vite, but it isn't declared in your dependencies v7.0.0-beta.59 #21548

The pull request that created this list in the first place is this one:

• Vite: Add builder-vite, react-vite, and vue3-vite #19007

That one says that the vite builder was able to be tested with:

yarn task --task smoke-test --template react-vite/default-js --force
yarn task --task smoke-test --template vue3-vite/default-js --force

Maybe worth trying to run that here unless the same tests are also being ran in CI automatically?

The comment where this list gets used is this one:

storybook/code/lib/builder-vite/src/optimizeDeps.ts

Lines 146 to 148 in 59c72ce

	// We need Vite to precompile these dependencies, because they contain non-ESM code that would break
	// if we served it directly to the browser.
	include: [...include, ...(config.optimizeDeps?.include || [])],

So it could be that uuid is indeed not necessary to add here if it already ships ESM code?

I'm not that familiar with this code but these are the only worries I would have about these code changes.

I've tested using the uuid package in place of uuid-browser/v4 successfully in our own project where we have manually set a webpack alias for uuid-browser/v4 import to point to this file instead:

// This file acts like a monkeypatch for fixing this issue:
// https://github.com/storybookjs/storybook/issues/21916
//
// We have custom webpack configuration that makes Storybook load
// this file instead of the file from `uuid-browser` package so that
// we can get the imports to work correctly.
//
// Once the issue mentioned above is fixed, this file should be removed.

import { v4 as uuidv4 } from 'uuid';
export default uuidv4;

This workaround has worked for us and usage of uuid package in place of uuid-browser succeeds.

[ndelangen]

I ran a storybook locally on this branch, and vite didn't warn about this...