change to affiliate link format

affiliate links points to the landing page and they have now
name_slug and original_artist_slug embeded

jam-ui/.env.development

@@ -1,6 +1,7 @@
 HOST=beta.jamkazam.local
 PORT=4000
 REACT_APP_ORIGIN=jamkazam.local
+REACT_APP_BASE_URL=http://beta.jamkazam.local:4000
 REACT_APP_CLIENT_BASE_URL=http://www.jamkazam.local:3000
 REACT_APP_API_BASE_URL=http://www.jamkazam.local:3000/api
 REACT_APP_BITBUCKET_BUILD_NUMBER=dev

jam-ui/.env.development.example

@@ -1,6 +1,7 @@
 HOST=beta.jamkazam.local
 PORT=4000
 REACT_APP_ORIGIN=jamkazam.local
+REACT_APP_BASE_URL=http://beta.jamkazam.local:4000
 REACT_APP_CLIENT_BASE_URL=http://www.jamkazam.local:3000
 REACT_APP_API_BASE_URL=http://www.jamkazam.local:3000/api
 REACT_APP_BITBUCKET_BUILD_NUMBER=dev

jam-ui/.env.production

@@ -1,6 +1,7 @@
 HOST=beta.jamkazam.com
 PORT=4000
 REACT_APP_ORIGIN=jamkazam.com
+REACT_APP_BASE_URL=https://beta.jamkazam.com
 REACT_APP_CLIENT_BASE_URL=https://www.jamkazam.com
 REACT_APP_API_BASE_URL=https://www.jamkazam.com/api
 REACT_APP_ENV=production

jam-ui/.env.staging

@@ -1,6 +1,9 @@
 HOST=beta.staging.jamkazam.com
 PORT=4000
 REACT_APP_ORIGIN=staging.jamkazam.com
+REACT_APP_BASE_URL=http://beta.staging.jamkazam.com
 REACT_APP_CLIENT_BASE_URL=https://staging.jamkazam.com
 REACT_APP_API_BASE_URL=https://staging.jamkazam.com/api
-REACT_APP_ENV=staging
+REACT_APP_ENV=staging
+REACT_APP_RECAPTCHA_ENABLED=false
+REACT_APP_SITE_KEY=6Let8dgSAAAAAFheKGWrs6iaq_hIlPOZ2f3Bb56B

jam-ui/src/components/affiliate/JKAffiliateLinks.js

@@ -88,14 +88,14 @@ const JKAffiliateLinks = () => {
     if (!jamTrack) {
       return '';
     }
-    return `${process.env.REACT_APP_CLIENT_BASE_URL}/jamtracks/${encodeURIComponent(jamTrack.original_artist)}/${jamTrack.slug}?affiliate=${affiliatePartnerId}`;
+    return `${process.env.REACT_APP_BASE_URL}/public/jamtracks/${encodeURIComponent(jamTrack.original_artist_slug)}/${jamTrack.name_slug}?affiliate=${affiliatePartnerId}`;
   }, [affiliatePartnerId]);
 
   const jamTrackArtistLink = useMemo(() => artist => {
     if (!artist) {
       return '';
     }
-    return `${process.env.REACT_APP_CLIENT_BASE_URL}/jamtracks/${encodeURIComponent(artist.original_artist)}?affiliate=${affiliatePartnerId}`;
+    return `${process.env.REACT_APP_CLIENT_BASE_URL}/public/jamtracks/${encodeURIComponent(artist.original_artist_slug)}?affiliate=${affiliatePartnerId}`;
   }, [affiliatePartnerId]);
 
   //autocomplete related code
