@blocklet/ui-react 2.13.18 → 2.13.19

package/lib/UserCenter/components/settings.js

@@ -5,6 +5,7 @@ import { useCreation, useMemoizedFn } from "ahooks";
 import { translate } from "@arcblock/ux/lib/Locale/util";
 import { useLocaleContext } from "@arcblock/ux/lib/Locale/context";
 import { mergeSx } from "@arcblock/ux/lib/Util/style";
+import useBrowser from "@arcblock/react-hooks/lib/useBrowser";
 import { translations } from "../libs/locales.js";
 import Notification from "./notification.js";
 import Privacy from "./privacy.js";
@@ -20,6 +21,8 @@ export default function Settings({
   ...rest
 }) {
   const { locale } = useLocaleContext();
+  const browser = useBrowser();
+  const isArcSphere = browser.arcSphere;
   const t = useMemoizedFn((key, data = {}) => {
     return translate(translations, key, locale, "en", data);
   });
@@ -36,11 +39,11 @@ export default function Settings({
   }, [settings?.userCenterTabs]);
   const tabs = useCreation(() => {
     return [
-      {
+      !isArcSphere ? {
         label: t("commonSetting.title"),
         value: "common",
         content: /* @__PURE__ */ jsx(ConfigProfile, { user, onSave })
-      },
+      } : void 0,
       {
         label: t("notificationManagement"),
         value: "notification",
@@ -101,38 +104,43 @@ export default function Settings({
         },
         maxWidth: "100%"
       },
-      children: tabs.map((tab) => /* @__PURE__ */ jsxs(
-        Box,
-        {
-          id: tab.value,
-          sx: mergeSx(
-            {
-              border: "1px solid",
-              borderColor: "divider",
-              borderRadius: 1,
-              p: 2,
-              "&:last-child": {
-                mb: 5
-              }
-            },
-            tab.sx
-          ),
-          children: [
-            /* @__PURE__ */ jsx(
-              Typography,
+      children: tabs.map((tab) => {
+        if (!tab) {
+          return null;
+        }
+        return /* @__PURE__ */ jsxs(
+          Box,
+          {
+            id: tab.value,
+            sx: mergeSx(
               {
-                sx: {
-                  color: "text.primary",
-                  fontWeight: 600
-                },
-                children: tab.label
-              }
+                border: "1px solid",
+                borderColor: "divider",
+                borderRadius: 1,
+                p: 2,
+                "&:last-child": {
+                  mb: 5
+                }
+              },
+              tab.sx
             ),
-            /* @__PURE__ */ jsx(Box, { mt: 2.5, children: tab.content })
-          ]
-        },
-        tab.value
-      ))
+            children: [
+              /* @__PURE__ */ jsx(
+                Typography,
+                {
+                  sx: {
+                    color: "text.primary",
+                    fontWeight: 600
+                  },
+                  children: tab.label
+                }
+              ),
+              /* @__PURE__ */ jsx(Box, { mt: 2.5, children: tab.content })
+            ]
+          },
+          tab.value
+        );
+      })
     }
   );
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/ui-react",
-  "version": "2.13.18",
+  "version": "2.13.19",
   "description": "Some useful front-end web components that can be used in Blocklets.",
   "keywords": [
     "react",
@@ -34,8 +34,8 @@
   "dependencies": {
     "@abtnode/constant": "^1.16.42",
     "@abtnode/util": "^1.16.42",
-    "@arcblock/bridge": "^2.13.18",
-    "@arcblock/react-hooks": "^2.13.18",
+    "@arcblock/bridge": "^2.13.19",
+    "@arcblock/react-hooks": "^2.13.19",
     "@arcblock/ws": "^1.20.2",
     "@blocklet/constant": "^1.16.42",
     "@blocklet/did-space-react": "^1.0.48",
@@ -94,5 +94,5 @@
     "jest": "^29.7.0",
     "unbuild": "^2.0.0"
   },
-  "gitHead": "7bb88b45cd68de7eb079b590d0d73fd41d303917"
+  "gitHead": "64c12fb7646d2323f1be0bef7a3901261687b165"
 }

package/src/UserCenter/components/settings.tsx

@@ -5,7 +5,7 @@ import { useCreation, useMemoizedFn } from 'ahooks';
 import { translate } from '@arcblock/ux/lib/Locale/util';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
 import { mergeSx } from '@arcblock/ux/lib/Util/style';
-
+import useBrowser from '@arcblock/react-hooks/lib/useBrowser';
 import { translations } from '../libs/locales';
 import Notification from './notification';
 import Privacy from './privacy';
@@ -29,6 +29,8 @@ export default function Settings({
   };
 } & BoxProps) {
   const { locale } = useLocaleContext();
+  const browser = useBrowser();
+  const isArcSphere = browser.arcSphere;
   const t = useMemoizedFn((key, data = {}) => {
     return translate(translations, key, locale, 'en', data);
   });
@@ -45,11 +47,13 @@ export default function Settings({
   }, [settings?.userCenterTabs]);
   const tabs = useCreation(() => {
     return [
-      {
-        label: t('commonSetting.title'),
-        value: 'common',
-        content: <ConfigProfile user={user} onSave={onSave} />,
-      },
+      !isArcSphere
+        ? {
+            label: t('commonSetting.title'),
+            value: 'common',
+            content: <ConfigProfile user={user} onSave={onSave} />,
+          }
+        : undefined,
       {
         label: t('notificationManagement'),
         value: 'notification',
@@ -111,32 +115,37 @@ export default function Settings({
         },
         maxWidth: '100%',
       }}>
-      {tabs.map((tab) => (
-        <Box
-          id={tab.value}
-          key={tab.value}
-          sx={mergeSx(
-            {
-              border: '1px solid',
-              borderColor: 'divider',
-              borderRadius: 1,
-              p: 2,
-              '&:last-child': {
-                mb: 5,
+      {tabs.map((tab) => {
+        if (!tab) {
+          return null;
+        }
+        return (
+          <Box
+            id={tab.value}
+            key={tab.value}
+            sx={mergeSx(
+              {
+                border: '1px solid',
+                borderColor: 'divider',
+                borderRadius: 1,
+                p: 2,
+                '&:last-child': {
+                  mb: 5,
+                },
               },
-            },
-            tab.sx
-          )}>
-          <Typography
-            sx={{
-              color: 'text.primary',
-              fontWeight: 600,
-            }}>
-            {tab.label}
-          </Typography>
-          <Box mt={2.5}>{tab.content}</Box>
-        </Box>
-      ))}
+              tab.sx
+            )}>
+            <Typography
+              sx={{
+                color: 'text.primary',
+                fontWeight: 600,
+              }}>
+              {tab.label}
+            </Typography>
+            <Box mt={2.5}>{tab.content}</Box>
+          </Box>
+        );
+      })}
     </Box>
   );
 }