theluyuan/RWKV-Runner
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

improve lazy loading ui

Browse Source
This commit is contained in:
josc146 2023-11-18 13:59:37 +08:00
parent f739c61197
commit 437de2be20
1 changed files with 5 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/components/LazyImportComponent.tsx
View File

@ -1,5 +1,6 @@
import { FC, LazyExoticComponent, ReactNode, Suspense } from 'react'; import { FC, LazyExoticComponent, ReactNode, Suspense } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Spinner } from '@fluentui/react-components';
interface LazyImportComponentProps { interface LazyImportComponentProps {
lazyChildren: LazyExoticComponent<FC<any>>; lazyChildren: LazyExoticComponent<FC<any>>;
@ -11,7 +12,10 @@ export const LazyImportComponent: FC<LazyImportComponentProps> = (props) => {
const { t } = useTranslation(); const { t } = useTranslation();
return ( return (
<Suspense fallback={<div>{t('Loading...')}</div>}> <Suspense fallback={
<div className="flex justify-center items-center h-full w-full">
<Spinner size="huge" label={t('Loading...')} />
</div>}>
<props.lazyChildren {...props.lazyProps}> <props.lazyChildren {...props.lazyProps}>
{props.children} {props.children}
</props.lazyChildren> </props.lazyChildren>