@ludo.ninja/components 1.1.6 → 1.1.8

package/package.json

@@ -1,14 +1,16 @@
 {
   "name": "@ludo.ninja/components",
-  "version": "1.1.6",
+  "version": "1.1.8",
   "private": false,
-  "main": "dist/index.js",
-  "types": "dist/types/index.d.ts",
   "scripts": {
-    "dev": "next dev",
-    "build": "tsc",
+    "dev": "next dev -p 3000",
+    "build": "next build",
     "start": "next start",
-    "publish": "npm publish --access=public -workspace @ludo.ninja/components",
+    "analyze": "cross-env ANALYZE=true next build",
+    "analyze:server": "cross-env BUNDLE_ANALYZE=server next build",
+    "analyze:browser": "cross-env BUNDLE_ANALYZE=browser next build",
+    "prepare:husky": "husky install",
+    "publish": "npm publish --access public -workspace @ludo.ninja/components",
     "format": "prettier --write .",
     "check-types": "tsc --pretty --noEmit",
     "check-format": "prettier --check .",
@@ -30,7 +32,7 @@
     "lodash.debounce": "^4.0.8",
     "lodash.remove": "^4.7.0",
     "moment": "^2.29.4",
-    "next": "^14.2.4",
+    "next": "^13.5.2",
     "next-zustand": "^1.1.0",
     "nookies": "^2.5.2",
     "path-to-regexp": "^6.2.1",

package/src/components/CreationCard/CardHead.tsx

@@ -37,6 +37,7 @@ export const CardHead = ({
   isDisabled,
   isShowCheckbox,
   currentMyGalleryId,
+  isProdENV,
 }: {
   creation: CreationEntity | CollectionCreationEntity;
   isRegularCard: boolean;
@@ -47,6 +48,7 @@ export const CardHead = ({
   isDisabled?: boolean;
   isShowCheckbox?: boolean | undefined;
   currentMyGalleryId?: false | string;
+  isProdENV: string;
 }) => {
   const openModalSidebarPortal = useUiStore(
     (state) => state.openModalSidebarPortal
@@ -132,7 +134,7 @@ export const CardHead = ({
         <CardRank rank={creation.getRank()} />
       </div>
       {/* // Todo cardHeadIcons */}
-      {!isProd() && !isShowCheckbox && (
+      {!isProd({ ENV: isProdENV }) && !isShowCheckbox && (
         <div className="icons">
           <div
             className="icon"

package/src/components/CreationCard/index.tsx

@@ -115,6 +115,7 @@ interface ICreationCard {
   isUserProfile?: boolean;
   isRegularCard?: boolean;
   currentMyGalleryId?: false | string;
+  isProdENV: string;
 }
 
 // Component
@@ -151,6 +152,7 @@ export const CreationCard = ({
   isActiveCheckbox,
   toggleCreationToGallery,
   currentMyGalleryId,
+  isProdENV,
 }: ICreationCard & ICheckboxState) => {
   const { likes, addLike, deleteLike } = useLikes({
     defaultLikesCount: likesDynamicInfo?.likesNum || creation.getLikes(),
@@ -161,7 +163,7 @@ export const CreationCard = ({
   });
 
   // Todo cardLink
-  const isHide = isProd();
+  const isHide = isProd({ ENV: isProdENV });
   const HideLink = isHide ? React.Fragment : Link;
 
   return (
@@ -191,6 +193,7 @@ export const CreationCard = ({
             isDisabled={!!isLoadingLikes}
             isShowCheckbox={isShowCheckbox}
             currentMyGalleryId={currentMyGalleryId}
+            isProdENV={isProdENV}
           />
         </StyledCardHead>
         <CardContent
@@ -205,7 +208,7 @@ export const CreationCard = ({
           <Flex alignItems="end" justifyContent={'space-between'}>
             <CardCategory label={creation.getLabel()} />
             {/* // Todo cardLikes */}
-            {!isProd() &&
+            {!isProd({ ENV: isProdENV }) &&
               (isLoadingLikes ? (
                 <Skeleton
                   style={{ borderRadius: '3px' }}

package/src/components/headers/headerSearch/index.tsx

@@ -16,7 +16,7 @@ import { redirectToLoginWindow } from '@/utils/auth';
 import { isProd } from '@/utils/env';
 
 // Component
-const HeaderSearch = () => {
+const HeaderSearch = ({ isProdENV }: { isProdENV: string }) => {
   const openSidebar = useUiStore((state) => state.openSidebar);
   const isSignedIn = useUserStore((state) => state.isSignedIn);
   const getUser = useUserStore((state) => state.user);
@@ -36,7 +36,7 @@ const HeaderSearch = () => {
         logoLinkComponent: ({ children }) => <Link href={'/'}>{children}</Link>,
         searchInput: ({ setInputFocused }) => {
           // Todo seacrh pages, hide search input from header
-          return isProd() ? undefined : (
+          return isProd({ ENV: isProdENV }) ? undefined : (
             <SearchSimpleInput onFocusHandler={setInputFocused} />
           );
         },

package/src/components/profile/ProfileTabs.tsx

@@ -12,11 +12,13 @@ export const ProfileTabs = ({
   profileId,
   style,
   isMobile,
+  isProdENV,
 }: {
   totalResults?: number | null;
   profileId: string;
   style?: CSSProperties;
   isMobile: boolean;
+  isProdENV: string;
 }) => {
   const router = useRouter();
 
@@ -28,7 +30,7 @@ export const ProfileTabs = ({
           text: 'NFTs',
         },
         // Todo fav-list
-        ...(isProd()
+        ...(isProd({ ENV: isProdENV })
           ? []
           : [
               {

package/src/components/sidebar/index.tsx

@@ -111,8 +111,12 @@ const SLink = styled(Link)<{
   }
 `;
 
+interface Props {
+  isProdENV: string;
+}
+
 // Component
-const Sidebar = () => {
+const Sidebar: React.FC<Props> = ({ isProdENV }) => {
   const closeSidebar = useUiStore((state) => state.closeSidebar);
   const isSidebarOpen = useUiStore((state) => state.isSidebarOpen);
 
@@ -130,7 +134,7 @@ const Sidebar = () => {
   const isDarkTheme = type === ThemeEnum.dark;
 
   // Todo fav-list
-  const sideBarData = isProd()
+  const sideBarData = isProd({ ENV: isProdENV })
     ? sideBarDataForProd({ userId, isAuthorized })
     : sideBarDataForDev({ userId, isAuthorized, isDarkTheme });
   const { windowDimensions } = useWindowDimensionsWithServerInitial();

package/src/components/sidebar/initializer.tsx

@@ -3,4 +3,6 @@ import dynamic from 'next/dynamic';
 const Sidebar = dynamic(() => import('../sidebar').then((res) => res.default), {
   ssr: false,
 });
-export const SidebarInitializer = () => <Sidebar />;
+export const SidebarInitializer = ({ isProdENV }: { isProdENV: string }) => (
+  <Sidebar isProdENV={isProdENV} />
+);

package/src/hooks/index.ts

@@ -1 +1,3 @@
 export * from './likes/useGetLikesAsset';
+export * from './apollo';
+

package/src/layouts/GlobalLayout.tsx

@@ -44,7 +44,7 @@ export const GlobalLayout = ({ children }: { children: ReactNode }) => {
       <InitializeAppHeight />
       <SubscriberInviteNotification />
       <Overlay />
-      <SidebarInitializer />
+      <SidebarInitializer isProdENV={process.env.NEXT_PUBLIC_ENV_VALUE} />
       <Alert />
       <Modal />
       <ModalSidebar />

package/src/layouts/base/LWithSearchHeader/index.tsx

@@ -7,10 +7,10 @@ import HeaderSearch from '@/components/headers/headerSearch';
 
 // Component
 
-const LWithSearchHeader: LayoutProps = ({ children }) => (
+const LWithSearchHeader: LayoutProps = ({ children, isProdENV }) => (
   <div style={{ minHeight: 'var(--app-height)' }}>
     <Meta />
-    <HeaderSearch />
+    <HeaderSearch isProdENV={isProdENV} />
     {children}
   </div>
 );

package/src/layouts/custom/accountLayout/index.tsx

@@ -7,11 +7,11 @@ import NoSSR from '@/components/base/NoSSR';
 import ToTopBtn from '@/components/toTopBtn';
 
 // Components
-const AccountLayout: LayoutProps = ({ children }) => {
+const AccountLayout: LayoutProps = ({ children, isProdENV }) => {
   return (
     <NoSSR>
       <PageTransitionLayout>
-        <LWithSearchHeader>
+        <LWithSearchHeader isProdENV={isProdENV}>
           <StyledMain role="main">
             {/*<PageLoader isActive={isLoading()} />*/}
             {children}

package/src/layouts/custom/formsLayout/index.tsx

@@ -7,10 +7,10 @@ import { LayoutProps } from '@/layouts/pageWithLayout';
 
 // Component
 
-const FormsLayout: LayoutProps = ({ children }) => {
+const FormsLayout: LayoutProps = ({ children, isProdENV }) => {
   return (
     <PageTransitionLayout>
-      <LWithoutHeader>
+      <LWithoutHeader isProdENV={isProdENV}>
         <StyledMainForms>{children}</StyledMainForms>
       </LWithoutHeader>
     </PageTransitionLayout>

package/src/layouts/custom/mainLayout/index.tsx

@@ -11,10 +11,10 @@ import ToTopBtn from '@/components/toTopBtn';
 
 // Component
 
-const MainLayout: LayoutProps = ({ children }) => {
+const MainLayout: LayoutProps = ({ children, isProdENV }) => {
   return (
     <PageTransitionLayout>
-      <LWithRegularHeader>
+      <LWithRegularHeader isProdENV={isProdENV}>
         <StyledMain>
           {children}
           {!isServer && <ToTopBtn />}

package/src/layouts/custom/searchLayout/index.tsx

@@ -10,11 +10,11 @@ import ToTopBtn from '@/components/toTopBtn';
 
 // Component
 
-const SearchLayout: LayoutProps = ({ children }) => {
+const SearchLayout: LayoutProps = ({ children, isProdENV }) => {
   return (
     // <PageTransitionLayout>
     <>
-      <LWithSearchHeader>
+      <LWithSearchHeader isProdENV={isProdENV}>
         <StyledMain role="main">
           {children}
           {!isServer && <ToTopBtn />}

package/src/layouts/custom/simpleLayout/index.tsx

@@ -10,10 +10,10 @@ import { LayoutProps } from '@/layouts/pageWithLayout';
 import ToTopBtn from '@/components/toTopBtn';
 
 // Component
-const SimpleLayout: LayoutProps = ({ children }) => {
+const SimpleLayout: LayoutProps = ({ children, isProdENV }) => {
   return (
     <PageTransitionLayout>
-      <LWithSimpleHeader>
+      <LWithSimpleHeader isProdENV={isProdENV}>
         <StyledMain role={'main'}>
           {children}
           {!isServer && <ToTopBtn />}

package/src/layouts/index.ts

@@ -0,0 +1,4 @@
+export * from './GlobalLayout';
+export * from './pageTransitionLayout';
+export * from './pageWithLayout';
+

package/src/layouts/pageWithLayout.ts

@@ -10,7 +10,9 @@ export type PageWithLayoutType =
   | PageLWithSearchHeader;
 export type LayoutProps = ({
   children,
+  isProdENV,
 }: {
   children: ReactNode;
+  isProdENV: string;
 }) => ReactElement;
 export default PageWithLayoutType;

package/src/modules/gallery/api/useGetAssetsAndCollectionForFavorite.ts

@@ -28,18 +28,33 @@ const limit = 40;
 
 export type TCreationWithOpportunity = TCreationAndCollection | TOpportunity;
 
-export const useGetAssetsAndCollectionForFavorite = <TCreations>({
-  gallery,
-  activeTab,
-  fetchLikes,
-}: {
+interface UseGetAssetsAndCollectionForFavoriteProps {
   gallery: GalleryEntityV2;
   activeTab: TActiveTab;
   fetchLikes?: (
     itemsIdsArray: string[],
     currentItemType: TCurrentItemType
   ) => Promise<void>;
-}) => {
+}
+
+interface UseGetAssetsAndCollectionForFavoriteReturn<TCreations> {
+  creations: TCreations[];
+  isLoading: boolean;
+  isNextLoading: boolean;
+  loadMore: () => Promise<void>;
+  error: Error | undefined;
+  refetchQuery: () => Promise<void>;
+  removeCreation: (
+    creationIdToRemove: string,
+    itemType: 'asset' | 'collection' | 'opportunity'
+  ) => void;
+}
+
+export const useGetAssetsAndCollectionForFavorite = <TCreations>({
+  gallery,
+  activeTab,
+  fetchLikes,
+}: UseGetAssetsAndCollectionForFavoriteProps): UseGetAssetsAndCollectionForFavoriteReturn<TCreations> => {
   const [assets, setAssets] = useState<[string, CreationEntity][]>([]);
   const [collections, setCollections] = useState<
     [string, CollectionCreationEntity][]
@@ -153,7 +168,6 @@ export const useGetAssetsAndCollectionForFavorite = <TCreations>({
       onError: () => {
         openAlert({
           type: alertVariants.error,
-
           caption: 'Oops, something went wrong.',
         });
         setAssets([]);
@@ -185,7 +199,6 @@ export const useGetAssetsAndCollectionForFavorite = <TCreations>({
     onError: () => {
       openAlert({
         type: alertVariants.error,
-
         caption: 'Oops, something went wrong.',
       });
       setCollections([]);
@@ -210,7 +223,6 @@ export const useGetAssetsAndCollectionForFavorite = <TCreations>({
     onError: () => {
       openAlert({
         type: alertVariants.error,
-
         caption: 'Oops, something went wrong.',
       });
       setOpportunities([]);

package/src/store/index.ts

@@ -1,4 +1,5 @@
 import { createProvider } from 'next-zustand';
+
 export * from './ui';
 export * from './media';
 

package/src/styles/index.ts

@@ -1,5 +1,3 @@
 export { default as GlobalStyle } from './globalStyles';
 export * from './ScreenWidth';
 export * from './colors';
-
-

package/src/system/Buttons/index.ts

@@ -2,5 +2,3 @@ export { default as IconButton } from './IconButton';
 export { default as IconWithButton } from './IconWithButton';
 export { default as MainButton } from './MainButton';
 export { default as SecondaryButton } from './SecondaryButton';
-
-

package/src/system/Cards/CardHeadIcons/index.tsx

@@ -37,6 +37,7 @@ const CardHeadIcons = ({
   itemId,
   isUserProfile,
   isDisabled,
+  isProdENV,
 }: {
   creation: CreationEntity | CollectionCreationEntity;
   isRegularCard: boolean;
@@ -47,6 +48,7 @@ const CardHeadIcons = ({
   itemId: string;
   isUserProfile: boolean;
   isDisabled?: boolean;
+  isProdENV: string;
 }) => {
   const openModalSidebarPortal = useUiStore(
     (state) => state.openModalSidebarPortal
@@ -127,7 +129,7 @@ const CardHeadIcons = ({
         <CardRank rank={creation.getRank()} />
       </div>
       {/* // Todo cardHeadIcons */}
-      {!isProd() && (
+      {!isProd({ ENV: isProdENV }) && (
         <div className="icons">
           <div
             className="icon"

package/src/system/Cards/CardsGrid/index.tsx

@@ -109,6 +109,7 @@ const CardsGrid = ({
   isEmptyGallery,
   isForVirtualize,
   tabsSlot,
+  isProdENV,
 }: {
   children: React.ReactNode;
   isTwoColumnLayout?: boolean;
@@ -118,6 +119,7 @@ const CardsGrid = ({
   isEmptyGallery?: boolean;
   isForVirtualize?: boolean;
   tabsSlot?: ReactNode;
+  isProdENV: string;
 }) => {
   const [isNeedShowOrganizeBtn, setShowOrganizeBtn] = useState<boolean>(
     Boolean(creations?.length)
@@ -140,7 +142,7 @@ const CardsGrid = ({
         <div className="sidebar">
           {/*{isNeedShowNetWorth && <ProfileNetWorth />}*/}
           {/* // Todo ProfileInterests */}
-          {!isProd() && <ProfileInterests />}
+          {!isProd({ ENV: isProdENV }) && <ProfileInterests />}
           <ProfileWallets />
           {isNeedShowOrganizeBtn && (
             <div className="sidebarOrganizeBtn">

package/src/system/Cards/RegularCard/index.tsx

@@ -81,6 +81,7 @@ const RegularCard = ({
   isNeedHeight,
   likesDynamicInfo,
   toolsForRemove,
+  isProdENV,
 }: {
   creationName?: string;
   creation: CreationEntity | CollectionCreationEntity;
@@ -89,6 +90,7 @@ const RegularCard = ({
   isNeedHeight: boolean;
   likesDynamicInfo?: IDynamicAssetData | IDynamicCollectionData;
   toolsForRemove?: RemoveToolsType;
+  isProdENV: string;
 }) => {
   const { windowWidth } = getWindowDimensions();
   const isMobile = windowWidth <= 1200;
@@ -101,7 +103,7 @@ const RegularCard = ({
   //show asset page
 
   // Todo cardLink
-  const isHide = isProd();
+  const isHide = isProd({ ENV: isProdENV });
   const HideLink = isHide ? React.Fragment : Link;
 
   return (
@@ -127,6 +129,7 @@ const RegularCard = ({
             deleteLikeFromCard={deleteLike}
             isUserProfile={false}
             itemId={creation.getItemId()}
+            isProdENV={isProdENV}
           />
         </StyledCardHead>
         <CardContent
@@ -140,7 +143,7 @@ const RegularCard = ({
           <Flex alignItems="end" justifyContent={'space-between'}>
             <CardCategory label={creation.getLabel()} />
             {/* // Todo cardLikes */}
-            {!isProd() && (
+            {!isProd({ ENV: isProdENV }) && (
               <CardLikes isLiked={likes.isLiked} likes={likes.likesCount} />
             )}
           </Flex>

package/src/system/CardsHolderWithSkeleton/CardsHolder/index.tsx

@@ -54,6 +54,7 @@ interface Props {
   isForVirtualize?: boolean;
   likesArray?: Array<IDynamicAssetData | IDynamicCollectionData> | [];
   tabsSlot?: ReactNode;
+  isProdENV: string;
 }
 
 // Component
@@ -70,6 +71,7 @@ const CardsHolder: React.FC<Props> = ({
   isForVirtualize,
   likesArray,
   tabsSlot,
+  isProdENV,
 }) => {
   const renderCardsWithGrid = (
     component: React.ReactNode,
@@ -83,6 +85,7 @@ const CardsHolder: React.FC<Props> = ({
         isEmptyGallery={isEmptyGallery}
         isForVirtualize={forVirtualize}
         tabsSlot={tabsSlot}
+        isProdENV={isProdENV}
       >
         {component}
       </CardsGrid>

package/src/system/CardsHolderWithSkeleton/index.tsx

@@ -33,6 +33,7 @@ interface Props {
   isForVirtualize?: boolean;
   likesArray?: Array<IDynamicAssetData | IDynamicCollectionData> | [];
   tabsSlot?: ReactNode;
+  isProdENV: string;
 }
 
 // Component
@@ -49,6 +50,7 @@ const CardsHolderWithSkeleton: React.FC<Props> = ({
   isForVirtualize,
   likesArray,
   tabsSlot,
+  isProdENV,
 }) => {
   if (loading && (!likesArray || likesArray?.length === 0))
     return (
@@ -57,6 +59,7 @@ const CardsHolderWithSkeleton: React.FC<Props> = ({
         isNeedShowNetWorth={isNeedShowNetWorth}
         isEmptyGallery={false}
         tabsSlot={tabsSlot}
+        isProdENV={isProdENV}
       >
         <CardSkeletonWrapper cardCount={40} />
       </CardsGrid>
@@ -75,6 +78,7 @@ const CardsHolderWithSkeleton: React.FC<Props> = ({
       isForVirtualize={isForVirtualize}
       likesArray={likesArray}
       tabsSlot={tabsSlot}
+      isProdENV={isProdENV}
     >
       {children}
     </CardsHolder>

package/src/system/index.ts

@@ -6,4 +6,3 @@ export * from './Img';
 export * from './theme';
 export * from './Tabs';
 export * from './Buttons';
-

package/src/utils/index.ts

@@ -1,4 +1,3 @@
 export * from './ssrFunctions';
 export * from './env/isProd';
 export * from './screen';
-

package/tsconfig.json

@@ -4,19 +4,17 @@
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
     "strict": true,
     "forceConsistentCasingInFileNames": true,
-    "noFallthroughCasesInSwitch": true,
+    "allowSyntheticDefaultImports": true,
+    "noEmit": true,
+    "esModuleInterop": true,
     "module": "esnext",
     "moduleResolution": "node",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "declaration": true,
-    "declarationDir": "./dist/types",
-    "outDir": "./dist",
-    "jsx": "react-jsx",
+    "jsx": "preserve",
+    "incremental": true,
     "baseUrl": ".",
     "paths": {
       "@/pages/*": ["src/pages/*"],
@@ -40,9 +38,8 @@
       "@/store/*": ["src/store/*"],
       "@/store": ["src/store/index.ts"],
       "@system": ["src/system/index.ts"]
-    },
-    "incremental": true
+    }
   },
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
-  "exclude": ["node_modules", "dist"]
+  "exclude": ["node_modules"]
 }

package/dist/api/graphql/index.js

@@ -1,7 +0,0 @@
-export var APOLLO_STATE_PROP_NAME = '__APOLLO_STATE__';
-export function addApolloState(client, pageProps) {
-    if (pageProps === null || pageProps === void 0 ? void 0 : pageProps.props) {
-        pageProps.props[APOLLO_STATE_PROP_NAME] = client.cache.extract();
-    }
-    return pageProps;
-}

package/dist/api/index.js

@@ -1 +0,0 @@
-export { addApolloState, APOLLO_STATE_PROP_NAME } from '@/api/graphql';