@ludo.ninja/components 2.2.46 → 2.2.47
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/api/server-experiences/queries/useFetchMyActivityStreak/index.js +6 -4
- package/build/components/base/UserStreak/index.d.ts +2 -1
- package/build/components/base/UserStreak/index.js +3 -3
- package/build/components/headers/components/headerStreak/index.d.ts +2 -1
- package/build/components/headers/components/headerStreak/index.js +2 -2
- package/build/components/headers/headerSearch/index.js +2 -2
- package/package.json +1 -1
|
@@ -34,10 +34,12 @@ const useFetchMyActivityStreak = () => {
|
|
|
34
34
|
});
|
|
35
35
|
},
|
|
36
36
|
onError: (err) => {
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
37
|
+
if (err.cause?.extensions?.classification !== 'NOT_FOUND') {
|
|
38
|
+
openAlert({
|
|
39
|
+
type: type_1.alertVariants.error,
|
|
40
|
+
caption: err.message,
|
|
41
|
+
});
|
|
42
|
+
}
|
|
41
43
|
resetUserStreak();
|
|
42
44
|
setErrorStreak(err);
|
|
43
45
|
setIsLoadingStreak(false);
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
type UserStreakProps = {
|
|
2
2
|
className?: string;
|
|
3
3
|
style?: React.CSSProperties;
|
|
4
|
+
tooltipPosition?: string;
|
|
4
5
|
};
|
|
5
|
-
declare const UserStreak: ({ className, style }: UserStreakProps) => import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
declare const UserStreak: ({ className, style, tooltipPosition }: UserStreakProps) => import("react/jsx-runtime").JSX.Element;
|
|
6
7
|
export default UserStreak;
|
|
@@ -134,14 +134,14 @@ const CheckSVGIcon = () => {
|
|
|
134
134
|
const TooltipSVGIcon = () => {
|
|
135
135
|
return ((0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: [(0, jsx_runtime_1.jsx)("circle", { cx: "5.99961", cy: "5.99998", r: "5.4", fill: "#CFD5EA" }), (0, jsx_runtime_1.jsx)("path", { d: "M5.45313 7.25185C5.45313 6.9264 5.509 6.65077 5.62074 6.42495C5.73247 6.19249 5.8705 5.99323 6.03482 5.82719C6.19914 5.6545 6.36017 5.49178 6.51792 5.33902C6.68224 5.17961 6.82027 5.01357 6.932 4.84088C7.04374 4.66155 7.09961 4.44902 7.09961 4.20327C7.09961 4.03723 7.06017 3.86786 6.9813 3.69517C6.909 3.52249 6.78083 3.37969 6.59679 3.26678C6.41276 3.14723 6.1597 3.08745 5.83764 3.08745C5.51557 3.08745 5.2428 3.15055 5.01933 3.27674C4.80243 3.40293 4.63153 3.56898 4.50665 3.77488C4.38834 3.98077 4.31933 4.19995 4.29961 4.43241H3.59961C3.61933 4.06711 3.71792 3.7317 3.89538 3.42618C4.07942 3.11402 4.32919 2.86495 4.64468 2.67898C4.96675 2.49301 5.34468 2.40002 5.77848 2.40002C6.25172 2.40002 6.63623 2.48969 6.932 2.66902C7.23435 2.8417 7.45454 3.06752 7.59257 3.34648C7.7306 3.61879 7.79961 3.90439 7.79961 4.20327C7.79961 4.51543 7.74374 4.77779 7.632 4.99032C7.52684 5.19622 7.3921 5.38219 7.22778 5.54823C7.07003 5.70764 6.909 5.86372 6.74468 6.01648C6.58036 6.16924 6.44233 6.34525 6.3306 6.5445C6.22543 6.73711 6.17285 6.9729 6.17285 7.25185H5.45313Z", fill: "#696F90" }), (0, jsx_runtime_1.jsx)("path", { d: "M5.81299 9.78175C5.61881 9.78175 5.45594 9.72118 5.3244 9.60002C5.19286 9.47887 5.12708 9.32887 5.12708 9.15002C5.12708 8.97118 5.19286 8.82118 5.3244 8.70002C5.45594 8.57887 5.61881 8.51829 5.81299 8.51829C6.00091 8.51829 6.16064 8.57887 6.29218 8.70002C6.42373 8.82118 6.4895 8.97118 6.4895 9.15002C6.4895 9.32887 6.42373 9.47887 6.29218 9.60002C6.16064 9.72118 6.00091 9.78175 5.81299 9.78175Z", fill: "#696F90" })] }));
|
|
136
136
|
};
|
|
137
|
-
const UserStreak = ({ className, style }) => {
|
|
137
|
+
const UserStreak = ({ className, style, tooltipPosition = 'bottomLeft' }) => {
|
|
138
138
|
const { userStreak, isLoadingStreak, errorStreak } = (0, store_1.useUserStore)((state) => ({
|
|
139
139
|
userStreak: state.userStreak,
|
|
140
140
|
isLoadingStreak: state.isLoadingStreak,
|
|
141
141
|
errorStreak: state.errorStreak,
|
|
142
142
|
}));
|
|
143
143
|
const isShowSkeleton = isLoadingStreak;
|
|
144
|
-
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:
|
|
144
|
+
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: tooltipPosition, trigger: ['hover', 'click', 'focus'], showArrow: false, styles: {
|
|
145
145
|
root: {
|
|
146
146
|
backgroundColor: '#ffffff',
|
|
147
147
|
opacity: 1,
|
|
@@ -152,7 +152,7 @@ const UserStreak = ({ className, style }) => {
|
|
|
152
152
|
borderRadius: '12px',
|
|
153
153
|
border: 'none',
|
|
154
154
|
},
|
|
155
|
-
},
|
|
155
|
+
}, overlay: (0, jsx_runtime_1.jsxs)(StreakInfo, { children: [(0, jsx_runtime_1.jsx)("div", { className: 'title', children: "Keep Your Daily Streak Going!" }), (0, jsx_runtime_1.jsxs)("ul", { className: 'description', children: [(0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u2022 Visit an Opportunity:" }), "Explore one from the \"New Opportunities\" section to maintain your streak."] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u2022 Share an Opportunity:" }), "Use the available sharing options to tell a friend and keep earning."] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u2022 Reminder:" }), "Maintain your streak to increase your daily XP and reach exciting milestone bonuses!"] })] })] }), children: (0, jsx_runtime_1.jsx)("span", { style: {
|
|
156
156
|
cursor: 'pointer',
|
|
157
157
|
display: 'flex',
|
|
158
158
|
alignItems: 'center',
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
declare const HeaderStreak: import("styled-components").StyledComponent<({ className, style }: {
|
|
1
|
+
declare const HeaderStreak: import("styled-components").StyledComponent<({ className, style, tooltipPosition }: {
|
|
2
2
|
className?: string;
|
|
3
3
|
style?: React.CSSProperties;
|
|
4
|
+
tooltipPosition?: string;
|
|
4
5
|
}) => import("react/jsx-runtime").JSX.Element, import("styled-components").DefaultTheme, {}, never>;
|
|
5
6
|
export default HeaderStreak;
|
|
@@ -9,12 +9,12 @@ const ScreenWidth_1 = require("../../../../styles/ScreenWidth");
|
|
|
9
9
|
const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
|
|
10
10
|
const HeaderStreak = (0, styled_components_1.default)(UserStreak_1.default) `
|
|
11
11
|
flex-direction: column;
|
|
12
|
-
gap: 2px;
|
|
12
|
+
gap: 2px !important;
|
|
13
13
|
align-items: end;
|
|
14
14
|
margin-right: 20px;
|
|
15
15
|
|
|
16
16
|
${ScreenWidth_1.mediaQuery.minWidthFourK} {
|
|
17
|
-
gap: ${(0, _4k_1.adaptiveValueCalc)(2)};
|
|
17
|
+
gap: ${(0, _4k_1.adaptiveValueCalc)(2)} !important;
|
|
18
18
|
margin-right: ${(0, _4k_1.adaptiveValueCalc)(20)};
|
|
19
19
|
}
|
|
20
20
|
`;
|
|
@@ -13,7 +13,7 @@ const ui_1 = require("../../../store/ui");
|
|
|
13
13
|
const auth_1 = require("../../../utils/auth");
|
|
14
14
|
const ludoDomains_1 = require("@ludo.ninja/core/build/ludoDomains");
|
|
15
15
|
const header_1 = require("@ludo.ninja/ui/build/components/header");
|
|
16
|
-
const
|
|
16
|
+
const headerStreak_1 = __importDefault(require("../components/headerStreak"));
|
|
17
17
|
// Component
|
|
18
18
|
const HeaderSearch = ({ showXP = true }) => {
|
|
19
19
|
const openSidebar = (0, ui_1.useUiStore)((state) => state.openSidebar);
|
|
@@ -28,7 +28,7 @@ const HeaderSearch = ({ showXP = true }) => {
|
|
|
28
28
|
}, slots: {
|
|
29
29
|
...(showXP ? {
|
|
30
30
|
headerExpLabel: (0, jsx_runtime_1.jsx)(headerExperienceLabel_1.default, { userId: getUser?.userId || "" }),
|
|
31
|
-
headerDaysStreak: (0, jsx_runtime_1.jsx)(
|
|
31
|
+
headerDaysStreak: (0, jsx_runtime_1.jsx)(headerStreak_1.default, { tooltipPosition: 'bottom' })
|
|
32
32
|
} : {}),
|
|
33
33
|
headerUserPick: (0, jsx_runtime_1.jsx)(headerUserPic_1.default, { userId: getUser?.userId || "" }),
|
|
34
34
|
logoLinkComponent: ({ children }) => ((0, jsx_runtime_1.jsx)("a", { href: ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE][isProd() ? "profile" : "app"], children: children })),
|