@ludo.ninja/components 2.2.18 → 2.2.20

package/build/api/server-search/queries/useFindUserLudoCreations/index.d.ts

@@ -0,0 +1,15 @@
+import { searchSchema as schema } from '@ludo.ninja/api';
+import CreationEntity from '../../../../dto/CreationEntity';
+declare const useFindUserLudoCreations: ({ ownerId, scrollTab, }: {
+    scrollTab: string | undefined;
+    ownerId: schema.IQueryFindUserLudoCreationsArgs["ownerId"];
+}) => {
+    isLoading: boolean;
+    error: import("@apollo/client").ApolloError | undefined;
+    totalResults: number;
+    creations: CreationEntity[];
+    refetchQuery: () => Promise<void>;
+    loadMore: () => Promise<void>;
+    isNextLoading: boolean;
+};
+export default useFindUserLudoCreations;

package/build/api/server-search/queries/useFindUserLudoCreations/index.js

@@ -0,0 +1,96 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const api_1 = require("@ludo.ninja/api");
+const getPageSizeAssets_1 = require("../../../../utils/getPageSizeAssets");
+const CreationEntity_1 = __importDefault(require("../../../../dto/CreationEntity"));
+const limit = 20;
+const useFindUserLudoCreations = ({ ownerId, scrollTab, }) => {
+    const [creations, setCreations] = (0, react_1.useState)([]);
+    const nextPageToken = (0, react_1.useRef)(null);
+    const [results, setResults] = (0, react_1.useState)(0);
+    const [isLoading, setIsLoading] = (0, react_1.useState)(true);
+    const [isNextLoading, setIsNextLoading] = (0, react_1.useState)(false);
+    const isHaveNextPage = creations.length < results;
+    const [fetchLudoCreations, { error, refetch, fetchMore }] = api_1.searchSchema.useFindUserLudoCreationsLazyQuery({
+        context: {
+            uri: api_1.hosts.searchHost,
+        },
+        fetchPolicy: 'no-cache',
+        onCompleted: ({ findUserLudoCreations: { creations, ...nextPage } }) => {
+            setCreations(creations.map((creation) => new CreationEntity_1.default(creation)));
+            setResults(nextPage.nextPage?.elements || 0);
+            setIsLoading(false);
+            nextPageToken.current = nextPage.nextPage?.token || null;
+        },
+        onError: () => {
+            setCreations([]);
+            setIsLoading(false);
+            nextPageToken.current = null;
+        },
+    });
+    (0, react_1.useEffect)(() => {
+        setIsLoading(true);
+        fetchLudoCreations({
+            variables: {
+                ownerId,
+                page: {
+                    size: (0, getPageSizeAssets_1.getPageSize)({
+                        scrollTab,
+                        limit,
+                    }),
+                    token: '',
+                },
+            },
+        });
+    }, [ownerId]);
+    async function refetchQuery() {
+        await refetch();
+    }
+    async function loadMore() {
+        if (!nextPageToken.current || !isHaveNextPage)
+            return;
+        setIsNextLoading(true);
+        try {
+            const { data } = await fetchMore({
+                variables: {
+                    ownerId,
+                    page: {
+                        token: nextPageToken.current,
+                        size: limit,
+                    },
+                },
+                updateQuery: (previousQueryResult) => {
+                    return previousQueryResult;
+                },
+            });
+            const { creations: nextCreations, ...nextPage } = data.findUserLudoCreations;
+            setCreations((prevCreations) => [
+                ...prevCreations,
+                ...nextCreations.map((creation) => new CreationEntity_1.default(creation)),
+            ]);
+            setResults(nextPage.nextPage?.elements || 0);
+            nextPageToken.current = nextPage.nextPage?.token || null;
+        }
+        catch (error) {
+            //todo uncomment next line
+            // throw new Error(error as string);
+        }
+        finally {
+            setIsNextLoading(false);
+        }
+    }
+    return {
+        isLoading,
+        error,
+        totalResults: results,
+        creations,
+        refetchQuery,
+        loadMore,
+        isNextLoading,
+    };
+};
+exports.default = useFindUserLudoCreations;

package/build/entities/asset/AssetMediasOpengraph.d.ts

@@ -0,0 +1,5 @@
+import { TAsset } from './types';
+export declare const AssetMediasOpengraph: ({ medias, alt }: {
+    medias: TAsset["medias"];
+    alt: string;
+}) => import("react/jsx-runtime").JSX.Element[];

