@0xchain/header 1.1.0-beta.89 → 1.1.0-beta.90

package/dist/lib/Nav.js

@@ -8,23 +8,20 @@ import { twMerge } from "tailwind-merge";
 import BetterLink from "@0xchain/better-link";
 import { useLocale } from "@0xchain/i18n/react";
 import Logout from "./User/Logout.js";
-import { useState, useCallback, useEffect } from "react";
+import { useState } from "react";
 import SignIn from "./User/SignIn.js";
-import { getClientSession, getRuntimeLoginState } from "@0xchain/auth";
-import { onUserEvent, USER_EVENTS } from "./events.js";
 import { usePathname } from "next/navigation";
 import Explorer from "./Explorer.js";
 import Products from "./Products.js";
+import PointsEntry from "./PointsEntry.js";
 import { useIsChaindigg } from "./context.js";
-import { hasProfileIdentity, fetchHeaderProfile } from "./authProfile.js";
+import { useHeaderUser } from "./useHeaderUser.js";
 function Nav({ onClick = () => void 0, hideNews = false, hideLogin = false, user }) {
   const isChaindigg = useIsChaindigg();
   const { gotoAISQL, gotoChat } = BetterLink();
   const locale = useLocale();
   const pathname = usePathname();
-  const [userKey, setUserKey] = useState("");
-  const [userInfo, setUserInfo] = useState(user);
-  const hasUserProfile = hasProfileIdentity(userInfo);
+  const { userInfo, hasUserProfile, userKey } = useHeaderUser(user);
   const [, setExplorerExpanded] = useState(false);
   const ichaingoNavList = [
     {
@@ -105,31 +102,6 @@ function Nav({ onClick = () => void 0, hideNews = false, hideLogin = false, user
     }
   ];
   const NavList = isChaindigg ? chaindiggNavList : ichaingoNavList;
-  const updateUserInfo = useCallback(async () => {
-    try {
-      const profile = await fetchHeaderProfile();
-      setUserInfo(profile || {});
-      setUserKey((/* @__PURE__ */ new Date()).getTime().toString());
-      return profile;
-    } catch (error) {
-      console.error(error);
-      setUserInfo({});
-      return null;
-    }
-  }, []);
-  useEffect(() => {
-    if (isChaindigg) return;
-    const cleanProfileUpdated = onUserEvent(USER_EVENTS.PROFILE_UPDATED, updateUserInfo);
-    const cleanLoggedIn = onUserEvent(USER_EVENTS.LOGGED_IN, updateUserInfo);
-    const cookieLoggedIn = getClientSession().isLoggedIn;
-    if (!hasUserProfile && (cookieLoggedIn || getRuntimeLoginState() === true)) {
-      updateUserInfo();
-    }
-    return () => {
-      cleanProfileUpdated();
-      cleanLoggedIn();
-    };
-  }, [hasUserProfile, isChaindigg, updateUserInfo]);
   if (isChaindigg) {
     return /* @__PURE__ */ jsxs(
       "nav",
@@ -228,6 +200,7 @@ function Nav({ onClick = () => void 0, hideNews = false, hideLogin = false, user
             })
           }
         ),
+        !pathname.includes("/login") && !hideLogin ? /* @__PURE__ */ jsx(PointsEntry, { userInfo, className: "hidden md:inline-flex", onClick }) : null,
         /* @__PURE__ */ jsx(Setting, { onClick }),
         !pathname.includes("/login") && !hideLogin ? /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(UserControl, { onClick, userInfo }, userKey),

package/dist/lib/PointsEntry.js

@@ -0,0 +1,51 @@
+'use client';
+import { jsxs, jsx } from "react/jsx-runtime";
+import LinkBar from "@0xchain/link";
+import Translation from "@0xchain/translation";
+import ImageBar from "@0xchain/image";
+import { twMerge } from "tailwind-merge";
+import { hasProfileIdentity } from "./authProfile.js";
+import { HEADER_POINTS_ICON, formatHeaderPoints } from "./headerPoints.js";
+import { useIsChaindigg } from "./context.js";
+function PointsEntry({
+  userInfo,
+  className,
+  onClick
+}) {
+  const isChaindigg = useIsChaindigg();
+  if (isChaindigg || !hasProfileIdentity(userInfo)) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(
+    LinkBar,
+    {
+      href: "/user-center/points",
+      baseUrl: process.env.NEXT_PUBLIC_AUTH_URL,
+      onClick,
+      className: twMerge(
+        "inline-flex shrink-0 items-center gap-1 h-8 px-3 rounded-full border border-primary/30 bg-background hover:bg-primary/5 text-sm whitespace-nowrap",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          ImageBar,
+          {
+            src: HEADER_POINTS_ICON,
+            width: 16,
+            height: 16,
+            alt: "",
+            className: "shrink-0"
+          }
+        ),
+        /* @__PURE__ */ jsxs("span", { className: "text-foreground", children: [
+          /* @__PURE__ */ jsx(Translation, { value: "points", parentKey: "account" }),
+          ": "
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "text-primary font-medium", children: formatHeaderPoints(userInfo) })
+      ]
+    }
+  );
+}
+export {
+  PointsEntry as default
+};

package/dist/lib/Right.js

@@ -1,7 +1,10 @@
+'use client';
 import { jsxs, jsx } from "react/jsx-runtime";
 import Nav from "./Nav.js";
 import Drawer from "./Drawer.js";
+import PointsEntry from "./PointsEntry.js";
 import { twMerge } from "tailwind-merge";
+import { useHeaderUser } from "./useHeaderUser.js";
 var HeaderSource = /* @__PURE__ */ ((HeaderSource2) => {
   HeaderSource2["EXPLORER"] = "explorer";
   HeaderSource2["CHAT"] = "chat";
@@ -15,9 +18,15 @@ function Right({
   source = "default"
   /* DEFAULT */
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: twMerge(source === "chat" ? "" : "flex md:flex-1 justify-start items-center md:gap-10 z-1001"), children: [
-    /* @__PURE__ */ jsx(Drawer, { hideLogin, hideNews, user }),
-    /* @__PURE__ */ jsx("div", { className: "hidden md:block flex-1", children: /* @__PURE__ */ jsx(Nav, { hideNews, hideLogin, user }) })
+  const { userInfo } = useHeaderUser(user);
+  const showPoints = !hideLogin;
+  return /* @__PURE__ */ jsxs("div", { className: twMerge(
+    "flex items-center gap-2 z-1001",
+    source === "chat" ? "" : "md:flex-1 md:justify-start md:gap-10"
+  ), children: [
+    showPoints ? /* @__PURE__ */ jsx(PointsEntry, { userInfo, className: "md:hidden" }) : null,
+    /* @__PURE__ */ jsx(Drawer, { hideLogin, hideNews, user: userInfo }),
+    /* @__PURE__ */ jsx("div", { className: "hidden md:block flex-1", children: /* @__PURE__ */ jsx(Nav, { hideNews, hideLogin, user: userInfo }) })
   ] });
 }
 export {

package/dist/lib/headerPoints.js

@@ -0,0 +1,19 @@
+function formatHeaderPoints(userInfo) {
+  const display = userInfo?.displayBalance;
+  if (typeof display === "string" && display.trim()) {
+    return display.trim();
+  }
+  const points = Number(userInfo?.points);
+  if (!Number.isFinite(points) || points < 0) {
+    return "0";
+  }
+  if (points > 99999) {
+    return "99999";
+  }
+  return String(Math.trunc(points));
+}
+const HEADER_POINTS_ICON = `${process.env.NEXT_PUBLIC_CDN_URL || ""}/uploads/2026/08/31/6a952e3b78f30.png`;
+export {
+  HEADER_POINTS_ICON,
+  formatHeaderPoints
+};

package/dist/lib/useHeaderUser.js

@@ -0,0 +1,44 @@
+'use client';
+import { useState, useCallback, useEffect } from "react";
+import { getClientSession, getRuntimeLoginState } from "@0xchain/auth";
+import { hasProfileIdentity, fetchHeaderProfile } from "./authProfile.js";
+import { onUserEvent, USER_EVENTS } from "./events.js";
+import { useIsChaindigg } from "./context.js";
+function useHeaderUser(user) {
+  const isChaindigg = useIsChaindigg();
+  const [userKey, setUserKey] = useState("");
+  const [userInfo, setUserInfo] = useState(user);
+  const hasUserProfile = hasProfileIdentity(userInfo);
+  const updateUserInfo = useCallback(async () => {
+    try {
+      const profile = await fetchHeaderProfile();
+      setUserInfo(profile || {});
+      setUserKey((/* @__PURE__ */ new Date()).getTime().toString());
+      return profile;
+    } catch (error) {
+      console.error(error);
+      setUserInfo({});
+      return null;
+    }
+  }, []);
+  useEffect(() => {
+    setUserInfo(user);
+  }, [user]);
+  useEffect(() => {
+    if (isChaindigg) return;
+    const cleanProfileUpdated = onUserEvent(USER_EVENTS.PROFILE_UPDATED, updateUserInfo);
+    const cleanLoggedIn = onUserEvent(USER_EVENTS.LOGGED_IN, updateUserInfo);
+    const cookieLoggedIn = getClientSession().isLoggedIn;
+    if (!hasUserProfile && (cookieLoggedIn || getRuntimeLoginState() === true)) {
+      updateUserInfo();
+    }
+    return () => {
+      cleanProfileUpdated();
+      cleanLoggedIn();
+    };
+  }, [hasUserProfile, isChaindigg, updateUserInfo]);
+  return { userInfo, hasUserProfile, userKey };
+}
+export {
+  useHeaderUser
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@0xchain/header",
-  "version": "1.1.0-beta.89",
+  "version": "1.1.0-beta.90",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -26,7 +26,7 @@
     "react": "19.1.1",
     "react-dom": "19.1.1",
     "tailwind-merge": "3.3.1",
-    "@0xchain/with-login": "1.1.0-beta.89"
+    "@0xchain/with-login": "1.1.0-beta.90"
   },
   "devDependencies": {
     "@0xchain/next-themes": "1.0.0",
@@ -41,21 +41,21 @@
     "react-dom": "19.1.1",
     "rollup-plugin-preserve-use-client": "3.0.1",
     "tailwind-merge": "3.3.1",
-    "@0xchain/with-login": "1.1.0-beta.89"
+    "@0xchain/with-login": "1.1.0-beta.90"
   },
   "dependencies": {
-    "@0xchain/auth": "1.1.0-beta.89",
-    "@0xchain/avatar": "1.1.0-beta.89",
-    "@0xchain/i18n": "1.1.0-beta.89",
-    "@0xchain/link": "1.1.0-beta.89",
-    "@0xchain/better-link": "1.1.0-beta.89",
-    "@0xchain/theme-toggle": "1.1.0-beta.89",
-    "@0xchain/request": "1.1.0-beta.89",
-    "@0xchain/tooltip": "1.1.0-beta.89",
-    "@0xchain/iconfont": "1.1.0-beta.89",
-    "@0xchain/translation": "1.1.0-beta.89",
-    "@0xchain/ui": "1.1.0-beta.89",
-    "@0xchain/image": "1.1.0-beta.89"
+    "@0xchain/auth": "1.1.0-beta.90",
+    "@0xchain/better-link": "1.1.0-beta.90",
+    "@0xchain/iconfont": "1.1.0-beta.90",
+    "@0xchain/avatar": "1.1.0-beta.90",
+    "@0xchain/i18n": "1.1.0-beta.90",
+    "@0xchain/image": "1.1.0-beta.90",
+    "@0xchain/request": "1.1.0-beta.90",
+    "@0xchain/theme-toggle": "1.1.0-beta.90",
+    "@0xchain/link": "1.1.0-beta.90",
+    "@0xchain/translation": "1.1.0-beta.90",
+    "@0xchain/ui": "1.1.0-beta.90",
+    "@0xchain/tooltip": "1.1.0-beta.90"
   },
   "nx": {
     "tags": [