From ee9462c221bc64e8db08934c00bf1440803d9b20 Mon Sep 17 00:00:00 2001
From: dongchengjie <37543964+dongchengjie@users.noreply.github.com>
Date: Wed, 26 Jun 2024 18:29:50 +0800
Subject: [PATCH] fix: await compatibility in #c648dc6

---
 src/components/base/base-tooltip-icon.tsx |  4 ++--
 src/components/layout/layout-traffic.tsx  | 10 +++++++---
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/components/base/base-tooltip-icon.tsx b/src/components/base/base-tooltip-icon.tsx
index 99cb15c8..e7028955 100644
--- a/src/components/base/base-tooltip-icon.tsx
+++ b/src/components/base/base-tooltip-icon.tsx
@@ -12,11 +12,11 @@ interface Props extends IconButtonProps {
 }
 
 export const TooltipIcon: React.FC<Props> = (props: Props) => {
-  const { title = "", icon: Icon = InfoRounded } = props;
+  const { title = "", icon: Icon = InfoRounded, ...restProps } = props;
 
   return (
     <Tooltip title={title} placement="top">
-      <IconButton color="inherit" size="small" {...props}>
+      <IconButton color="inherit" size="small" {...restProps}>
         <Icon fontSize="inherit" style={{ cursor: "pointer", opacity: 0.75 }} />
       </IconButton>
     </Tooltip>
diff --git a/src/components/layout/layout-traffic.tsx b/src/components/layout/layout-traffic.tsx
index e015a9cb..5ea8068f 100644
--- a/src/components/layout/layout-traffic.tsx
+++ b/src/components/layout/layout-traffic.tsx
@@ -1,4 +1,4 @@
-import { useRef } from "react";
+import { useEffect, useRef, useState } from "react";
 import { Box, Typography } from "@mui/material";
 import {
   ArrowDownward,
@@ -21,8 +21,6 @@ interface MemoryUsage {
   oslimit?: number;
 }
 
-const isDebug = await isDebugEnabled();
-
 // setup the traffic
 export const LayoutTraffic = () => {
   const { t } = useTranslation();
@@ -34,6 +32,12 @@ export const LayoutTraffic = () => {
 
   const trafficRef = useRef<TrafficRef>(null);
   const pageVisible = useVisibility();
+  const [isDebug, setIsDebug] = useState(false);
+
+  useEffect(() => {
+    isDebugEnabled().then((flag) => setIsDebug(flag));
+    return () => {};
+  }, [isDebug]);
 
   // https://swr.vercel.app/docs/subscription#deduplication
   // useSWRSubscription auto deduplicates to one subscription per key per entire app