package/build/entities/asset/AssetMediasOpengraph.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AssetMediasOpengraph = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Urls_1 = require("../../dto/common/Media/Urls");
+const types_1 = require("./types");
+const utils_1 = require("./utils");
+const env_1 = require("../../store/env");
+const AssetMediasOpengraph = ({ medias, alt }) => {
+    return [medias[0]].map((media) => {
+        const assetVariant = (0, utils_1.getAssetMediaVariant)({ media });
+        switch (assetVariant) {
+            case types_1.EAssetVariants.audio:
+                return (0, jsx_runtime_1.jsx)(AudioOpengraph, { media: media });
+            case types_1.EAssetVariants.video:
+                return (0, jsx_runtime_1.jsx)(VideoOpengraph, { media: media });
+            case types_1.EAssetVariants.object3d:
+                return (0, jsx_runtime_1.jsx)(Object3DOpengraph, { media: media, alt: alt });
+            case types_1.EAssetVariants.other:
+            case types_1.EAssetVariants.image:
+            case types_1.EAssetVariants.screenshot:
+            default:
+                return (0, jsx_runtime_1.jsx)(ImageOpengraph, { media: media, alt: alt });
+        }
+    });
+};
+exports.AssetMediasOpengraph = AssetMediasOpengraph;
+const ImageOpengraph = ({ media, alt }) => {
+    const NEXT_PUBLIC_STATIC_DOMAIN = (0, env_1.useEnvStore)((state) => state.NEXT_PUBLIC_STATIC_DOMAIN);
+    const url = (0, Urls_1.isExternalMediaImage)(media.media, Urls_1.mediaSizes.regular, NEXT_PUBLIC_STATIC_DOMAIN);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("meta", { property: "og:image", content: url }), (0, jsx_runtime_1.jsx)("meta", { property: "og:image:alt", content: alt }), (0, jsx_runtime_1.jsx)("meta", { name: "twitter:image", content: url }), (0, jsx_runtime_1.jsx)("meta", { property: "twitter:image:alt", content: alt })] }));
+};
+const AudioOpengraph = ({ media }) => {
+    const getAudioENVDomain = (0, env_1.useEnvStore)((state) => state.getAudioDomain);
+    return (0, jsx_runtime_1.jsx)("meta", { property: "og:audio", content: (0, Urls_1.isExternalMediaAudio)(media.media, getAudioENVDomain) });
+};
+const VideoOpengraph = ({ media }) => {
+    const getVideoDomain = (0, env_1.useEnvStore)((state) => state.getVideoDomain);
+    const url = (0, Urls_1.isExternalMediaVideo)(media.media, getVideoDomain);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("meta", { property: "og:video", content: url }), (0, jsx_runtime_1.jsx)("meta", { property: "og:video:secure_url", content: url }), (0, jsx_runtime_1.jsx)("meta", { property: "og:video:type", content: "application/x-shockwave-flash" }), (0, jsx_runtime_1.jsx)("meta", { property: "og:image", content: url }), (0, jsx_runtime_1.jsx)("meta", { property: "\u201Dog:image:width\u201D", content: "1280" }), (0, jsx_runtime_1.jsx)("meta", { property: "\u201Dog:image:height\u201D", content: "720" })] }));
+};
+const Object3DOpengraph = ({ media, alt }) => {
+    //todo: add preview url
+    // const NEXT_PUBLIC_STATIC_DOMAIN = useEnvStore((state) => state.NEXT_PUBLIC_STATIC_DOMAIN);
+    // const previewUrl = isExternalMediaImage(media.media, mediaSizes.regular, NEXT_PUBLIC_STATIC_DOMAIN);
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
+};

package/build/entities/asset/AssetMediasViews.d.ts

@@ -0,0 +1,4 @@
+import { TAsset } from './types';
+export declare const AssetMediasViews: ({ medias }: {
+    medias: TAsset["medias"];
+}) => import("react/jsx-runtime").JSX.Element[];

package/build/entities/asset/AssetMediasViews.js

