@ludo.ninja/components 2.4.3 → 2.4.5

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.
@@ -108,18 +108,18 @@ const useSidebarData = () => {
108
108
  icon: (0, jsx_runtime_1.jsx)(icons_1.RewardsIcon, {}),
109
109
  isExternalUrl: false,
110
110
  },
111
- {
112
- href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["account"]}/referrals`,
113
- title: "Referral Dashboard",
114
- icon: (0, jsx_runtime_1.jsx)(icons_1.ReferralDashboardIcon, {}),
115
- isExternalUrl: false,
116
- },
117
- {
118
- href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["app"]}/invite-codes`,
119
- title: "My invites",
120
- icon: (0, jsx_runtime_1.jsx)(icons_1.MyInvitesIcon, {}),
121
- isExternalUrl: false,
122
- },
111
+ // {
112
+ // href: `${ludoDomains[NEXT_PUBLIC_ENV_VALUE as TEnvValue]["account"]}/referrals`,
113
+ // title: "Referral Dashboard",
114
+ // icon: <ReferralDashboardIcon />,
115
+ // isExternalUrl: false,
116
+ // },
117
+ // {
118
+ // href: `${ludoDomains[NEXT_PUBLIC_ENV_VALUE as TEnvValue]["app"]}/invite-codes`,
119
+ // title: "My invites",
120
+ // icon: <MyInvitesIcon />,
121
+ // isExternalUrl: false,
122
+ // },
123
123
  ]
124
124
  : []),
125
125
  ];
@@ -7,8 +7,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
7
7
  const data_1 = require("./data");
8
8
  const sidebarInviteCodeLabel_1 = __importDefault(require("./sidebarInviteCodeLabel"));
9
9
  const useExtension_1 = __importDefault(require("../../hooks/extension/useExtension"));
10
+ const useRefCode_1 = require("../../hooks/refCode/useRefCode");
10
11
  const useSignOut_1 = require("../../modules/user/auth/useSignOut");
11
12
  const store_1 = require("../../modules/user/store");
13
+ const env_1 = require("../../store/env");
12
14
  const ui_1 = require("../../store/ui");
13
15
  const ScreenWidth_1 = require("../../styles/ScreenWidth");
14
16
  const Userpic_1 = __importDefault(require("../../system/Img/Userpic"));
