From db7599ec527a9aa385b7101722ce39d457f342ac Mon Sep 17 00:00:00 2001
From: Marcella Maki <marcellamaki@gmail.com>
Date: Fri, 8 Jul 2022 08:34:32 -0400
Subject: [PATCH 1/4] Fix bug with display of resources that are not in a topic
 NOR are search results

---
 .../learn/assets/src/views/TopicsPage.vue     | 50 ++++++++++++-------
 1 file changed, 33 insertions(+), 17 deletions(-)

diff --git a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
index 3a35db8a898..30ac8a1888b 100644
--- a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
+++ b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
@@ -185,25 +185,23 @@
               </KButton>
               <KCircularLoader v-if="t.id === subTopicLoading" />
             </div>
-            <!-- search results -->
+            <!-- resources that are not in a folder -->
             <HybridLearningCardGrid
               v-if="resources.length"
-              :contents="resources"
+              :contents="resourcesDisplayed"
               :numCols="numCols"
               :genContentLink="genContentLink"
               cardViewStyle="card"
               @toggleInfoPanel="toggleInfoPanel"
             />
-            <div v-if="topicMore" class="end-button-block">
-              <KButton
-                v-if="!topicMoreLoading"
-                :text="coreString('viewMoreAction')"
-                appearance="raised-button"
-                :disabled="topicMoreLoading"
-                @click="handleLoadMoreInTopic"
-              />
-              <KCircularLoader v-else />
-            </div>
+            <KButton
+              v-if="moreResources"
+              class="more-after-grid"
+              appearance="basic-link"
+              @click="handleShowMoreResources"
+            >
+              {{ $tr('showMore') }}
+            </KButton>
           </div>
           <div v-else-if="!searchLoading">
             <h2 class="results-title">
@@ -469,6 +467,7 @@
         currentViewStyle: 'card',
         currentCategory: null,
         showSearchModal: false,
+        showMoreResources: false,
         sidePanelIsOpen: false,
         sidePanelContent: null,
         expandedTopics: {},
@@ -527,12 +526,26 @@
         return this.channel.name;
       },
       resources() {
-        const resources = this.contents.filter(content => content.kind !== ContentNodeKinds.TOPIC);
-        // If there are no topics, then just display all resources we have loaded.
-        if (!this.topics.length) {
-          return resources;
+        return this.contents.filter(content => content.kind !== ContentNodeKinds.TOPIC);
+      },
+      resourcesDisplayed() {
+        // if no folders are shown at this level, show more resources to fill the space
+        if (!this.topics) {
+          return this.resources.slice(0, 8);
+          // if there are topics, and the user has not clicked show more
+          // default to just the preview number
+        } else if (this.topics && !this.showMoreResources) {
+          return this.resources.slice(0, this.childrenToDisplay);
+          // otherwise display all resources
+        } else {
+          return this.resources;
         }
-        return resources.slice(0, this.childrenToDisplay);
+      },
+      moreResources() {
+        return (
+          this.resources.length > this.childrenToDisplay &&
+          this.resourcesDisplayed.length < this.resources.length
+        );
       },
       topics() {
         return this.contents.filter(content => content.kind === ContentNodeKinds.TOPIC);
@@ -737,6 +750,9 @@
           [topicId]: true,
         };
       },
