From 7b43657a07ece9e59b0f80816612ebe0e065c17f Mon Sep 17 00:00:00 2001
From: Qstick <qstick@gmail.com>
Date: Tue, 19 Jan 2021 23:08:46 -0500
Subject: [PATCH] Fixed: Spotify playlists not shown after authentication

---
 frontend/src/Components/Form/PlaylistInput.js    |  3 ++-
 .../Components/Form/PlaylistInputConnector.js    | 16 +++++++++-------
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/frontend/src/Components/Form/PlaylistInput.js b/frontend/src/Components/Form/PlaylistInput.js
index 89ec3829b..69a2d8448 100644
--- a/frontend/src/Components/Form/PlaylistInput.js
+++ b/frontend/src/Components/Form/PlaylistInput.js
@@ -180,7 +180,8 @@ PlaylistInput.propTypes = {
 
 PlaylistInput.defaultProps = {
   className: styles.playlistInputWrapper,
-  inputClassName: styles.input
+  inputClassName: styles.input,
+  isPopulated: false
 };
 
 export default PlaylistInput;
diff --git a/frontend/src/Components/Form/PlaylistInputConnector.js b/frontend/src/Components/Form/PlaylistInputConnector.js
index 0a890cb94..ad700d231 100644
--- a/frontend/src/Components/Form/PlaylistInputConnector.js
+++ b/frontend/src/Components/Form/PlaylistInputConnector.js
@@ -3,20 +3,21 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
-import { clearOptions, fetchOptions } from 'Store/Actions/providerOptionActions';
+import { clearOptions, defaultState, fetchOptions } from 'Store/Actions/providerOptionActions';
 import PlaylistInput from './PlaylistInput';
 
 function createMapStateToProps() {
   return createSelector(
-    (state) => state.providerOptions,
-    (state) => {
+    (state) => state.providerOptions.playlists || defaultState,
+    (playlists) => {
       const {
         items,
         ...otherState
-      } = state;
+      } = playlists;
+
       return ({
-        user: items.user ? items.user : '',
-        items: items.playlists ? items.playlists : [],
+        user: items && items.user ? items.user : '',
+        items: items && items.playlists ? items.playlists : [],
         ...otherState
       });
     }
@@ -48,7 +49,7 @@ class PlaylistInputConnector extends Component {
   }
 
   componentWillUnmount = () => {
-    this.props.dispatchClearOptions();
+    this.props.dispatchClearOptions({ section: 'playlists' });
   }
 
   //
@@ -62,6 +63,7 @@ class PlaylistInputConnector extends Component {
     } = this.props;
 
     dispatchFetchOptions({
+      section: 'playlists',
       action: 'getPlaylists',
       provider,
       providerData