@ludo.ninja/components 2.4.17 → 2.4.19

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.
@@ -1,13 +1,13 @@
1
- import { ApolloClient, NormalizedCacheObject } from '@apollo/client';
2
- import { identitySchema as schema } from '@ludo.ninja/api';
3
- import { ProfileEntity } from '@ludo.ninja/core';
1
+ import { ApolloClient, NormalizedCacheObject } from "@apollo/client";
2
+ import { identitySchema as schema } from "@ludo.ninja/api";
3
+ import { ProfileEntity } from "@ludo.ninja/core";
4
4
  declare const prefetchProfile: ({ userId }: schema.IQueryFetchProfileArgs, apolloClient: ApolloClient<NormalizedCacheObject>) => Promise<import("@apollo/client").ApolloQueryResult<any> | {
5
5
  data: {
6
6
  fetchProfile: null;
7
7
  };
8
8
  }>;
9
9
  declare const useFetchProfile: ({ userId }: schema.IQueryFetchProfileArgs, prefetchedProfile: ProfileEntity | null) => {
10
- refetch: (variables?: Partial<import("@apollo/client").OperationVariables> | undefined) => Promise<import("@apollo/client").ApolloQueryResult<any>>;
10
+ refetch: import("@apollo/client").LazyQueryExecFunction<any, import("@apollo/client").OperationVariables>;
11
11
  data: any;
12
12
  clientProfileData: ProfileEntity | null;
13
13
  clientProfileLoading: boolean;
@@ -1,20 +1,20 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.useFetchProfile = exports.prefetchProfile = void 0;
4
- const react_1 = require("react");
5
- const client_1 = require("@apollo/client");
6
- const api_1 = require("@ludo.ninja/api");
7
- const core_1 = require("@ludo.ninja/core");
8
4
  const store_1 = require("../../../../modules/user/store");
9
5
  const ui_1 = require("../../../../store/ui");
10
6
  const getErrorAlertProps_1 = require("../../../../utils/getErrorAlertProps");
7
+ const client_1 = require("@apollo/client");
8
+ const api_1 = require("@ludo.ninja/api");
9
+ const core_1 = require("@ludo.ninja/core");
10
+ const react_1 = require("react");
11
11
  const prefetchProfile = ({ userId }, apolloClient) => {
12
12
  return apolloClient
13
13
  .query({
14
14
  query: api_1.identitySchema.FetchProfileDocument,
15
15
  variables: { userId },
16
16
  context: { uri: api_1.hosts.serverIdentityHost },
17
- fetchPolicy: 'network-only',
17
+ fetchPolicy: "network-only",
18
18
  })
19
19
  .catch(() => {
20
20
  return {
@@ -32,7 +32,7 @@ const useFetchProfile = ({ userId }, prefetchedProfile) => {
32
32
  isLoadingProfileData: state.isLoadingProfileData,
33
33
  user: state.user,
34
34
  }));
35
- const [fetchProfile, { data, error, refetch }] = (0, client_1.useLazyQuery)(api_1.identitySchema.FetchProfileDocument, {
35
+ const [fetchProfile, { data, error, loading, refetch }] = (0, client_1.useLazyQuery)(api_1.identitySchema.FetchProfileDocument, {
36
36
  variables: { userId },
37
37
  context: {
38
38
  uri: api_1.hosts.identityHost,
@@ -40,7 +40,7 @@ const useFetchProfile = ({ userId }, prefetchedProfile) => {
40
40
  onCompleted: ({ fetchProfile }) => {
41
41
  setProfile(new core_1.ProfileEntity({
42
42
  ...fetchProfile,
43
- wallets: fetchProfile.wallets.sort((wallet, nextWallet) => Number(nextWallet?.mainWallet) - Number(wallet?.mainWallet))
43
+ wallets: fetchProfile.wallets.sort((wallet, nextWallet) => Number(nextWallet?.mainWallet) - Number(wallet?.mainWallet)),
44
44
  }));
45
45
  setIsLoading(false);
46
46
  },
@@ -70,10 +70,10 @@ const useFetchProfile = ({ userId }, prefetchedProfile) => {
70
70
  }
71
71
  }, [isLoadingProfileData, profileData, userId]);
72
72
  return {
73
- refetch,
73
+ refetch: fetchProfile,
74
74
  data,
75
75
  clientProfileData: profile,
76
- clientProfileLoading: isLoading,
76
+ clientProfileLoading: isLoading || loading,
77
77
  clientProfileError: error,
78
78
  };
79
79
  };
@@ -1,10 +1,9 @@
1
- import { ApolloQueryResult, OperationVariables } from "@apollo/client";
2
1
  import { identitySchema as schema } from "@ludo.ninja/api";
3
2
  import { IBoostType } from "@ludo.ninja/api/build/graphql_tools/__generated__/identityHost/schema";
4
3
  import React, { FC } from "react";
5
4
  export declare const Wrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
6
- type Props = Pick<schema.IProfile, "social" | "userId"> & {
7
- refetchProfile: (variables?: Partial<OperationVariables> | undefined) => Promise<ApolloQueryResult<any>>;
5
+ type Props = Pick<schema.IProfile, "userId"> & {
6
+ onBoostAdded?: () => void;
8
7
  boostType: IBoostType;
9
8
  className?: string;
10
9
  style?: React.CSSProperties;
@@ -10,7 +10,9 @@ const Congratulations_1 = __importDefault(require("./Congratulations"));
10
10
  const useCheckDiscordFollow_1 = require("../../api/discord/useCheckDiscordFollow");
11
11
  const useSetEducatorBoost_1 = __importDefault(require("../../api/server-identities/mutations/useSetEducatorBoost"));
12
12
  const useSetShootingStarBoost_1 = __importDefault(require("../../api/server-identities/mutations/useSetShootingStarBoost"));
13
+ const useFetchProfile_1 = require("../../api/server-identities/queries/useFetchProfile");
13
14
  const useCheckFollow_1 = require("../../api/twitter/useCheckFollow");
15
+ const ArrowIcon_1 = __importDefault(require("./icons/ArrowIcon"));
14
16
  const env_1 = require("../../store/env");
15
17
  const ui_1 = require("../../store/ui");
16
18
  const ScreenWidth_1 = require("../../styles/ScreenWidth");
@@ -22,12 +24,12 @@ const ludoDomains_1 = require("@ludo.ninja/core/build/ludoDomains");
22
24
  const ui_2 = require("@ludo.ninja/ui");
23
25
  const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
24
26
  const utils_1 = require("@ludo.ninja/utils");
27
+ const framer_motion_1 = require("framer-motion");
25
28
  const link_1 = __importDefault(require("next/link"));
26
29
  const rc_tooltip_1 = __importDefault(require("rc-tooltip"));
27
30
  const react_1 = require("react");
28
31
  const react_loading_skeleton_1 = __importDefault(require("react-loading-skeleton"));
29
32
  const styled_components_1 = __importDefault(require("styled-components"));
30
- const ArrowIcon_1 = __importDefault(require("./icons/ArrowIcon"));
31
33
  exports.Wrapper = styled_components_1.default.div `
32
34
  width: 272px;
33
35
  margin-top: -18px;
@@ -43,6 +45,7 @@ exports.Wrapper = styled_components_1.default.div `
43
45
  }
44
46
  `;
45
47
  const CheckList = styled_components_1.default.div `
48
+ transition: all 0.5s ease;
46
49
  display: inline-flex;
47
50
  align-items: start;
48
51
  flex-direction: column;
@@ -89,12 +92,12 @@ const FollowLink = styled_components_1.default.a `
89
92
  }
90
93
  `;
91
94
  const StyledSkeleton = (0, styled_components_1.default)(react_loading_skeleton_1.default) `
92
- height: 20px;
93
- width: 154px;
95
+ height: 18px;
96
+ width: 194px;
94
97
 
95
98
  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
96
- height: ${(0, _4k_1.adaptiveValueCalc)(20)};
97
- width: ${(0, _4k_1.adaptiveValueCalc)(154)};
99
+ height: ${(0, _4k_1.adaptiveValueCalc)(18)};
100
+ width: ${(0, _4k_1.adaptiveValueCalc)(194)};
98
101
  }
99
102
  `;
100
103
  const ActionButton = (0, styled_components_1.default)(MainButton_1.default) `
@@ -104,7 +107,9 @@ const ActionButton = (0, styled_components_1.default)(MainButton_1.default) `
104
107
  margin-top: ${(0, _4k_1.adaptiveValueCalc)(26)};
105
108
  }
106
109
  `;
107
- const LudoEducatorModal = ({ social, refetchProfile, userId, boostType, className, style }) => {
110
+ const LudoEducatorModal = ({ userId, onBoostAdded, boostType, className, style }) => {
111
+ const { clientProfileData, clientProfileLoading, refetch } = (0, useFetchProfile_1.useFetchProfile)({ userId }, null);
112
+ const social = clientProfileData?.getSocial();
108
113
  const twitterUserName = social?.twitter?.split("https://x.com/")?.[1] || "";
109
114
  const { followStatus, followStatusLoading } = (0, useCheckFollow_1.useCheckFollow)(twitterUserName);
110
115
  const { followDiscordStatus, followDiscordStatusLoading } = (0, useCheckDiscordFollow_1.useCheckDiscordFollow)(social?.discordId);
@@ -118,19 +123,21 @@ const LudoEducatorModal = ({ social, refetchProfile, userId, boostType, classNam
118
123
  const closeModalSidebarPortal = (0, ui_1.useUiStore)((state) => state.closeModalSidebarPortal);
119
124
  const handleBecomeLudoEducator = () => {
120
125
  setEducatorBoost().then(() => {
121
- refetchProfile && refetchProfile();
126
+ onBoostAdded && onBoostAdded();
122
127
  closeModalSidebarPortal();
123
128
  openModalSidebarPortal((0, jsx_runtime_1.jsx)(Congratulations_1.default, {}));
124
129
  });
125
130
  };
126
131
  const handleBecomeLudoShootingStar = () => {
127
132
  setShootingStarBoost().then(() => {
128
- refetchProfile && refetchProfile();
133
+ onBoostAdded && onBoostAdded();
129
134
  closeModalSidebarPortal();
130
135
  openModalSidebarPortal((0, jsx_runtime_1.jsx)(Congratulations_1.default, { message: "You are now a Ludo Shooting Star! Check how you can take advantage of it." }));
131
136
  });
132
137
  };
133
138
  const handleSubmit = () => {
139
+ if (getSubmitButtonDisabled())
140
+ return;
134
141
  switch (boostType) {
135
142
  case schema_1.IBoostType.Educator:
136
143
  handleBecomeLudoEducator();
@@ -151,15 +158,15 @@ const LudoEducatorModal = ({ social, refetchProfile, userId, boostType, classNam
151
158
  const getSubmitButtonDisabled = () => {
152
159
  switch (boostType) {
153
160
  case schema_1.IBoostType.Educator:
154
- return !isCheckListDone || loadingSetEducatorBoost;
161
+ return !isCheckListDone || loadingSetEducatorBoost || clientProfileLoading;
155
162
  case schema_1.IBoostType.Ambassador:
156
- return !isShootingStarCheckListDone || loadingSetShootingStarBoost;
163
+ return !isShootingStarCheckListDone || loadingSetShootingStarBoost || clientProfileLoading;
157
164
  }
158
165
  };
159
166
  (0, react_1.useEffect)(() => {
160
- refetchProfile && refetchProfile();
167
+ refetch();
161
168
  }, []);
162
- return ((0, jsx_runtime_1.jsxs)(exports.Wrapper, { className: className, style: style, children: [(0, jsx_runtime_1.jsx)(ui_2.H3, { children: "Join Ludo Educators" }), (0, jsx_runtime_1.jsxs)(CheckList, { children: [(0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: !!social?.twitter, title: social?.twitter ? ("Connect Twitter") : ((0, jsx_runtime_1.jsxs)(StyledLink, { href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["account"]}/settings`, children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Connect Twitter" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] })) }), (0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: !!social?.telegramLink, title: social?.telegramLink ? ("Connect Telegram") : ((0, jsx_runtime_1.jsxs)(StyledLink, { href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["account"]}/settings`, children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Connect Telegram" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] })) }), followStatusLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: Boolean(followStatus?.following), title: (0, jsx_runtime_1.jsx)(rc_tooltip_1.default, { placement: "top", trigger: ["hover", "click", "focus"], showArrow: false, styles: {
169
+ return ((0, jsx_runtime_1.jsxs)(exports.Wrapper, { className: className, style: style, children: [(0, jsx_runtime_1.jsx)(ui_2.H3, { children: "Join Ludo Educators" }), (0, jsx_runtime_1.jsxs)(CheckList, { children: [clientProfileLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: !!social?.twitter, title: social?.twitter ? ("Connect Twitter") : ((0, jsx_runtime_1.jsxs)(StyledLink, { href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["account"]}/settings`, children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Connect Twitter" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] })) })), clientProfileLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: !!social?.telegramLink, title: social?.telegramLink ? ("Connect Telegram") : ((0, jsx_runtime_1.jsxs)(StyledLink, { href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["account"]}/settings`, children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Connect Telegram" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] })) })), followStatusLoading || clientProfileLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: Boolean(followStatus?.following), title: (0, jsx_runtime_1.jsx)(rc_tooltip_1.default, { placement: "top", trigger: ["hover", "click", "focus"], showArrow: false, styles: {
163
170
  root: {
164
171
  backgroundColor: "#ffffff",
165
172
  opacity: 1,
@@ -170,6 +177,6 @@ const LudoEducatorModal = ({ social, refetchProfile, userId, boostType, classNam
170
177
  borderRadius: "12px",
171
178
  border: "none",
172
179
  },
173
- }, overlay: (0, jsx_runtime_1.jsx)(index_1.H6, { style: { fontWeight: 500 }, children: "You have to connect the same X account to proceed" }), children: (0, jsx_runtime_1.jsxs)(FollowLink, { onClick: () => closeModalSidebarPortal(), target: "_blank", href: (0, utils_1.appendUtmParam)("https://x.com/LudoHQ"), children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Follow @LudoHQ" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] }) }) })), (0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: Boolean(social?.telegramId), title: (0, jsx_runtime_1.jsxs)(FollowLink, { onClick: () => closeModalSidebarPortal(), target: "_blank", href: (0, utils_1.appendUtmParam)(`https://t.me/LudoAppBot?start=${userId}`), children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Register to LudoAppBot" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] }) }), boostType === schema_1.IBoostType.Ambassador && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: !!social?.discordId, title: social?.discordId ? ("Connect Discord") : ((0, jsx_runtime_1.jsxs)(StyledLink, { href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["account"]}/settings`, children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Connect Discord" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] })) }), followDiscordStatusLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: Boolean(followDiscordStatus?.following), title: (0, jsx_runtime_1.jsxs)(FollowLink, { onClick: () => closeModalSidebarPortal(), target: "_blank", href: (0, utils_1.appendUtmParam)("https://discord.gg/m2bjPqGbyj"), children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Join Ludo server" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] }) }))] }))] }), isSocialsConnected && ((0, jsx_runtime_1.jsx)(ActionButton, { className: "modal-action-btn", variant: "primaryM", text: getSubmitButtonLabel(), disabled: getSubmitButtonDisabled(), onClick: handleSubmit }))] }));
180
+ }, overlay: (0, jsx_runtime_1.jsx)(index_1.H6, { style: { fontWeight: 500 }, children: "You have to connect the same X account to proceed" }), children: (0, jsx_runtime_1.jsxs)(FollowLink, { onClick: () => closeModalSidebarPortal(), target: "_blank", href: (0, utils_1.appendUtmParam)("https://x.com/LudoHQ"), children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Follow @LudoHQ" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] }) }) })), clientProfileLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: Boolean(social?.telegramId), title: (0, jsx_runtime_1.jsxs)(FollowLink, { onClick: () => closeModalSidebarPortal(), target: "_blank", href: (0, utils_1.appendUtmParam)(`https://t.me/LudoAppBot?start=${userId}`), children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Register to LudoAppBot" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] }) })), boostType === schema_1.IBoostType.Ambassador && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [clientProfileLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: !!social?.discordId, title: social?.discordId ? ("Connect Discord") : ((0, jsx_runtime_1.jsxs)(StyledLink, { href: `${ludoDomains_1.ludoDomains[NEXT_PUBLIC_ENV_VALUE]["account"]}/settings`, children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Connect Discord" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] })) })), followDiscordStatusLoading ? ((0, jsx_runtime_1.jsx)(StyledSkeleton, {})) : ((0, jsx_runtime_1.jsx)(CheckListItem_1.default, { isDone: Boolean(followDiscordStatus?.following), title: (0, jsx_runtime_1.jsxs)(FollowLink, { onClick: () => closeModalSidebarPortal(), target: "_blank", href: (0, utils_1.appendUtmParam)("https://discord.gg/m2bjPqGbyj"), children: [(0, jsx_runtime_1.jsx)(index_1.H6, { children: "Join Ludo server" }), (0, jsx_runtime_1.jsx)(ArrowIcon_1.default, {})] }) }))] }))] }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { layout: true, children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: { opacity: 0, y: 20 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: 20 }, transition: { type: "spring", stiffness: 280, damping: 18 }, className: "w-full flex justify-center", children: (0, jsx_runtime_1.jsx)(ActionButton, { className: "modal-action-btn", variant: "primaryM", text: getSubmitButtonLabel(), disabled: getSubmitButtonDisabled(), onClick: handleSubmit }) }, "submit-btn") }) })] }));
174
181
  };
175
182
  exports.default = LudoEducatorModal;
@@ -14,7 +14,7 @@ var ServerErrorType;
14
14
  })(ServerErrorType || (exports.ServerErrorType = ServerErrorType = {}));
15
15
  const getErrorAlertProps = (error) => {
16
16
  const err = error;
17
- const errorExtensions = err.cause?.extensions;
17
+ const errorExtensions = err.cause?.extensions || error.graphQLErrors?.[0]?.extensions;
18
18
  switch (errorExtensions?.classification) {
19
19
  case ServerErrorType.BAD_REQUEST:
20
20
  case ServerErrorType.UNAUTHORIZED:
@@ -22,13 +22,13 @@ const getErrorAlertProps = (error) => {
22
22
  case ServerErrorType.NOT_FOUND:
23
23
  return {
24
24
  type: type_1.alertVariants.warning,
25
- caption: err.cause?.message || error.message,
25
+ caption: err.cause?.message || error.graphQLErrors?.[0]?.message || error.message,
26
26
  };
27
27
  case ServerErrorType.INTERNAL_ERROR:
28
28
  default:
29
- return !(0, env_1.isProdFromEnvForServer)() ? {
29
+ return (0, env_1.isProdFromEnvForServer)() ? {
30
30
  type: type_1.alertVariants.error,
31
- caption: err.cause?.message || error.message,
31
+ caption: err.cause?.message || error.graphQLErrors?.[0]?.message || error.message,
32
32
  } : {
33
33
  type: type_1.alertVariants.error,
34
34
  caption: 'Internal server error',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ludo.ninja/components",
3
- "version": "2.4.17",
3
+ "version": "2.4.19",
4
4
  "private": false,
5
5
  "main": "build/index.js",
6
6
  "types": "build/index.d.ts",