This is an automated email from the ASF dual-hosted git repository. robin0716 pushed a commit to branch dev in repository https://gitbox.apache.org/repos/asf/incubator-answer.git
commit 6e51cc756df7313732ad65400a0a533e7f4582e5 Author: Ourai Lin <[email protected]> AuthorDate: Sun Oct 20 12:13:23 2024 +0800 refactor(ui): optimize initial loading --- ui/src/App.tsx | 11 +++++++++-- ui/src/components/InitialLoadingPlaceholder/index.tsx | 18 ++++++++++++++++++ 2 files changed, 27 insertions(+), 2 deletions(-) diff --git a/ui/src/App.tsx b/ui/src/App.tsx index 1b7d1b82..f799042a 100644 --- a/ui/src/App.tsx +++ b/ui/src/App.tsx @@ -28,8 +28,9 @@ import './i18n/init'; import { subscribe, unsubscribe } from '@/utils/pluginKit'; import resolveRoutes from '@/router'; +import InitialLoadingPlaceholder from '@/components/InitialLoadingPlaceholder'; -function App() { +function useResolvedRoutes() { const [routes, setRoutes] = useState<RouteObject[]>([]); useEffect(() => { @@ -44,8 +45,14 @@ function App() { }; }, []); + return routes; +} + +function App() { + const routes = useResolvedRoutes(); + if (routes.length === 0) { - return <div>initializing</div>; + return <InitialLoadingPlaceholder />; } const router = createBrowserRouter(routes, { diff --git a/ui/src/components/InitialLoadingPlaceholder/index.tsx b/ui/src/components/InitialLoadingPlaceholder/index.tsx new file mode 100644 index 00000000..28ba1cfd --- /dev/null +++ b/ui/src/components/InitialLoadingPlaceholder/index.tsx @@ -0,0 +1,18 @@ +import { Spinner } from 'react-bootstrap'; + +function InitialLoadingPlaceholder() { + return ( + <div + style={{ + flexGrow: 1, + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + }}> + <Spinner /> + <span style={{ marginLeft: 8 }}>Initializing</span> + </div> + ); +} + +export default InitialLoadingPlaceholder;
