{"version":3,"file":"nft.787064ce.js","sources":["../../../app/frontend/entrypoints/page/home/section/nfts/nft.tsx"],"sourcesContent":["import { useRecoilState } from 'recoil'\nimport { currentPlayState } from '../../../../../src/atoms/CurrentPlayAtom'\nimport { pageState } from '../../../../../src/atoms/PageAtom'\nimport { pastPageState } from '../../../../../src/atoms/PastPageAtom'\n\nimport { useTranslation } from 'react-i18next'\n\nimport pauseIcon from '../../../../../src/assets/images/icons/pause.svg'\nimport playIcon from '../../../../../src/assets/images/icons/play.svg'\n\ntype Props = {\n  nft: NFT\n  shapingPlayList: (target: {\n    chainId: number\n    tokenId: string\n    contractAddress: string\n  }) => void\n}\n\ntype NFT = {\n  chain_id: number\n  contract_address: string\n  token_id: string\n  name: string\n  image: string\n  sound: string\n  artist_name: string\n  artist_public_id: string\n  genres: Genre[]\n}\n\nfunction HomeNft(props: Props) {\n  const { t } = useTranslation()\n\n  const [, setPage] = useRecoilState(pageState)\n  const [, setPastPage] = useRecoilState(pastPageState)\n  const [currentPlay, setCurrentPlay] = useRecoilState(currentPlayState)\n\n  const fixUriPrefix = (uri: string) => {\n    let fixUri = String(uri)\n    if (fixUri.indexOf('ipfs://') !== -1) {\n      fixUri = fixUri.replace('ipfs://', 'https://ipfs.io/ipfs/')\n    } else if (fixUri.indexOf('ar://') !== -1) {\n      fixUri = fixUri.replace('ar://', 'https://arweave.net/')\n    }\n\n    return fixUri\n  }\n\n  let networkName = ''\n  switch (props.nft.chain_id) {\n    case 1:\n      networkName = 'ethereum'\n      break\n    case 5:\n      networkName = 'goerli'\n      break\n    case 137:\n      networkName = 'polygon'\n      break\n  }\n\n  const playMusic = () => {\n    if (!props.nft) return\n\n    props.shapingPlayList({\n      contractAddress: props.nft.contract_address,\n      tokenId: props.nft.token_id,\n      chainId: props.nft.chain_id,\n    })\n  }\n\n  return (\n    <div\n      className=\"nft\"\n      onClick={() => {\n        setPastPage('home')\n        setPage(\n          `nft/${networkName}/${props.nft.contract_address}/${props.nft.token_id}/detail`\n        )\n      }}\n    >\n      <div\n        className=\"image\"\n        style={{ backgroundImage: `url(${fixUriPrefix(props.nft.image)})` }}\n        onClick={(event) => {\n          event.stopPropagation()\n        }}\n      >\n        <div className=\"navigation\">\n          <button className=\"icon\"></button>\n          {currentPlay.chainId === props.nft.chain_id &&\n          currentPlay.contractAddress === props.nft.contract_address &&\n          currentPlay.tokenId === props.nft.token_id &&\n          currentPlay.playStatus ? (\n            <button\n              className=\"play\"\n              aria-label=\"停止\"\n              style={{ backgroundImage: `url(${pauseIcon})` }}\n              onClick={(event) => {\n                event.stopPropagation()\n                const dupCurrentPlay = Object.assign({}, currentPlay)\n                dupCurrentPlay.outerPause = true\n                setCurrentPlay(dupCurrentPlay)\n              }}\n            ></button>\n          ) : (\n            <button\n              className=\"play\"\n              aria-label=\"再生\"\n              style={{ backgroundImage: `url(${playIcon})` }}\n              onClick={(event) => {\n                event.stopPropagation()\n                playMusic()\n              }}\n            ></button>\n          )}\n          <button className=\"icon\"></button>\n        </div>\n      </div>\n      <div className=\"datum\">\n        <div className=\"genres\">\n          {props.nft.genres.length > 0 ? (\n            props.nft.genres.map((genre: Genre) => (\n              <button className=\"genre\" key={genre.public_id}>\n                {genre.name}\n              </button>\n            ))\n          ) : (\n            <button className=\"genre\">ジャンル未設定</button>\n          )}\n        </div>\n        <p className=\"data ttl\">{props.nft.name}</p>\n        <button\n          className=\"data button\"\n          onClick={(event) => {\n            event.stopPropagation()\n            setPastPage('home')\n            setPage(`artists/${props.nft.artist_public_id}`)\n          }}\n        >\n          <span className=\"user-icon\"></span>\n          <span className=\"artist-name\">{props.nft.artist_name}</span>\n        </button>\n      </div>\n      {/* <div className=\"buttons\">\n        {currentPlay.chainId === props.nft.chain_id &&\n        currentPlay.contractAddress === props.nft.contract_address &&\n        currentPlay.tokenId === props.nft.token_id &&\n        currentPlay.playStatus ? (\n          <button\n            className=\"button button-bl\"\n            onClick={(event) => {\n              event.stopPropagation()\n              const dupCurrentPlay = Object.assign({}, currentPlay)\n              dupCurrentPlay.outerPause = true\n              setCurrentPlay(dupCurrentPlay)\n            }}\n          >\n            {t('parts.pauseButton.text')}\n          </button>\n        ) : (\n          <button\n            className=\"button button-bl\"\n            onClick={(event) => {\n              event.stopPropagation()\n              playMusic()\n            }}\n          >\n            {t('parts.listeningButton.text')}\n          </button>\n        )}\n        <button\n          className=\"button button-wh\"\n          onClick={(event) => {\n            event.stopPropagation()\n            setPastPage('home')\n            setPage(\n              `nft/${networkName}/${props.nft.contract_address}/${props.nft.token_id}/detail`\n            )\n          }}\n        >\n          {t('parts.showButton.text')}\n        </button>\n      </div> */}\n    </div>\n  )\n}\n\nexport default HomeNft\n"],"names":["HomeNft","props","useTranslation","setPage","useRecoilState","pageState","setPastPage","pastPageState","currentPlay","setCurrentPlay","currentPlayState","fixUriPrefix","uri","fixUri","String","indexOf","replace","networkName","nft","chain_id","playMusic","shapingPlayList","contractAddress","contract_address","tokenId","token_id","chainId","_jsx","backgroundImage","image","event","stopPropagation","playStatus","pauseIcon","dupCurrentPlay","Object","assign","outerPause","playIcon","_jsxs","genres","length","map","genre","name","public_id","artist_public_id","artist_name"],"mappings":"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"}