Feat: Supports to debug single component in Agent. #3993 (#4007)

### What problem does this PR solve?

Feat: Supports to debug single component in Agent. #3993
Fix: The github button on the login page is displayed incorrectly  #4002

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/utils/api.ts

@@ -118,4 +118,6 @@ export default {
   resetCanvas: `${api_host}/canvas/reset`,
   runCanvas: `${api_host}/canvas/completion`,
   testDbConnect: `${api_host}/canvas/test_db_connect`,
+  getInputElements: `${api_host}/canvas/input_elements`,
+  debug: `${api_host}/canvas/debug`,
 };

web/src/utils/request.ts

@@ -107,31 +107,25 @@ request.interceptors.response.use(async (response: any, options) => {
     return response;
   }
 
-  const data: ResponseType = await response.clone().json();
-
-  if (data.code === 401 || data.code === 401) {
+  const data: ResponseType = await response?.clone()?.json();
+  if (data?.code === 100) {
+    message.error(data?.message);
+  } else if (data?.code === 401) {
     notification.error({
-      message: data.message,
-      description: data.message,
+      message: data?.message,
+      description: data?.message,
       duration: 3,
     });
     authorizationUtil.removeAll();
     history.push('/login'); // Will not jump to the login page
-  } else if (data.code !== 0) {
-    if (data.code === 100) {
-      message.error(data.message);
-    } else {
-      notification.error({
-        message: `${i18n.t('message.hint')} : ${data.code}`,
-        description: data.message,
-        duration: 3,
-      });
-    }
-
-    return response;
-  } else {
-    return response;
+  } else if (data?.code !== 0) {
+    notification.error({
+      message: `${i18n.t('message.hint')} : ${data?.code}`,
+      description: data?.message,
+      duration: 3,
+    });
   }
+  return response;
 });
 
 export default request;