Release v2024.06.04

contentcuration/contentcuration/frontend/accounts/pages/Create.vue

@@ -5,13 +5,13 @@
     :appBarText="$tr('backToLoginButton')"
     backButton
   >
-    <VImg
-      height="200"
-      maxHeight="100"
-      contain
-      :lazy-src="require('shared/images/kolibri-logo.svg')"
-      :src="require('shared/images/kolibri-logo.svg')"
-    />
+    <div class="align-center d-flex justify-center mb-2">
+      <KLogo
+        altText="Kolibri Logo with background"
+        :showBackground="true"
+        :size="120"
+      />
+    </div>
     <h2 ref="top" class="mb-4 primary--text text-xs-center">
       {{ $tr('createAnAccountTitle') }}
     </h2>

contentcuration/contentcuration/frontend/accounts/pages/Main.vue

@@ -12,13 +12,13 @@
           class="pa-4"
           style="width: 300px;margin: 0 auto;"
         >
-          <VImg
-            height="200"
-            maxHeight="100"
-            contain
-            :lazy-src="require('shared/images/kolibri-logo.svg')"
-            :src="require('shared/images/kolibri-logo.svg')"
-          />
+          <div class="k-logo-container">
+            <KLogo
+              altText="Kolibri Logo with background"
+              :showBackground="true"
+              :size="120"
+            />
+          </div>
           <h2 class="primary--text py-2 text-xs-center">
             {{ $tr('kolibriStudio') }}
           </h2>
@@ -227,4 +227,9 @@
     width: 100%;
   }
 
+  .k-logo-container {
+    display: flex;
+    justify-content: center;
+  }
+
 </style>

contentcuration/contentcuration/frontend/administration/pages/AdministrationIndex.vue

@@ -161,7 +161,7 @@
 
     tr:hover td {
       /* stylelint-disable-next-line custom-property-pattern */
-      background-color: var(--v-greyBackground-base) !important;
+      background-color: var(--v-greyBackground-lighten1) !important;
     }
 
     /deep/ .v-table__overflow {

contentcuration/contentcuration/frontend/administration/pages/Channels/ChannelTable.vue

@@ -52,7 +52,7 @@
       <template #progress>
         <VProgressLinear
           v-if="loading"
-          color="primary"
+          color="loading"
           indeterminate
           data-test="loading"
         />

contentcuration/contentcuration/frontend/administration/pages/Users/UserTable.vue

@@ -63,7 +63,7 @@
       :class="{ expanded: $vuetify.breakpoint.mdAndUp }"
     >
       <template #progress>
-        <VProgressLinear v-if="loading" color="primary" indeterminate />
+        <VProgressLinear v-if="loading" color="loading" indeterminate />
       </template>
 
       <template #headerCell="{ header }">

contentcuration/contentcuration/frontend/channelEdit/components/ContentNodeEditListItem.vue

@@ -363,6 +363,7 @@
   }
 
   .copy-retry-btn {
+    padding-bottom: 2px;
     font-size: inherit;
   }
 

contentcuration/contentcuration/frontend/channelEdit/components/ContentNodeListItem/index.vue

@@ -420,6 +420,7 @@
     align-items: center;
     align-self: center;
     min-width: max-content;
+    line-height: 1.6;
     pointer-events: auto;
     cursor: default;
 

contentcuration/contentcuration/frontend/channelEdit/components/ContentNodeValidator.vue

@@ -9,7 +9,7 @@
   <span v-else-if="error" class="mx-2">
     <VTooltip bottom lazy>
       <template #activator="{ on }">
-        <Icon color="red" v-on="on">
+        <Icon :color="$themePalette.red.v_1100" v-on="on">
           error
         </Icon>
       </template>
@@ -19,7 +19,7 @@
   <span v-else-if="warning" class="mx-2">
     <VTooltip bottom lazy>
       <template #activator="{ on }">
-        <Icon color="amber" v-on="on">
+        <Icon :color="$themePalette.yellow.v_1100" v-on="on">
           warning
         </Icon>
       </template>

contentcuration/contentcuration/frontend/channelEdit/components/StudioTree/StudioTree.vue

@@ -118,6 +118,7 @@
                         v-if="loading"
                         class="mx-3"
                         indeterminate
+                        color="loading"
                         size="15"
                         width="2"
                       />

