Update the Plan > Lessons landing page to align with new information architecture

[marcellamaki]

Overview

For our information architecture restructuring, we are going to be "squishing together" some of our current pages and components to move us to a different page naming system and organization.

Prerequisites

• Run Kolibri or kolibri-demo locally to get familiar with the current state of the UX/UI. Make sure you are rebased on top of develop and that you see the new lessonstemp path.

Diff - current state vs new state

Plan	Reports

The new landing page for lessons will combine elements from each to be available at a glance:

Tasks

• Following the /lessonstemp/ routes pattern, create a /lessonstemp route that functions as the temporary "root" lessons page, or landing page, for the lessons at a glance
• The component should be the LessonsRootPage, just like:

{
    name: LessonsPageNames.PLAN_LESSONS_ROOT,
    path: path(OPTIONAL_CLASS, ALL_LESSONS),
    component: LessonsRootPage,
    handler(toRoute, fromRoute, next) {
      if (classIdParamRequiredGuard(toRoute, PageNames.PLAN_PAGE, next)) {
        return;
      }
      showLessonsRootPage(store, toRoute.params.classId);
    },
    meta: {
      titleParts: ['lessonsLabel', 'CLASS_NAME'],
    },
  },

• Update the table used in LessonsRootPage to include "progress" from reports to the main table; use the same empty states as in report when data is not available (or not yet ready)
• Add a placeholder to filter by recipients - the filtering action will be done in follow up
• Add class title at the top of the UI
• include the "view learner devices" and print and download option buttons from the reports

Acceptance Criteria

• all tasks above are completed
• all "report" data is available in the table at a glance
• All UI adjustments to be aligned to the new spec (i.e. moving the "new quiz" button, adding top/bottom borders for table rows for readability, updating or removing strings and titles, etc.)
• The changes do not break the current state of develop, at /plan/lessons

Out of scope

• Removing the KTabsPanel or updating the main navigation titles