From 4f1b9e37000eb1c4b197b6cedb4d5bf24aff1d64 Mon Sep 17 00:00:00 2001
From: Andrew Nicolaou <me@andrewnicolaou.co.uk>
Date: Sun, 3 May 2020 22:51:01 +0200
Subject: [PATCH] Fix bug when switching collection or sketch lists  (fixes
 #1401) (#1416)

* Update sketch/collection list when URL changes (fixes #1401)

Using the username as the key prop causes the List component to remount
when the username changes. This means we don't have to bother resetting
everything when the user changes.

* Update deprecated SketchList lifecycle methods

From componentWillReceiveProps to componentDidUpdate
---
 client/modules/IDE/components/SketchList.jsx | 5 +++--
 client/modules/User/pages/DashboardView.jsx  | 6 +++---
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/client/modules/IDE/components/SketchList.jsx b/client/modules/IDE/components/SketchList.jsx
index 3777de2a..7633e6e8 100644
--- a/client/modules/IDE/components/SketchList.jsx
+++ b/client/modules/IDE/components/SketchList.jsx
@@ -333,8 +333,9 @@ class SketchList extends React.Component {
     };
   }
 
-  componentWillReceiveProps(nextProps) {
-    if (this.props.sketches !== nextProps.sketches && Array.isArray(nextProps.sketches)) {
+  componentDidUpdate(prevProps) {
+    if (this.props.sketches !== prevProps.sketches && Array.isArray(this.props.sketches)) {
+      // eslint-disable-next-line react/no-did-update-set-state
       this.setState({
         isInitialDataLoad: false,
       });
diff --git a/client/modules/User/pages/DashboardView.jsx b/client/modules/User/pages/DashboardView.jsx
index e51490de..2b1373cf 100644
--- a/client/modules/User/pages/DashboardView.jsx
+++ b/client/modules/User/pages/DashboardView.jsx
@@ -98,12 +98,12 @@ class DashboardView extends React.Component {
   renderContent(tabKey, username) {
     switch (tabKey) {
       case TabKey.assets:
-        return <AssetList username={username} />;
+        return <AssetList key={username} username={username} />;
       case TabKey.collections:
-        return <CollectionList username={username} />;
+        return <CollectionList key={username} username={username} />;
       case TabKey.sketches:
       default:
-        return <SketchList username={username} />;
+        return <SketchList key={username} username={username} />;
     }
   }