Merge pull request #37 from golos-blockchain/dev

Dev
golos-blockchain · Nov 12, 2023 · 15e8634 · 15e8634
2 parents 910fc98 + 3e13d1f
commit 15e8634
Show file tree

Hide file tree

Showing 20 changed files with 379 additions and 37 deletions.
diff --git a/app/ResolveRoute.js b/app/ResolveRoute.js
@@ -112,5 +112,8 @@ export default function resolveRoute(path)
     if (match) { 
         return {page: 'NFTMarketPage', params: match.slice(1)}
     }
+    if (path === '/all-nft') {
+        return {page: 'AllNFTPage'}
+    }
     return {page: 'NotFound'};
 }
diff --git a/app/RootRoute.js b/app/RootRoute.js
@@ -39,6 +39,8 @@ export default {
             cb(null, [require('@pages/nft/NFTTokenPage')]);
         } else if (route.page === 'NFTMarketPage') {
             cb(null, [require('@pages/nft/NFTMarketPage')]);
+        } else if (route.page === 'AllNFTPage') {
+            cb(null, [require('@pages/nft/AllNFTPage')])
         } else if (route.page === 'Market') {
             cb(null, [require('@pages/MarketLoader')]);
        } else if (route.page === 'Rating') {

diff --git a/app/components/App.jsx b/app/components/App.jsx
@@ -38,7 +38,7 @@ const GlobalStyle = createGlobalStyle`
     }
 `;
 
-const availableDomains = [
+export const availableDomains = [
     'golos.id',
     'golos.in',
     'golos.today',

diff --git a/app/components/all.scss b/app/components/all.scss
@@ -85,6 +85,7 @@
 @import "./pages/Rating";
 @import "./pages/UserProfile";
 @import "./pages/Witnesses";
+@import "./pages/nft/AllNFTPage";
 @import "./pages/nft/NFTCollectionPage";
 @import "./pages/nft/NFTMarketPage";
 @import "./pages/nft/NFTTokenPage";
diff --git a/app/components/elements/Memo.jsx b/app/components/elements/Memo.jsx
@@ -5,6 +5,7 @@ import tt from 'counterpart';
 import { memo, } from 'golos-lib-js';
 import { Link, } from 'react-router';
 
+import { availableDomains } from 'app/components/App'
 import links from 'app/utils/Links'
 import shouldComponentUpdate from 'app/utils/shouldComponentUpdate'
 import { validate_account_name, } from 'app/utils/ChainValidation'
@@ -52,19 +53,28 @@ class Memo extends React.Component {
         for (let section of text.split(' ')) {
             if (section.trim().length === 0) continue
             const matchUserName = section.match(/(^|\s)(@[a-z][-\.a-z\d]+[a-z\d])/i)
-            const matchLink = section.match(links.local)
+            let insertPlain = true
             if (matchUserName) {
                 const user2 = matchUserName[0].trim().substring(1)
                 const userLower = user2.toLowerCase()
                 const valid = validate_account_name(userLower) == null
                 valid
                     ? sections.push(<Link key={idx++} to={`/@${userLower}`}>{`@${user2}`}&nbsp;</Link>)
                     : sections.push(<span key={idx++}>{`@${user2}`}</span>)
+                insertPlain = false
+            } else if (section.match(links.any)) {
+                let hostname
+                try {
+                    hostname = new URL(section.trim()).hostname
+                } catch (err) {
+                    console.error(err)
+                }
+                if (availableDomains.includes(hostname)) {
+                    sections.push(<a key={idx++} href={section} target='_blank' rel='noopener noreferrer'>{section}&nbsp;</a>)
+                    insertPlain = false
+                }
             }
-            else if (matchLink) {
-                sections.push(<Link key={idx++} to={section}>{section}&nbsp;</Link>)
-            }
-            else {
+            if (insertPlain) {
                 sections.push(<span className="overflow-ellipsis" key={idx++}>{section}&nbsp;</span>)
             }
       }

diff --git a/app/components/elements/nft/NFTMarketCollections.jsx b/app/components/elements/nft/NFTMarketCollections.jsx
@@ -4,38 +4,53 @@ import tt from 'counterpart'
 import Icon from 'app/components/elements/Icon'
 import NFTSmallIcon from 'app/components/elements/nft/NFTSmallIcon'
 import PagedDropdownMenu from 'app/components/elements/PagedDropdownMenu'
+import { NFTImageStub } from 'app/utils/NFTUtils'
 
 class NFTMarketCollections extends React.Component {
     render() {
         let { nft_market_collections, selected } = this.props
-        const nft_colls = nft_market_collections ? nft_market_collections.toJS() : []
+        const nft_colls = nft_market_collections ? nft_market_collections.toJS().data : []
 
         const colls = []
         colls.push({
             key: '_all',
             link: '/nft',
-            label: <React.Fragment>
-                <NFTSmallIcon image={null} />
-                {tt('nft_market_page_jsx.all_collections')}
-            </React.Fragment>,
-            value: tt('nft_market_page_jsx.all_collections')
+            value: tt('nft_market_collections_jsx.all_collections')
         })
+        let i = 0
         for (const nft_coll of nft_colls) {
             colls.push({
-                key: nft_coll.name,
+                key: i,
                 link: '/nft/' + nft_coll.name,
                 label: <React.Fragment>
                     <NFTSmallIcon image={nft_coll.image} />
                     {nft_coll.name}
                 </React.Fragment>,
                 value: nft_coll.name
             })
+            ++i
         }
 
-        selected = selected || tt('nft_market_page_jsx.all_collections')
+        selected = selected || tt('nft_market_collections_jsx.all_collections')
 
         return <PagedDropdownMenu className='NFTMarketCollections Witnesses__vote-list' el='div' items={colls}
-            renderItem={item => item}
+            renderItem={item => {
+                const coll = nft_colls[item.key]
+                const collImg = (coll && coll.image) || NFTImageStub()
+                const collName = coll ? coll.name : tt('nft_market_collections_jsx.all_collections')
+
+                return {
+                    ...item,
+                    label: <React.Fragment>
+                        <NFTSmallIcon image={collImg} />
+                        {collName}
+                    </React.Fragment>,
+                    addon: (coll && coll.sell_order_count) ?
+                        <span style={{ position: 'absolute', right: '10px' }} title={tt('nft_market_collections_jsx.order_count', {count: coll.sell_order_count})}>
+                            {coll.sell_order_count}
+                        </span> : null,
+                }
+            }}
             selected={selected}
             perPage={20}>
             {selected}

diff --git a/app/components/elements/nft/NFTMarketCollections.scss b/app/components/elements/nft/NFTMarketCollections.scss
@@ -1,4 +1,8 @@
 .NFTMarketCollections {
+    margin-top: 6px;
+    margin-left: 10px;
+    vertical-align: top;
+
     .NFTSmallIcon {
         margin-top: 0.25rem;
         margin-right: 0.25rem;

diff --git a/app/components/elements/nft/NFTTokenItem.jsx b/app/components/elements/nft/NFTTokenItem.jsx
@@ -99,7 +99,9 @@ class NFTTokenItem extends Component {
             }
             last_price = <span title={tt('nft_tokens_jsx.selling_for') + price.floatString}>
                 {imageUrl && <img className='price-icon' src={imageUrl} alt={''} />}
-                {price.amountFloat}
+                <span style={{fontSize: price.amountFloat.length > 9 ? '90%' : '100%' }}>
+                    {price.amountFloat}
+                </span>
             </span>
         }
 

diff --git a/app/components/modules/Header.jsx b/app/components/modules/Header.jsx
@@ -116,6 +116,8 @@ class Header extends React.Component {
             page_title = tt('header_jsx.nft_token')
         } else if (route.page === `NFTMarketPage`){
             page_title = tt('header_jsx.nft_market')
+        } else if (route.page === `AllNFTPage`){
+            page_title = tt('all_nft_page_jsx.title')
         } else {
             page_name = ''; //page_title = route.page.replace( /([a-z])([A-Z])/g, '$1 $2' ).toLowerCase();
         }

diff --git a/app/components/modules/nft/NFTTokenSell.jsx b/app/components/modules/nft/NFTTokenSell.jsx
@@ -3,6 +3,7 @@ import tt from 'counterpart'
 import { connect, } from 'react-redux'
 import CloseButton from 'react-foundation-components/lib/global/close-button'
 import { Formik, Form, Field, ErrorMessage, } from 'formik'
+import { api } from 'golos-lib-js'
 import { Asset, AssetEditor } from 'golos-lib-js/lib/utils'
 
 import AmountField from 'app/components/elements/forms/AmountField'
@@ -19,6 +20,20 @@ class NFTTokenSell extends Component {
         }
     }
 
+    async componentDidMount() {
+        try {
+            const assets = await api.getAssetsAsync('', [], '', 5000, 'by_symbol_name')
+            for (const asset of assets) {
+                asset.supply = Asset(asset.supply)
+            }
+            this.setState({
+                assets
+            })
+        } catch (err) {
+            console.error(err)
+        }
+    }
+
     validate = (values) => {
         const errors = {}
         const { price } = values
@@ -99,7 +114,7 @@ class NFTTokenSell extends Component {
     }
 
     render() {
-        if (this.doNotRender) {
+        if (this.doNotRender || !this.state.assets) {
             return <LoadingIndicator type='circle' />
         }
 
@@ -120,9 +135,10 @@ class NFTTokenSell extends Component {
         const assets = {}
         assets['GOLOS'] = { supply: Asset(0, 3, 'GOLOS') }
         assets['GBG'] = { supply: Asset(0, 3, 'GBG') }
-        for (const asset of this.props.assets) {
-            asset.supply = asset.supply.symbol ? asset.supply : Asset(asset.supply)
-            assets[asset.supply.symbol] = asset
+        for (const asset of this.state.assets) {
+            const sym = asset.supply.symbol
+            if ($STM_Config.hidden_assets && $STM_Config.hidden_assets[sym]) continue
+            assets[sym] = asset
         }
 
         return <div className='NFTTokenSell'>
@@ -186,7 +202,6 @@ export default connect(
     (state, ownProps) => {
         return { ...ownProps,
             nft_tokens: state.global.get('nft_tokens'),
-            assets: state.global.get('assets')
         }
     },