[incubator-devlake] branch main updated: fix(config-ui): adjust the connection request (#6300)

[abeizn]

This is an automated email from the ASF dual-hosted git repository.

abeizn pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git


The following commit(s) were added to refs/heads/main by this push:
     new 5e7a340e9 fix(config-ui): adjust the connection request (#6300)
5e7a340e9 is described below

commit 5e7a340e93533f71156cda8782c5aaaf0ba1765d
Author: 青湛 <0x1304...@gmail.com>
AuthorDate: Mon Oct 23 14:50:19 2023 +1300

    fix(config-ui): adjust the connection request (#6300)
---
 config-ui/src/App.tsx                       | 18 +-----------------
 config-ui/src/features/connections/slice.ts | 10 +++++++++-
 config-ui/src/routes/layout/layout.tsx      | 17 +++++++++++++++--
 3 files changed, 25 insertions(+), 20 deletions(-)

diff --git a/config-ui/src/App.tsx b/config-ui/src/App.tsx
index 433c7a16f..11757250e 100644
--- a/config-ui/src/App.tsx
+++ b/config-ui/src/App.tsx
@@ -16,11 +16,8 @@
  *
  */
 
-import { useEffect } from 'react';
 import { createBrowserRouter, Navigate, RouterProvider, json } from 
'react-router-dom';
 
-import { useAppDispatch, useAppSelector } from '@/app/hook';
-import { init, selectStatus } from '@/features';
 import { PageLoading } from '@/components';
 import {
   ConnectionHomePage,
@@ -103,17 +100,4 @@ const router = createBrowserRouter([
   },
 ]);
 
-export const App = () => {
-  const dispatch = useAppDispatch();
-  const status = useAppSelector(selectStatus);
-
-  useEffect(() => {
-    dispatch(init());
-  }, []);
-
-  if (['idle', 'loading'].includes(status)) {
-    return <PageLoading />;
-  }
-
-  return <RouterProvider router={router} fallbackElement={<PageLoading />} />;
-};
+export const App = () => <RouterProvider router={router} 
fallbackElement={<PageLoading />} />;
diff --git a/config-ui/src/features/connections/slice.ts 
b/config-ui/src/features/connections/slice.ts
index f0494f929..1d8126beb 100644
--- a/config-ui/src/features/connections/slice.ts
+++ b/config-ui/src/features/connections/slice.ts
@@ -35,9 +35,17 @@ const initialState: {
 };
 
 export const init = createAsyncThunk('connections/init', async () => {
+  const getConnections = async (plugin: string) => {
+    try {
+      return API.connection.list(plugin);
+    } catch {
+      return [];
+    }
+  };
+
   const res = await Promise.all(
     PluginConfig.map(async ({ plugin }) => {
-      const connections = await API.connection.list(plugin);
+      const connections = await getConnections(plugin);
       return connections.map((connection) => transformConnection(plugin, 
connection));
     }),
   );
diff --git a/config-ui/src/routes/layout/layout.tsx 
b/config-ui/src/routes/layout/layout.tsx
index de136ae4d..b1c9a67a0 100644
--- a/config-ui/src/routes/layout/layout.tsx
+++ b/config-ui/src/routes/layout/layout.tsx
@@ -16,12 +16,14 @@
  *
  */
 
-import { useRef } from 'react';
+import { useEffect, useRef } from 'react';
 import { useLoaderData, Outlet, useNavigate, useLocation } from 
'react-router-dom';
 import { CSSTransition } from 'react-transition-group';
 import { Menu, MenuItem, Navbar, Alignment } from '@blueprintjs/core';
 
-import { Logo, ExternalLink, IconButton } from '@/components';
+import { useAppDispatch, useAppSelector } from '@/app/hook';
+import { PageLoading, Logo, ExternalLink, IconButton } from '@/components';
+import { init, selectStatus } from '@/features';
 import { DOC_URL } from '@/release';
 import { TipsContextProvider, TipsContextConsumer } from '@/store';
 
@@ -42,10 +44,21 @@ export const Layout = () => {
   const navigate = useNavigate();
   const { pathname } = useLocation();
 
+  const dispatch = useAppDispatch();
+  const status = useAppSelector(selectStatus);
+
   const menu = useMenu();
 
   const tipsRef = useRef(null);
 
+  useEffect(() => {
+    dispatch(init());
+  }, []);
+
+  if (['idle', 'loading'].includes(status)) {
+    return <PageLoading />;
+  }
+
   const handlePushPath = (it: MenuItemType) => {
     if (!it.target) {
       navigate(it.path);