@@ -0,0 +1,54 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AssetMediasViews = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const assetPage_1 = require("../../components/assetPage");
+const AssetImage_1 = __importDefault(require("../../components/assetPage/media/AssetImage"));
+const AssetImage_2 = __importDefault(require("../../components/assetPage/media/AssetImage"));
+const Urls_1 = require("../../dto/common/Media/Urls");
+const types_1 = require("./types");
+const utils_1 = require("./utils");
+const env_1 = require("../../store/env");
+const constants_1 = require("@ludo.ninja/core/build/constants");
+const AssetMediasViews = ({ medias }) => {
+    return medias.map((media) => {
+        const assetVariant = (0, utils_1.getAssetMediaVariant)({ media });
+        switch (assetVariant) {
+            case types_1.EAssetVariants.image:
+                return (0, jsx_runtime_1.jsx)(AssetImageMediaView, { media: media });
+            case types_1.EAssetVariants.audio:
+                return (0, jsx_runtime_1.jsx)(AssetAudioMediaView, { media: media });
+            case types_1.EAssetVariants.screenshot:
+                return (0, jsx_runtime_1.jsx)(AssetImageMediaView, { media: media, isScreenshot: true });
+            case types_1.EAssetVariants.video:
+                return (0, jsx_runtime_1.jsx)(AssetVideoMediaView, { media: media });
+            case types_1.EAssetVariants.object3d:
+                return (0, jsx_runtime_1.jsx)(assetPage_1.Viewer3D, { file3D: media.originalUrl, file2D: "" });
+            case types_1.EAssetVariants.other:
+                return (0, jsx_runtime_1.jsx)(AssetOtherMediaView, { media: media });
+            default:
+                return ((0, jsx_runtime_1.jsx)(AssetImage_2.default, { alt: media.alt, imageUrl: "/noContent/noContent.svg", errorImg: "/noContent/noContent.svg" }));
+        }
+    });
+};
+exports.AssetMediasViews = AssetMediasViews;
+const AssetImageMediaView = ({ media, isScreenshot }) => {
+    const NEXT_PUBLIC_STATIC_DOMAIN = (0, env_1.useEnvStore)((state) => state.NEXT_PUBLIC_STATIC_DOMAIN);
+    return ((0, jsx_runtime_1.jsx)(AssetImage_1.default, { alt: media.alt, imageUrl: (0, Urls_1.isExternalMediaImage)(media.media, Urls_1.mediaSizes.regular, NEXT_PUBLIC_STATIC_DOMAIN), errorImg: `${constants_1.staticLink}/public/noContent/noContent.svg`, originalUrl: media.originalUrl, isScreenshot: isScreenshot }));
+};
+const AssetAudioMediaView = ({ media }) => {
+    const getAudioENVDomain = (0, env_1.useEnvStore)((state) => state.getAudioDomain);
+    return ((0, jsx_runtime_1.jsx)(assetPage_1.AudioVideoPlayer, { playerType: "audio", poster: null, src: (0, Urls_1.isExternalMediaAudio)(media.media, getAudioENVDomain) }));
+};
+const AssetVideoMediaView = ({ media }) => {
+    const getVideoENVDomain = (0, env_1.useEnvStore)((state) => state.getVideoDomain);
+    return ((0, jsx_runtime_1.jsx)(assetPage_1.AudioVideoPlayer, { playerType: "video", poster: null, src: (0, Urls_1.isExternalMediaVideo)(media.media, getVideoENVDomain) }));
+};
+const AssetOtherMediaView = ({ media }) => {
+    const NEXT_PUBLIC_STATIC_DOMAIN = (0, env_1.useEnvStore)((state) => state.NEXT_PUBLIC_STATIC_DOMAIN);
+    const mediaUrl = (0, Urls_1.isExternalMediaImage)(media.media, Urls_1.mediaSizes.regular, NEXT_PUBLIC_STATIC_DOMAIN);
+    return ((0, jsx_runtime_1.jsx)(AssetImage_2.default, { alt: media.alt, imageUrl: mediaUrl, errorImg: `${constants_1.staticLink}/public/noContent/noContent.svg`, originalUrl: media.originalUrl ?? mediaUrl }));
+};

package/build/entities/asset/builder.d.ts

@@ -0,0 +1,3 @@
+import { TAsset } from './types';
+import { IAsset } from "@ludo.ninja/api/build/graphql_tools/__generated__/assetsHost/schema";
+export declare const buildAsset: (asset: IAsset) => TAsset;

