Hotfix 10 9 launch (#36)

* Add audius.org link

* Add TermsOfUse

* Bump libs to 1.0.0

* Update env vars for new contracts

* 0.21.22

* 0.21.23

* hotfix 10 9 bugfix (#37)

* Fix eagerLoadUtils

* Add wait for libs init on history

* Switch to ropsten

.env/.env.prod

@@ -9,11 +9,11 @@ REACT_APP_REGISTRY_ADDRESS=0xC611C82150b56E6e4Ec5973AcAbA8835Dd0d75A2
 REACT_APP_WEB3_PROVIDER_URL=https://poa-gateway.audius.co,https://core.poa.network
 REACT_APP_WEB3_NETWORK_ID=99
 
-REACT_APP_ETH_REGISTRY_ADDRESS=0xb2be26Ca062c5D74964921B80DE6cfa28D9A36c0
-REACT_APP_ETH_PROVIDER_URL=https://mainnet.infura.io/v3/c569c6faf4f14d15a49d0044e7ddd668
-REACT_APP_ETH_NETWORK_ID=1
-REACT_APP_ETH_TOKEN_ADDRESS=0xADEf65C0f6a30Dcb5f88Eb8653BBFe09Bf99864f
-REACT_APP_ETH_OWNER_WALLET=0xe886a1858d2d368ef8f02c65bdd470396a1ab188
+REACT_APP_ETH_REGISTRY_ADDRESS=0x095284A8237b275aBB96E8587e60ed76983BE6A5
+REACT_APP_ETH_PROVIDER_URL=https://eth-ropsten.alchemyapi.io/v2/Cfba0ddjnI3WUXr2V_85dAaIPm_a6CSx
+REACT_APP_ETH_NETWORK_ID=3
+REACT_APP_ETH_TOKEN_ADDRESS=0xF0A4A438821d21e37150e9916569De7c156E898F
+REACT_APP_ETH_OWNER_WALLET=0xC7310a03e930DD659E15305ed7e1F5Df0F0426C5
 
 REACT_APP_CACHE_PRUNE_MIN=250
 

.env/.env.staging

@@ -9,10 +9,10 @@ REACT_APP_REGISTRY_ADDRESS=0x793373aBF96583d5eb71a15d86fFE732CD04D452
 REACT_APP_WEB3_PROVIDER_URL=https://poa-gateway.staging.audius.co,https://sokol.poa.network/
 REACT_APP_WEB3_NETWORK_ID=77
 
-REACT_APP_ETH_REGISTRY_ADDRESS=0xB631ABAA63a26311366411b2025F0cAca00DE27F
+REACT_APP_ETH_REGISTRY_ADDRESS=0xE4D37F2dA0a2953f801c23e036D924595eE6d0c1
 REACT_APP_ETH_PROVIDER_URL=https://eth-ropsten.alchemyapi.io/v2/Y-vE_LXNPnKsbnmaXxAre7t_xI-PA6KU
 REACT_APP_ETH_NETWORK_ID=3
-REACT_APP_ETH_TOKEN_ADDRESS=0xF8e679Aa54361467B12c7394BFF57Eb890f6d934
+REACT_APP_ETH_TOKEN_ADDRESS=0x90DFd2219FC87e5Ea83a8FD42615944c56A01f4D
 REACT_APP_ETH_OWNER_WALLET=0xcccc7428648c4AdC0ae262D3547584dDAE25c465
 
 REACT_APP_CACHE_PRUNE_MIN=250

package.json

@@ -3,10 +3,10 @@
   "productName": "Audius",
   "description": "The Audius decentralized application",
   "author": "Audius",
-  "version": "0.21.21",
+  "version": "0.21.23",
   "private": true,
   "dependencies": {
-    "@audius/libs": "0.13.3",
+    "@audius/libs": "1.0.0",
     "@audius/stems": "0.2.4",
     "@optimizely/optimizely-sdk": "^4.0.0",
     "@reduxjs/toolkit": "^1.3.2",

src/components/public-site/NavBanner.module.css

@@ -94,7 +94,7 @@
   justify-content: flex-end;
 }
 
-.devStakers {
+.token {
   cursor: pointer;
   color: var(--static-white);
   font-family: Gilroy !important;;
@@ -108,18 +108,18 @@
   transform: scale3d(1, 1, 1);
 }
 
-.devStakers:hover {
+.token:hover {
   text-decoration: underline;
   opacity: 0.8;
   transform: scale3d(1.03, 1.03, 1.03);
 }
 
-.devStakers:active {
+.token:active {
   opacity: 0.8;
   transform: scale3d(0.99, 0.99, 0.99);
 }
 
-.invertColors .devStakers {
+.invertColors .token {
   display: none;
 }
 

src/components/public-site/NavBanner.tsx

@@ -12,10 +12,10 @@ import {
   pushWindowRoute,
   handleClickRoute,
   AUDIUS_HOME_LINK,
-  AUDIUS_DEV_STAKER_LINK,
   AUDIUS_LISTENING_LINK,
   AUDIUS_HOT_AND_NEW,
-  AUDIUS_EXPLORE_LINK
+  AUDIUS_EXPLORE_LINK,
+  AUDIUS_ORG
 } from 'utils/links'
 
 import styles from './NavBanner.module.css'
@@ -24,15 +24,15 @@ const messages = {
   explore: 'Explore',
   trending: 'Trending',
   hotAndNew: 'Hot & New',
-  devStakers: 'Devs & Stakers',
+  token: 'Token',
   startListening: 'Start Listening'
 }
 
 const onClickHome = handleClickRoute(AUDIUS_HOME_LINK)
 const onClickExplore = handleClickRoute(AUDIUS_EXPLORE_LINK)
 const onClickTrending = handleClickRoute(AUDIUS_LISTENING_LINK)
 const onClickHotAndNew = handleClickRoute(AUDIUS_HOT_AND_NEW)
-const onClickDevStakers = handleClickRoute(AUDIUS_DEV_STAKER_LINK)
+const onClickToken = handleClickRoute(AUDIUS_ORG)
 
 type NavBannerProps = {
   isMobile: boolean
@@ -131,8 +131,8 @@ const NavBanner = (props: NavBannerProps) => {
           />
         </div>
         <div className={styles.linkContainer}>
-          <div onClick={onClickDevStakers} className={styles.devStakers}>
-            {messages.devStakers}
+          <div onClick={onClickToken} className={styles.token}>
+            {messages.token}
           </div>
           <div onClick={onStartListening} className={styles.startListening}>
             {messages.startListening}

src/containers/landing-page/components/Hero.module.css

@@ -141,6 +141,12 @@
   text-shadow: 0 2px 2px rgba(0,0,0,0.2);
   transform: scale3d(1, 1, 1);
   cursor: pointer;
+  margin-right: 24px;
+}
+
+.mobileContainer .ctaButton {
+  margin-right: 0;
+  margin-bottom: 24px;
 }
 
 .ctaButton:hover {
@@ -165,6 +171,44 @@
   margin-right: 4px;
 }
 
+.tokenButton {
+  user-select: none;
+  transition: all 0.15s ease-in-out;
+  display: inline-flex;
+  align-items: center;
+  height: 58px;
+  border: none;
+  border-radius: 8px;
+  background: linear-gradient(267.49deg, rgba(91, 35, 225, 0.4) 0%, rgba(91, 35, 225, 0.15) 100%);
+  mix-blend-mode: normal;
+  border: 2px solid #FFFFFF;
+  box-shadow: 0 5px 20px -1px rgba(25,0,96,0.5);
+  color: #FFFFFF;
+  padding: 16px 40px;
+
+  font-family: Gilroy !important;
+  font-size: 18px;
+  font-weight: 800;
+  letter-spacing: 0.2px;
+  line-height: 26px;
+  text-align: center;
+  text-shadow: 0 2px 2px rgba(0,0,0,0.2);
+  transform: scale3d(1, 1, 1);
+  cursor: pointer;
+}
+
+.tokenButton:hover {
+  transform: scale3d(1.03, 1.03, 1.03);
+	background: linear-gradient(267.49deg, rgba(91, 35, 225, 0.6) 0%, rgba(91, 35, 225, 0.35) 100%);
+	box-shadow: 0 10px 20px -1px rgba(25,0,96,0.5);
+}
+
+.tokenButton:active {
+  transform: scale3d(0.99, 0.99, 0.99);
+  background: linear-gradient(267.49deg, rgba(91, 35, 225, 0.6) 0%, rgba(91, 35, 225, 0.35) 100%);
+  box-shadow: 0 0 2px -1px rgba(25,0,96,0.5);
+}
+
 .glyphPattern {
   width: 100%;
   position: absolute;

src/containers/landing-page/components/Hero.tsx

@@ -11,20 +11,25 @@ import HeroBackgroundMobile from 'assets/img/publicSite/Hero-Background-mobile.j
 import GlyphPattern from 'assets/img/publicSite/glyph-pattern.png'
 import { ReactComponent as IconArrow } from 'assets/img/publicSite/iconArrow.svg'
 
-import { AUDIUS_SIGN_UP_LINK, pushWindowRoute } from 'utils/links'
+import { AUDIUS_ORG, AUDIUS_SIGN_UP_LINK, pushWindowRoute } from 'utils/links'
 
 const messages = {
   title: 'UNLEASH YOUR MUSIC',
   subtitle1: 'Discover & Stream',
   subtitle2: 'Up-And-Coming Artists',
   subtitle: 'Discover & Stream Up-And-Coming Artists',
-  cta: 'Sign Up Free'
+  cta: 'Sign Up Free',
+  learn: 'Learn About The Token'
 }
 
 const onSignUp = () => {
   pushWindowRoute(AUDIUS_SIGN_UP_LINK)
 }
 
+const onLearnAboutToken = () => {
+  pushWindowRoute(AUDIUS_ORG)
+}
+
 type HeroProps = {
   isMobile: boolean
   onImageLoad: () => void
@@ -61,6 +66,9 @@ export const Hero = (props: HeroProps) => {
             <span className={styles.ctaMessage}>{messages.cta}</span>
             <IconArrow className={styles.ctaArrow} />
           </div>
+          <div onClick={onLearnAboutToken} className={styles.tokenButton}>
+            <span className={styles.ctaMessage}>{messages.learn}</span>
+          </div>
         </div>
         <img src={GlyphPattern} alt='Pattern' className={styles.glyphPattern} />
       </div>
@@ -108,6 +116,9 @@ export const Hero = (props: HeroProps) => {
               <span className={styles.ctaMessage}>{messages.cta}</span>
               <IconArrow className={styles.ctaArrow} />
             </div>
+            <div onClick={onLearnAboutToken} className={styles.tokenButton}>
+              <span className={styles.ctaMessage}>{messages.learn}</span>
+            </div>
           </div>
         </Parallax>
       </div>

src/services/AudiusBackend.js

@@ -959,6 +959,7 @@ class AudiusBackend {
   }
 
   static async getListenHistoryTracks(limit = 100, offset = 0) {
+    await waitForLibsInit()
     try {
       const trackListens = await audiusLibs.Track.getListenHistoryTracks(
         limit,

src/services/audius-backend/eagerLoadUtils.ts

@@ -129,10 +129,15 @@ const makeRequest = async (
     headers['X-User-ID'] = user.user_id
   }
 
+  let baseUrl = `${endpoint}/${req.endpoint}`
+  if (req.urlParams) {
+    baseUrl = `${baseUrl}${req.urlParams}`
+  }
+
   let res: any
   if (req?.method?.toLowerCase() === 'post') {
     headers['Content-Type'] = 'application/json'
-    const url = `${endpoint}/${req.endpoint}?${parmsToQS(
+    const url = `${baseUrl}?${parmsToQS(
       req.queryParams,
       endpoint === eagerDiscprov
     )}`
@@ -142,7 +147,7 @@ const makeRequest = async (
       body: JSON.stringify(req.data)
     })
   } else {
-    const url = `${endpoint}/${req.endpoint}?${parmsToQS(
+    const url = `${baseUrl}?${parmsToQS(
       req.queryParams,
       endpoint === eagerDiscprov
     )}`

src/utils/links.ts

@@ -6,8 +6,9 @@ export const AUDIUS_INSTAMGRAM_LINK = 'https://www.instagram.com/audiusmusic'
 export const AUDIUS_DISCORD_LINK = 'https://discord.gg/yNUg2e2'
 
 // Org Links
-export const AUDIUS_TEAM_LINK = 'https://audius.org/team.html'
-export const AUDIUS_DEV_STAKER_LINK = 'https://audius.org/developers.html'
+export const AUDIUS_ORG = 'https://audius.org'
+export const AUDIUS_TEAM_LINK = 'https://audius.org/team'
+export const AUDIUS_DEV_STAKER_LINK = 'https://audius.org/developers'
 
 export const AUDIUS_HOME_LINK = '/'
 export const AUDIUS_LISTENING_LINK = '/trending'
@@ -27,7 +28,7 @@ export const AUDIUS_PODCAST_LINK =
 export const AUDIUS_CYPHER_LINK = 'https://discord.gg/yNUg2e2'
 
 export const AUDIUS_PRESS_KIT_ZIP =
-  'https://s3-us-west-1.amazonaws.com/download.audius.co/Audius+Press+Kit+1.5.zip'
+  'https://s3-us-west-1.amazonaws.com/download.audius.co/Audius+Press+Kit+2.0.zip'
 
 export const pushWindowRoute = (route: string) => {
   if (route === AUDIUS_SIGN_UP_LINK) {