Merge pull request #4853 from learningequality/hotfixes

Merge down hotfixes into unstable

contentcuration/contentcuration/apps.py

@@ -8,6 +8,9 @@ class ContentConfig(AppConfig):
     name = 'contentcuration'
 
     def ready(self):
+        # Import signals
+        import contentcuration.signals  # noqa
+
         if settings.AWS_AUTO_CREATE_BUCKET and not is_gcs_backend():
             from contentcuration.utils.minio_utils import ensure_storage_bucket_public
             ensure_storage_bucket_public()

contentcuration/contentcuration/frontend/channelEdit/components/move/MoveModal.vue

@@ -98,6 +98,11 @@
             <VDivider v-if="index < children.length - 1" :key="`move-divider-${node.id}`" />
           </template>
         </VList>
+        <div class="show-more-button-container">
+          <KButton v-if="more" :disabled="moreLoading" @click="loadMore">
+            {{ showMoreLabel }}
+          </KButton>
+        </div>
       </VFlex>
       <ResourceDrawer
         :nodeId="previewNodeId"
@@ -146,6 +151,13 @@
   import Thumbnail from 'shared/views/files/Thumbnail';
   import { ContentKindsNames } from 'shared/leUtils/ContentKinds';
   import { titleMixin } from 'shared/mixins';
+  import { createTranslator } from 'shared/i18n';
+
+  // Can't use cross component translator to get the NodePanel translations
+  // here, because the NodePanel component imports this component.
+  const showMoreTranslator = createTranslator('NodePanel', {
+    showMore: 'Show more',
+  });
 
   export default {
     name: 'MoveModal',
@@ -182,6 +194,8 @@
       return {
         showNewTopicModal: false,
         loading: false,
+        more: null,
+        moreLoading: false,
         moveNodesInProgress: false,
         targetNodeId: null,
         previewNodeId: null,
@@ -234,6 +248,10 @@
       crumbs() {
         return this.getContentNodeAncestors(this.targetNodeId, true) || [];
       },
+      showMoreLabel() {
+        // eslint-disable-next-line kolibri/vue-no-undefined-string-uses
+        return showMoreTranslator.$tr('showMore');
+      },
     },
     watch: {
       targetNodeId() {
@@ -247,7 +265,7 @@
       this.targetNodeId = this.currentLocationId || this.rootId;
     },
     methods: {
-      ...mapActions('contentNode', ['createContentNode', 'loadChildren']),
+      ...mapActions('contentNode', ['createContentNode', 'loadChildren', 'loadContentNodes']),
       isDisabled(node) {
         return this.moveNodeIds.includes(node.id);
       },
@@ -272,8 +290,9 @@
           return this.loadChildren({
             parent: this.targetNodeId,
             root_id: this.rootId,
-          }).then(() => {
+          }).then(childrenResponse => {
             this.loading = false;
+            this.more = childrenResponse.more || null;
           });
         }
         return Promise.resolve();
@@ -302,6 +321,15 @@
         });
         this.moveNodesInProgress = false;
       },
+      loadMore() {
+        if (this.more && !this.moreLoading) {
+          this.moreLoading = true;
+          this.loadContentNodes(this.more).then(response => {
+            this.more = response.more || null;
+            this.moreLoading = false;
+          });
+        }
+      },
     },
     $trs: {
       moveItems:
@@ -350,4 +378,11 @@
     }
   }
 
+  .show-more-button-container {
+    display: flex;
+    justify-content: center;
+    width: 100%;
+    margin-bottom: 10px;
+  }
+
 </style>

contentcuration/contentcuration/frontend/channelEdit/views/CurrentTopicView.vue

