BUM: Improved user creation

kolibri/core/auth/api.py

@@ -31,6 +31,7 @@
 from django_filters.rest_framework import BaseInFilter
 from django_filters.rest_framework import CharFilter
 from django_filters.rest_framework import ChoiceFilter
+from django_filters.rest_framework import DateTimeFilter
 from django_filters.rest_framework import DjangoFilterBackend
 from django_filters.rest_framework import FilterSet
 from django_filters.rest_framework import ModelChoiceFilter
@@ -317,6 +318,14 @@ class FacilityUserFilter(FilterSet):
         choices=USER_TYPE_CHOICES,
         method="filter_exclude_user_type",
     )
+    date_joined__gt = DateTimeFilter(
+        field_name="date_joined",
+        lookup_expr="gt",
+    )
+    date_joined__lt = DateTimeFilter(
+        field_name="date_joined",
+        lookup_expr="lt",
+    )
     by_ids = UUIDInFilter(field_name="id")
 
     def filter_member_of(self, queryset, name, value):
@@ -363,6 +372,8 @@ class Meta:
             "exclude_member_of",
             "exclude_user_type",
             "by_ids",
+            "date_joined__gt",
+            "date_joined__lt",
         ]
 
 

kolibri/plugins/coach/assets/src/views/quizzes/CreateExamPage/index.vue

@@ -118,7 +118,7 @@
   import { ref, getCurrentInstance } from 'vue';
   import pickBy from 'lodash/pickBy';
   import BottomAppBar from 'kolibri/components/BottomAppBar';
-  import commonCoreStrings from 'kolibri/uiText/commonCoreStrings';
+  import commonCoreStrings, { coreStrings } from 'kolibri/uiText/commonCoreStrings';
   import { enhancedQuizManagementStrings } from 'kolibri-common/strings/enhancedQuizManagementStrings';
   import useSnackbar from 'kolibri/composables/useSnackbar';
   import { PageNames } from '../../../constants';
@@ -159,7 +159,6 @@
       initClassInfo().then(() => store.dispatch('notLoading'));
 
       const {
-        saveAndClose$,
         allSectionsEmptyWarning$,
         changesSavedSuccessfully$,
         sectionOrderLabel$,
@@ -170,6 +169,7 @@
       } = enhancedQuizManagementStrings;
 
       const { closeConfirmationTitle$, closeConfirmationMessage$ } = coachStrings;