+      handleShowMoreResources() {
+        this.showMoreResources = true;
+      },
       handleLoadMoreinSubtopic(topicId) {
         this.subTopicLoading = topicId;
         this.loadMoreContents(topicId).then(() => {

From 90c5187cceef15eace94b64eb57f7997d86e4445 Mon Sep 17 00:00:00 2001
From: Marcella Maki <marcellamaki@gmail.com>
Date: Fri, 8 Jul 2022 08:42:17 -0400
Subject: [PATCH 2/4] Fix problem with not showing more when not logged in

---
 kolibri/plugins/learn/assets/src/views/TopicsPage.vue | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
index 30ac8a1888b..bd16932ed0a 100644
--- a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
+++ b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
@@ -530,11 +530,11 @@
       },
       resourcesDisplayed() {
         // if no folders are shown at this level, show more resources to fill the space
-        if (!this.topics) {
-          return this.resources.slice(0, 8);
+        if (this.topics.length == 0 && !this.showMoreResources) {
+          return this.resources.slice(0, this.childrenToDisplay * 2);
           // if there are topics, and the user has not clicked show more
           // default to just the preview number
-        } else if (this.topics && !this.showMoreResources) {
+        } else if (this.topics.length > 0 && !this.showMoreResources) {
           return this.resources.slice(0, this.childrenToDisplay);
           // otherwise display all resources
         } else {
@@ -542,10 +542,7 @@
         }
       },
       moreResources() {
-        return (
-          this.resources.length > this.childrenToDisplay &&
-          this.resourcesDisplayed.length < this.resources.length
-        );
+        return this.resourcesDisplayed.length < this.resources.length;
       },
       topics() {
         return this.contents.filter(content => content.kind === ContentNodeKinds.TOPIC);

From 504d1ed6849299e2c6b2c93e76a397fc42f89370 Mon Sep 17 00:00:00 2001
From: Marcella Maki <marcellamaki@gmail.com>
Date: Fri, 8 Jul 2022 15:17:24 -0400
Subject: [PATCH 3/4] Implement PR feedback

---
 .../learn/assets/src/views/TopicsPage.vue     | 22 +++++++++++++------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
index bd16932ed0a..66371984665 100644
--- a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
+++ b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
@@ -202,6 +202,16 @@
             >
               {{ $tr('showMore') }}
             </KButton>
+            <div v-else-if="topicMore" class="end-button-block">
+              <KButton
+                v-if="!topicMoreLoading"
+                :text="coreString('viewMoreAction')"
+                appearance="raised-button"
+                :disabled="topicMoreLoading"
+                @click="handleLoadMoreInTopic"
+              />
+              <KCircularLoader v-else />
+            </div>
           </div>
           <div v-else-if="!searchLoading">
             <h2 class="results-title">
@@ -529,17 +539,15 @@
         return this.contents.filter(content => content.kind !== ContentNodeKinds.TOPIC);
       },
       resourcesDisplayed() {
+        let displayed;
         // if no folders are shown at this level, show more resources to fill the space
-        if (this.topics.length == 0 && !this.showMoreResources) {
-          return this.resources.slice(0, this.childrenToDisplay * 2);
-          // if there are topics, and the user has not clicked show more
-          // default to just the preview number
-        } else if (this.topics.length > 0 && !this.showMoreResources) {
-          return this.resources.slice(0, this.childrenToDisplay);
+        if (!this.showMoreResources) {
+          displayed = this.resources.slice(0, this.childrenToDisplay);
           // otherwise display all resources
         } else {
-          return this.resources;
+          displayed = this.resources;
         }
+        return displayed;
       },
       moreResources() {
         return this.resourcesDisplayed.length < this.resources.length;

From 68d333cb0d7944d4279600cbd0d865ddc334fed8 Mon Sep 17 00:00:00 2001
From: Marcella Maki <marcellamaki@gmail.com>
Date: Mon, 11 Jul 2022 08:49:31 -0400
Subject: [PATCH 4/4] Implement feedback

---
 kolibri/plugins/learn/assets/src/views/TopicsPage.vue | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
index 66371984665..c14fa7ae5c1 100644
--- a/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
+++ b/kolibri/plugins/learn/assets/src/views/TopicsPage.vue
@@ -539,15 +539,12 @@
         return this.contents.filter(content => content.kind !== ContentNodeKinds.TOPIC);
       },
       resourcesDisplayed() {
-        let displayed;
         // if no folders are shown at this level, show more resources to fill the space
-        if (!this.showMoreResources) {
-          displayed = this.resources.slice(0, this.childrenToDisplay);
-          // otherwise display all resources
-        } else {
-          displayed = this.resources;
+        // or if the user has explicitly requested to show more resources
+        if (!this.topics.length || this.showMoreResources) {
+          return this.resources;
         }
-        return displayed;
+        return this.resources.slice(0, this.childrenToDisplay);
       },
       moreResources() {
         return this.resourcesDisplayed.length < this.resources.length;