fix: hide empty sections and remove sample data

js/packages/web/src/components/PreSaleBanner/index.tsx

@@ -17,6 +17,11 @@ export const PreSaleBanner = ({
   auction,
 }: IPreSaleBanner) => {
   const art = useArt(auction?.thumbnail.metadata.pubkey);
+
+  if (!auction) {
+    return null;
+  }
+
   return (
     <Row style={{ height: 400 }}>
       <Col span={12} style={{ display: 'flex' }}>

js/packages/web/src/views/art/index.tsx

@@ -4,8 +4,6 @@ import { useParams } from 'react-router-dom';
 import { useArt } from './../../hooks';
 
 import './index.less';
-import { Artist } from '../../types';
-import { sampleArtist } from '../home/sampleData';
 import { ArtContent } from '../../components/ArtContent';
 import { shortenAddress } from '@oyster/common';
 import { MetaAvatar } from '../../components/MetaAvatar';
@@ -15,7 +13,6 @@ const { Content } = Layout;
 export const ArtView = () => {
   const { id } = useParams<{ id: string }>();
   const art = useArt(id);
-  const artist: Artist = sampleArtist;
 
   return (
     <Content>
@@ -66,8 +63,12 @@ export const ArtView = () => {
             <div className="info-header">ABOUT THE CREATION</div>
             <div className="info-content">{art.about}</div>
             <br />
+            {/*
+              TODO: add info about artist
+
+
             <div className="info-header">ABOUT THE CREATOR</div>
-            <div className="info-content">{artist.about}</div>
+            <div className="info-content">{art.about}</div> */}
           </Col>
         </Row>
       </Col>

js/packages/web/src/views/home/index.tsx

@@ -10,7 +10,7 @@ import { AuctionRenderCard } from '../../components/AuctionRenderCard';
 import { Link } from 'react-router-dom';
 import { CardLoader } from '../../components/MyLoader';
 import { useMeta } from '../../contexts';
-import moment from 'moment';
+import BN from 'bn.js';
 
 const { TabPane } = Tabs;
 
@@ -29,25 +29,26 @@ export const HomeView = () => {
   const heroAuction = useMemo(
     () =>
       auctions.filter(a => {
-        const now = moment().unix();
-        let delta = (a.auction.info.endedAt?.toNumber() || 0) - now;
-
+        // const now = moment().unix();
+        return !a.auction.info.ended();
         // filter out auction for banner that are further than 30 days in the future
-        return Math.floor(delta / 86400) <= 30;
+        // return Math.floor(delta / 86400) <= 30;
       })?.[0],
     [auctions],
   );
 
-  const liveAuctions = (
+  const liveAuctions = auctions
+  .sort((a, b) => a.auction.info.endedAt?.sub(b.auction.info.endedAt || new BN(0)).toNumber() || 0)
+  .filter((m, idx) => idx < 10);
+
+  const liveAuctionsView = (
     <Masonry
       breakpointCols={breakpointColumnsObj}
       className="my-masonry-grid"
       columnClassName="my-masonry-grid_column"
     >
       {!isLoading
-        ? auctions
-            .filter((m, idx) => idx < 10)
-            .map((m, idx) => {
+        ? liveAuctions.map((m, idx) => {
               if (m === heroAuction) {
                 return;
               }
@@ -93,14 +94,14 @@ export const HomeView = () => {
       <Layout>
         <Content style={{ display: 'flex', flexWrap: 'wrap' }}>
           <Col style={{ width: '100%', marginTop: 10 }}>
-            <Row>
+            {liveAuctions.length > 0 && (<Row>
               <Tabs>
                 <TabPane>
                   <h2>Live Auctions</h2>
-                  {liveAuctions}
+                  {liveAuctionsView}
                 </TabPane>
               </Tabs>
-            </Row>
+            </Row>)}
             <Row>
               <Tabs>
                 <TabPane>

js/packages/web/src/views/home/sampleData.ts

@@ -1,122 +0,0 @@
-import { Auction, Artist, Presale } from '../../types';
-
-export const sampleAuction: Auction = {
-  name: 'Liquidity Pool',
-  auctionerName: 'Rama XI',
-  auctionerLink: '/address/4321dcba',
-  highestBid: 23000,
-  solAmt: 200,
-  link: '/auction/1234abcd',
-  image: 'img/auction1.jpg',
-  endingTS: 1618447663000,
-};
-
-export const sampleAuctions: Array<Auction> = [
-  {
-    name: 'Team Trees',
-    auctionerName: 'NFToros',
-    auctionerLink: '/address/4321dcba',
-    highestBid: 23000,
-    solAmt: 115,
-    link: '/auction/1234abcd',
-    image: 'img/auction2.jpg',
-    endingTS: 1618447663000,
-  },
-  {
-    name: 'Miko 4',
-    auctionerName:
-      'Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World ',
-    auctionerLink: '/address/4321dcba',
-    highestBid: 13000,
-    solAmt: 75,
-    link: '/auction/1234abcd',
-    image: 'img/auction3.jpg',
-    endingTS: 1618447663000,
-  },
-  {
-    name: 'Tell Me',
-    auctionerName: 'Supper Club',
-    auctionerLink: '/address/4321dcba',
-    highestBid: 24000,
-    solAmt: 120,
-    link: '/auction/1234abcd',
-    image: 'img/auction4.jpg',
-    endingTS: 1618447663000,
-  },
-  {
-    name: 'Saucy',
-    auctionerName: 'Mr. Momo',
-    auctionerLink: '/address/4321dcba',
-    highestBid: 23000,
-    solAmt: 200,
-    link: '/auction/1234abcd',
-    image: 'img/auction5.jpg',
-    endingTS: 1618447663000,
-  },
-  {
-    name: 'Haze',
-    auctionerName: 'Daily Dose',
-    auctionerLink: '/address/4321dcba',
-    highestBid: 23000,
-    solAmt: 200,
-    link: '/auction/1234abcd',
-    image: 'img/auction6.jpg',
-    endingTS: 1618447663000,
-  },
-  {
-    name: 'Wounderground',
-    auctionerName: 'The Maze',
-    auctionerLink: '/address/4321dcba',
-    highestBid: 23000,
-    solAmt: 200,
-    link: '/auction/1234abcd',
-    image: 'img/auction7.jpg',
-    endingTS: 1618447663000,
-  },
-];
-
-export const sampleArtists: Array<Artist> = [
-  {
-    name: 'Yuzu415',
-    link: '/artist/1234abcd',
-    image: 'img/artist1.jpeg',
-    itemsAvailable: 7,
-    itemsSold: 215,
-  },
-  {
-    name: 'Mischa',
-    link: '/artist/1234abcd',
-    image: 'img/artist2.jpeg',
-    itemsAvailable: 2,
-    itemsSold: 215,
-  },
-  {
-    name: 'Sammy',
-    link: '/artist/1234abcd',
-    image: 'img/artist3.jpeg',
-    itemsAvailable: 7,
-    itemsSold: 215,
-  },
-  {
-    name: 'Wonderful',
-    link: '/artist/1234abcd',
-    image: 'img/artist4.jpeg',
-    itemsAvailable: 7,
-    itemsSold: 215,
-  },
-];
-
-export const sampleArtist: Artist = {
-  name: 'Yuzu415',
-  link: '/artist/1234abcd',
-  image: '/img/artist3.jpeg',
-  about:
-    'NFTARTIST is an Artist & Director working in entertainment for the past 15 years. Experience in film, commercial and live events, his work serves as a means to visual and methodological study.',
-};
-
-export const samplePresale: Presale = {
-  endingTS: 1618447663000,
-  targetPricePerShare: 5,
-  pricePerShare: 4.39,
-  marketCap: 328,
-};