diff --git a/kolibri/plugins/learn/assets/src/composables/__tests__/useSearch.spec.js b/kolibri/plugins/learn/assets/src/composables/__tests__/useSearch.spec.js
deleted file mode 100644
index 3b0d5e1284e..00000000000
--- a/kolibri/plugins/learn/assets/src/composables/__tests__/useSearch.spec.js
+++ /dev/null
@@ -1,438 +0,0 @@
-import { get, set } from '@vueuse/core';
-import VueRouter from 'vue-router';
-import Vue, { nextTick, ref } from 'vue';
-import ContentNodeResource from 'kolibri-common/apiResources/ContentNodeResource';
-import { coreStoreFactory } from 'kolibri/store';
-import { AllCategories, NoCategories } from 'kolibri/constants';
-import useUser, { useUserMock } from 'kolibri/composables/useUser'; // eslint-disable-line
-import useSearch from '../useSearch';
-import coreModule from '../../../../../../core/assets/src/state/modules/core';
-
-Vue.use(VueRouter);
-
-jest.mock('kolibri/composables/useUser');
-
-const name = 'not important';
-
-function prep(query = {}, descendant = null) {
-  const store = coreStoreFactory({
-    state: () => ({
-      route: {
-        query,
-        name,
-      },
-    }),
-    mutations: {
-      SET_QUERY(state, query) {
-        state.route.query = query;
-      },
-    },
-  });
-  store.registerModule('core', coreModule);
-  const router = new VueRouter();
-  router.push = jest.fn().mockReturnValue(Promise.resolve());
-  return {
-    ...useSearch(descendant, store, router),
-    router,
-    store,
-  };
-}
-
-describe(`useSearch`, () => {
-  beforeEach(() => {
-    ContentNodeResource.fetchCollection = jest.fn();
-    ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-    useUser.mockImplementation(() => useUserMock());
-  });
-  describe(`searchTerms computed ref`, () => {
-    it(`returns an object with all relevant keys when query params are empty`, () => {
-      const { searchTerms } = prep();
-      expect(get(searchTerms)).toEqual({
-        accessibility_labels: {},
-        categories: {},
-        grade_levels: {},
-        languages: {},
-        learner_needs: {},
-        learning_activities: {},
-        keywords: '',
-      });
-    });
-    it(`returns an object with all relevant keys when query params have other keys`, () => {
-      const { searchTerms } = prep({
-        search: {
-          this: true,
-        },
-        keyword: 'how about this?',
-      });
-      expect(get(searchTerms)).toEqual({
-        accessibility_labels: {},
-        categories: {},
-        grade_levels: {},
-        languages: {},
-        learner_needs: {},
-        learning_activities: {},
-        keywords: '',
-      });
-    });
-    it(`returns an object with all relevant keys when query params are specified`, () => {
-      const { searchTerms } = prep({
-        accessibility_labels: 'test1,test2',
-        keywords: 'I love paris in the springtime!',
-        categories: 'notatest,reallynotatest,absolutelynotatest',
-        grade_levels: 'lowerprimary,uppersecondary,adult',
-        languages: 'ar-jk,en-pr,en-gb',
-        learner_needs: 'internet,pencil,rolodex',
-        learning_activities: 'watch',
-      });
-      expect(get(searchTerms)).toEqual({
-        accessibility_labels: {
-          test1: true,
-          test2: true,
-        },
-        categories: {
-          notatest: true,
-          reallynotatest: true,
-          absolutelynotatest: true,
-        },
-        grade_levels: {
-          lowerprimary: true,
-          uppersecondary: true,
-          adult: true,
-        },
-        languages: {
-          'ar-jk': true,
-          'en-pr': true,
-          'en-gb': true,
-        },
-        learner_needs: {
-          internet: true,
-          pencil: true,
-          rolodex: true,
-        },
-        learning_activities: {
-          watch: true,
-        },
-        keywords: 'I love paris in the springtime!',
-      });
-    });
-    it(`setting relevant keys will result in a router push`, () => {
-      const { searchTerms, router } = prep();
-      set(searchTerms, {
-        keywords: 'test',
-        categories: {
-          cat1: true,
-          cat2: true,
-        },
-      });
-      expect(router.push).toHaveBeenCalledWith({
-        name,
-        query: {
-          keywords: 'test',
-          categories: 'cat1,cat2',
-        },
-      });
-    });
-    it(`removing keys will be propagated to the router`, () => {
-      const { searchTerms, router } = prep({
-        keywords: 'test',
-        categories: 'cat1,cat2',
-        grade_levels: 'level1',
-      });
-      set(searchTerms, {
-        keywords: '',
-        categories: {
-          cat2: true,
-        },
-      });
-      expect(router.push).toHaveBeenCalledWith({
-        name,
-        query: {
-          categories: 'cat2',
-        },
-      });
-    });
-    it(`setting keywords to null will be propagated to the router`, () => {
-      const { searchTerms, router } = prep({
-        keywords: 'test',
-        categories: 'cat1,cat2',
-        grade_levels: 'level1',
-      });
-      set(searchTerms, {
-        keywords: null,
-        categories: {
-          cat2: true,
-        },
-      });
-      expect(router.push).toHaveBeenCalledWith({
-        name,
-        query: {
-          categories: 'cat2',
-        },
-      });
-    });
-  });
-  describe('displayingSearchResults computed property', () => {
-    const searchKeys = [
-      'learning_activities',
-      'categories',
-      'learner_needs',
-      'accessibility_labels',
-      'languages',
-      'grade_levels',
-    ];
-    it.each(searchKeys)('should be true when there are any values for %s', key => {
-      const { displayingSearchResults } = prep({
-        [key]: 'test1,test2',
-      });
-      expect(get(displayingSearchResults)).toBe(true);
-    });
-    it('should be true when there is a value for keywords', () => {
-      const { displayingSearchResults } = prep({
-        keywords: 'testing testing one two three',
-      });
-      expect(get(displayingSearchResults)).toBe(true);
-    });
-  });
-  describe('search method', () => {
-    it('should call ContentNodeResource.fetchCollection when searchTerms changes', async () => {
-      const { store } = prep();
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      store.commit('SET_QUERY', { categories: 'test1,test2' });
-      await nextTick();
-      expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
-        getParams: {
-          categories: ['test1', 'test2'],
-          max_results: 25,
-          include_coach_content: false,
-        },
-      });
-    });
-    it('should not call ContentNodeResource.fetchCollection if there is no search', () => {
-      const { search } = prep();
-      ContentNodeResource.fetchCollection.mockClear();
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      search();
-      expect(ContentNodeResource.fetchCollection).not.toHaveBeenCalled();
-    });
-    it('should clear labels and more if there is no search', () => {
-      const { search, labels, more } = prep();
-      set(labels, ['test']);
-      set(more, { test: 'test' });
-      search();
-      expect(get(labels)).toBeNull();
-      expect(get(more)).toBeNull();
-    });
-    it('should call ContentNodeResource.fetchCollection if there is no search but a descendant is set', () => {
-      const { search } = prep({}, ref({ tree_id: 1, lft: 10, rght: 20 }));
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      search();
-      expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
-        getParams: {
-          tree_id: 1,
-          lft__gt: 10,
-          rght__lt: 20,
-          max_results: 1,
-          include_coach_content: false,
-        },
-      });
-    });
-    it('should set labels and clear more if there is no search but a descendant is set', async () => {
-      const { labels, more, search } = prep({}, ref({ tree_id: 1, lft: 10, rght: 20 }));
-      const labelsSet = {
-        available: ['labels'],
-        languages: [],
-      };
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({ labels: labelsSet }));
-      set(more, { test: 'test' });
-      search();
-      await nextTick();
-      expect(get(more)).toBeNull();
-      expect(get(labels)).toEqual(labelsSet);
-    });
-    it('should call ContentNodeResource.fetchCollection when searchTerms exist', () => {
-      const { search } = prep({ categories: 'test1,test2' });
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      search();
-      expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
-        getParams: {
-          categories: ['test1', 'test2'],
-          max_results: 25,
-          include_coach_content: false,
-        },
-      });
-    });
-    it('should ignore other categories when AllCategories is set and search for isnull false', () => {
-      const { search } = prep({ categories: `test1,test2,${NoCategories},${AllCategories}` });
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      search();
-      expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
-        getParams: { categories__isnull: false, max_results: 25, include_coach_content: false },
-      });
-    });
-    it('should ignore other categories when NoCategories is set and search for isnull true', () => {
-      const { search } = prep({ categories: `test1,test2,${NoCategories}` });
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      search();
-      expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
-        getParams: { categories__isnull: true, max_results: 25, include_coach_content: false },
-      });
-    });
-    it('should set keywords when defined', () => {
-      const { search } = prep({ keywords: `this is just a test` });
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      search();
-      expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
-        getParams: {
-          keywords: `this is just a test`,
-          max_results: 25,
-          include_coach_content: false,
-        },
-      });
-    });
-    it('should set results, labels, and more with returned data', async () => {
-      const { labels, more, results, search } = prep({ categories: 'test1,test2' });
-      const expectedLabels = {
-        available: ['labels'],
-        languages: [],
-      };
-      const expectedMore = {
-        cursor: 'adalskdjsadlkjsadlkjsalkd',
-      };
-      const expectedResults = [{ id: 'node-id1' }];
-      ContentNodeResource.fetchCollection.mockReturnValue(
-        Promise.resolve({
-          labels: expectedLabels,
-          results: expectedResults,
-          more: expectedMore,
-        }),
-      );
-      search();
-      await nextTick();
-      expect(get(labels)).toEqual(expectedLabels);
-      expect(get(results)).toEqual(expectedResults);
-      expect(get(more)).toEqual(expectedMore);
-    });
-  });
-  describe('searchMore method', () => {
-    it('should not call anything when not displaying search terms', () => {
-      const { searchMore } = prep();
-      ContentNodeResource.fetchCollection.mockClear();
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      searchMore();
-      expect(ContentNodeResource.fetchCollection).not.toHaveBeenCalled();
-    });
-    it('should not call anything when more is null', () => {
-      const { more, searchMore } = prep({ categories: 'test1' });
-      ContentNodeResource.fetchCollection.mockClear();
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      set(more, null);
-      searchMore();
-      expect(ContentNodeResource.fetchCollection).not.toHaveBeenCalled();
-    });
-    it('should not call anything when moreLoading is true', () => {
-      const { more, moreLoading, searchMore } = prep({ categories: 'test1' });
-      ContentNodeResource.fetchCollection.mockClear();
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      set(more, {});
-      set(moreLoading, true);
-      searchMore();
-      expect(ContentNodeResource.fetchCollection).not.toHaveBeenCalled();
-    });
-    it('should pass the more object directly to getParams', () => {
-      const { more, searchMore } = prep({ categories: `test1,test2,${NoCategories}` });
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
-      const moreExpected = { test: 'this', not: 'that' };
-      set(more, moreExpected);
-      searchMore();
-      expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({ getParams: moreExpected });
-    });
-    it('should set results, more and labels', async () => {
-      const { labels, more, results, searchMore, search } = prep({
-        categories: `test1,test2,${NoCategories}`,
-      });
-      const expectedLabels = {
-        available: ['labels'],
-        languages: [],
-      };
-      const expectedMore = {
-        cursor: 'adalskdjsadlkjsadlkjsalkd',
-      };
-      const originalResults = [{ id: 'originalId', content_id: 'first' }];
-      ContentNodeResource.fetchCollection.mockReturnValue(
-        Promise.resolve({
-          labels: expectedLabels,
-          results: originalResults,
-          more: expectedMore,
-        }),
-      );
-      search();
-      await nextTick();
-      const expectedResults = [{ id: 'node-id1', content_id: 'second' }];
-      ContentNodeResource.fetchCollection.mockReturnValue(
-        Promise.resolve({
-          labels: expectedLabels,
-          results: expectedResults,
-          more: expectedMore,
-        }),
-      );
-      set(more, {});
-      searchMore();
-      await nextTick();
-      expect(get(labels)).toEqual(expectedLabels);
-      expect(get(results)).toEqual(originalResults.concat(expectedResults));
-      expect(get(more)).toEqual(expectedMore);
-    });
-  });
-  describe('removeFilterTag method', () => {
-    it('should remove a filter from the searchTerms', () => {
-      const { removeFilterTag, router } = prep({
-        categories: 'test1,test2',
-      });
-      removeFilterTag({ value: 'test1', key: 'categories' });
-      expect(router.push).toHaveBeenCalledWith({
-        name,
-        query: {
-          categories: 'test2',
-        },
-      });
-    });
-    it('should remove keywords from the searchTerms', () => {
-      const { removeFilterTag, router } = prep({
-        keywords: 'test',
-      });
-      removeFilterTag({ value: 'test', key: 'keywords' });
-      expect(router.push).toHaveBeenCalledWith({
-        name,
-        query: {},
-      });
-    });
-    it('should not remove any other filters', () => {
-      const { removeFilterTag, router } = prep({
-        categories: 'test1,test2',
-        learning_activities: 'watch',
-      });
-      removeFilterTag({ value: 'test1', key: 'categories' });
-      expect(router.push).toHaveBeenCalledWith({
-        name,
-        query: {
-          categories: 'test2',
-          learning_activities: 'watch',
-        },
-      });
-    });
-  });
-  describe('clearSearch method', () => {
-    it('should remove all filters from the searchTerms', () => {
-      const { clearSearch, router } = prep({
-        categories: 'test1,test2',
-        learning_activities: 'watch',
-        keywords: 'this',
-      });
-      clearSearch();
-      expect(router.push).toHaveBeenCalledWith({
-        name,
-        query: {},
-      });
-    });
-  });
-});
diff --git a/kolibri/plugins/learn/assets/src/composables/useContentLink.js b/kolibri/plugins/learn/assets/src/composables/useContentLink.js
index d5bce334591..00447fa62f6 100644
--- a/kolibri/plugins/learn/assets/src/composables/useContentLink.js
+++ b/kolibri/plugins/learn/assets/src/composables/useContentLink.js
@@ -2,6 +2,7 @@ import { get } from '@vueuse/core';
 import isEmpty from 'lodash/isEmpty';
 import pick from 'lodash/pick';
 import { computed, getCurrentInstance } from 'vue';
