Add composition path prefix to storybook to allow publishing to gh-pages (#51700)

Add composition path prefix to storybook

.github/workflows/storybook-pages.yml

@@ -27,6 +27,8 @@ jobs:
 
             - name: Build Storybook
               run: pnpm --filter='@woocommerce/storybook' build-storybook --quiet
+              env:
+                  STORYBOOK_COMPOSITION_PATH_PREFIX: /woocommerce
 
             - name: Deploy
               uses: peaceiris/actions-gh-pages@4f9cc6602d3f66b9c108549d475ec49e8ef4d45e # v4.0.0

tools/storybook/.storybook/main.js

@@ -28,11 +28,18 @@ module.exports = {
 		if ( configType === 'DEVELOPMENT' ) {
 			return {};
 		}
+
+		let pathPrefix = (
+			process.env.STORYBOOK_COMPOSITION_PATH_PREFIX ?? ''
+		).trim();
+		if ( pathPrefix && ! pathPrefix.startsWith( '/' ) ) {
+			pathPrefix = '/' + pathPrefix;
+		}
 		return {
 			'woocommerce-blocks': {
 				expanded: false,
 				title: 'WooCommerce Blocks',
-				url: '/assets/woocommerce-blocks',
+				url: pathPrefix + '/assets/woocommerce-blocks',
 			},
 		};
 	},