@@ -186,7 +202,6 @@ export default connect(
(state, ownProps) => {
return { ...ownProps,
nft_tokens: state.global.get('nft_tokens'),
- assets: state.global.get('assets')
}
},
diff --git a/app/components/pages/nft/AllNFTPage.jsx b/app/components/pages/nft/AllNFTPage.jsx
new file mode 100644
index 0000000..f72cb7c
--- /dev/null
+++ b/app/components/pages/nft/AllNFTPage.jsx
@@ -0,0 +1,177 @@
+import React from 'react'
+import { connect, } from 'react-redux'
+import tt from 'counterpart'
+import Reveal from 'react-foundation-components/lib/global/reveal'
+
+import DropdownMenu from 'app/components/elements/DropdownMenu'
+import Icon from 'app/components/elements/Icon'
+import LoadingIndicator from 'app/components/elements/LoadingIndicator'
+import NFTTokenItem from 'app/components/elements/nft/NFTTokenItem'
+import NFTTokenTransfer from 'app/components/modules/nft/NFTTokenTransfer'
+import NFTTokenSell from 'app/components/modules/nft/NFTTokenSell'
+import g from 'app/redux/GlobalReducer'
+
+class AllNFTPage extends React.Component {
+ state = {}
+
+ componentDidMount() {
+ this.refetch()
+ }
+
+ refetch = () => {
+ this.props.fetchNFTTokens(0, this.sort, this.sortReversed)
+ }
+
+ showTransfer = (e, tokenIdx) => {
+ e.preventDefault()
+ this.setState({
+ showTransfer: true,
+ tokenIdx,
+ })
+ }
+
+ hideTransfer = () => {
+ this.setState({
+ showTransfer: false,
+ })
+ }
+
+ showSell = (e, tokenIdx) => {
+ e.preventDefault()
+ this.setState({
+ showSell: true,
+ tokenIdx,
+ })
+ }
+
+ hideSell = () => {
+ this.setState({
+ showSell: false,
+ })
+ }
+
+ sortOrder = (e, sort, sortReversed) => {
+ e.preventDefault()
+ this.sort = sort
+ this.sortReversed = sortReversed
+ this.refetch()
+ }
+
+ render() {
+ const { currentUser, nft_tokens, nft_assets, } = this.props
+
+ const tokens = nft_tokens ? nft_tokens.toJS().data : null
+ const assets = nft_assets ? nft_assets.toJS() : {}
+
+ const next_from = nft_tokens && nft_tokens.get('next_from')
+
+ let items = []
+ if (!tokens) {
+ items =
+ } else if (!tokens.length) {
+ items =
{tt('nft_tokens_jsx.not_yet')}
+ } else {
+ for (let i = 0; i < tokens.length; ++i) {
+ const token = tokens[i]
+ items.push(
)
+ }
+ }
+
+ const { showTransfer, showSell, tokenIdx } = this.state
+
+ const sortItems = [
+ { link: '#', onClick: e => {
+ this.sortOrder(e, 'by_last_update', false)
+ }, value: tt('nft_tokens_jsx.sort_new') },
+ { link: '#', onClick: e => {
+ this.sortOrder(e, 'by_last_update', true)
+ }, value: tt('nft_tokens_jsx.sort_old') },
+ { link: '#', onClick: e => {
+ this.sortOrder(e, 'by_last_price', false)
+ }, value: tt('nft_tokens_jsx.sort_price') },
+ { link: '#', onClick: e => {
+ this.sortOrder(e, 'by_name', false)
+ }, value: tt('nft_tokens_jsx.sort_name') },
+ ]
+
+ let currentSort
+ if (this.sort === 'by_last_price') {
+ currentSort = tt('nft_tokens_jsx.sort_price')
+ } else if (this.sort === 'by_name') {
+ currentSort = tt('nft_tokens_jsx.sort_name')
+ } else {
+ if (this.sortReversed) {
+ currentSort = tt('nft_tokens_jsx.sort_old')
+ } else {
+ currentSort = tt('nft_tokens_jsx.sort_new')
+ }
+ }
+
+ return (
+
+
+
{tt('all_nft_page_jsx.title')}
+
+
+
+ {currentSort}
+
+
+
+
+
+
+
+ {items}
+ {next_from ?
+
+ : null}
+
+
+
+
+
+
+
+
+
+
+
)
+ }
+}
+
+module.exports = {
+ path: '/all-nft',
+ component: connect(
+ (state, ownProps) => {
+ const currentUser = state.user.getIn(['current'])
+
+ return {
+ currentUser,
+ nft_tokens: state.global.get('nft_tokens'),
+ nft_assets: state.global.get('nft_assets')
+ }
+ },
+ dispatch => ({
+ fetchNFTTokens: (start_token_id, sort, sortReversed) => {
+ dispatch(g.actions.fetchNftTokens({ account: '', start_token_id, sort, reverse_sort: sortReversed }))
+ },
+ })
+ )(AllNFTPage),
+}
\ No newline at end of file
diff --git a/app/components/pages/nft/AllNFTPage.scss b/app/components/pages/nft/AllNFTPage.scss
new file mode 100644
index 0000000..873e70b
--- /dev/null
+++ b/app/components/pages/nft/AllNFTPage.scss
@@ -0,0 +1,7 @@
+.AllNFTPage {
+ padding-top: 1rem;
+ padding-bottom: 1rem;
+ padding-left: 0.2rem;
+ padding-right: 0.2rem;
+ flex: 1;
+}
diff --git a/app/components/pages/nft/NFTMarketPage.jsx b/app/components/pages/nft/NFTMarketPage.jsx
index c46eda6..70b13b3 100644
--- a/app/components/pages/nft/NFTMarketPage.jsx
+++ b/app/components/pages/nft/NFTMarketPage.jsx
@@ -1,28 +1,34 @@
import React from 'react'
import { connect, } from 'react-redux'
+import { Link } from 'react-router'
import tt from 'counterpart'
import LoadingIndicator from 'app/components/elements/LoadingIndicator'
+import NFTMarketCollections from 'app/components/elements/nft/NFTMarketCollections'
import NFTTokenItem from 'app/components/elements/nft/NFTTokenItem'
import g from 'app/redux/GlobalReducer'
+import session from 'app/utils/session'
class NFTMarketPage extends React.Component {
componentDidMount() {
- setTimeout(() => {
+ this.props.fetchNftMarketCollections('')
+ this.refetch()
+ }
+
+ componentDidUpdate(prevProps) {
+ if (this.props.routeParams.name !== prevProps.routeParams.name) {
this.refetch()
- }, 500)
+ }
}
refetch = () => {
- const { currentUser } = this.props
- const username = currentUser && currentUser.get('username')
- this.props.fetchNftMarket(username, '', 0, this.sort, this.sortReversed)
+ const collName = this.props.routeParams.name || ''
+ const curName = session.load().currentName
+ this.props.fetchNftMarket(curName, collName, 0, this.sort, this.sortReversed)
}
render() {
- const { currentUser, nft_orders, own_nft_orders, nft_assets, routeParams } = this.props
-
- const { name } = routeParams
+ const { currentUser, nft_market_collections, nft_orders, own_nft_orders, nft_assets, routeParams } = this.props
let content
const orders = nft_orders ? nft_orders.toJS().data : null
@@ -65,7 +71,7 @@ class NFTMarketPage extends React.Component {
{items}
{next_from ?
: null}
@@ -74,9 +80,18 @@ class NFTMarketPage extends React.Component {
}
+ const selected = this.props.routeParams.name
+
return