+import { primaryLanguageKey } from 'kolibri-common/composables/useBaseSearch';
 import { ExternalPagePaths, PageNames } from '../constants';
 
 function _decodeBackLinkQuery(query) {
@@ -17,6 +18,10 @@ export default function useContentLink(store) {
 
   function _makeNodeLink(id, isResource, query, deviceId) {
     const params = get(route).params;
+    const oldQuery = get(route).query || {};
+    if (!isResource && oldQuery[primaryLanguageKey]) {
+      query[primaryLanguageKey] = oldQuery[primaryLanguageKey];
+    }
     return {
       name: isResource ? PageNames.TOPICS_CONTENT : PageNames.TOPICS_TOPIC,
       params: pick({ id, deviceId: deviceId || params.deviceId }, ['id', 'deviceId']),
diff --git a/kolibri/plugins/learn/assets/src/views/LibraryPage/index.vue b/kolibri/plugins/learn/assets/src/views/LibraryPage/index.vue
index b0499ab0f87..4a9e997c1b8 100644
--- a/kolibri/plugins/learn/assets/src/views/LibraryPage/index.vue
+++ b/kolibri/plugins/learn/assets/src/views/LibraryPage/index.vue
@@ -49,9 +49,16 @@
           v-else-if="!displayingSearchResults && !rootNodesLoading"
           data-test="channels"
         >
-          <h1 class="channels-label">
-            {{ channelsLabel }}
-          </h1>
+          <KFixedGrid numCols="4">
+            <KFixedGridItem span="3">
+              <h1 class="channels-label">
+                {{ channelsLabel }}
+              </h1>
+            </KFixedGridItem>
+            <KFixedGridItem span="1">
+              <LanguageSelector :primary="true" />
+            </KFixedGridItem>
+          </KFixedGrid>
           <p
             v-if="isLocalLibraryEmpty"
             data-test="nothing-in-lib-label"
@@ -109,6 +116,7 @@
           :class="windowIsLarge ? 'side-panel' : ''"
           data-test="side-panel-local"
           :width="`${sidePanelWidth}px`"
+          :showLanguages="displayingSearchResults"
         />
       </div>
 
@@ -122,6 +130,7 @@
           v-model="searchTerms"
           data-test="side-panel"
           :width="`${sidePanelWidth}px`"
+          :showLanguages="displayingSearchResults"
         />
       </SidePanelModal>
 
@@ -176,20 +185,22 @@
 <script>
 
   import { get, set } from '@vueuse/core';
+  import orderBy from 'lodash/orderBy';
 
   import { onMounted, getCurrentInstance, ref, watch } from 'vue';
   import commonCoreStrings from 'kolibri/uiText/commonCoreStrings';
   import useKResponsiveWindow from 'kolibri-design-system/lib/composables/useKResponsiveWindow';
   import useUser from 'kolibri/composables/useUser';
   import samePageCheckGenerator from 'kolibri-common/utils/samePageCheckGenerator';
+  import { getContentLangActive } from 'kolibri/utils/i18n';
   import ContentNodeResource from 'kolibri-common/apiResources/ContentNodeResource';
   import { mapState } from 'vuex';
   import MeteredConnectionNotificationModal from 'kolibri-common/components/MeteredConnectionNotificationModal.vue';
   import appCapabilities, { checkCapability } from 'kolibri/utils/appCapabilities';
   import LearningActivityChip from 'kolibri-common/components/ResourceDisplayAndSearch/LearningActivityChip.vue';
-  import { searchKeys } from 'kolibri-common/composables/useBaseSearch';
   import SidePanelModal from 'kolibri-common/components/SidePanelModal';
   import SearchFiltersPanel from 'kolibri-common/components/SearchFiltersPanel';
+  import LanguageSelector from 'kolibri-common/components/SearchFiltersPanel/LanguageSelector';
   import useChannels from 'kolibri-common/composables/useChannels';
   import { KolibriStudioId, PageNames } from '../../constants';
   import useCardViewStyle from '../../composables/useCardViewStyle';
@@ -233,6 +244,7 @@
       LearnAppBarPage,
       OtherLibraries,
       PostSetupModalGroup,
+      LanguageSelector,
     },
     mixins: [commonLearnStrings, commonCoreStrings],
     setup(props) {
@@ -261,6 +273,9 @@
         removeFilterTag,
         clearSearch,
         currentRoute,
+        createBaseSearchGetParams,
+        ensurePrimaryLanguage,
+        primaryLanguage,
       } = useSearch();
       search();
       const { fetchResumableContentNodes } = useLearnerResources();
@@ -300,20 +315,35 @@
               // we want them to be in the same order as the channels list
               set(
                 rootNodes,
-                channels
-                  .map(channel => {
-                    const node = channelCollection.find(n => n.channel_id === channel.id);
-                    if (node) {
-                      // The `channel` comes with additional data that is
-                      // not returned from the ContentNodeResource.
-                      // Namely thumbnail, description and tagline (so far)
-                      node.title = channel.name || node.title;
-                      node.thumbnail = channel.thumbnail;
-                      node.description = channel.tagline || channel.description;
-                      return node;
-                    }
-                  })
-                  .filter(Boolean),
+                // Sort channels by relevance to the current user interface language
+                orderBy(
+                  channels
+                    .map(channel => {
+                      const node = channelCollection.find(n => n.channel_id === channel.id);
+                      if (node) {
+                        // The `channel` comes with additional data that is
+                        // not returned from the ContentNodeResource.
+                        // Namely thumbnail, description and tagline (so far)
+                        node.title = channel.name || node.title;
+                        node.thumbnail = channel.thumbnail;
+                        node.description = channel.tagline || channel.description;
+                        node.included_languages = channel.included_languages;
+                        return node;
+                      }
+                    })
+                    .filter(Boolean),
+                  [
+                    c => getContentLangActive(c.lang, get(primaryLanguage)),
+                    c =>
+                      Math.max(
+                        ...c.included_languages.map(l =>
+                          getContentLangActive(l, get(primaryLanguage)),
+                        ),
+                      ),
+                    'title',
+                  ],
+                  ['desc', 'desc', 'asc'],
+                ),
               );
 
               store.commit('CORE_SET_PAGE_LOADING', false);
@@ -332,7 +362,8 @@
       }
 
       function _showLibrary(baseurl) {
-        return fetchChannels({ baseurl }).then(channels => {
+        const params = createBaseSearchGetParams();
+        return fetchChannels(params).then(channels => {
           if (!channels.length && isUserLoggedIn) {
             router.replace({ name: PageNames.CONTENT_UNAVAILABLE });
             return;
@@ -342,9 +373,7 @@
             return;
           }
 
-          const query = currentRoute().query;
-
-          if (searchKeys.some(key => query[key])) {
+          if (get(displayingSearchResults)) {
             // If currently on a route with search terms
             // just finish early and let the component handle loading
             store.commit('CORE_SET_PAGE_LOADING', false);
@@ -357,7 +386,10 @@
         });
       }
 
-      function showLibrary() {
+      async function showLibrary() {
+        if (!(await ensurePrimaryLanguage())) {
+          return;
+        }
         set(rootNodesLoading, true);
         store.commit('CORE_SET_PAGE_LOADING', true);
         if (props.deviceId) {
@@ -386,6 +418,12 @@
         }
       });
 
+      watch(primaryLanguage, () => {
+        if (!displayingSearchResults.value) {
+          showLibrary();
+        }
+      });
+
       showLibrary();
 
       return {
diff --git a/kolibri/plugins/learn/assets/src/views/TopicsPage/index.vue b/kolibri/plugins/learn/assets/src/views/TopicsPage/index.vue
index 313e86433dd..d428e417028 100644
--- a/kolibri/plugins/learn/assets/src/views/TopicsPage/index.vue
+++ b/kolibri/plugins/learn/assets/src/views/TopicsPage/index.vue
@@ -370,12 +370,14 @@
         removeFilterTag,
         clearSearch,
         currentRoute,
+        createBaseSearchGetParams,
+        ensurePrimaryLanguage,
       } = useSearch(topic);
       const { back, genContentLinkKeepCurrentBackLink } = useContentLink();
       const { windowBreakpoint, windowIsLarge, windowIsSmall } = useKResponsiveWindow();
       const { channelsMap, fetchChannels } = useChannels();
       const { fetchContentNodeProgress, fetchContentNodeTreeProgress } = useContentNodeProgress();
-      const { isUserLoggedIn, isCoach, isAdmin, isSuperuser } = useUser();
+      const { isUserLoggedIn } = useUser();
       const { fetchUserDownloadRequests } = useDownloadRequests(store);
 
       const isRoot = ref(false);
@@ -430,10 +432,7 @@
         let id = props.id;
         const route = currentRoute();
         const skip = route.query && route.query.skip === 'true';
-        const params = {
-          include_coach_content: get(isAdmin) || get(isCoach) || get(isSuperuser),
-          baseurl,
-        };
+        const params = createBaseSearchGetParams(false);
         if (get(isUserLoggedIn) && !baseurl) {
           fetchContentNodeTreeProgress({ id, params });
         }
@@ -486,7 +485,10 @@
         });
       }
 
-      function showTopicsTopic() {
+      async function showTopicsTopic() {
+        if (!(await ensurePrimaryLanguage())) {
+          return;
+        }
         return store.dispatch('loading').then(() => {
           const route = currentRoute();
           store.commit('SET_PAGE_NAME', route.name);
@@ -557,8 +559,6 @@
         type: String,
         default: null,
       },
-      // Our linting doesn't detect usage in the setup function yet.
-      // eslint-disable-next-line vue/no-unused-properties
       id: {
         type: String,
         required: true,
diff --git a/kolibri/plugins/learn/assets/test/views/library-page.spec.js b/kolibri/plugins/learn/assets/test/views/library-page.spec.js
index b4b758bc6bc..e5e85fb0460 100644
--- a/kolibri/plugins/learn/assets/test/views/library-page.spec.js
+++ b/kolibri/plugins/learn/assets/test/views/library-page.spec.js
@@ -36,6 +36,14 @@ const CHANNEL = {
   name: 'test channel',
   root: 'test root',
   thumbnail: 'test thumbnail',
+  lang: {
+    id: 'es-es',
+    lang_name: 'Español',
+    lang_code: 'es',
+    lang_subcode: 'es',
+    lang_direction: 'ltr',
+  },
+  included_languages: ['es-es'],
 };
 
 jest.mock('kolibri-common/composables/useChannels');
@@ -53,7 +61,13 @@ jest.mock('kolibri/urls');
 
 async function makeWrapper({ options, fullMount = false } = {}) {
   const store = new Store({
-    state: { core: { loading: false } },
+    state: {
+      core: { loading: false },
+      route: {
+        query: {},
+        name: PageNames.TOPICS_TOPIC,
+      },
+    },
     getters: {
       isUserLoggedIn: jest.fn(),
       isLearner: jest.fn(),
@@ -70,6 +84,9 @@ async function makeWrapper({ options, fullMount = false } = {}) {
       SET_PAGE_NAME: jest.fn(),
       CORE_SET_PAGE_LOADING: jest.fn(),
       CORE_SET_ERROR: jest.fn(),
+      SET_QUERY(state, query) {
+        state.route.query = query;
+      },
     },
   });
   let wrapper;
@@ -94,8 +111,10 @@ describe('LibraryPage', () => {
       }),
     );
     ContentNodeResource.fetchCollection.mockImplementation(() =>
-      Promise.resolve([{ id: 'test', title: 'test', channel_id: CHANNEL_ID }]),
+      Promise.resolve([{ id: 'test', title: 'test', channel_id: CHANNEL_ID, lang: CHANNEL.lang }]),
     );
+    router.push = jest.fn().mockReturnValue(Promise.resolve());
+    router.replace = jest.fn().mockReturnValue(Promise.resolve());
   });
   describe('filters button', () => {
     it('is visible when the page is not large and channels are available', async () => {
diff --git a/packages/kolibri-common/components/SearchChips.vue b/packages/kolibri-common/components/SearchChips.vue
index f62523f9b9d..6ebfb665d6c 100644
--- a/packages/kolibri-common/components/SearchChips.vue
+++ b/packages/kolibri-common/components/SearchChips.vue
@@ -40,26 +40,21 @@
     name: 'SearchChips',
     mixins: [commonCoreStrings],
     setup() {
-      const { availableLanguages } = injectBaseSearch();
-      const languagesMap = availableLanguages.value.reduce((map, lang) => {
-        map[lang.id] = lang;
+      const { languageOptions, activeSearchTerms } = injectBaseSearch();
+      const languagesMap = languageOptions.value.reduce((map, lang) => {
+        map[lang.value] = lang.label;
         return map;
       }, {});
       const { channelsMap } = useChannels();
       return {
         channelsMap,
         languagesMap,
+        activeSearchTerms,
       };
     },
-    props: {
-      searchTerms: {
-        type: Object,
-        default: () => ({}),
-      },
-    },
     computed: {
       items() {
-        return flatMap(this.searchTerms, (value, key) => {
+        return flatMap(this.activeSearchTerms, (value, key) => {
           if (key === 'keywords' && value && value.length) {
             return [
               {
@@ -82,7 +77,7 @@
     methods: {
       translate(key, value) {
         if (key === 'languages') {
-          return this.languagesMap[value].lang_name;
+          return this.languagesMap[value];
         }
         if (key === 'channels') {
           return this.channelsMap[value].name;
diff --git a/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue b/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue
index aaa22652d4f..508255e254e 100644
--- a/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue
+++ b/packages/kolibri-common/components/SearchFiltersPanel/AccordionSelectGroup.vue
@@ -61,15 +61,15 @@
     </AccordionContainer>
 
     <AccordionContainer
-      v-if="languageOptionsList.length"
+      v-if="languageOptions.length && showLanguages"
       class="accordion-select"
     >
       <AccordionItem
         :title="coreString('languageLabel')"
         :headerAppearanceOverrides="
-          accordionHeaderStyles(anySelectedFor('languages', languageOptionsList))
+          accordionHeaderStyles(anySelectedFor('languages', languageOptions))
         "
-        :disabled="languageOptionsList.every(opt => opt.disabled)"
+        :disabled="languageOptions.every(opt => opt.disabled)"
         :contentAppearanceOverrides="{
           maxHeight: '256px',
           overflowY: 'scroll',
@@ -77,7 +77,7 @@
       >
         <template #content>
           <KCheckbox
-            v-for="lang in languageOptionsList"
+            v-for="lang in languageOptions"
             :key="'lang-' + lang.value"
             :checked="isSelected('languages', lang)"
             :disabled="lang.disabled"
@@ -191,18 +191,18 @@
         availableResourcesNeeded,
         availableGradeLevels,
         availableAccessibilityOptions,
-        availableLanguages,
         availableLibraryCategories,
         searchableLabels,
+        languageOptions,
       } = injectBaseSearch();
 
       return {
         availableResourcesNeeded,
         availableGradeLevels,
         availableAccessibilityOptions,
-        availableLanguages,
         availableLibraryCategories,
         searchableLabels,
+        languageOptions,
       };
     },
     props: {
@@ -214,6 +214,10 @@
           return inputKeys.every(k => Object.prototype.hasOwnProperty.call(value, k));
         },
       },
+      showLanguages: {
+        type: Boolean,
+        default: true,
+      },
       handleCategory: {
         type: Function,
         required: true,
@@ -249,16 +253,6 @@
         }
         return null;
       },
-      languageOptionsList() {
-        return this.availableLanguages.map(language => {
-          return {
-            value: language.id,
-            disabled:
-              this.searchableLabels && !this.searchableLabels.languages.includes(language.id),
-            label: language.lang_name,
-          };
-        });
-      },
       accessibilityOptionsList() {
         return this.availableAccessibilityOptions.map(key => {
           const value = AccessibilityCategories[key];
diff --git a/packages/kolibri-common/components/SearchFiltersPanel/LanguageSelector.vue b/packages/kolibri-common/components/SearchFiltersPanel/LanguageSelector.vue
new file mode 100644
index 00000000000..85cc4614608
--- /dev/null
+++ b/packages/kolibri-common/components/SearchFiltersPanel/LanguageSelector.vue
@@ -0,0 +1,65 @@
+<template>
+
+  <KSelect
+    v-if="languageOptions.length"
+    :options="languageOptions"
+    :disabled="!languageId && enabledLanguageOptions.length < 2"
+    :clearable="!(!languageId && enabledLanguageOptions.length < 2)"
+    :clearText="coreString('clearAction')"
+    :value="selectedLanguage"
+    :label="coreString('languageLabel')"
+    @change="val => (languageId = val && val.value)"
+  />
+
+</template>
+
+
+<script>
+
+  import { computed } from 'vue';
+  import { get } from '@vueuse/core';
+  import commonCoreStrings from 'kolibri/uiText/commonCoreStrings';
+  import { injectBaseSearch } from 'kolibri-common/composables/useBaseSearch';
+
+  export default {
+    name: 'LanguageSelector',
+    mixins: [commonCoreStrings],
+    setup(props) {
+      const {
+        languageOptions,
+        enabledLanguageOptions,
+        currentLanguageId,
+        currentPrimaryLanguageId,
+      } = injectBaseSearch();
+
+      const languageId = computed({
+        get: () => (props.primary ? currentPrimaryLanguageId.value : currentLanguageId.value),
+        set: val => {
+          if (props.primary) {
+            currentPrimaryLanguageId.value = val;
+          } else {
+            currentLanguageId.value = val;
+          }
+        },
+      });
+
+      const selectedLanguage = computed(
+        () => get(languageOptions).find(lang => lang.value === get(languageId)) || {},
+      );
+
+      return {
+        languageOptions,
+        enabledLanguageOptions,
+        languageId,
+        selectedLanguage,
+      };
+    },
+    props: {
+      primary: {
+        type: Boolean,
+        default: false,
+      },
+    },
+  };
+
+</script>
diff --git a/packages/kolibri-common/components/SearchFiltersPanel/SelectGroup.vue b/packages/kolibri-common/components/SearchFiltersPanel/SelectGroup.vue
index cf26123bff5..0a94c833d44 100644
--- a/packages/kolibri-common/components/SearchFiltersPanel/SelectGroup.vue
+++ b/packages/kolibri-common/components/SearchFiltersPanel/SelectGroup.vue
@@ -1,16 +1,9 @@
 <template>
 
   <div>
-    <KSelect
-      v-if="languageOptionsList.length"
-      :options="languageOptionsList"
-      :disabled="!langId && enabledLanguageOptions.length < 2"
-      :clearable="!(!langId && enabledLanguageOptions.length < 2)"
-      :clearText="coreString('clearAction')"
-      :value="selectedLanguage"
-      :label="coreString('languageLabel')"
+    <LanguageSelector
+      v-if="showLanguages"
       :style="selectorStyle"
-      @change="val => handleChange('languages', val)"
     />
     <KSelect
       v-if="contentLevelsList.length"
@@ -22,7 +15,7 @@
       :value="selectedLevel"
       :label="coreString('levelLabel')"
       :style="selectorStyle"
-      @change="val => handleChange('grade_levels', val)"
+      @change="val => handleChange('grade_levels', val && val.value)"
     />
     <KSelect
       v-if="accessibilityOptionsList.length"
@@ -34,7 +27,7 @@
       :value="selectedAccessibilityFilter"
       :label="coreString('accessibility')"
       :style="selectorStyle"
-      @change="val => handleChange('accessibility_labels', val)"
+      @change="val => handleChange('accessibility_labels', val && val.value)"
     />
   </div>
 
@@ -47,21 +40,20 @@
   import { ContentLevels, AccessibilityCategories } from 'kolibri/constants';
   import commonCoreStrings from 'kolibri/uiText/commonCoreStrings';
   import { injectBaseSearch } from 'kolibri-common/composables/useBaseSearch';
+  import LanguageSelector from './LanguageSelector';
 
   export default {
     name: 'SelectGroup',
+    components: {
+      LanguageSelector,
+    },
     mixins: [commonCoreStrings],
     setup() {
-      const {
-        availableGradeLevels,
-        availableAccessibilityOptions,
-        availableLanguages,
-        searchableLabels,
-      } = injectBaseSearch();
+      const { availableGradeLevels, availableAccessibilityOptions, searchableLabels } =
+        injectBaseSearch();
       return {
         availableGradeLevels,
         availableAccessibilityOptions,
-        availableLanguages,
         searchableLabels,
       };
     },
@@ -74,6 +66,10 @@
           return inputKeys.every(k => Object.prototype.hasOwnProperty.call(value, k));
         },
       },
+      showLanguages: {
+        type: Boolean,
+        default: true,
+      },
     },
     computed: {
       selectorStyle() {
@@ -83,19 +79,6 @@
           borderRadius: '2px',
         };
       },
-      languageOptionsList() {
-        return this.availableLanguages.map(language => {
-          return {
-            value: language.id,
-            disabled:
-              this.searchableLabels && !this.searchableLabels.languages.includes(language.id),
-            label: language.lang_name,
-          };
-        });
-      },
-      enabledLanguageOptions() {
-        return this.languageOptionsList.filter(l => !l.disabled);
-      },
       accessibilityOptionsList() {
         return this.availableAccessibilityOptions.map(key => {
           const value = AccessibilityCategories[key];
@@ -133,15 +116,6 @@
       enabledContentLevels() {
         return this.contentLevelsList.filter(c => !c.disabled);
       },
-      langId() {
-        return Object.keys(this.value.languages)[0];
-      },
-      selectedLanguage() {
-        if (!this.langId && this.enabledLanguageOptions.length === 1) {
-          return this.enabledLanguageOptions[0];
-        }
-        return this.languageOptionsList.find(o => o.value === this.langId) || {};
-      },
       accessId() {
         return Object.keys(this.value.accessibility_labels)[0];
       },
diff --git a/packages/kolibri-common/components/SearchFiltersPanel/index.vue b/packages/kolibri-common/components/SearchFiltersPanel/index.vue
index ba2eb32634f..d98e5244be1 100644
--- a/packages/kolibri-common/components/SearchFiltersPanel/index.vue
+++ b/packages/kolibri-common/components/SearchFiltersPanel/index.vue
@@ -85,7 +85,7 @@
         <!-- Filter results by learning activity, displaying all options -->
         <SelectGroup
           v-model="inputValue"
-          :showChannels="showChannels"
+          :showLanguages="showLanguages"
           class="section"
         />
         <div
@@ -132,7 +132,7 @@
 
           <AccordionSelectGroup
             v-model="inputValue"
-            :showChannels="showChannels"
+            :showLanguages="showLanguages"
             :activeCategories="activeCategories"
             :handleCategory="handleCategory"
             style="margin-top: 1em"
@@ -244,7 +244,7 @@
         required: false,
         default: null,
       },
-      showChannels: {
+      showLanguages: {
         type: Boolean,
         default: true,
       },
diff --git a/packages/kolibri-common/composables/__mocks__/useBaseSearch.js b/packages/kolibri-common/composables/__mocks__/useBaseSearch.js
index 3a88de06738..82e5ef747df 100644
--- a/packages/kolibri-common/composables/__mocks__/useBaseSearch.js
+++ b/packages/kolibri-common/composables/__mocks__/useBaseSearch.js
@@ -61,6 +61,8 @@ const MOCK_DEFAULTS = {
       meta: {},
     };
   }),
+  ensurePrimaryLanguage: jest.fn(() => Promise.resolve(true)),
+  createBaseSearchGetParams: jest.fn(() => ({})),
 };
 
 export function useBaseSearchMock(overrides = {}) {
@@ -82,6 +84,9 @@ export const injectBaseSearch = jest.fn(() => ({
   availableChannels: [],
   searchableLabels: [],
   activeSearchTerms: [],
+  languageOptions: [],
+  enabledLanguageOptions: [],
+  removeSearchTerm: jest.fn(),
 }));
 
 export const searchKeys = [];
diff --git a/packages/kolibri-common/composables/__tests__/useBaseSearch.spec.js b/packages/kolibri-common/composables/__tests__/useBaseSearch.spec.js
index b4b46c14a82..ad4d77dc689 100644
--- a/packages/kolibri-common/composables/__tests__/useBaseSearch.spec.js
+++ b/packages/kolibri-common/composables/__tests__/useBaseSearch.spec.js
@@ -39,6 +39,12 @@ function prep(query = {}, descendant = null) {
 }
 
 describe(`useBaseSearch`, () => {
+  async function waitThreeTicks() {
+    // Because of async behaviour in search method, we need to wait for three ticks
+    await nextTick();
+    await nextTick();
+    await nextTick();
+  }
   beforeEach(() => {
     ContentNodeResource.fetchCollection = jest.fn();
     ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
@@ -196,9 +202,8 @@ describe(`useBaseSearch`, () => {
   describe('search method', () => {
     it('should call ContentNodeResource.fetchCollection when searchTerms changes', async () => {
       const { store } = prep();
-      ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
       store.commit('SET_QUERY', { categories: 'test1,test2' });
-      await nextTick();
+      await waitThreeTicks();
       expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
         getParams: {
           categories: ['test1', 'test2'],
@@ -207,25 +212,28 @@ describe(`useBaseSearch`, () => {
         },
       });
     });
-    it('should not call ContentNodeResource.fetchCollection if there is no search', () => {
+    it('should not call ContentNodeResource.fetchCollection if there is no search', async () => {
       const { search } = prep();
       ContentNodeResource.fetchCollection.mockClear();
       ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
       search();
+      await waitThreeTicks();
       expect(ContentNodeResource.fetchCollection).not.toHaveBeenCalled();
     });
-    it('should clear labels and more if there is no search', () => {
+    it('should clear labels and more if there is no search', async () => {
       const { search, labels, more } = prep();
       set(labels, ['test']);
       set(more, { test: 'test' });
       search();
+      await waitThreeTicks();
       expect(get(labels)).toBeNull();
       expect(get(more)).toBeNull();
     });
-    it('should call ContentNodeResource.fetchCollection if there is no search but a descendant is set', () => {
+    it('should call ContentNodeResource.fetchCollection if there is no search but a descendant is set', async () => {
       const { search } = prep({}, ref({ tree_id: 1, lft: 10, rght: 20 }));
       ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
       search();
+      await waitThreeTicks();
       expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
         getParams: {
           tree_id: 1,
@@ -245,14 +253,16 @@ describe(`useBaseSearch`, () => {
       ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({ labels: labelsSet }));
       set(more, { test: 'test' });
       search();
-      await nextTick();
+      await waitThreeTicks();
       expect(get(more)).toBeNull();
       expect(get(labels)).toEqual(labelsSet);
     });
-    it('should call ContentNodeResource.fetchCollection when searchTerms exist', () => {
+    it('should call ContentNodeResource.fetchCollection when searchTerms exist', async () => {
       const { search } = prep({ categories: 'test1,test2' });
       ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
+      await nextTick();
       search();
+      await waitThreeTicks();
       expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
         getParams: {
           categories: ['test1', 'test2'],
@@ -261,26 +271,29 @@ describe(`useBaseSearch`, () => {
         },
       });
     });
-    it('should ignore other categories when AllCategories is set and search for isnull false', () => {
+    it('should ignore other categories when AllCategories is set and search for isnull false', async () => {
       const { search } = prep({ categories: `test1,test2,${NoCategories},${AllCategories}` });
       ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
       search();
+      await waitThreeTicks();
       expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
         getParams: { categories__isnull: false, max_results: 25, include_coach_content: false },
       });
     });
-    it('should ignore other categories when NoCategories is set and search for isnull true', () => {
+    it('should ignore other categories when NoCategories is set and search for isnull true', async () => {
       const { search } = prep({ categories: `test1,test2,${NoCategories}` });
       ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
       search();
+      await waitThreeTicks();
       expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
         getParams: { categories__isnull: true, max_results: 25, include_coach_content: false },
       });
     });
-    it('should set keywords when defined', () => {
+    it('should set keywords when defined', async () => {
       const { search } = prep({ keywords: `this is just a test` });
       ContentNodeResource.fetchCollection.mockReturnValue(Promise.resolve({}));
       search();
+      await waitThreeTicks();
       expect(ContentNodeResource.fetchCollection).toHaveBeenCalledWith({
         getParams: {
           keywords: `this is just a test`,
@@ -307,7 +320,7 @@ describe(`useBaseSearch`, () => {
         }),
       );
       search();
-      await nextTick();
+      await waitThreeTicks();
       expect(get(labels)).toEqual(expectedLabels);
       expect(get(results)).toEqual(expectedResults);
       expect(get(more)).toEqual(expectedMore);
@@ -366,7 +379,7 @@ describe(`useBaseSearch`, () => {
         }),
       );
       search();
-      await nextTick();
+      await waitThreeTicks();
       const expectedResults = [{ id: 'node-id1', content_id: 'second' }];
       ContentNodeResource.fetchCollection.mockReturnValue(
         Promise.resolve({
@@ -377,18 +390,18 @@ describe(`useBaseSearch`, () => {
       );
       set(more, {});
       searchMore();
-      await nextTick();
+      await waitThreeTicks();
       expect(get(labels)).toEqual(expectedLabels);
       expect(get(results)).toEqual(originalResults.concat(expectedResults));
       expect(get(more)).toEqual(expectedMore);
     });
   });
-  describe('removeFilterTag method', () => {
+  describe('removeSearchTerm method', () => {
     it('should remove a filter from the searchTerms', () => {
-      const { removeFilterTag, router } = prep({
+      const { removeSearchTerm, router } = prep({
         categories: 'test1,test2',
       });
-      removeFilterTag({ value: 'test1', key: 'categories' });
+      removeSearchTerm({ value: 'test1', key: 'categories' });
       expect(router.push).toHaveBeenCalledWith({
         name,
         query: {
@@ -397,21 +410,21 @@ describe(`useBaseSearch`, () => {
       });
     });
     it('should remove keywords from the searchTerms', () => {
-      const { removeFilterTag, router } = prep({
+      const { removeSearchTerm, router } = prep({
         keywords: 'test',
       });
-      removeFilterTag({ value: 'test', key: 'keywords' });
+      removeSearchTerm({ value: 'test', key: 'keywords' });
       expect(router.push).toHaveBeenCalledWith({
         name,
         query: {},
       });
     });
     it('should not remove any other filters', () => {
-      const { removeFilterTag, router } = prep({
+      const { removeSearchTerm, router } = prep({
         categories: 'test1,test2',
         learning_activities: 'watch',
       });
-      removeFilterTag({ value: 'test1', key: 'categories' });
+      removeSearchTerm({ value: 'test1', key: 'categories' });
       expect(router.push).toHaveBeenCalledWith({
         name,
         query: {
diff --git a/packages/kolibri-common/composables/useBaseSearch.js b/packages/kolibri-common/composables/useBaseSearch.js
index dcee9eb8a25..80a425aab89 100644
--- a/packages/kolibri-common/composables/useBaseSearch.js
+++ b/packages/kolibri-common/composables/useBaseSearch.js
@@ -1,5 +1,6 @@
-import { get, set } from '@vueuse/core';
+import { get, set, until } from '@vueuse/core';
 import invert from 'lodash/invert';
+import orderBy from 'lodash/orderBy';
 import logger from 'kolibri-logging';
 import { computed, getCurrentInstance, inject, provide, ref, watch } from 'vue';
 import ContentNodeResource from 'kolibri-common/apiResources/ContentNodeResource';
@@ -13,6 +14,7 @@ import {
   NoCategories,
   ResourcesNeededTypes,
 } from 'kolibri/constants';
+import { getContentLangActive } from 'kolibri/utils/i18n';
 import useUser from 'kolibri/composables/useUser';
 
 import { deduplicateResources } from '../utils/contentNode';
@@ -152,13 +154,17 @@ export const searchKeys = [
   'grade_levels',
 ];
 
+export const primaryLanguageKey = 'primaryLanguage';
+
+const allLanguagesValue = 'allLangs';
+
 export default function useBaseSearch({
   descendant,
   store,
   router,
   baseurl,
   fetchContentNodeProgress,
-}) {
+} = {}) {
   // Get store and router references from the curent instance
   // but allow them to be passed in to allow for dependency
   // injection, primarily for tests.
@@ -213,6 +219,24 @@ export default function useBaseSearch({
     },
   });
 
+  const primaryLanguage = computed({
+    get() {
+      if (get(route).query[primaryLanguageKey] === allLanguagesValue) {
+        return;
+      }
+      return get(route).query[primaryLanguageKey];
+    },
+    set(value) {
+      const query = { ...get(route).query };
+      if (value) {
+        query[primaryLanguageKey] = value;
+      } else {
+        query[primaryLanguageKey] = allLanguagesValue;
+      }
+      router.push({ ...get(route), query }).catch(() => {});
+    },
+  });
+
   const displayingSearchResults = computed(() =>
     // Happily this works even for keywords, because calling Object.keys
     // on a string value will give an array of the indexes of a string
@@ -230,43 +254,65 @@ export default function useBaseSearch({
     }
   }
 
-  function search() {
-    const currentBaseUrl = get(baseurl);
+  function createBaseSearchGetParams(setDescendant = true) {
     const getParams = {
       include_coach_content: get(isAdmin) || get(isCoach) || get(isSuperuser),
-      baseurl: currentBaseUrl,
+      baseurl: get(baseurl),
     };
-    const descValue = descendant ? get(descendant) : null;
-    if (descValue) {
-      getParams.tree_id = descValue.tree_id;
-      getParams.lft__gt = descValue.lft;
-      getParams.rght__lt = descValue.rght;
+    if (setDescendant && descendant) {
+      const descValue = get(descendant);
+      if (descValue) {
+        getParams.tree_id = descValue.tree_id;
+        getParams.lft__gt = descValue.lft;
+        getParams.rght__lt = descValue.rght;
+      }
     }
-    if (get(displayingSearchResults)) {
-      getParams.max_results = 25;
-      const terms = get(searchTerms);
-      set(searchResultsLoading, true);
-      for (const key of searchKeys) {
-        if (key === 'categories') {
-          if (terms[key][AllCategories]) {
-            getParams['categories__isnull'] = false;
-            continue;
-          } else if (terms[key][NoCategories]) {
-            getParams['categories__isnull'] = true;
-            continue;
-          }
-        }
-        if (key === 'channels' && descValue) {
+    const primaryLang = get(primaryLanguage);
+    if (primaryLang && primaryLang !== allLanguagesValue) {
+      const langCode = primaryLang.split('-')[0];
+      getParams.languages = get(languagesList)
+        .filter(lang => lang.id.startsWith(langCode))
+        .map(lang => lang.id);
+    }
+    return getParams;
+  }
+
+  function createSearchGetParams() {
+    const getParams = createBaseSearchGetParams();
+    const terms = get(searchTerms);
+    for (const key of searchKeys) {
+      if (key === 'categories') {
+        if (terms[key][AllCategories]) {
+          getParams['categories__isnull'] = false;
+          continue;
+        } else if (terms[key][NoCategories]) {
+          getParams['categories__isnull'] = true;
           continue;
-        }
-        const keys = Object.keys(terms[key]);
-        if (keys.length) {
-          getParams[key] = keys;
         }
       }
-      if (terms.keywords) {
-        getParams.keywords = terms.keywords;
+      if (key === 'channels' && descendant ? get(descendant) : null) {
+        continue;
       }
+      const keys = Object.keys(terms[key]);
+      if (keys.length) {
+        getParams[key] = keys;
+      }
+    }
+    if (terms.keywords) {
+      getParams.keywords = terms.keywords;
+    }
+    return getParams;
+  }
+
+  async function search() {
+    await until(globalLabelsLoading).toBe(false);
+    const desc = descendant ? get(descendant) : null;
+    if (get(displayingSearchResults)) {
+      // If we're actually displaying search results
+      // then we need to load all the search results to display
+      set(searchResultsLoading, true);
+      const getParams = createSearchGetParams();
+      getParams.max_results = 25;
       if (get(isUserLoggedIn)) {
         fetchContentNodeProgress?.(getParams);
       }
@@ -276,7 +322,8 @@ export default function useBaseSearch({
         _setAvailableLabels(data.labels);
         set(searchResultsLoading, false);
       });
-    } else if (descValue) {
+    } else if (desc || get(primaryLanguage)) {
+      const getParams = createBaseSearchGetParams();
       getParams.max_results = 1;
       ContentNodeResource.fetchCollection({ getParams }).then(data => {
         _setAvailableLabels(data.labels);
@@ -305,7 +352,7 @@ export default function useBaseSearch({
     }
   }
 
-  function removeFilterTag({ value, key }) {
+  function removeSearchTerm({ value, key }) {
     if (key === 'keywords') {
       set(searchTerms, {
         ...get(searchTerms),
@@ -335,6 +382,8 @@ export default function useBaseSearch({
     });
   }
 
+  watch(primaryLanguage, search);
+
   // Helper to get the route information in a setup() function
   function currentRoute() {
     return get(route);
@@ -409,9 +458,61 @@ export default function useBaseSearch({
     return _getGlobalLabels('accessibilityOptionsList', []);
   });
   const languagesList = computed(() => {
-    return _getGlobalLabels('languagesList', []);
+    return orderBy(
+      _getGlobalLabels('languagesList', []),
+      [getContentLangActive, 'id'],
+      ['desc', 'asc'],
+    );
   });
 
+  const languageOptionsList = computed(() => {
+    const searchableLabels = get(labels);
+    return get(languagesList).map(language => {
+      return {
+        value: language.id,
+        disabled: searchableLabels && !searchableLabels.languages.includes(language.id),
+        label: language.lang_name,
+      };
+    });
+  });
+
+  const enabledLanguageOptions = computed(() => {
+    return get(languageOptionsList).filter(l => !l.disabled);
+  });
+
+  const currentLanguageId = computed({
+    get() {
+      return get(searchTerms).languages ? Object.keys(get(searchTerms).languages)[0] : null;
+    },
+    set(value) {
+      set(searchTerms, {
+        ...get(searchTerms),
+        languages: value ? { [value]: true } : {},
+      });
+    },
+  });
+
+  async function ensurePrimaryLanguage() {
+    await until(globalLabelsLoading).toBe(false);
+    if (!get(route).query[primaryLanguageKey]) {
+      // If we have no currently selected primary language key
+      // compute the closest match to the currently active interface language
+      const closestMatchChannelLanguage = get(languagesList)[0];
+      const language =
+        closestMatchChannelLanguage && getContentLangActive(closestMatchChannelLanguage) > 1
+          ? closestMatchChannelLanguage.id
+          : allLanguagesValue;
+      router.replace({
+        query: {
+          ...currentRoute().query,
+          [primaryLanguageKey]: language,
+        },
+      });
+      return false;
+    }
+    return true;
+  }
+
   provide('availableLearningActivities', learningActivitiesShown);
   provide('availableLibraryCategories', libraryCategories);
   provide('availableResourcesNeeded', resourcesNeeded);
@@ -419,6 +520,11 @@ export default function useBaseSearch({
   provide('availableAccessibilityOptions', accessibilityOptionsList);
   provide('availableLanguages', languagesList);
 
+  provide('currentLanguageId', currentLanguageId);
+  provide('currentPrimaryLanguageId', primaryLanguage);
+  provide('languageOptions', languageOptionsList);
+  provide('enabledLanguageOptions', enabledLanguageOptions);
+
   // Provide an object of searchable labels
   // This is a manifest of all the labels that could still be selected and produce search results
   // given the currently applied search filters.
@@ -427,9 +533,12 @@ export default function useBaseSearch({
   // Currently selected search terms
   provide('activeSearchTerms', searchTerms);
 
+  provide('removeSearchTerm', removeSearchTerm);
+
   return {
     currentRoute,
     searchTerms,
+    createBaseSearchGetParams,
     displayingSearchResults,
     searchLoading,
     moreLoading,
@@ -438,8 +547,10 @@ export default function useBaseSearch({
     labels,
     search,
     searchMore,
-    removeFilterTag,
     clearSearch,
+    primaryLanguage,
+    ensurePrimaryLanguage,
+    removeSearchTerm,
   };
 }
 
@@ -456,6 +567,14 @@ export function injectBaseSearch() {
   const availableLanguages = inject('availableLanguages');
   const searchableLabels = inject('searchableLabels');
   const activeSearchTerms = inject('activeSearchTerms');
+
+  const currentLanguageId = inject('currentLanguageId');
+  const currentPrimaryLanguageId = inject('currentPrimaryLanguageId');
+  const languageOptions = inject('languageOptions');
+  const enabledLanguageOptions = inject('enabledLanguageOptions');
+
+  const removeSearchTerm = inject('removeSearchTerm');
+
   return {
     availableLearningActivities,
     availableLibraryCategories,
@@ -465,5 +584,10 @@ export function injectBaseSearch() {
     availableLanguages,
     searchableLabels,
     activeSearchTerms,
+    currentLanguageId,
+    currentPrimaryLanguageId,
+    languageOptions,
+    enabledLanguageOptions,
+    removeSearchTerm,
   };
 }
diff --git a/packages/kolibri/utils/i18n.js b/packages/kolibri/utils/i18n.js
index 769cb5f368c..cc9ce41e07b 100644
--- a/packages/kolibri/utils/i18n.js
+++ b/packages/kolibri/utils/i18n.js
@@ -1,4 +1,5 @@
 import has from 'lodash/has';
+import isString from 'lodash/isString';
 import Vue from 'vue';
 import logger from 'kolibri-logging';
 import plugin_data from 'kolibri-plugin-data';
@@ -32,15 +33,30 @@ const contentLanguageCodes = {
   yo: ['yor'],
 };
 
-export const getContentLangActive = language => {
-  const langCode = languageIdToCode(currentLanguage);
+export const getContentLangActive = (language, comparisonLanguage = currentLanguage) => {
+  if (isString(language)) {
+    // If the language is a string, assume it's a language code
+    // convert to object format
+    language = {
+      id: language,
+      lang_code: languageIdToCode(language),
+    };
+  }
+  const langCode = languageIdToCode(comparisonLanguage);
   const additionalCodes = contentLanguageCodes[langCode] || [];
-  if (language.id.toLowerCase() === currentLanguage.toLowerCase()) {
-    // Best possible match, return a 2 to have it still be truthy, but distinguishable
-    // from a 1 which is a lang_code match
+  if (language.id.toLowerCase() === comparisonLanguage.toLowerCase()) {
+    // Best possible match, return a 3 to sort first
+    // Exact match between content and the language the user is using
+    return 3;
+  }
+  if (language.id === langCode || additionalCodes.includes(language.id)) {
+    // Here the language for the content has no region code, and we have an exact
+    // match with the language we are using.
     return 2;
   }
   if (language.lang_code === langCode || additionalCodes.includes(language.lang_code)) {
+    // Here the language for the content has a region code, but the language itself
+    // matches, even if the region is different.
     return 1;
   }
   return 0;