From 6d692e54ba080da7d21319a0b00c437f49fd5162 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Tue, 22 Nov 2022 15:38:43 +0100 Subject: [PATCH] fixes --- code/lib/builder-webpack5/src/index.ts | 3 +- code/lib/core-events/src/index.ts | 55 ++++++++++--------- code/lib/preview/package.json | 6 +- code/lib/preview/src/globals/definitions.ts | 4 +- code/lib/preview/src/globals/exports.ts | 1 + code/ui/components/src/Loader/Loader.tsx | 4 +- .../src/components/preview/preview.tsx | 4 +- code/ui/manager/src/globals/exports.ts | 1 + 8 files changed, 41 insertions(+), 37 deletions(-) diff --git a/code/lib/builder-webpack5/src/index.ts b/code/lib/builder-webpack5/src/index.ts index ef4416eb202d..bb3097da7dd3 100644 --- a/code/lib/builder-webpack5/src/index.ts +++ b/code/lib/builder-webpack5/src/index.ts @@ -8,6 +8,7 @@ import { checkWebpackVersion } from '@storybook/core-webpack'; import { dirname, join, parse } from 'path'; import express from 'express'; import fs from 'fs-extra'; +import { PREVIEW_BUILDER_PROGRESS } from '@storybook/core-events'; // eslint-disable-next-line import/no-extraneous-dependencies import prettyTime from 'pretty-hrtime'; @@ -161,7 +162,7 @@ const starter: StarterFunction = async function* starterGeneratorFn({ } } - channel.emit('preview_builder_progress', [progress]); + channel.emit(PREVIEW_BUILDER_PROGRESS, [progress]); }, modulesCount, }).apply(compiler); diff --git a/code/lib/core-events/src/index.ts b/code/lib/core-events/src/index.ts index 4ce90cc37f7a..a995c2b8c80c 100644 --- a/code/lib/core-events/src/index.ts +++ b/code/lib/core-events/src/index.ts @@ -51,6 +51,8 @@ enum events { REGISTER_SUBSCRIPTION = 'registerSubscription', // Tell the manager that the user pressed a key in the preview PREVIEW_KEYDOWN = 'previewKeydown', + // Tell the preview that the builder is in progress + PREVIEW_BUILDER_PROGRESS = 'preview_builder_progress', // Used in the manager to change the story selection SELECT_STORY = 'selectStory', STORIES_COLLAPSE_ALL = 'storiesCollapseAll', @@ -70,41 +72,42 @@ export default events; export const { CHANNEL_CREATED, CONFIG_ERROR, - STORY_INDEX_INVALIDATED, - STORY_SPECIFIED, - SET_STORIES, - SET_INDEX, - SET_CONFIG, - SET_CURRENT_STORY, CURRENT_STORY_WAS_SET, + DOCS_RENDERED, FORCE_RE_RENDER, FORCE_REMOUNT, - STORY_PREPARED, - STORY_CHANGED, - STORY_UNCHANGED, - PRELOAD_ENTRIES, - STORY_RENDERED, - STORY_MISSING, - STORY_ERRORED, - STORY_THREW_EXCEPTION, - STORY_RENDER_PHASE_CHANGED, - PLAY_FUNCTION_THREW_EXCEPTION, - UPDATE_STORY_ARGS, - STORY_ARGS_UPDATED, - RESET_STORY_ARGS, - SET_GLOBALS, - UPDATE_GLOBALS, GLOBALS_UPDATED, - REGISTER_SUBSCRIPTION, + NAVIGATE_URL, + PLAY_FUNCTION_THREW_EXCEPTION, + PRELOAD_ENTRIES, + PREVIEW_BUILDER_PROGRESS, PREVIEW_KEYDOWN, + REGISTER_SUBSCRIPTION, + RESET_STORY_ARGS, SELECT_STORY, - STORIES_COLLAPSE_ALL, - STORIES_EXPAND_ALL, - DOCS_RENDERED, + SET_CONFIG, + SET_CURRENT_STORY, + SET_GLOBALS, + SET_INDEX, + SET_STORIES, SHARED_STATE_CHANGED, SHARED_STATE_SET, - NAVIGATE_URL, + STORIES_COLLAPSE_ALL, + STORIES_EXPAND_ALL, + STORY_ARGS_UPDATED, + STORY_CHANGED, + STORY_ERRORED, + STORY_INDEX_INVALIDATED, + STORY_MISSING, + STORY_PREPARED, + STORY_RENDER_PHASE_CHANGED, + STORY_RENDERED, + STORY_SPECIFIED, + STORY_THREW_EXCEPTION, + STORY_UNCHANGED, + UPDATE_GLOBALS, UPDATE_QUERY_PARAMS, + UPDATE_STORY_ARGS, } = events; // Used to break out of the current render without showing a redbox diff --git a/code/lib/preview/package.json b/code/lib/preview/package.json index 0e309bc9e8e6..44c3da39bc81 100644 --- a/code/lib/preview/package.json +++ b/code/lib/preview/package.json @@ -33,9 +33,9 @@ }, "./package.json": "./package.json" }, - "main": "dist/index.js", - "module": "dist/index.mjs", - "types": "dist/index.d.ts", + "main": "dist/runtime.js", + "module": "dist/runtime.mjs", + "types": "dist/runtime.d.ts", "typesVersions": { "*": { "*": [ diff --git a/code/lib/preview/src/globals/definitions.ts b/code/lib/preview/src/globals/definitions.ts index 9122fca70262..7a614b42c3f7 100644 --- a/code/lib/preview/src/globals/definitions.ts +++ b/code/lib/preview/src/globals/definitions.ts @@ -18,8 +18,8 @@ import type { Definitions } from './types'; * * If you forget to do either, TypeScript will complain. * - * This `definitions.ts` file is consumed by the `builder-manager` package, - * The `runtime.ts` file is used inside the manager's browser code runtime. + * This `definitions.ts` file is consumed by the `builder-*` package, + * The `runtime.ts` file is used inside the preview's browser code runtime. */ const createModuleInfo = (m: keyof typeof Keys): Required => ({ diff --git a/code/lib/preview/src/globals/exports.ts b/code/lib/preview/src/globals/exports.ts index 358ca7376ab2..0d621b77e43f 100644 --- a/code/lib/preview/src/globals/exports.ts +++ b/code/lib/preview/src/globals/exports.ts @@ -106,6 +106,7 @@ export default { 'NAVIGATE_URL', 'PLAY_FUNCTION_THREW_EXCEPTION', 'PRELOAD_ENTRIES', + 'PREVIEW_BUILDER_PROGRESS', 'PREVIEW_KEYDOWN', 'REGISTER_SUBSCRIPTION', 'RESET_STORY_ARGS', diff --git a/code/ui/components/src/Loader/Loader.tsx b/code/ui/components/src/Loader/Loader.tsx index 8199888257d3..c4f89c572a5d 100644 --- a/code/ui/components/src/Loader/Loader.tsx +++ b/code/ui/components/src/Loader/Loader.tsx @@ -104,7 +104,7 @@ interface LoaderProps { size?: number; } -export const PureLoader: FC> = ({ +export const Loader: FC> = ({ progress, error, size, @@ -155,5 +155,3 @@ export const PureLoader: FC /> ); }; - -export const Loader = PureLoader; diff --git a/code/ui/manager/src/components/preview/preview.tsx b/code/ui/manager/src/components/preview/preview.tsx index 252bf57815e1..d266fb6b3deb 100644 --- a/code/ui/manager/src/components/preview/preview.tsx +++ b/code/ui/manager/src/components/preview/preview.tsx @@ -3,7 +3,7 @@ import { Helmet } from 'react-helmet-async'; import global from 'global'; import { type API, Consumer, type Combo, merge } from '@storybook/api'; -import { SET_CURRENT_STORY } from '@storybook/core-events'; +import { PREVIEW_BUILDER_PROGRESS, SET_CURRENT_STORY } from '@storybook/core-events'; import { addons, types, type Addon } from '@storybook/addons'; import { PureLoader } from '@storybook/components'; @@ -66,7 +66,7 @@ const createCanvas = (id: string, baseUrl = 'iframe.html', withLoader = true): A if (global.CONFIG_TYPE === 'DEVELOPMENT') { const channel = addons.getServerChannel(); - channel.on('preview_builder_progress', (options) => { + channel.on(PREVIEW_BUILDER_PROGRESS, (options) => { setProgress(options); }); } diff --git a/code/ui/manager/src/globals/exports.ts b/code/ui/manager/src/globals/exports.ts index 156f5ad761f8..abe8d9da226d 100644 --- a/code/ui/manager/src/globals/exports.ts +++ b/code/ui/manager/src/globals/exports.ts @@ -124,6 +124,7 @@ export default { 'NAVIGATE_URL', 'PLAY_FUNCTION_THREW_EXCEPTION', 'PRELOAD_ENTRIES', + 'PREVIEW_BUILDER_PROGRESS', 'PREVIEW_KEYDOWN', 'REGISTER_SUBSCRIPTION', 'RESET_STORY_ARGS',