contentcuration/contentcuration/frontend/channelEdit/components/edit/EditModal.vue

@@ -22,7 +22,7 @@
             <!-- Toolbar + extension -->
             <VToolbar
               dark
-              color="primary"
+              color="appBarDark"
               fixed
               flat
               :clipped-left="!$isRTL"

contentcuration/contentcuration/frontend/channelEdit/components/edit/SavingIndicator.vue

@@ -2,7 +2,7 @@
 
   <div class="mx-2">
     <template v-if="hasChanges">
-      <VProgressCircular indeterminate size="16" width="2" color="secondary" />
+      <VProgressCircular indeterminate size="16" width="2" color="loading" />
       <span class="mx-2" style="vertical-align: middle;">
         {{ $tr('savingIndicator') }}
       </span>

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

@@ -1,6 +1,6 @@
 <template>
 
-  <VCard @click="handleClick">
+  <VCard hover @click="handleClick">
     <VCardTitle>
       <VLayout row wrap>
         <VFlex class="pt-2 px-4 thumbnail-column">
@@ -229,11 +229,6 @@
 
   .v-card {
     cursor: pointer;
-
-    &:hover {
-      /* stylelint-disable-next-line custom-property-pattern */
-      background-color: var(--v-greyBackground-base);
-    }
   }
 
   h3 {

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

@@ -1,6 +1,6 @@
 <template>
 
-  <VCard :to="channelRoute">
+  <VCard hover :to="channelRoute">
     <VCardTitle>
       <VLayout row wrap>
         <VFlex lg2 md4 sm5 xs12 class="px-3">
@@ -113,11 +113,6 @@
 
   .v-card {
     cursor: pointer;
-
-    &:hover {
-      /* stylelint-disable-next-line custom-property-pattern */
-      background-color: var(--v-greyBackground-base);
-    }
   }
 
 </style>

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

@@ -72,7 +72,7 @@
     mixins: [constantsTranslationMixin],
     data() {
       return {
-        languageFilter: '',
+        languageFilter: null,
         channels: [],
         pageCount: 0,
         loading: false,
@@ -110,6 +110,7 @@
       },
       languageFilter() {
         this.loadPage();
+        this.$emit('update-language', this.languageFilter);
       },
     },
     mounted() {

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

@@ -48,6 +48,7 @@
         <!-- Search or Topics Browsing -->
         <ChannelList
           v-if="isBrowsing && !$route.params.channelId"
+          @update-language="updateLanguageQuery"
         />
         <ContentTreeList
           v-else-if="isBrowsing"
@@ -96,6 +97,7 @@
         searchTerm: '',
         topicNode: null,
         copyNode: null,
+        languageFromChannelList: null,
       };
     },
     computed: {
@@ -142,6 +144,9 @@
       handleBackToBrowse() {
         this.$router.push(this.backToBrowseRoute);
       },
+      updateLanguageQuery(language) {
+        this.languageFromChannelList = language;
+      },
       handleSearchTerm() {
         if (this.searchIsValid) {
           this.$router.push({
@@ -151,9 +156,11 @@
             },
             query: {
               ...this.$route.query,
+              ...(this.isBrowsing ? { languages: this.languageFromChannelList } : {}),
               last: this.$route.query.last || this.$route.path,
             },
           });
+          this.languageFromChannelList = null;
           this.clearNodes();
           this.$analytics.trackAction('import_modal', 'Search');
         }

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

@@ -73,7 +73,7 @@
               v-on="on"
             >
               {{ $formatNumber(errorsInChannel) }}
-              <Icon color="amber">
+              <Icon :color="$themePalette.yellow.v_1100">
                 warning
               </Icon>
             </div>
@@ -204,7 +204,7 @@
         <slot name="extension"></slot>
       </template>
     </ToolBar>
-    <MainNavigationDrawer v-model="drawer" />
+    <MainNavigationDrawer v-model="drawer" color="white" />
     <slot></slot>
 
     <PublishModal

contentcuration/contentcuration/frontend/channelEdit/vuex/clipboard/actions.js

@@ -193,7 +193,7 @@ export function addClipboardNodeFromListener(context, obj) {
     .then(() =>
       context.dispatch(
         'contentNode/loadContentNodes',
-        { '[node_id+channel_id]__in': [obj.source_node_id, obj.source_channel_id] },
+        { '[node_id+channel_id]__in': [[obj.source_node_id, obj.source_channel_id]] },
         { root }
       )
     )

contentcuration/contentcuration/frontend/channelList/views/Channel/CatalogFilterBar.vue

@@ -19,68 +19,6 @@
         @click="clearFilters"
       />
     </div>
-    <div v-else>
-      <VLayout row wrap>
-        <VFlex
-          v-for="collection in collections"
-          :key="`public-collection-${collection.id}`"
-          xs12
-          class="py-2"
-        >
-          <VCard
-            tabindex="0"
-            class="pt-2"
-            data-test="collection"
-            @click="setCollection(collection.id)"
-            @keyup.enter="setCollection(collection.id)"
-          >
-            <VLayout>
-              <div class="px-2 text-xs-center">
-                <Icon style="font-size: 75px;">
-                  local_hospital
-                </Icon>
-              </div>
-              <VCardTitle primary-title class="pb-2 pt-2">
-
-                <!-- TODO: add 'notranslate' class once we figure out how to handle collections
-                          that have multiple channel languages inside -->
-                <h3 class="headline mb-0">
-                  {{ collection.name }}
-                </h3>
-                <p class="body-1 grey--text">
-                  {{ $tr('channelCount', { count: collection.count }) }}
-                </p>
-                <p v-if="collection.description">
-                  {{ collection.description }}
-                </p>
-              </VCardTitle>
-            </VLayout>
-            <VCardActions>
-              <VSpacer />
-              <IconButton
-                icon="copy"
-                :text="$tr('copyToken')"
-                @click.stop="displayToken = collection.token"
-              />
-            </VCardActions>
-          </VCard>
-        </VFlex>
-      </VLayout>
-
-      <KModal
-        v-if="displayToken"
-        :title="$tr('copyTitle')"
-        :text="$tr('copyTokenInstructions')"
-        :cancelText="$tr('close')"
-        @cancel="displayToken = null"
-      >
-        <div class="mb-3">
-          {{ $tr('copyTokenInstructions') }}
-        </div>
-        <CopyToken :token="displayToken" />
-      </KModal>
-
-    </div>
   </VContainer>
 
 </template>
@@ -90,10 +28,6 @@
   import flatten from 'lodash/flatten'; // Tests fail with native Array.flat() method
   import { catalogFilterMixin } from './mixins';
   import { constantsTranslationMixin } from 'shared/mixins';
-  import IconButton from 'shared/views/IconButton';
-  import CopyToken from 'shared/views/CopyToken';
-
-  const publicCollections = window.publicCollections || [];
 
   /*
     Returns the expected format for filters
@@ -108,16 +42,7 @@
 
   export default {
     name: 'CatalogFilterBar',
-    components: {
-      IconButton,
-      CopyToken,
-    },
     mixins: [constantsTranslationMixin, catalogFilterMixin],
-    data() {
-      return {
-        displayToken: null,
-      };
-    },
     computed: {
       currentFilters() {
         return flatten([
@@ -150,24 +75,10 @@
           createFilter(this.coach, this.$tr('coachContent'), this.resetCoach),
           createFilter(this.assessments, this.$tr('assessments'), this.resetAssessments),
           createFilter(this.subtitles, this.$tr('subtitles'), this.resetSubtitles),
-          createFilter(this.collection, this.getCollectionName(), this.resetCollection),
         ]).filter(Boolean);
       },
-      collections() {
-        return publicCollections;
-      },
     },
     methods: {
-      getCollectionName() {
-        const collection = this.collections.find(c => c.id === this.collection);
-        return collection && collection.name;
-      },
-      setCollection(collectionId) {
-        this.collection = collectionId;
-      },
-      resetCollection() {
-        this.setCollection(null);
-      },
       resetKeywords() {
         this.keywords = '';
       },
@@ -200,12 +111,6 @@
       subtitles: 'Subtitles',
       starred: 'Starred',
       clearAll: 'Clear all',
-      channelCount: '{count, plural,\n =1 {# channel}\n other {# channels}}',
-      copyToken: 'Copy collection token',
-      copyTitle: 'Copy collection token',
-      copyTokenInstructions:
-        'Paste this token into Kolibri to import the channels contained in this collection',
-      close: 'Close',
     },
   };