@@ -150,7 +150,7 @@ const JKAffiliateLinks = () => {
         {jamTracks &&
           jamTracks.map(jamTrack => {
             return (
-              <div key={jamTrack.id}>
+              <div key={jamTrack.id} className='mb-3'>
                 <div>
                   {t('links.affiliate_link_for')} {jamTrack.name} {t('links.by')} {jamTrack.original_artist}:
                 </div>
@@ -159,7 +159,7 @@ const JKAffiliateLinks = () => {
                     // <a href={jamTrackLink(jamTrack)} target="_blank">
                     //   {jamTrackLink(jamTrack)}
                     // </a>
-                    <Link to={`/jamtracks/${jamTrack.original_artist}/${jamTrack.slug}`}>
+                    <Link to={`/public/jamtracks/${jamTrack.original_artist_slug}/${jamTrack.name_slug}`}>
                       {jamTrackLink(jamTrack)}
                     </Link>
                   ) : (
@@ -178,7 +178,7 @@ const JKAffiliateLinks = () => {
         {jamTrackArtists &&
           jamTrackArtists.map(artist => {
             return (
-              <div key={artist.original_artist}>
+              <div key={artist.original_artist} className='mb-3'>
                 <div>
                   {t('links.affiliate_link_for')} {artist.original_artist}:
                 </div>
@@ -187,7 +187,7 @@ const JKAffiliateLinks = () => {
                     // <a href={jamTrackArtistLink(artist)} target="_blank">
                     //   {jamTrackArtistLink(artist)}
                     // </a>
-                    <Link to={`/jamtracks/${artist.original_artist}`}>
+                    <Link to={`/public/jamtracks/${artist.original_artist_slug}`}>
                       {jamTrackArtistLink(artist)}
                     </Link>
                   ) : (

jam-ui/src/components/dashboard/JKDashboardMain.js

@@ -52,7 +52,7 @@ import JKCheckout from '../shopping-cart/JKCheckout';
 import JKCheckoutSuccess from '../shopping-cart/JKCheckoutSuccess';
 import JKMyJamTracks from '../jamtracks/JKMyJamTracks';
 import JKJamTrackShow from '../jamtracks/JKJamTrackShow';
-import JKJamTracksLanding from '../jamtracks/JKJamTracksLanding';
+
 
 //import loadable from '@loadable/component';
 //const DashboardRoutes = loadable(() => import('../../layouts/JKDashboardRoutes'));
@@ -302,8 +302,6 @@ function JKDashboardMain() {
           <PrivateRoute path="/affiliate/signups" component={JKAffiliateSignups} />
           <PrivateRoute path="/affiliate/earnings" component={JKAffiliateEarnings} />
           <PrivateRoute path="/affiliate/agreement" component={JKAffiliateAgreement} />
-          <PrivateRoute path="/jamtracks/:artist/:song_slug" component={JKJamTracksLanding} />
-          <PrivateRoute path="/jamtracks/:artist" component={JKJamTracksLanding} />
           <PrivateRoute path="/jamtracks" component={JKJamTracksFilter} />
           <PrivateRoute path="/jamtrack/:id" component={JKJamTrackShow} />
           <PrivateRoute path="/jamtracks" component={JKJamTracksFilter} />

jam-ui/src/components/jamtracks/JKJamTracksLanding.js

@@ -2,12 +2,12 @@ import React from 'react'
 import { useParams, Link } from 'react-router-dom';
 
 const JKJamTracksLanding = () => {
-  const { artist, song_slug } = useParams();
+  const { artist, song } = useParams();
   return (
     <div>
       <h1>JKJamTracksLanding</h1>
       <p>artist: {artist}</p>
-      <p>song_slug: {song_slug}</p>
+      <p>song: {song}</p>
       <Link to="/jamtracks">Back to JamTracks</Link>
     </div>
   )

jam-ui/src/layouts/JKPublicRoutes.js

@@ -10,6 +10,7 @@ import JKForum from '../components/public/help/JKForum';
 import JKUnsubscribe from '../components/public/JKUnsubscribe';
 import JKDownloads from '../components/public/JKDownloads';
 import JKDownloadsLegacy from '../components/public/JKDownloadsLegacy';
+import JKJamTracksLanding from '../components/jamtracks/JKJamTracksLanding';
 
 const JKPublicRoutes = ({ match: { url } }) => (
 
@@ -22,6 +23,8 @@ const JKPublicRoutes = ({ match: { url } }) => (
     <Route path={`${url}/unsubscribe`} exact component={JKUnsubscribe} />
     <Route path={`${url}/downloads`} exact component={JKDownloads} />
     <Route path={`${url}/downloads-legacy`} exact component={JKDownloadsLegacy} />
+    <Route path={`${url}/jamtracks/:artist/:song`} component={JKJamTracksLanding} />
+    <Route path={`${url}/jamtracks/:artist`} component={JKJamTracksLanding} />
 
     {/*Redirect*/}
     <Redirect to="/errors/404" />