+      const { saveAndClose$ } = coreStrings;
 
       return {
         closeConfirmationTitle$,

kolibri/plugins/facility/assets/src/composables/useUserManagement.js

@@ -1,10 +1,11 @@
-import { ref, computed, getCurrentInstance, watch } from 'vue';
 import pickBy from 'lodash/pickBy';
+import isEqual from 'lodash/isEqual';
+import { ref, computed, getCurrentInstance, watch } from 'vue';
 import FacilityUserResource from 'kolibri-common/apiResources/FacilityUserResource';
 import ClassroomResource from 'kolibri-common/apiResources/ClassroomResource';
 import { _userState } from '../modules/mappers';
 
-export default function useUserManagement(activeFacilityId) {
+export default function useUserManagement({ activeFacilityId, dateJoinedGt } = {}) {
   const facilityUsers = ref([]);
   const totalPages = ref(0);
   const usersCount = ref(0);
@@ -26,6 +27,7 @@ export default function useUserManagement(activeFacilityId) {
       const resp = await FacilityUserResource.fetchCollection({
         getParams: pickBy({
           member_of: activeFacilityId,
+          date_joined__gt: dateJoinedGt?.toISOString(),
           page: page.value,
           page_size: pageSize.value,
           search: search.value?.trim() || null,
@@ -60,8 +62,10 @@ export default function useUserManagement(activeFacilityId) {
   // re-running fetchUsers whenever the relevant query params change
   watch(
     () => [page.value, pageSize.value, search.value, userType.value, ordering.value, order.value],
-    () => {
-      fetchUsers();
+    (newFilters, oldFilters) => {
+      if (!isEqual(newFilters, oldFilters)) {
+        fetchUsers();
+      }
     },
     { immediate: true },
   );

kolibri/plugins/facility/assets/src/constants.js

@@ -5,16 +5,24 @@ export const PageNames = {
   CLASS_ASSIGN_COACH: 'CLASS_ASSIGN_COACH',
   USER_MGMT_PAGE: 'USER_MGMT_PAGE',
   USER_CREATE_PAGE: 'USER_CREATE_PAGE',
+  NEW_USERS_PAGE: 'NEW_USERS_PAGE',
   USER_EDIT_PAGE: 'USER_EDIT_PAGE',
   IMPORT_CSV_PAGE: 'IMPORT_CSV_PAGE',
   DATA_EXPORT_PAGE: 'DATA_EXPORT_PAGE',
   FACILITY_CONFIG_PAGE: 'FACILITY_CONFIG_PAGE',
   ALL_FACILITIES_PAGE: 'ALL_FACILITIES_PAGE',
   MOVE_TO_TRASH_TRASH_SIDE_PANEL: 'MOVE_TO_TRASH_TRASH_SIDE_PANEL',
+  MOVE_TO_TRASH_TRASH_SIDE_PANEL__NEW_USERS: 'MOVE_TO_TRASH_TRASH_SIDE_PANEL__NEW_USERS',
   FILTER_USERS_SIDE_PANEL: 'FILTER_USERS_SIDE_PANEL',
+  FILTER_USERS_SIDE_PANEL__NEW_USERS: 'FILTER_USERS_SIDE_PANEL__NEW_USERS',
+  ADD_NEW_USER_SIDE_PANEL: 'ADD_NEW_USER_SIDE_PANEL',
+  ADD_NEW_USER_SIDE_PANEL__NEW_USERS: 'ADD_NEW_USER_SIDE_PANEL__NEW_USERS',
   ASSIGN_COACHES_SIDE_PANEL: 'ASSIGN_COACHES_SIDE_PANEL',
+  ASSIGN_COACHES_SIDE_PANEL__NEW_USERS: 'ASSIGN_COACHES_SIDE_PANEL__NEW_USERS',
   REMOVE_FROM_CLASSES_SIDE_PANEL: 'REMOVE_FROM_CLASSES_SIDE_PANEL',
+  REMOVE_FROM_CLASSES_SIDE_PANEL__NEW_USERS: 'REMOVE_FROM_CLASSES_SIDE_PANEL__NEW_USERS',
   ENROLL_LEARNERS_SIDE_PANEL: 'ENROLL_LEARNERS_SIDE_PANEL',
+  ENROLL_LEARNERS_SIDE_PANEL__NEW_USERS: 'ENROLL_LEARNERS_SIDE_PANEL__NEW_USERS',
 };
 
 // modal names
@@ -60,3 +68,8 @@ export const UsersExportStatuses = {
   EXPORTING: 'EXPORTING',
   FINISHED: 'FINISHED',
 };
+
+export const ClassesActions = {
+  ENROLL_LEARNER: 'ENROLL_LEARNER',
+  ASSIGN_COACH: 'ASSIGN_COACH',
+};

kolibri/plugins/facility/assets/src/modules/pluginModule.js

@@ -26,7 +26,7 @@ export default {
       // big list of facility users for duplicate-username validation
       if (
         fromRoute.name === PageNames.USER_MGMT_PAGE &&
-        (toRoute.name === PageNames.USER_CREATE_PAGE || toRoute.name === PageNames.USER_EDIT_PAGE)
+        toRoute.name === PageNames.USER_EDIT_PAGE
       ) {
         return;
       }
@@ -82,7 +82,7 @@ export default {
           params,
         },
         UserCreatePage: {
-          name: PageNames.USER_CREATE_PAGE,
+          name: PageNames.ADD_NEW_USER_SIDE_PANEL__NEW_USERS,
           params,
         },
         UserEditPage: {

kolibri/plugins/facility/assets/src/routes.js

@@ -12,8 +12,8 @@ import DataPage from './views/DataPage';
 import ImportCsvPage from './views/ImportCsvPage';
 import FacilityConfigPage from './views/FacilityConfigPage';
 import ManageClassPage from './views/ManageClassPage';
-import UserPage from './views/UserPage';
-import UserCreatePage from './views/UserCreatePage';
+import UsersRootPage from './views/users/UsersRootPage';
+import NewUsersPage from './views/users/NewUsersPage.vue';
 import UserEditPage from './views/UserEditPage';
 import AllFacilitiesPage from './views/AllFacilitiesPage';
 import { showClassesPage } from './modules/classManagement/handlers';
@@ -77,28 +77,41 @@ export default [
   },
   {
     name: PageNames.USER_MGMT_PAGE,
-    component: UserPage,
+    component: UsersRootPage,
     path: '/:facility_id?/users/',
     handler: toRoute => {
-      if (facilityParamRequiredGuard(toRoute, UserPage.name)) {
+      if (facilityParamRequiredGuard(toRoute, UsersRootPage.name)) {
         return;
       }
     },
-    children: getSidePanelRoutes(
+    children: getSidePanelRoutes([
       PageNames.MOVE_TO_TRASH_TRASH_SIDE_PANEL,
       PageNames.FILTER_USERS_SIDE_PANEL,
       PageNames.ASSIGN_COACHES_SIDE_PANEL,
       PageNames.REMOVE_FROM_CLASSES_SIDE_PANEL,
       PageNames.ENROLL_LEARNERS_SIDE_PANEL,
-    ),
+    ]),
   },
   {
-    name: PageNames.USER_CREATE_PAGE,
-    component: UserCreatePage,
-    path: '/:facility_id?/users/new',
-    handler: () => {
-      store.dispatch('preparePage', { isAsync: false });
+    name: PageNames.NEW_USERS_PAGE,
+    component: NewUsersPage,
+    path: '/:facility_id?/users/new-users',
+    handler: toRoute => {
+      if (facilityParamRequiredGuard(toRoute, NewUsersPage.name)) {
+        return;
+      }
     },
+    children: getSidePanelRoutes(
+      [
+        PageNames.MOVE_TO_TRASH_TRASH_SIDE_PANEL,
+        PageNames.FILTER_USERS_SIDE_PANEL,
+        PageNames.ASSIGN_COACHES_SIDE_PANEL,
+        PageNames.REMOVE_FROM_CLASSES_SIDE_PANEL,
+        PageNames.ENROLL_LEARNERS_SIDE_PANEL,
+        PageNames.ADD_NEW_USER_SIDE_PANEL,
+      ],
+      'NEW_USERS',
+    ),
   },
   {
     name: PageNames.USER_EDIT_PAGE,

kolibri/plugins/facility/assets/src/utils.js

@@ -3,11 +3,12 @@ import { isNavigationFailure, NavigationFailureType } from 'vue-router';
 import logger from 'kolibri-logging';
 import useFacilities from 'kolibri-common/composables/useFacilities';
 import { PageNames } from './constants';
-import MoveToTrashSidePanel from './views/UserPage/SidePanels/MoveToTrashSidePanel';
-import FilterUsersSidePanel from './views/UserPage/SidePanels/FilterUsersSidePanel';
-import AssignCoachesSidePanel from './views/UserPage/SidePanels/AssignCoachesSidePanel';
-import RemoveFromClassSidePanel from './views/UserPage/SidePanels/RemoveFromClassSidePanel';
-import EnrollLearnersSidePanel from './views/UserPage/SidePanels/EnrollLearnersSidePanel';
+import UserCreateSidePanel from './views/users/sidePanels/UserCreate/index.vue';
+import MoveToTrashSidePanel from './views/users/sidePanels/MoveToTrashSidePanel';
+import FilterUsersSidePanel from './views/users/sidePanels/FilterUsersSidePanel';
+import AssignCoachesSidePanel from './views/users/sidePanels/AssignCoachesSidePanel';
+import RemoveFromClassSidePanel from './views/users/sidePanels/RemoveFromClassSidePanel';
+import EnrollLearnersSidePanel from './views/users/sidePanels/EnrollLearnersSidePanel';
 
 const logging = logger.getLogger(__filename);
 
@@ -29,6 +30,22 @@ export function facilityParamRequiredGuard(toRoute, subtopicName) {
   }
 }
 
+export function overrideRoute(route, newRoute) {
+  // Override the route with a new one, preserving the params and query
+  const { params, query } = route;
+  return {
+    ...newRoute,
+    params: {
+      ...params,
+      ...newRoute.params,
+    },
+    query: {
+      ...query,
+      ...newRoute.query,
+    },
+  };
+}
+
 const sidePanelRoutes = [
   {
     name: PageNames.MOVE_TO_TRASH_TRASH_SIDE_PANEL,
@@ -55,9 +72,21 @@ const sidePanelRoutes = [
     path: 'enroll-learners',
     component: EnrollLearnersSidePanel,
   },
+  {
+    name: PageNames.ADD_NEW_USER_SIDE_PANEL,
+    path: 'new',
+    component: UserCreateSidePanel,
+  },
 ];
 
-export function getSidePanelRoutes(...pageNames) {
+export function getSidePanelRoutes(pageNames, suffix = '') {
   const pages = new Set(pageNames);
-  return sidePanelRoutes.filter(route => pages.has(route.name));
+  const routes = sidePanelRoutes.filter(route => pages.has(route.name));
+  if (!suffix) {
+    return routes;
+  }
+  return routes.map(route => ({
+    ...route,
+    name: `${route.name}__${suffix}`,
+  }));
 }