package/build/entities/asset/builder.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildAsset = void 0;
+const ItemType_1 = require("../../dto/common/ItemType");
+const builder_1 = require("../media/builder");
+const core_1 = require("@ludo.ninja/core");
+const utils_1 = require("@ludo.ninja/utils");
+const buildAsset = (asset) => {
+    const newAsset = {
+        assetId: asset.assetId,
+        blockchain: new core_1.BlockChainEntity(asset?.blockchain),
+        markets: asset.markets?.map((market) => new core_1.MarketPlaceEntity({
+            marketName: market?.marketName,
+            marketUrl: market?.marketUrl,
+            marketId: market?.marketUrl,
+        })) || [],
+        ownersProfiles: (asset.ownersProfiles || []),
+        ownersAddresses: (asset.ownersAddresses || null),
+        itemType: ItemType_1.LabelKeys.asset,
+        address: asset.address,
+        tokenId: asset.tokenId,
+        medias: (asset.medias?.map((media) => media && (0, builder_1.createAssetMedia)({ media, asset })) || []),
+        name: asset.name,
+        description: asset.description,
+        creatorsProfiles: (asset.creatorsProfiles || []),
+        creatorsAddresses: (asset.creatorsAddresses || null),
+        originalUrls: (asset.originalUrls || []),
+        rank: asset.rank ? Math.round(asset.rank) : 0,
+        collection: {
+            collectionId: asset.collectionId,
+            collectionTitle: asset.collectionTitle,
+            collectionMedias: (asset.collectionMedias?.map((media) => media &&
+                (0, builder_1.createAssetMedia)({
+                    media,
+                    asset,
+                })) || []),
+        },
+        category: asset.category,
+        categoryLabel: asset.categoryLabel,
+        price: {
+            latestPriceAmount: asset.latestPriceAmount,
+            latestPriceCurrency: asset.latestPriceCurrency,
+        },
+        attributes: (asset.attributes || []),
+        blockTimestamp: asset.blockTimestamp,
+    };
+    return {
+        ...newAsset,
+        isSlider: newAsset.medias.length > 1 || newAsset.originalUrls.length > 1,
+        splitedAssetId: newAsset.assetId.split(".")[1] || newAsset.assetId,
+        originalUrls: newAsset.originalUrls.map((originalUrl) => ({
+            url: (0, utils_1.checkGltfUrl)(originalUrl || ""),
+            mimeType: null,
+            originalMime: null,
+        })),
+        assetLink: `/${newAsset.itemType}/${newAsset.blockchain.getBlockChainPrivateLabel()}/${newAsset.assetId}${[core_1.BlockChainKeys.elrond, core_1.BlockChainKeys.solana].includes(newAsset.blockchain.getBlockChainPrivateLabel())
+            ? ""
+            : `/${newAsset.tokenId}`}`,
+    };
+};
+exports.buildAsset = buildAsset;

package/build/entities/asset/types.d.ts

@@ -0,0 +1,49 @@
+import { LabelKeys } from '../../dto/common/ItemType';
+import { IMedia } from '../media/types';
+import { IAsset, IProfile, IAttribute } from "@ludo.ninja/api/build/graphql_tools/__generated__/assetsHost/schema";
+import { BlockChainEntity, MarketPlaceEntity } from "@ludo.ninja/core";
+export type TAsset = {
+    assetId: IAsset["assetId"];
+    blockchain: BlockChainEntity;
+    markets: MarketPlaceEntity[];
+    ownersProfiles: IProfile[];
+    ownersAddresses: string[] | null;
+    itemType: LabelKeys.asset;
+    address: IAsset["address"];
+    tokenId: IAsset["tokenId"];
+    medias: IMedia[];
+    name: IAsset["name"];
+    description: IAsset["description"];
+    creatorsProfiles: IProfile[];
+    creatorsAddresses: string[] | null;
+    rank: number;
+    collection: {
+        collectionId: IAsset["collectionId"];
+        collectionTitle: IAsset["collectionTitle"];
+        collectionMedias: IMedia[];
+    };
+    category: IAsset["category"];
+    categoryLabel: IAsset["categoryLabel"];
+    price: {
+        latestPriceAmount: IAsset["latestPriceAmount"];
+        latestPriceCurrency: IAsset["latestPriceCurrency"];
+    };
+    attributes: IAttribute[];
+    blockTimestamp: IAsset["blockTimestamp"];
+    isSlider: boolean;
+    splitedAssetId: string;
+    originalUrls: {
+        url: string;
+        mimeType: null;
+        originalMime: null;
+    }[];
+    assetLink: string;
+};
+export declare enum EAssetVariants {
+    audio = "audio",
+    image = "image",
+    object3d = "object3d",
+    other = "other",
+    screenshot = "screenshot",
+    video = "video"
+}