@@ -533,6 +533,7 @@
       },
       inheritanceParent() {
         const firstNode = this.currentInheritingNodes[0];
+
         if (!firstNode) {
           return;
         }
@@ -726,6 +727,7 @@
       handleDragDrop(drop) {
         const { data } = drop;
         const { identity, section, relative } = data.target;
+        const targetMetadata = identity.metadata || {};
         const isTargetTree =
           drop.target && drop.target.region && drop.target.region.id === DraggableRegions.TREE;
 
@@ -742,7 +744,7 @@
           position = this.relativePosition(relative > DraggableFlags.NONE ? relative : section);
         } else {
           // Safety check
-          const { kind } = identity.metadata || {};
+          const { kind } = targetMetadata;
           if (kind && kind !== ContentKindsNames.TOPIC) {
             return Promise.reject('Cannot set child of non-topic');
           }
@@ -756,7 +758,7 @@
         const sources = drop.sources || [];
         const sourceRegion = sources.length > 0 ? sources[0].region : null;
         const payload = {
-          target: identity.metadata.id,
+          target: targetMetadata.id,
           position,
         };
 
@@ -765,7 +767,7 @@
           // `excluded_descendants` by accessing the copy trees through the clipboard node ID
           if (sourceRegion && sourceRegion.id === DraggableRegions.CLIPBOARD) {
             return Promise.all(
-              data.sources.map(source => {
+              sources.map(source => {
                 // Using `getCopyTrees` we can access the `excluded_descendants` for the node, such
                 // that we make sure to skip copying nodes that aren't intended to be copied
                 const trees = this.getCopyTrees(source.metadata.clipboardNodeId, true);
@@ -789,10 +791,27 @@
             );
           }
 
+          // We want to avoid launching the inherit modal when the move operation is a prepend or
+          // append move, and target is the current parent. When the move operation is relative to
+          // the target, that is left or right, we want only launch the modal if the parent is
+          // changing
+          let inherit = false;
+          if (
+            position === RELATIVE_TREE_POSITIONS.FIRST_CHILD ||
+            position === RELATIVE_TREE_POSITIONS.LAST_CHILD
+          ) {
+            inherit = !sources.some(s => s.metadata.parent === targetMetadata.id);
+          } else if (
+            position === RELATIVE_TREE_POSITIONS.LEFT ||
+            position === RELATIVE_TREE_POSITIONS.RIGHT
+          ) {
+            inherit = !sources.some(s => s.metadata.parent === targetMetadata.parent);
+          }
+
           return this.moveContentNodes({
             ...payload,
-            id__in: data.sources.map(s => s.metadata.id),
-            inherit: !data.sources.some(s => s.metadata.parent === payload.target),
+            id__in: sources.map(s => s.metadata.id),
+            inherit,
           });
         }
       },

contentcuration/contentcuration/frontend/channelEdit/views/ImportFromChannels/ContentTreeList.vue

@@ -43,6 +43,11 @@
           />
         </VFlex>
       </VLayout>
+      <div class="show-more-button-container">
+        <KButton v-if="more" :disabled="moreLoading" @click="loadMore">
+          {{ showMoreLabel }}
+        </KButton>
+      </div>
     </div>
   </VContainer>
 
@@ -55,13 +60,17 @@
   import intersectionBy from 'lodash/intersectionBy';
   import { mapActions, mapGetters } from 'vuex';
   import find from 'lodash/find';
+  import NodePanel from '../NodePanel';
   import { RouteNames } from '../../constants';
   import BrowsingCard from './BrowsingCard';
   import Breadcrumbs from 'shared/views/Breadcrumbs';
   import Checkbox from 'shared/views/form/Checkbox';
   import LoadingText from 'shared/views/LoadingText';
   import { constantsTranslationMixin } from 'shared/mixins';
   import { ChannelListTypes } from 'shared/constants';
+  import { crossComponentTranslator } from 'shared/i18n';
+
+  const showMoreTranslator = crossComponentTranslator(NodePanel);
 
   export default {
     name: 'ContentTreeList',
@@ -85,6 +94,8 @@
     data() {
       return {
         loading: false,
+        more: null,
+        moreLoading: false,
       };
     },
     computed: {
@@ -142,39 +153,44 @@
           ...ancestorsLinks,
         ];
       },
+      showMoreLabel() {
+        // eslint-disable-next-line kolibri/vue-no-undefined-string-uses
+        return showMoreTranslator.$tr('showMore');
+      },
     },
     watch: {
-      topicId(parent) {
+      topicId(newTopicId, oldTopicId) {
+        if (newTopicId !== oldTopicId && newTopicId) {
+          this.loadData();
+        }
+      },
+    },
+    created() {
+      this.loadData();
+    },
+    methods: {
+      ...mapActions('contentNode', ['loadChildren', 'loadAncestors', 'loadContentNodes']),
+      loadData() {
         this.loading = true;
-        return this.loadChildren({
-          parent,
+        const params = {
           complete: true,
-        }).then(() => {
+        };
+        const channelListType = this.$route.query.channel_list || ChannelListTypes.PUBLIC;
+        if (channelListType === ChannelListTypes.PUBLIC) {
+          // TODO: load from public API instead
+          // TODO: challenging because of node_id->id and root_id->channel_id
+          params.published = true;
+        }
+
+        return Promise.all([
+          this.loadChildren({ parent: this.topicId, ...params }).then(childrenResponse => {
+            this.more = childrenResponse.more || null;
+          }),
+          this.loadAncestors({ id: this.topicId }),
+        ]).then(() => {
           this.loading = false;
         });
       },
-    },
-    mounted() {
-      this.loading = true;
-      const params = {
-        complete: true,
-      };
-      const channelListType = this.$route.query.channel_list || ChannelListTypes.PUBLIC;
-      if (channelListType === ChannelListTypes.PUBLIC) {
-        // TODO: load from public API instead
-        // TODO: challenging because of node_id->id and root_id->channel_id
-        params.published = true;
-      }
-
-      return Promise.all([
-        this.loadChildren({ parent: this.topicId, ...params }),
-        this.loadAncestors({ id: this.topicId }),
-      ]).then(() => {
-        this.loading = false;
-      });
-    },
-    methods: {
-      ...mapActions('contentNode', ['loadChildren', 'loadAncestors']),
       // @public
       scrollToNode(nodeId) {
         const ref = this.$refs[nodeId];
@@ -187,6 +203,15 @@
       toggleSelected(node) {
         this.$emit('change_selected', { nodes: [node], isSelected: !this.isSelected(node) });
       },
+      loadMore() {
+        if (this.more && !this.moreLoading) {
+          this.moreLoading = true;
+          this.loadContentNodes(this.more).then(response => {
+            this.more = response.more || null;
+            this.moreLoading = false;
+          });
+        }
+      },
     },
     $trs: {
       allChannelsLabel: 'Channels',

contentcuration/contentcuration/frontend/channelEdit/views/TreeView/TreeViewBase.vue

@@ -390,7 +390,7 @@
           this.currentChannel.publishing ||
           !this.isChanged ||
           !this.currentChannel.language ||
-          (this.rootNode && !this.rootNode.total_count)
+          (this.rootNode && !this.rootNode.resource_count)
         );
       },
       publishButtonTooltip() {