@@ -21,7 +23,6 @@ const MainButton_1 = __importDefault(require("@ludo.ninja/ui/build/system/Button
21
23
  const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
22
24
  const link_1 = __importDefault(require("next/link"));
23
25
  const styled_components_1 = __importDefault(require("styled-components"));
24
- const useRefCode_1 = require("../../hooks/refCode/useRefCode");
25
26
  const MenuItem = styled_components_1.default.div `
26
27
  font-size: 15px;
27
28
  font-weight: 500;
@@ -101,6 +102,7 @@ const Sidebar = () => {
101
102
  const closeSidebar = (0, ui_1.useUiStore)((state) => state.closeSidebar);
102
103
  const isSidebarOpen = (0, ui_1.useUiStore)((state) => state.isSidebarOpen);
103
104
  const isAuthorized = (0, store_1.useUserStore)((state) => state.isSignedIn);
105
+ const isProd = (0, env_1.useEnvStore)((state) => state.isProd);
104
106
  const getUser = (0, store_1.useUserStore)((state) => state.user);
105
107
  const signOut = (0, useSignOut_1.useSignOut)();
106
108
  const { deviceType } = (0, screen_1.useWindowDimensions)();
@@ -121,7 +123,7 @@ const Sidebar = () => {
121
123
  menu: sideBarData.map(({ title, href, icon, isExternalUrl }) => ((0, jsx_runtime_1.jsxs)(SLink, { href: href, target: isExternalUrl ? "_blank" : "_self", onClick: closeSidebar, passHref: isExternalUrl, scale: (0, scale_1.getAdaptiveScale)({ windowDimensions, currentSize: 1 }), children: [(0, jsx_runtime_1.jsx)("span", { className: "icon-wrapper", children: icon }), title] }, title))),
122
124
  userPicture: ({ children, height, width, isNeedBoxTransform }) => ((0, jsx_runtime_1.jsx)(Userpic_1.default, { width: width, height: height, userId: userId, isNeedBoxTransform: isNeedBoxTransform, children: children })),
123
125
  inviteCode: (0, jsx_runtime_1.jsx)(sidebarInviteCodeLabel_1.default, {}),
124
- ...(deviceType == "isDesktop" && isAuthorized
126
+ ...(deviceType == "isDesktop" && isAuthorized && !isProd()
125
127
  ? {
126
128
  beforeMenu: ((0, jsx_runtime_1.jsx)(BeforeMenuContainer, { children: isExtensionInstalled ? ((0, jsx_runtime_1.jsxs)(MenuItem, { onClick: () => {
127
129
  closeSidebar();
@@ -1,23 +1,50 @@
1
1
  "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
2
25
  var __importDefault = (this && this.__importDefault) || function (mod) {
3
26
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
27
  };
5
28
  Object.defineProperty(exports, "__esModule", { value: true });
6
29
  const jsx_runtime_1 = require("react/jsx-runtime");
7
- const styled_components_1 = __importDefault(require("styled-components"));
8
- const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
9
30
  const store_1 = require("../../../modules/user/store");
31
+ const env_1 = require("../../../store/env");
10
32
  const ScreenWidth_1 = require("../../../styles/ScreenWidth");
11
33
  const ExperienceLabel_1 = __importDefault(require("../../../system/Labels/ExperienceLabel"));
12
34
  const InviteLabel_1 = __importDefault(require("../../../system/Labels/InviteLabel"));
13
- const env_1 = require("../../../store/env");
14
35
  const ludoDomains_1 = require("@ludo.ninja/core/build/ludoDomains");
36
+ const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
37
+ const styled_components_1 = __importStar(require("styled-components"));
38
+ const educatorBadge_1 = __importDefault(require("../../userBadges/educatorBadge"));
39
+ const ambassadorBadge_1 = __importDefault(require("../../userBadges/ambassadorBadge"));
40
+ const typography_1 = require("@ludo.ninja/ui/build/styles/typography");
15
41
  // import UserStreak from "@/components/base/UserStreak";
16
42
  // Styles
17
43
  const StyledSidebarInviteCodeLabel = styled_components_1.default.div `
18
44
  display: flex;
19
45
  gap: 16px;
20
46
  margin-top: 16px;
47
+ flex-wrap: wrap;
21
48
 
22
49
  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
23
50
  gap: ${(0, _4k_1.adaptiveValueCalc)(16)};
@@ -31,9 +58,20 @@ const StyledSidebarInviteCodeLabel = styled_components_1.default.div `
31
58
  // margin-top: ${adaptiveValueCalc(16)};
32
59
  // }
33
60
  // `;
61
+ const BadgeStyles = (0, styled_components_1.css) `
62
+ h6 {
63
+ ${typography_1.FH5}
64
+ }
65
+ `;
66
+ const SidebarEducatorBadge = (0, styled_components_1.default)(educatorBadge_1.default) `
67
+ ${BadgeStyles};
68
+ `;
69
+ const SidebarAmbassadorBadge = (0, styled_components_1.default)(ambassadorBadge_1.default) `
70
+ ${BadgeStyles};
71
+ `;
34
72
  // Component
35
73
  const SidebarInviteCodeLabel = () => {
36
- const { getUser, userExp, isLoadingExp, errorExp, isLoadingProfileData, inviteCodes, } = (0, store_1.useUserStore)((state) => ({
74
+ const { getUser, userExp, isLoadingExp, errorExp, isLoadingProfileData, inviteCodes } = (0, store_1.useUserStore)((state) => ({
37
75
  getUser: state.user,
38
76
  userExp: state.userExp,
39
77
  isLoadingExp: state.isLoadingExp,
@@ -42,8 +80,20 @@ const SidebarInviteCodeLabel = () => {
42
80
  inviteCodes: state.inviteCodes,
43
81
  }));
44
82
  const NEXT_PUBLIC_ENV_VALUE = (0, env_1.useEnvStore)((state) => state.NEXT_PUBLIC_ENV_VALUE);
83
+ const isProd = (0, env_1.useEnvStore)((state) => state.isProd);
45
84
  const unUsedInviteCodes = inviteCodes?.filter((code) => !code.isUsed);
46
- return ((0, jsx_runtime_1.jsx)(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 }))] }) }));
85
+ const profileData = (0, store_1.useUserStore)((state) => state.profileData);
86
+ const getBadge = () => {
87
+ switch (profileData?.getBoost()) {
88
+ case 'EDUCATOR':
89
+ return (0, jsx_runtime_1.jsx)(SidebarEducatorBadge, { backgroundColor: '#ffffff' });
90
+ case 'AMBASSADOR':
91
+ return (0, jsx_runtime_1.jsx)(SidebarAmbassadorBadge, { backgroundColor: '#ffffff' });
92
+ default:
93
+ return null;
94
+ }
95
+ };
96
+ return ((0, jsx_runtime_1.jsx)(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 }), getBadge(), !!unUsedInviteCodes && !isProd() && ((0, jsx_runtime_1.jsx)(InviteLabel_1.default, { value: unUsedInviteCodes.length, link: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["app"]}/invite-codes`, loading: isLoadingProfileData }))] }) }));
47
97
  };
48
98
  // Export
49
99
  exports.default = SidebarInviteCodeLabel;
@@ -19,6 +19,7 @@ const sidebar_1 = require("@ludo.ninja/ui/build/components/sidebar");
19
19
  const MainButton_1 = __importDefault(require("@ludo.ninja/ui/build/system/Buttons/MainButton"));
20
20
  const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
21
21
  const styled_components_1 = __importDefault(require("styled-components"));
22
+ const env_1 = require("../../store/env");
22
23
  const MenuItem = styled_components_1.default.div `
23
24
  font-size: 15px;
24
25
  font-weight: 500;
@@ -98,6 +99,7 @@ const SidebarSpa = ({ SLink, UserPic, SidebarInviteCodeLabel, }) => {
98
99
  const closeSidebar = (0, ui_1.useUiStore)((state) => state.closeSidebar);
99
100
  const isSidebarOpen = (0, ui_1.useUiStore)((state) => state.isSidebarOpen);
100
101
  const isAuthorized = (0, store_1.useUserStore)((state) => state.isSignedIn);
102
+ const isProd = (0, env_1.useEnvStore)((state) => state.isProd);
101
103
  const getUser = (0, store_1.useUserStore)((state) => state.user);
102
104
  const signOut = (0, useSignOut_1.useSignOut)();
103
105
  const { deviceType } = (0, screen_1.useWindowDimensions)();
@@ -118,7 +120,7 @@ const SidebarSpa = ({ SLink, UserPic, SidebarInviteCodeLabel, }) => {
118
120
  menu: sideBarData.map(({ title, href, icon, isExternalUrl }) => ((0, jsx_runtime_1.jsxs)(SLink, { href: href, target: isExternalUrl ? "_blank" : "_self", onClick: closeSidebar, passHref: isExternalUrl, scale: (0, scale_1.getAdaptiveScale)({ windowDimensions, currentSize: 1 }), children: [(0, jsx_runtime_1.jsx)("span", { className: "icon-wrapper", children: icon }), title] }, title))),
119
121
  userPicture: ({ children, height, width, isNeedBoxTransform }) => ((0, jsx_runtime_1.jsx)(UserPic, { width: width, height: height, userId: userId, isNeedBoxTransform: isNeedBoxTransform, children: children })),
120
122
  inviteCode: (0, jsx_runtime_1.jsx)(SidebarInviteCodeLabel, {}),
121
- ...(deviceType == "isDesktop" && isAuthorized
123
+ ...(deviceType == "isDesktop" && isAuthorized && !isProd()
122
124
  ? {
123
125
  beforeMenu: ((0, jsx_runtime_1.jsx)(BeforeMenuContainer, { children: isExtensionInstalled ? ((0, jsx_runtime_1.jsxs)(MenuItem, { onClick: () => {
124
126
  closeSidebar();
@@ -1,6 +1,7 @@
1
1
  import { FC } from 'react';
2
2
  type Props = {
3
3
  className?: string;
4
+ backgroundColor?: string;
4
5
  };
5
6
  declare const AmbassadorBadge: FC<Props>;
6
7
  export default AmbassadorBadge;
@@ -17,7 +17,7 @@ const Wrapper = styled_components_1.default.div `
17
17
  border-radius: 16px;
18
18
  border: 2px solid transparent;
19
19
  color: #4357C5;
20
- background: linear-gradient(to right, #f3f4f9, #f3f4f9),
20
+ background: ${({ background }) => `linear-gradient(to right, ${background}, ${background})`} ,
21
21
  linear-gradient(160deg, #15D2FF 0%, #4C6DFF 100%);
22
22
  background-clip: padding-box, border-box;
23
23
  background-origin: padding-box, border-box;
@@ -28,7 +28,7 @@ const Wrapper = styled_components_1.default.div `
28
28
  border: ${(0, _4k_1.adaptiveValueCalc)(2)} solid transparent;
29
29
  }
30
30
  `;
31
- const AmbassadorBadge = ({ className }) => {
32
- return ((0, jsx_runtime_1.jsx)(Wrapper, { className: className, children: (0, jsx_runtime_1.jsx)(index_1.H6, { children: "Ambassador" }) }));
31
+ const AmbassadorBadge = ({ className, backgroundColor = '#f3f4f9' }) => {
32
+ return ((0, jsx_runtime_1.jsx)(Wrapper, { className: className, background: backgroundColor, children: (0, jsx_runtime_1.jsx)(index_1.H6, { children: "Ambassador" }) }));
33
33
  };
34
34
  exports.default = AmbassadorBadge;
@@ -1,6 +1,7 @@
1
1
  import { FC } from 'react';
2
2
  type Props = {
3
3
  className?: string;
4
+ backgroundColor?: string;
4
5
  };
5
6
  declare const EducatorBadge: FC<Props>;
6
7
  export default EducatorBadge;
@@ -17,7 +17,7 @@ const Wrapper = styled_components_1.default.div `
17
17
  border-radius: 16px;
18
18
  border: 2px solid transparent;
19
19
  color: #5748bc;
20
- background: linear-gradient(to right, #f3f4f9, #f3f4f9),
20
+ background: ${({ background }) => `linear-gradient(to right, ${background}, ${background})`},
21
21
  linear-gradient(160deg, #e84eff 0%, #8946ff 100%);
22
22
  background-clip: padding-box, border-box;
23
23
  background-origin: padding-box, border-box;
@@ -28,7 +28,7 @@ const Wrapper = styled_components_1.default.div `
28
28
  border: ${(0, _4k_1.adaptiveValueCalc)(2)} solid transparent;
29
29
  }
30
30
  `;
31
- const EducatorBadge = ({ className }) => {
32
- return ((0, jsx_runtime_1.jsx)(Wrapper, { className: className, children: (0, jsx_runtime_1.jsx)(index_1.H6, { children: "Educator" }) }));
31
+ const EducatorBadge = ({ className, backgroundColor = '#f3f4f9' }) => {
32
+ return ((0, jsx_runtime_1.jsx)(Wrapper, { className: className, background: backgroundColor, children: (0, jsx_runtime_1.jsx)(index_1.H6, { children: "Educator" }) }));
33
33
  };
34
34
  exports.default = EducatorBadge;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ludo.ninja/components",
3
- "version": "2.4.3",
3
+ "version": "2.4.5",
4
4
  "private": false,
5
5
  "main": "build/index.js",
6
6
  "types": "build/index.d.ts",