@ludo.ninja/components 2.2.43 → 2.2.45

package/build/components/base/UserStreak/index.d.ts

@@ -1,3 +1,4 @@
+import 'rc-tooltip/assets/bootstrap_white.css';
 type UserStreakProps = {
     className?: string;
     style?: React.CSSProperties;

package/build/components/base/UserStreak/index.js

@@ -11,6 +11,7 @@ const ScreenWidth_1 = require("../../../styles/ScreenWidth");
 const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
 const store_1 = require("../../../modules/user/store");
 const rc_tooltip_1 = __importDefault(require("rc-tooltip"));
+require("rc-tooltip/assets/bootstrap_white.css");
 const react_loading_skeleton_1 = __importDefault(require("react-loading-skeleton"));
 const Wrapper = styled_components_1.default.div `
   display: flex;
@@ -140,7 +141,7 @@ const UserStreak = ({ className, style }) => {
         isLoadingStreak: state.isLoadingStreak,
         errorStreak: state.errorStreak,
     }));
-    const isShowSkeleton = isLoadingStreak || errorStreak;
+    const isShowSkeleton = isLoadingStreak;
     return ((0, jsx_runtime_1.jsxs)(Wrapper, { className: className, style: style, children: [(0, jsx_runtime_1.jsx)("div", { className: 'streak-count', children: isShowSkeleton ? ((0, jsx_runtime_1.jsx)(react_loading_skeleton_1.default, { className: 'skeleton-streak', width: '85px' })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { children: [userStreak.totalDays, " Days Streak"] }), (0, jsx_runtime_1.jsx)(CheckSVGIcon, {})] })) }), (0, jsx_runtime_1.jsx)("div", { className: 'streak-bonus', children: isShowSkeleton ? ((0, jsx_runtime_1.jsx)(react_loading_skeleton_1.default, { className: 'skeleton-streak', width: '215px' })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { children: ["Next Bonus: ", userStreak.nextStreak, " Days Streak +", userStreak.nextBonus, " XP."] }), (0, jsx_runtime_1.jsx)(rc_tooltip_1.default, { placement: "bottomLeft", trigger: ['hover', 'click', 'focus'], showArrow: false, styles: {
                                 root: {
                                     backgroundColor: '#ffffff',

package/build/components/headers/headerSearch/index.js

@@ -13,7 +13,7 @@ const ui_1 = require("../../../store/ui");
 const auth_1 = require("../../../utils/auth");
 const ludoDomains_1 = require("@ludo.ninja/core/build/ludoDomains");
 const header_1 = require("@ludo.ninja/ui/build/components/header");
-const headerStreak_1 = __importDefault(require("../components/headerStreak"));
+const UserStreak_1 = __importDefault(require("../../base/UserStreak"));
 // Component
 const HeaderSearch = ({ showXP = true }) => {
     const openSidebar = (0, ui_1.useUiStore)((state) => state.openSidebar);
@@ -28,7 +28,7 @@ const HeaderSearch = ({ showXP = true }) => {
         }, slots: {
             ...(showXP ? {
                 headerExpLabel: (0, jsx_runtime_1.jsx)(headerExperienceLabel_1.default, { userId: getUser?.userId || "" }),
-                headerUserPick: (0, jsx_runtime_1.jsx)(headerStreak_1.default, {})
+                headerDaysStreak: (0, jsx_runtime_1.jsx)(UserStreak_1.default, {})
             } : {}),
             headerUserPick: (0, jsx_runtime_1.jsx)(headerUserPic_1.default, { userId: getUser?.userId || "" }),
             logoLinkComponent: ({ children }) => ((0, jsx_runtime_1.jsx)("a", { href: ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE][isProd() ? "profile" : "app"], children: children })),

package/build/components/sidebar/sidebarInviteCodeLabel/index.js

@@ -24,6 +24,13 @@ const StyledSidebarInviteCodeLabel = styled_components_1.default.div `
     margin-top: ${(0, _4k_1.adaptiveValueCalc)(16)};
   }
 `;
+const StyledUserStreak = (0, styled_components_1.default)(UserStreak_1.default) `
+  margin-top: 16px;
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    margin-top: ${(0, _4k_1.adaptiveValueCalc)(16)};
+  }
+`;
 // Component
 const SidebarInviteCodeLabel = () => {
     const { getUser, userExp, isLoadingExp, errorExp, isLoadingProfileData, inviteCodes, } = (0, store_1.useUserStore)((state) => ({
@@ -36,7 +43,7 @@ const SidebarInviteCodeLabel = () => {
     }));
     const NEXT_PUBLIC_ENV_VALUE = (0, env_1.useEnvStore)((state) => state.NEXT_PUBLIC_ENV_VALUE);
     const unUsedInviteCodes = inviteCodes?.filter((code) => !code.isUsed);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(StyledSidebarInviteCodeLabel, { children: [(0, jsx_runtime_1.jsx)(ExperienceLabel_1.default, { value: userExp.xps, link: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["app"]}/rewards/${getUser?.userId}`, loading: isLoadingExp || !!errorExp }), !!unUsedInviteCodes && ((0, jsx_runtime_1.jsx)(InviteLabel_1.default, { value: unUsedInviteCodes.length, link: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["app"]}/invite-codes`, loading: isLoadingProfileData }))] }), (0, jsx_runtime_1.jsx)(UserStreak_1.default, {})] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(StyledSidebarInviteCodeLabel, { children: [(0, jsx_runtime_1.jsx)(ExperienceLabel_1.default, { value: userExp.xps, link: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["app"]}/rewards/${getUser?.userId}`, loading: isLoadingExp || !!errorExp }), !!unUsedInviteCodes && ((0, jsx_runtime_1.jsx)(InviteLabel_1.default, { value: unUsedInviteCodes.length, link: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["app"]}/invite-codes`, loading: isLoadingProfileData }))] }), (0, jsx_runtime_1.jsx)(StyledUserStreak, {})] }));
 };
 // Export
 exports.default = SidebarInviteCodeLabel;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ludo.ninja/components",
-  "version": "2.2.43",
+  "version": "2.2.45",
   "private": false,
   "main": "build/index.js",
   "types": "build/index.d.ts",