package/build/entities/asset/types.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EAssetVariants = void 0;
+var EAssetVariants;
+(function (EAssetVariants) {
+    EAssetVariants["audio"] = "audio";
+    EAssetVariants["image"] = "image";
+    EAssetVariants["object3d"] = "object3d";
+    EAssetVariants["other"] = "other";
+    EAssetVariants["screenshot"] = "screenshot";
+    EAssetVariants["video"] = "video";
+})(EAssetVariants || (exports.EAssetVariants = EAssetVariants = {}));

package/build/entities/asset/utils.d.ts

@@ -0,0 +1,5 @@
+import { EAssetVariants } from './types';
+import { IMedia } from '../media/types';
+export declare const getAssetMediaVariant: ({ media }: {
+    media: IMedia;
+}) => EAssetVariants;

package/build/entities/asset/utils.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getAssetMediaVariant = void 0;
+const types_1 = require("./types");
+const _3d_1 = require("../../utils/3d");
+const core_1 = require("@ludo.ninja/core");
+const getAssetMediaVariant = ({ media }) => {
+    if ((0, core_1.isImage)({
+        media: media.media,
+        mimeType: media.mimeType,
+        originalMimeType: media.originalMime,
+    })) {
+        return types_1.EAssetVariants.image;
+    }
+    if ((0, core_1.isAudio)({
+        media: media.media,
+        mimeType: media.mimeType,
+        originalMimeType: media.originalMime,
+    })) {
+        return types_1.EAssetVariants.audio;
+    }
+    if ((0, core_1.isScreenshot)({
+        media: media.media,
+        mimeType: media.mimeType,
+        originalMimeType: media.originalMime,
+    })) {
+        return types_1.EAssetVariants.screenshot;
+    }
+    if ((0, core_1.isVideo)({
+        media: media.media,
+        mimeType: media.mimeType,
+        originalMimeType: media.originalMime,
+    })) {
+        return types_1.EAssetVariants.video;
+    }
+    if ((0, _3d_1.isObject3D)({
+        media: media.media,
+        mimeType: media.mimeType,
+    })) {
+        return types_1.EAssetVariants.object3d;
+    }
+    return types_1.EAssetVariants.other;
+};
+exports.getAssetMediaVariant = getAssetMediaVariant;

package/build/entities/media/builder.d.ts

@@ -0,0 +1,7 @@
+import { IMedia } from './types';
+import assetSchema from "@ludo.ninja/api/build/graphql_tools/__generated__/assetsHost/schema";
+export declare const createMedia: (media: IMedia) => IMedia;
+export declare const createAssetMedia: ({ media, asset }: {
+    media: assetSchema.IMedia;
+    asset: assetSchema.IAsset;
+}) => IMedia;

package/build/entities/media/builder.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createAssetMedia = exports.createMedia = void 0;
+const utils_1 = require("@ludo.ninja/utils");
+const createMedia = (media) => ({
+    ...media,
+    media: (0, utils_1.checkGltfUrl)(media.media || ""),
+});
+exports.createMedia = createMedia;
+const createAssetMedia = ({ media, asset }) => (0, exports.createMedia)({
+    media: media?.url || "",
+    nsfw: null,
+    mimeType: media?.mimeType || null,
+    previewUrl: null,
+    originalUrl: media?.originalUrl || null,
+    alt: `${asset.name || ""} ${asset.address || ""}`,
+    originalMime: media?.originalMime || null,
+});
+exports.createAssetMedia = createAssetMedia;

package/build/entities/media/types.d.ts

@@ -0,0 +1,9 @@
+export interface IMedia {
+    media: string;
+    mimeType: null | string;
+    nsfw: number | null;
+    previewUrl: string[] | null;
+    originalUrl?: string | null;
+    alt: string;
+    originalMime: null | string;
+}

package/build/entities/media/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ludo.ninja/components",
-  "version": "2.2.18",
+  "version": "2.2.20",
   "private": false,
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -23,7 +23,7 @@
     "publish": "npm publish --access public -workspace @ludo.ninja/components"
   },
   "dependencies": {
-    "@ludo.ninja/api": "^2.9.8",
+    "@ludo.ninja/api": "^3.0.20",
     "@react-three/drei": "^9.68.3",
     "@react-three/fiber": "^8.13.0",
     "chart.js": "^4.4.3",