mirror of
https://github.com/apache/superset.git
synced 2026-04-12 20:57:55 +00:00
108 lines
3.2 KiB
TypeScript
108 lines
3.2 KiB
TypeScript
/**
|
|
* Licensed to the Apache Software Foundation (ASF) under one
|
|
* or more contributor license agreements. See the NOTICE file
|
|
* distributed with this work for additional information
|
|
* regarding copyright ownership. The ASF licenses this file
|
|
* to you under the Apache License, Version 2.0 (the
|
|
* "License"); you may not use this file except in compliance
|
|
* with the License. You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing,
|
|
* software distributed under the License is distributed on an
|
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
* KIND, either express or implied. See the License for the
|
|
* specific language governing permissions and limitations
|
|
* under the License.
|
|
*/
|
|
|
|
import React, { type ReactNode } from 'react';
|
|
import { LiveError, LivePreview } from 'react-live';
|
|
import BrowserOnly from '@docusaurus/BrowserOnly';
|
|
import { ErrorBoundaryErrorMessageFallback } from '@docusaurus/theme-common';
|
|
import ErrorBoundary from '@docusaurus/ErrorBoundary';
|
|
import Translate from '@docusaurus/Translate';
|
|
import PlaygroundHeader from '@theme/Playground/Header';
|
|
|
|
import styles from './styles.module.css';
|
|
|
|
// Get the theme wrapper for Superset components
|
|
function getThemeWrapper() {
|
|
if (typeof window === 'undefined') {
|
|
return ({ children }: { children: React.ReactNode }) => <>{children}</>;
|
|
}
|
|
|
|
try {
|
|
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
|
const { themeObject } = require('@apache-superset/core/ui');
|
|
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
|
const { App } = require('antd');
|
|
|
|
if (!themeObject?.SupersetThemeProvider) {
|
|
return ({ children }: { children: React.ReactNode }) => <>{children}</>;
|
|
}
|
|
|
|
return ({ children }: { children: React.ReactNode }) => (
|
|
<themeObject.SupersetThemeProvider>
|
|
<App>{children}</App>
|
|
</themeObject.SupersetThemeProvider>
|
|
);
|
|
} catch (e) {
|
|
console.error('[PlaygroundPreview] Failed to load theme provider:', e);
|
|
return ({ children }: { children: React.ReactNode }) => <>{children}</>;
|
|
}
|
|
}
|
|
|
|
function Loader() {
|
|
return <div>Loading...</div>;
|
|
}
|
|
|
|
function ThemedLivePreview(): ReactNode {
|
|
const ThemeWrapper = getThemeWrapper();
|
|
return (
|
|
<ThemeWrapper>
|
|
<LivePreview />
|
|
</ThemeWrapper>
|
|
);
|
|
}
|
|
|
|
function PlaygroundLivePreview(): ReactNode {
|
|
// No SSR for the live preview
|
|
// See https://github.com/facebook/docusaurus/issues/5747
|
|
return (
|
|
<BrowserOnly fallback={<Loader />}>
|
|
{() => (
|
|
<>
|
|
<ErrorBoundary
|
|
fallback={(params) => (
|
|
<ErrorBoundaryErrorMessageFallback {...params} />
|
|
)}
|
|
>
|
|
<ThemedLivePreview />
|
|
</ErrorBoundary>
|
|
<LiveError />
|
|
</>
|
|
)}
|
|
</BrowserOnly>
|
|
);
|
|
}
|
|
|
|
export default function PlaygroundPreview(): ReactNode {
|
|
return (
|
|
<>
|
|
<PlaygroundHeader>
|
|
<Translate
|
|
id="theme.Playground.result"
|
|
description="The result label of the live codeblocks"
|
|
>
|
|
Result
|
|
</Translate>
|
|
</PlaygroundHeader>
|
|
<div className={styles.playgroundPreview}>
|
|
<PlaygroundLivePreview />
|
|
</div>
|
|
</>
|
|
);
|
|
}
|