feat: add suspense support

.eslintrc

@@ -9,7 +9,7 @@
     "parserOptions": {
         "project": "tsconfig.json"
     },
-    "ignorePatterns": ["/*", "!/src"],
+    "ignorePatterns": ["/*", "!/src", "!/.storybook"],
     "rules": {
         "callback-return": "off",
         "react-hooks/exhaustive-deps": "error",

.gitignore

@@ -4,6 +4,9 @@ node_modules
 # Artifacts
 build
 
+# Storybook
+storybook-static
+
 # Editor configs
 .vscode/*
 !.vscode/extensions.json

.storybook/main.ts

@@ -0,0 +1,32 @@
+import path from 'node:path';
+
+import {configureServiceWebpackConfig} from '@gravity-ui/app-builder';
+import type {StorybookConfig} from '@storybook/react-webpack5';
+
+import dataSourceLazyPlugin from '../src/plugin/webpack';
+
+const config: StorybookConfig = {
+    stories: ['../src/**/*.stories.@(ts|tsx)'],
+    framework: '@storybook/react-webpack5',
+    addons: ['@storybook/addon-webpack5-compiler-swc'],
+    core: {
+        disableWhatsNewNotifications: true,
+    },
+    webpackFinal: async (originalConfig, {configType}) => {
+        const mode = configType === 'DEVELOPMENT' ? 'development' : 'production';
+        const webpackConfig = await configureServiceWebpackConfig(mode, originalConfig);
+
+        webpackConfig.resolve ??= {};
+        webpackConfig.resolve.alias = {
+            ...webpackConfig.resolve.alias,
+            '@gravity-ui/data-source': path.resolve(__dirname, '../src/index.ts'),
+        };
+
+        webpackConfig.plugins ??= [];
+        webpackConfig.plugins.push(dataSourceLazyPlugin());
+
+        return webpackConfig;
+    },
+};
+
+export default config;

.storybook/preview.tsx

@@ -0,0 +1,33 @@
+/* eslint-disable import/order */
+import React from 'react';
+
+import {ThemeProvider} from '@gravity-ui/uikit';
+import type {Preview} from '@storybook/react-webpack5';
+
+import {ClientDataManager, DataSourceProvider} from '@gravity-ui/data-source';
+
+import '@gravity-ui/uikit/styles/fonts.css';
+import '@gravity-ui/uikit/styles/styles.css';
+import '@gravity-ui/illustrations/styles/styles.scss';
+
+const dataManager = new ClientDataManager({
+    defaultOptions: {
+        queries: {
+            retryOnMount: false,
+        },
+    },
+});
+
+const preview: Preview = {
+    decorators: [
+        (Story) => (
+            <DataSourceProvider dataManager={dataManager}>
+                <ThemeProvider theme="light">
+                    <Story />
+                </ThemeProvider>
+            </DataSourceProvider>
+        ),
+    ],
+};
+
+export default preview;

app-builder.config.ts

@@ -2,6 +2,6 @@ import {defineConfig} from '@gravity-ui/app-builder';
 
 export default defineConfig({
     lib: {
-        internalDirs: ['__tests__'],
+        internalDirs: ['.storybook', '**/__tests__', '**/__stories__', 'plugin'],
     },
 });

jest.config.js

@@ -5,5 +5,5 @@ module.exports = {
         '^.+\\.tsx?$': '@swc/jest',
     },
     testEnvironment: 'jsdom',
-    setupFilesAfterEnv: ['<rootDir>/src/setupTests.ts'],
+    setupFilesAfterEnv: ['<rootDir>/src/__tests__/setupTests.ts'],
 };