@mojito-inc/secondary-market/cjs/component/TokenCard.js

Mojito secondary market is the platform to purchase NFT.

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var i=require("react/jsx-runtime"),e=require("react"),t=require("@mui/material/Stack"),o=require("@mui/material/CardContent"),l=require("@mui/material/IconButton"),n=require("@mui/material/Card"),r=require("@mui/material/Button"),a=require("@mui/material/Typography"),d=require("@mui/material/Box"),u=require("@mui/material/styles"),s=require("@mui/icons-material/MoreVert"),p=require("@mui/material/CardActions"),v=require("../constant/index.js"),m=require("../utils/formatNumberWithCommas.js"),c=require("../utils/usdAndEuroCurrencyFormat.js"),x=require("./VideoWithImageCard.js");exports.default=({listingType:g,cardDetail:h,showMenu:b,placeholderImage:y,walletMediaConfig:f,currency:C="USD",isShowSecondaryButton:j=!1,secondaryButtonLabel:L,onClickSecondaryButton:k,handleMenuOpen:T,onClickButton:A,onClickCard:I})=>{var q,S,B,N,W,w,z,M,F,O,$,E,_,D,R,U,P,X,V;const Y=u.useTheme(),G=e.useCallback((()=>{(null==h?void 0:h.buttonName)&&void 0!==I&&I()}),[null==h?void 0:h.buttonName,I]);return i.jsxs(n,{sx:{boxShadow:"none",position:"relative",borderRadius:"12px"},children:[b&&i.jsx(l,{"aria-label":"options","aria-controls":"media-menu","aria-haspopup":"true",onClick:T,sx:{zIndex:1,position:"absolute",right:"16px",top:"16px",borderRadius:"50%",background:null===(q=null==Y?void 0:Y.palette)||void 0===q?void 0:q.iconColor,"&:hover":{background:null===(S=null==Y?void 0:Y.palette)||void 0===S?void 0:S.iconColor}},children:i.jsx(s,{sx:{color:null===(N=null===(B=null==Y?void 0:Y.palette)||void 0===B?void 0:B.text)||void 0===N?void 0:N.primary}})}),i.jsxs(o,{onClick:G,sx:{padding:"0px !important",backgroundColor:Y.palette.primary.dark,cursor:void 0!==I&&(null==h?void 0:h.buttonName)?"pointer":"default"},children:[i.jsx(x.default,{videoAttributes:Object.assign(Object.assign({},null==f?void 0:f.videoAttributes),{thumbnailFrame:null===(W=null==f?void 0:f.videoAttributes)||void 0===W?void 0:W.thumbnailFrame,customThumbnail:(null===(w=null==f?void 0:f.videoAttributes)||void 0===w?void 0:w.customThumbnail)||(null==h?void 0:h.thumbnailImage)||(null==h?void 0:h.placeholderImage)}),url:"thumbnail-only"!==(null===(z=null==f?void 0:f.videoAttributes)||void 0===z?void 0:z.thumbnailFrame)&&"custom"!==(null===(M=null==f?void 0:f.videoAttributes)||void 0===M?void 0:M.thumbnailFrame)?(null==h?void 0:h.tokenImage)||(null==h?void 0:h.animationURL):(null==h?void 0:h.animationURL)||(null==h?void 0:h.tokenImage),placeholderImage:y,height:"300px"}),!(null==f?void 0:f.mediaOnly)&&i.jsxs(d,{sx:{paddingY:"12px",paddingX:"8px"},children:[i.jsx(d,{height:"auto",children:i.jsx(a,{variant:"h3",sx:{fontSize:"24px",marginTop:"8px",marginBottom:"8px",overflow:"hidden",textOverflow:"ellipsis",display:"-webkit-box",WebkitBoxOrient:"vertical",WebkitLineClamp:2},children:(null==h?void 0:h.tokenName)?null==h?void 0:h.tokenName:`# ${null==h?void 0:h.tokenId}`})}),i.jsxs(t,{sx:g===(null===v.ListingType||void 0===v.ListingType?void 0:v.ListingType.CLAIMABLE)?{height:"auto",justifyContent:"flex-end"}:{height:"auto",justifyContent:h.priceLabel?"space-between":"flex-end"},direction:"row",children:[h.priceLabel&&g!==(null===v.ListingType||void 0===v.ListingType?void 0:v.ListingType.CLAIMABLE)&&i.jsxs(d,{sx:{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"flex-start"},children:[i.jsx(a,{sx:{fontSize:"10px",fontWeight:700,color:Y.palette.grey[400],letterSpacing:"1.1px"},children:h.priceLabel}),i.jsx(a,{variant:"subtitle1",sx:{fontWeight:600,fontSize:"24px"},children:`${m.formatNumberWithCommas(h.cryptoPrice)} ${h.cryptoLabel}`}),i.jsx(a,{sx:{fontWeight:500,fontSize:"12px",color:Y.palette.grey[400]},children:`${c.formatUsdAndEuroCurrency(h.usdPrice,C)} ${C}`})]}),i.jsx(d,{sx:{display:"flex",justifyContent:"flex-end",alignItems:"flex-end"},children:i.jsx(d,{sx:{height:"27px",backgroundColor:Y.palette.grey[800],color:Y.palette.grey[400],borderRadius:20,display:"flex",justifyContent:"center",alignItems:"center",paddingX:"10px"},children:i.jsx(a,{variant:"h6",sx:{fontWeight:700,fontSize:"12px"},children:h.collectionType})})})]})]})]}),(null==h?void 0:h.buttonName)&&i.jsxs(p,{sx:{backgroundColor:Y.palette.primary.dark,paddingY:g===(null===v.ListingType||void 0===v.ListingType?void 0:v.ListingType.CLAIMABLE)?"0px":"12px",paddingX:"8px",paddingTop:0,display:"flex",flexDirection:"column"},children:[(null==h?void 0:h.buttonName)?i.jsx(r,{fullWidth:!0,"data-testid":"NFT_Card_btn",sx:{textTransform:"capitalize",color:null===($=null===(O=null===(F=null==Y?void 0:Y.palette)||void 0===F?void 0:F.appDefaultColor)||void 0===O?void 0:O.secondary)||void 0===$?void 0:$.dark,border:`1px solid ${null===(_=null===(E=null==Y?void 0:Y.palette)||void 0===E?void 0:E.grey)||void 0===_?void 0:_[700]}`,background:null===(R=null===(D=null==Y?void 0:Y.palette)||void 0===D?void 0:D.primary)||void 0===R?void 0:R.main,fontSize:"14px",fontWeight:500},onClick:A,children:null==h?void 0:h.buttonName}):i.jsx(d,{height:g===(null===v.ListingType||void 0===v.ListingType?void 0:v.ListingType.CLAIMABLE)?"auto":j&&L?"96px":"40px"}),(null==h?void 0:h.buttonName)&&j&&L&&k&&i.jsx(r,{fullWidth:!0,"data-testid":"NFT_Shipping_btn",variant:"outlined",sx:{textTransform:"uppercase",color:null===(P=null===(U=null==Y?void 0:Y.palette)||void 0===U?void 0:U.primary)||void 0===P?void 0:P.main,border:`1px solid ${null===(V=null===(X=null==Y?void 0:Y.palette)||void 0===X?void 0:X.primary)||void 0===V?void 0:V.main}`,backgroundColor:"transparent",fontSize:"16px",fontWeight:500,marginLeft:"0px !important",marginTop:"16px"},onClick:k,children:L})]})]})};