@clickview/lite 0.0.24-rc.4 → 0.0.24

package/dist/scripts/31.chunk.js

@@ -1,571 +1,396 @@
 (window["webpackJsonp_clickview_lite"] = window["webpackJsonp_clickview_lite"] || []).push([[31],{
 
-/***/ "../../libs/shared/src/apps/subjects/components/preferences/nav/PreferencesNav.tsx":
-/*!*****************************************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/subjects/components/preferences/nav/PreferencesNav.tsx ***!
-  \*****************************************************************************************************************************/
-/*! exports provided: PreferencesNav */
+/***/ "../../libs/shared/src/components/div-button/DivButton.tsx":
+/*!*****************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/div-button/DivButton.tsx ***!
+  \*****************************************************************************************************/
+/*! exports provided: DivButton */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PreferencesNav", function() { return PreferencesNav; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DivButton", function() { return DivButton; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _components_app_link_AppLink__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../components/app-link/AppLink */ "../../libs/shared/src/components/app-link/AppLink.tsx");
-/* harmony import */ var _preferences_nav_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./preferences-nav.scss */ "../../libs/shared/src/apps/subjects/components/preferences/nav/preferences-nav.scss");
-/* harmony import */ var _preferences_nav_scss__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_preferences_nav_scss__WEBPACK_IMPORTED_MODULE_2__);
 
+/**
+ * This element lets us use `div` elements as buttons without losing the accessibility of
+ * a regular HTML button element
+ */
+
+function DivButton(props) {
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    role: 'button',
+    tabIndex: 0,
+    className: "".concat(props.className ? props.className : '', " cursor-pointer"),
+    onKeyDown: function onKeyDown(e) {
+      return e.key === 'Enter' && props.onClick(e);
+    },
+    onClick: props.onClick,
+    style: props.style ? props.style : {}
+  }, props.children);
+}
 
+/***/ }),
 
+/***/ "../../libs/shared/src/hooks/UseAlerts.ts":
+/*!************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/UseAlerts.ts ***!
+  \************************************************************************************/
+/*! exports provided: useAlerts */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-function getClass(active, disabled) {
-  var baseClasses = 'rounded-circle mx-2 ' + _preferences_nav_scss__WEBPACK_IMPORTED_MODULE_2___default.a.progressItem;
-  var colourClass = active ? 'bg-info' : 'bg-light';
-  var disabledClass = disabled || active ? '' : 'cursor-pointer';
-  return "".concat(baseClasses, " ").concat(colourClass, " ").concat(disabledClass);
-}
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useAlerts", function() { return useAlerts; });
+/* harmony import */ var _common_src_react_hooks_UseService__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/react/hooks/UseService */ "../../libs/common/src/react/hooks/UseService.ts");
+/* harmony import */ var _common_src_backbone_services_BaseAlertService__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/src/backbone/services/BaseAlertService */ "../../libs/common/src/backbone/services/BaseAlertService.ts");
+/* harmony import */ var _common_src_backbone_constants_CommonServices__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../common/src/backbone/constants/CommonServices */ "../../libs/common/src/backbone/constants/CommonServices.ts");
+
+
+
+var useAlerts = function useAlerts() {
+  var alertService = Object(_common_src_react_hooks_UseService__WEBPACK_IMPORTED_MODULE_0__["useService"])(_common_src_backbone_constants_CommonServices__WEBPACK_IMPORTED_MODULE_2__["CommonServices"].ALERT);
+  return {
+    success: function success(alertContent) {
+      alertService.success(alertContent)();
+    },
+    error: function error(alertContent) {
+      alertService.error(alertContent)();
+    },
+    warning: function warning(alertContent) {
+      alertService.createAlert({
+        type: _common_src_backbone_services_BaseAlertService__WEBPACK_IMPORTED_MODULE_1__["AlertType"].Warning,
+        heading: _common_src_backbone_services_BaseAlertService__WEBPACK_IMPORTED_MODULE_1__["DefaultAlertHeading"].Warning,
+        message: alertContent
+      });
+    }
+  };
+};
 
-function PreferencesNav(props) {
-  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("nav", {
-    className: "d-flex justify-content-center pt-3 position-relative ".concat(_preferences_nav_scss__WEBPACK_IMPORTED_MODULE_2___default.a.progress)
-  }, props.steps.map(function (step, i) {
-    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_app_link_AppLink__WEBPACK_IMPORTED_MODULE_1__["AppLink"], {
-      key: i,
-      appLink: step.disabled || step.active ? null : step.appLink,
-      className: getClass(step.active, step.disabled)
-    });
-  }));
+/***/ }),
+
+/***/ "./src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx":
+/*!***************************************************************************************************!*\
+  !*** ./src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx ***!
+  \***************************************************************************************************/
+/*! exports provided: ClassroomGroupDetailsForm */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ClassroomGroupDetailsForm", function() { return ClassroomGroupDetailsForm; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var formik__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! formik */ "../../../node_modules/formik/dist/formik.esm.js");
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _libs_shared_src_components_forms_form_field_FormField__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-field/FormField */ "../../libs/shared/src/components/forms/form-field/FormField.tsx");
+/* harmony import */ var _libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-wrapper/FormWrapper */ "../../libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx");
+/* harmony import */ var _libs_shared_src_components_forms_form_buttons_FormButtons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-buttons/FormButtons */ "../../libs/shared/src/components/forms/form-buttons/FormButtons.tsx");
+/* harmony import */ var _libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/text/Text */ "../../libs/shared/src/components/text/Text.tsx");
+/* harmony import */ var apps_classrooms_components_colour_picker_ColourPicker__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! apps/classrooms/components/colour-picker/ColourPicker */ "./src/apps/classrooms/components/colour-picker/ColourPicker.tsx");
+/* harmony import */ var _classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./classroom-group-details-form.scss */ "./src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss");
+/* harmony import */ var _classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8__);
+
+
+
+
+
+
+
+
+
+var namespace = 'classrooms.classroomGroupDetailsForm';
+var getPhrase = _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].encloseNamespace(namespace);
+function ClassroomGroupDetailsForm(props) {
+  var formikProps = Object(_libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_4__["useFormikContextWrapper"])();
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("h2", {
+    className: 'w-50 d-inline-block h6'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__["Text"], {
+    namespace: namespace,
+    phrase: 'nameLabel'
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("h2", {
+    className: 'd-inline-block h6'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__["Text"], {
+    namespace: namespace,
+    phrase: 'colourLabel'
+  }))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(formik__WEBPACK_IMPORTED_MODULE_1__["Form"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'pb-3 d-flex'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'w-50'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_forms_form_field_FormField__WEBPACK_IMPORTED_MODULE_3__["FormField"], {
+    type: 'text',
+    name: 'name',
+    id: 'name',
+    className: "".concat(_classroom_group_details_form_scss__WEBPACK_IMPORTED_MODULE_8___default.a.groupNameInput),
+    placeholder: getPhrase('groupNamePlaceholder'),
+    autoFocus: true,
+    value: formikProps.values.name
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'form-group'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(apps_classrooms_components_colour_picker_ColourPicker__WEBPACK_IMPORTED_MODULE_7__["ColourPicker"], {
+    onSelect: function onSelect(c) {
+      return formikProps.setFieldValue('colour', c);
+    },
+    selection: formikProps.values.colour,
+    id: "".concat(props.isNew ? 'create' : 'edit', "-classroom-group")
+  }))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: 'btn-container d-flex justify-content-end'
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("button", {
+    type: 'button',
+    className: 'btn btn-link mr-2',
+    onClick: props.onClickCancel
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_text_Text__WEBPACK_IMPORTED_MODULE_6__["Text"], {
+    namespace: namespace,
+    phrase: 'cancel'
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_forms_form_buttons_FormButtons__WEBPACK_IMPORTED_MODULE_5__["FormButtons"], {
+    isNew: props.isNew
+  }))));
 }
 
 /***/ }),
 
-/***/ "../../libs/shared/src/apps/subjects/components/preferences/nav/preferences-nav.scss":
-/*!*******************************************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/subjects/components/preferences/nav/preferences-nav.scss ***!
-  \*******************************************************************************************************************************/
+/***/ "./src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss":
+/*!*******************************************************************************************************!*\
+  !*** ./src/apps/classrooms/components/classroom-group-details-form/classroom-group-details-form.scss ***!
+  \*******************************************************************************************************/
 /*! no static exports found */
 /***/ (function(module, exports, __webpack_require__) {
 
 // extracted by mini-css-extract-plugin
-module.exports = {"progress":"cv--progress--iKcwJ","progressItem":"cv--progressItem--1SBXD"};
+module.exports = {"groupNameInput":"cv--groupNameInput--3hGvq"};
 
 /***/ }),
 
-/***/ "../../libs/shared/src/apps/subjects/utils/OnboardingHelper.ts":
-/*!*********************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/subjects/utils/OnboardingHelper.ts ***!
-  \*********************************************************************************************************/
-/*! exports provided: OnboardingHelper */
+/***/ "./src/apps/classrooms/components/colour-picker/ColourPicker.tsx":
+/*!***********************************************************************!*\
+  !*** ./src/apps/classrooms/components/colour-picker/ColourPicker.tsx ***!
+  \***********************************************************************/
+/*! exports provided: ColourPicker */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "OnboardingHelper", function() { return OnboardingHelper; });
-/* harmony import */ var _enums_PresentationType__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../enums/PresentationType */ "../../libs/shared/src/enums/PresentationType.ts");
-/* harmony import */ var _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../enums/BulkOnboardingPreferencesState */ "../../libs/shared/src/enums/BulkOnboardingPreferencesState.ts");
-
-
-var OnboardingHelper = {
-  getIsStep: function getIsStep(currentStep) {
-    return function (steps) {
-      return Array.isArray(steps) ? steps.includes(currentStep) : currentStep === steps;
-    };
-  },
-  hasManyPresentationTypes: function hasManyPresentationTypes() {
-    var presentations = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-    var totalAvailableSubjectPresentations = 0;
-    var totalAvailableCurriculumPresentations = 0;
-    presentations.forEach(function (p) {
-      if (p.type.toLowerCase() === _enums_PresentationType__WEBPACK_IMPORTED_MODULE_0__["PresentationType"].Subject) totalAvailableSubjectPresentations++;else if (p.type.toLowerCase() === _enums_PresentationType__WEBPACK_IMPORTED_MODULE_0__["PresentationType"].Curriculum) totalAvailableCurriculumPresentations++;
-    });
-    /**
-     * The checks for "> 1" are done because we _only_ want to display presentation selectors
-     * if the user has more than 1 presentation to select from. If they only have 1 available,
-     * then that will always be used by default and they don't have to make any decisions.
-     */
-
-    return {
-      hasManySubjectPresentations: totalAvailableSubjectPresentations > 1,
-      hasManyCurriculumPresentations: totalAvailableCurriculumPresentations > 1
-    };
-  },
-  getBulkPreferencesState: function getBulkPreferencesState(state) {
-    if (state === _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__["BulkOnboardingPreferencesState"].AllSubjectsAndAllLevels) return {
-      levels: true,
-      subjects: true
-    };
-    return {
-      levels: state === _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__["BulkOnboardingPreferencesState"].AllLevels,
-      subjects: state === _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__["BulkOnboardingPreferencesState"].AllSubjects
-    };
-  },
-  stepIsValid: function stepIsValid(step) {
-    return ['welcome', 'subjects', 'levels', 'summary', 'school-level', 'curriculum'].indexOf(step) !== -1;
-  },
-  hasBulkSelectedLevels: function hasBulkSelectedLevels(bulkState) {
-    return bulkState === _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__["BulkOnboardingPreferencesState"].AllLevels || bulkState === _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__["BulkOnboardingPreferencesState"].AllSubjectsAndAllLevels;
-  },
-  hasBulkSelectedSubjects: function hasBulkSelectedSubjects(bulkState) {
-    return bulkState === _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__["BulkOnboardingPreferencesState"].AllSubjects || bulkState === _enums_BulkOnboardingPreferencesState__WEBPACK_IMPORTED_MODULE_1__["BulkOnboardingPreferencesState"].AllSubjectsAndAllLevels;
-  }
-};
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ColourPicker", function() { return ColourPicker; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-bootstrap */ "react-bootstrap");
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _libs_shared_src_components_div_button_DivButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/div-button/DivButton */ "../../libs/shared/src/components/div-button/DivButton.tsx");
+/* harmony import */ var _libs_shared_src_components_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/svg-container/SvgContainer */ "../../libs/shared/src/components/svg-container/SvgContainer.tsx");
+/* harmony import */ var _libs_shared_src_utils_SvgHelper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/utils/SvgHelper */ "../../libs/shared/src/utils/SvgHelper.ts");
+/* harmony import */ var apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! apps/classrooms/enums/GroupColour */ "./src/apps/classrooms/enums/GroupColour.ts");
+/* harmony import */ var apps_classrooms_utils_GroupHelper__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! apps/classrooms/utils/GroupHelper */ "./src/apps/classrooms/utils/GroupHelper.ts");
+/* harmony import */ var _colour_picker_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./colour-picker.scss */ "./src/apps/classrooms/components/colour-picker/colour-picker.scss");
+/* harmony import */ var _colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7__);
 
-/***/ }),
 
-/***/ "../../libs/shared/src/enums/BulkOnboardingPreferencesState.ts":
-/*!*********************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/enums/BulkOnboardingPreferencesState.ts ***!
-  \*********************************************************************************************************/
-/*! exports provided: BulkOnboardingPreferencesState */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BulkOnboardingPreferencesState", function() { return BulkOnboardingPreferencesState; });
-var BulkOnboardingPreferencesState;
 
-(function (BulkOnboardingPreferencesState) {
-  BulkOnboardingPreferencesState[BulkOnboardingPreferencesState["None"] = 0] = "None";
-  BulkOnboardingPreferencesState[BulkOnboardingPreferencesState["AllSubjects"] = 1] = "AllSubjects";
-  BulkOnboardingPreferencesState[BulkOnboardingPreferencesState["AllLevels"] = 2] = "AllLevels";
-  BulkOnboardingPreferencesState[BulkOnboardingPreferencesState["AllSubjectsAndAllLevels"] = 3] = "AllSubjectsAndAllLevels";
-})(BulkOnboardingPreferencesState || (BulkOnboardingPreferencesState = {}));
 
-/***/ }),
 
-/***/ "../../libs/shared/src/enums/PresentationType.ts":
-/*!*******************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/enums/PresentationType.ts ***!
-  \*******************************************************************************************/
-/*! exports provided: PresentationType */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PresentationType", function() { return PresentationType; });
-var PresentationType;
 
-(function (PresentationType) {
-  PresentationType["Subject"] = "subject";
-  PresentationType["Curriculum"] = "curriculum";
-})(PresentationType || (PresentationType = {}));
+ColourPicker.defaultProps = {
+  selection: apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"].White,
+  onSelect: function onSelect() {}
+};
+function ColourPicker(props) {
+  function getToggleButtonClass() {
+    var baseClass = "".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.dropdownToggle, " outline-none p-0 d-flex align-items-center text-decoration-none");
+    var disabledClass = props.disabled ? 'cursor-default' : '';
+    return "".concat(baseClass, " ").concat(disabledClass);
+  }
+
+  function getOptionClass(colour) {
+    var baseClass = "".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.colourOption, " position-relative");
+    var borderClass = colour === apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"].White ? 'border border-dark' : '';
+    var disabledClass = props.disabled ? 'cursor-default' : '';
+    var colorClass = Object(apps_classrooms_utils_GroupHelper__WEBPACK_IMPORTED_MODULE_6__["mapColourToClassName"])(colour);
+    return "".concat(baseClass, " ").concat(borderClass, " ").concat(disabledClass, " ").concat(colorClass);
+  }
+
+  var dropdownProps = {};
+  if (props.disabled) dropdownProps.show = false;
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"], Object.assign({}, dropdownProps), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"].Toggle, {
+    id: props.id,
+    variant: 'link',
+    className: getToggleButtonClass()
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: "border border-secondary rounded bg-white ".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.colourButton)
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+    className: "px-0 py-1 rounded ".concat(Object(apps_classrooms_utils_GroupHelper__WEBPACK_IMPORTED_MODULE_6__["mapColourToClassName"])(props.selection))
+  }, "\xA0")), !props.disabled && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_3__["SvgContainer"], {
+    svgName: _libs_shared_src_utils_SvgHelper__WEBPACK_IMPORTED_MODULE_4__["cvSvgLibrary"].Caret
+  })), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"].Menu, null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("ul", {
+    className: "".concat(_colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.colourList, " list-unstyled d-flex flex-wrap px-2 m-0")
+  }, Object.keys(apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"]).map(function (colourKey) {
+    var colour = apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"][colourKey];
+    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("li", {
+      key: "".concat(props.id, ":").concat(colour),
+      className: 'm-1'
+    }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_div_button_DivButton__WEBPACK_IMPORTED_MODULE_2__["DivButton"], {
+      onClick: function onClick() {
+        return props.onSelect(colour);
+      },
+      className: getOptionClass(colour)
+    }, colour === apps_classrooms_enums_GroupColour__WEBPACK_IMPORTED_MODULE_5__["GroupColour"].White ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
+      className: _colour_picker_scss__WEBPACK_IMPORTED_MODULE_7___default.a.lineThrough
+    }) : react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null, "\xA0")));
+  }))));
+}
 
 /***/ }),
 
-/***/ "../../libs/shared/src/flight-requests/PreferenceRequests.ts":
-/*!*******************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/flight-requests/PreferenceRequests.ts ***!
-  \*******************************************************************************************************/
-/*! exports provided: PreferenceRequests */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
+/***/ "./src/apps/classrooms/components/colour-picker/colour-picker.scss":
+/*!*************************************************************************!*\
+  !*** ./src/apps/classrooms/components/colour-picker/colour-picker.scss ***!
+  \*************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
 
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PreferenceRequests", function() { return PreferenceRequests; });
-/* harmony import */ var _common_src_backbone_utils_UrlHelper__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/backbone/utils/UrlHelper */ "../../libs/common/src/backbone/utils/UrlHelper.ts");
-/* harmony import */ var _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/src/backbone/enums/HttpVerbs */ "../../libs/common/src/backbone/enums/HttpVerbs.ts");
-/* harmony import */ var _constants_WithStatements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../constants/WithStatements */ "../../libs/shared/src/constants/WithStatements.ts");
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-
-
-
-var classificationQuery = _constants_WithStatements__WEBPACK_IMPORTED_MODULE_2__["SharedWithStatements"].CLASSIFICATION;
-var endpoints = {
-  // Subjects
-  allSubjectPreferences: function allSubjectPreferences() {
-    return "/api/domain/v1/subjects/preferences?query=".concat(classificationQuery, "&type=subject");
-  },
-  mySubjectPreferences: function mySubjectPreferences() {
-    return "/api/domain/v1/subjects/classifications/following?query=".concat(classificationQuery);
-  },
-  followSubjects: function followSubjects() {
-    return '/api/domain/v1/subjects/classifications/following';
-  },
-  unfollowSubjects: function unfollowSubjects(ids) {
-    return _common_src_backbone_utils_UrlHelper__WEBPACK_IMPORTED_MODULE_0__["UrlHelper"].urlBuilder('/api/domain/v1/subjects/classifications/following', {
-      id: ids
-    });
-  },
-  // Levels
-  allLevelPreferences: function allLevelPreferences() {
-    return "/api/domain/v1/subjects/audiences?type=subject";
-  },
-  myLevelPreferences: function myLevelPreferences() {
-    return "/api/domain/v1/subjects/audiences/following";
-  },
-  followLevels: function followLevels() {
-    return "/api/domain/v1/subjects/audiences/following";
-  },
-  unfollowLevels: function unfollowLevels(ids) {
-    return _common_src_backbone_utils_UrlHelper__WEBPACK_IMPORTED_MODULE_0__["UrlHelper"].urlBuilder('/api/domain/v1/subjects/audiences/following', {
-      id: ids
-    });
-  },
-  // School Level
-  getSchoolLevels: function getSchoolLevels() {
-    return "/api/domain/v1/subjects/school-level";
-  },
-  getSelectedSchoolLevel: function getSelectedSchoolLevel(userId) {
-    return "/api/domain/v1/subjects/school-level/".concat(userId);
-  },
-  setSchoolLevel: function setSchoolLevel() {
-    return '/api/domain/v1/subjects/school-level';
-  },
-  // Curriculum
-  getCurriculums: function getCurriculums() {
-    return "/api/domain/v1/subjects/curriculum";
-  },
-  getSelectedCurriculum: function getSelectedCurriculum(userId) {
-    return "/api/domain/v1/subjects/school-level/".concat(userId);
-  },
-  setCurriculum: function setCurriculum() {
-    return '/api/domain/v1/subjects/curriculum';
-  },
-  getCurrentPresentations: function getCurrentPresentations(type) {
-    return "/api/domain/v1/subjects/presentations".concat(type ? "?type=".concat(type) : '');
-  },
-  getAvailablePresentations: function getAvailablePresentations(type) {
-    return "/api/domain/v1/subjects/presentations/available".concat(type ? "?type=".concat(type) : '');
-  },
-  setPresentation: function setPresentation(id) {
-    return "/api/domain/v1/subjects/presentations/".concat(id);
-  }
-};
-var PreferenceRequests = {
-  /**
-   * Presentations
-   */
-  currentPresentations: function currentPresentations(type) {
-    return {
-      url: endpoints.getCurrentPresentations(type),
-      key: "current:presentations".concat(type ? ":".concat(type) : ''),
-      expiryTime: Infinity
-    };
-  },
-  availablePresentations: function availablePresentations(type) {
-    return {
-      url: endpoints.getAvailablePresentations(type),
-      key: "available:presentations:".concat(type),
-      expiryTime: Infinity
-    };
-  },
-  setPresentation: function setPresentation(presentation, type, success) {
-    return {
-      url: endpoints.setPresentation(presentation.id),
-      key: "set:".concat(type, ":presentation"),
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__["HttpVerbs"].POST,
-      data: {},
-      invalidationKeys: ["current:presentations:".concat(type), 'current:presentations', 'subject:preference:options', 'my:subject:preferences', 'level:preference:options', 'my:level:preferences'],
-      success: success
-    };
-  },
-
-  /**
-   * Subjects
-   */
-  allSubjectPreferences: function allSubjectPreferences() {
-    return {
-      url: endpoints.allSubjectPreferences(),
-      key: "subject:preference:options",
-      expiryTime: Infinity
-    };
-  },
-  mySubjectPreferences: function mySubjectPreferences(success) {
-    return {
-      url: endpoints.mySubjectPreferences(),
-      key: "my:subject:preferences",
-      normalize: false,
-      expiryTime: Infinity,
-      success: success,
-      formatData: function formatData(preferences) {
-        return preferences.filter(function (p) {
-          return p.canBePreferred;
-        });
-      }
-    };
-  },
-  followSubjects: function followSubjects(subjectIds, success, error, always) {
-    return {
-      url: endpoints.followSubjects(),
-      key: "follow:subjects",
-      data: subjectIds,
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__["HttpVerbs"].POST,
-      success: success,
-      error: error,
-      always: always,
-      invalidationKeys: [].concat(_toConsumableArray(subjectIds.map(function (id) {
-        return "classification:".concat(id);
-      })), ['my:subject:preferences'])
-    };
-  },
-  unfollowSubjects: function unfollowSubjects(subjectIds, success, error, always) {
-    return {
-      url: endpoints.unfollowSubjects(subjectIds),
-      key: "unfollow:subjects",
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__["HttpVerbs"].DELETE,
-      success: success,
-      error: error,
-      always: always,
-      invalidationKeys: [].concat(_toConsumableArray(subjectIds.map(function (id) {
-        return "classification:".concat(id);
-      })), ['my:subject:preferences'])
-    };
-  },
-
-  /**
-   * Levels
-   */
-  allLevelPreferences: function allLevelPreferences() {
-    return {
-      url: endpoints.allLevelPreferences(),
-      key: "level:preference:options",
-      normalize: false,
-      expiryTime: Infinity
-    };
-  },
-  myLevelPreferences: function myLevelPreferences(success) {
-    return {
-      url: endpoints.myLevelPreferences(),
-      key: "my:level:preferences",
-      normalize: false,
-      expiryTime: Infinity,
-      success: success
-    };
-  },
-  followLevels: function followLevels(levelIds, success, error, always) {
-    return {
-      url: endpoints.followLevels(),
-      key: "follow:levels",
-      data: levelIds,
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__["HttpVerbs"].POST,
-      success: success,
-      error: error,
-      always: always,
-      invalidationKeys: ['my:level:preferences']
-    };
-  },
-  unfollowLevels: function unfollowLevels(levelIds, success, error, always) {
-    return {
-      url: endpoints.unfollowLevels(levelIds),
-      key: "unfollow:levels",
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__["HttpVerbs"].DELETE,
-      success: success,
-      error: error,
-      always: always,
-      invalidationKeys: ['my:level:preferences']
-    };
-  }
-};
+// extracted by mini-css-extract-plugin
+module.exports = {"dropdownToggle":"cv--dropdownToggle--347DY","colourButton":"cv--colourButton--1rKvE","colourList":"cv--colourList--328-w","colourOption":"cv--colourOption--1Tw7u","lineThrough":"cv--lineThrough--18oZq"};
 
 /***/ }),
 
-/***/ "../../libs/shared/src/flight-requests/SettingRequests.ts":
-/*!****************************************************************************************************!*\
-  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/flight-requests/SettingRequests.ts ***!
-  \****************************************************************************************************/
-/*! exports provided: SettingRequests */
+/***/ "./src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx":
+/*!***************************************************************************************************!*\
+  !*** ./src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx ***!
+  \***************************************************************************************************/
+/*! exports provided: EditClassroomGroupDetails */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SettingRequests", function() { return SettingRequests; });
-/* harmony import */ var _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/react/utils/ArrayHelper */ "../../libs/common/src/react/utils/ArrayHelper.ts");
-/* harmony import */ var _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/src/backbone/enums/HttpVerbs */ "../../libs/common/src/backbone/enums/HttpVerbs.ts");
-
-
-var SettingRequests = {
-  setting: function setting(entityId, name) {
-    return {
-      key: "settings:".concat(entityId, ":").concat(name),
-      url: "/api/domain/v3/settings/".concat(entityId, "?type=").concat(name),
-      normalize: false,
-      formatData: function formatData(data) {
-        return _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_0__["ArrayHelper"].first(data);
-      }
-    };
-  },
-  updateSetting: function updateSetting(entityId, name, value, kind, success, error) {
-    return {
-      key: 'update:setting',
-      url: "/api/domain/v3/settings/".concat(entityId),
-      data: {
-        name: name,
-        value: value,
-        kind: kind
-      },
-      type: _common_src_backbone_enums_HttpVerbs__WEBPACK_IMPORTED_MODULE_1__["HttpVerbs"].PUT,
-      invalidationKeys: ["settings:".concat(entityId, ":").concat(name)],
-      success: success,
-      error: error
-    };
-  }
-};
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "EditClassroomGroupDetails", function() { return EditClassroomGroupDetails; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/forms/form-wrapper/FormWrapper */ "../../libs/shared/src/components/forms/form-wrapper/FormWrapper.tsx");
+/* harmony import */ var apps_classrooms_validation_ClassroomGroupValidationSchema__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! apps/classrooms/validation/ClassroomGroupValidationSchema */ "./src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts");
+/* harmony import */ var apps_classrooms_components_classroom_group_details_form_ClassroomGroupDetailsForm__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm */ "./src/apps/classrooms/components/classroom-group-details-form/ClassroomGroupDetailsForm.tsx");
+
+
+
+
+function EditClassroomGroupDetails(props) {
+  var _a, _b, _c;
+
+  var group = props.group,
+      saveGroup = props.saveGroup,
+      onClickCancel = props.onClickCancel;
+  var initialValues = {
+    id: (_a = group) === null || _a === void 0 ? void 0 : _a.id,
+    name: (_b = group) === null || _b === void 0 ? void 0 : _b.name,
+    colour: (_c = group) === null || _c === void 0 ? void 0 : _c.colour,
+    students: []
+  };
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_forms_form_wrapper_FormWrapper__WEBPACK_IMPORTED_MODULE_1__["FormWrapper"], {
+    initialValues: initialValues,
+    validationSchema: apps_classrooms_validation_ClassroomGroupValidationSchema__WEBPACK_IMPORTED_MODULE_2__["ClassroomGroupValidationSchema"],
+    onSubmit: saveGroup
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(apps_classrooms_components_classroom_group_details_form_ClassroomGroupDetailsForm__WEBPACK_IMPORTED_MODULE_3__["ClassroomGroupDetailsForm"], {
+    isNew: !group,
+    onClickCancel: onClickCancel
+  }));
+}
 
 /***/ }),
 
-/***/ "./src/apps/subjects/utils/OnboardingHelper.ts":
-/*!*****************************************************!*\
-  !*** ./src/apps/subjects/utils/OnboardingHelper.ts ***!
-  \*****************************************************/
-/*! exports provided: OnboardingHelper */
+/***/ "./src/apps/classrooms/enums/GroupColour.ts":
+/*!**************************************************!*\
+  !*** ./src/apps/classrooms/enums/GroupColour.ts ***!
+  \**************************************************/
+/*! exports provided: GroupColour */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "OnboardingHelper", function() { return OnboardingHelper; });
-/* harmony import */ var _libs_shared_src_apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../../libs/shared/src/apps/subjects/utils/OnboardingHelper */ "../../libs/shared/src/apps/subjects/utils/OnboardingHelper.ts");
-/* harmony import */ var shared_constants_LiteActions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! shared/constants/LiteActions */ "./src/shared/constants/LiteActions.ts");
-/* harmony import */ var shared_constants_LiteRadioChannels__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! shared/constants/LiteRadioChannels */ "./src/shared/constants/LiteRadioChannels.ts");
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "GroupColour", function() { return GroupColour; });
+var GroupColour;
+
+(function (GroupColour) {
+  GroupColour["White"] = "white";
+  GroupColour["Pink"] = "pink";
+  GroupColour["YellowOrange"] = "yellow-orange";
+  GroupColour["Emerald"] = "emerald";
+  GroupColour["PuertoRico"] = "puerto-rico";
+  GroupColour["PictonBlue"] = "picton-blue";
+  GroupColour["EastSide"] = "east-side";
+  GroupColour["Portage"] = "portage";
+})(GroupColour || (GroupColour = {}));
 
+/***/ }),
 
+/***/ "./src/apps/classrooms/utils/GroupHelper.ts":
+/*!**************************************************!*\
+  !*** ./src/apps/classrooms/utils/GroupHelper.ts ***!
+  \**************************************************/
+/*! exports provided: mapColourToClassName */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
 
-var OnboardingHelper = Object.assign(Object.assign({}, _libs_shared_src_apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_0__["OnboardingHelper"]), {
-  buildAppLink: function buildAppLink(step, redirectUrl) {
-    var appLink = {
-      application: shared_constants_LiteRadioChannels__WEBPACK_IMPORTED_MODULE_2__["AppChannels"].SUBJECT,
-      action: shared_constants_LiteActions__WEBPACK_IMPORTED_MODULE_1__["Actions"].Subjects.PREFERENCES,
-      params: {
-        step: step
-      }
-    };
-    if (redirectUrl) appLink.params.redirectUrl = redirectUrl;
-    return appLink;
-  }
-});
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "mapColourToClassName", function() { return mapColourToClassName; });
+function mapColourToClassName(groupName) {
+  return "bg-".concat(groupName);
+}
 
 /***/ }),
 
-/***/ "./src/apps/subjects/views/preferences/LazyStepViews.tsx":
-/*!***************************************************************!*\
-  !*** ./src/apps/subjects/views/preferences/LazyStepViews.tsx ***!
-  \***************************************************************/
-/*! exports provided: LazyStepViews */
+/***/ "./src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts":
+/*!**************************************************************************!*\
+  !*** ./src/apps/classrooms/validation/ClassroomGroupValidationSchema.ts ***!
+  \**************************************************************************/
+/*! exports provided: ClassroomGroupValidationSchema */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "LazyStepViews", function() { return LazyStepViews; });
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-
-var AsyncPreferencesWelcomeView = react__WEBPACK_IMPORTED_MODULE_0___default.a.lazy(function () {
-  return __webpack_require__.e(/*! import() */ 58).then(__webpack_require__.bind(null, /*! apps/subjects/views/preferences/welcome/LitePreferencesWelcomeView */ "./src/apps/subjects/views/preferences/welcome/LitePreferencesWelcomeView.tsx")).then(function (_ref) {
-    var PreferencesWelcomeView = _ref.PreferencesWelcomeView;
-    return {
-      "default": PreferencesWelcomeView
-    };
-  });
-});
-var AsyncSubjectPresentationSelectorView = react__WEBPACK_IMPORTED_MODULE_0___default.a.lazy(function () {
-  return Promise.all(/*! import() */[__webpack_require__.e(12), __webpack_require__.e(57)]).then(__webpack_require__.bind(null, /*! apps/subjects/views/preferences/subject-presentation/LiteSubjectPresentationSelectorView */ "./src/apps/subjects/views/preferences/subject-presentation/LiteSubjectPresentationSelectorView.tsx")).then(function (_ref2) {
-    var SubjectPresentationSelectorView = _ref2.SubjectPresentationSelectorView;
-    return {
-      "default": SubjectPresentationSelectorView
-    };
-  });
-});
-var AsyncCurriculumPresentationSelectorView = react__WEBPACK_IMPORTED_MODULE_0___default.a.lazy(function () {
-  return Promise.all(/*! import() */[__webpack_require__.e(12), __webpack_require__.e(56)]).then(__webpack_require__.bind(null, /*! apps/subjects/views/preferences/curriculum-presentation/LiteCurriculumPresentationSelectorView */ "./src/apps/subjects/views/preferences/curriculum-presentation/LiteCurriculumPresentationSelectorView.tsx")).then(function (_ref3) {
-    var CurriculumPresentationSelectorView = _ref3.CurriculumPresentationSelectorView;
-    return {
-      "default": CurriculumPresentationSelectorView
-    };
-  });
-});
-var AsyncLevelPreferencesView = react__WEBPACK_IMPORTED_MODULE_0___default.a.lazy(function () {
-  return Promise.all(/*! import() */[__webpack_require__.e(12), __webpack_require__.e(36)]).then(__webpack_require__.bind(null, /*! apps/subjects/views/preferences/level-preferences/LiteLevelPreferencesView */ "./src/apps/subjects/views/preferences/level-preferences/LiteLevelPreferencesView.tsx")).then(function (_ref4) {
-    var LevelPreferencesView = _ref4.LevelPreferencesView;
-    return {
-      "default": LevelPreferencesView
-    };
-  });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ClassroomGroupValidationSchema", function() { return ClassroomGroupValidationSchema; });
+/* harmony import */ var yup__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! yup */ "../../../node_modules/yup/lib/index.js");
+/* harmony import */ var yup__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(yup__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _enums_GroupColour__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../enums/GroupColour */ "./src/apps/classrooms/enums/GroupColour.ts");
+
+
+
+var getPhrase = _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__["LanguageService"].encloseNamespace('classrooms.classroomValidation');
+var ClassroomGroupValidationSchema = Object(yup__WEBPACK_IMPORTED_MODULE_0__["object"])().shape({
+  name: Object(yup__WEBPACK_IMPORTED_MODULE_0__["string"])().max(255, function () {
+    return getPhrase('nameExceeds');
+  }).required(function () {
+    return getPhrase('nameRequired');
+  })["default"](''),
+  colour: Object(yup__WEBPACK_IMPORTED_MODULE_0__["string"])().required(function () {
+    return getPhrase('colourRequired');
+  })["default"](_enums_GroupColour__WEBPACK_IMPORTED_MODULE_2__["GroupColour"].White)
 });
-var AsyncSubjectPreferencesView = react__WEBPACK_IMPORTED_MODULE_0___default.a.lazy(function () {
-  return Promise.all(/*! import() */[__webpack_require__.e(12), __webpack_require__.e(42)]).then(__webpack_require__.bind(null, /*! apps/subjects/views/preferences/subject-preferences/LiteSubjectPreferencesView */ "./src/apps/subjects/views/preferences/subject-preferences/LiteSubjectPreferencesView.tsx")).then(function (_ref5) {
-    var SubjectPreferencesView = _ref5.SubjectPreferencesView;
-    return {
-      "default": SubjectPreferencesView
-    };
-  });
-});
-var AsyncPreferencesSummaryView = react__WEBPACK_IMPORTED_MODULE_0___default.a.lazy(function () {
-  return __webpack_require__.e(/*! import() */ 23).then(__webpack_require__.bind(null, /*! apps/subjects/views/preferences/summary/LitePreferencesSummaryView */ "./src/apps/subjects/views/preferences/summary/LitePreferencesSummaryView.tsx")).then(function (_ref6) {
-    var PreferencesSummaryView = _ref6.PreferencesSummaryView;
-    return {
-      "default": PreferencesSummaryView
-    };
-  });
-});
-var LazyStepViews = function LazyStepViews() {
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-};
-
-LazyStepViews['welcome'] = function (props) {
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(AsyncPreferencesWelcomeView, Object.assign({}, props));
-};
-
-LazyStepViews['school-level'] = function (props) {
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(AsyncSubjectPresentationSelectorView, Object.assign({}, props));
-};
-
-LazyStepViews['curriculum'] = function (props) {
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(AsyncCurriculumPresentationSelectorView, Object.assign({}, props));
-};
-
-LazyStepViews['levels'] = function (props) {
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(AsyncLevelPreferencesView, Object.assign({}, props));
-};
-
-LazyStepViews['subjects'] = function (props) {
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(AsyncSubjectPreferencesView, Object.assign({}, props));
-};
-
-LazyStepViews['summary'] = function (props) {
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(AsyncPreferencesSummaryView, Object.assign({}, props));
-};
 
 /***/ }),
 
-/***/ "./src/apps/subjects/views/preferences/LiteBasePreferencesView.tsx":
-/*!*************************************************************************!*\
-  !*** ./src/apps/subjects/views/preferences/LiteBasePreferencesView.tsx ***!
-  \*************************************************************************/
-/*! exports provided: BasePreferencesView */
+/***/ "./src/apps/classrooms/views/create-classroom-group/CreateClassroomGroupView.tsx":
+/*!***************************************************************************************!*\
+  !*** ./src/apps/classrooms/views/create-classroom-group/CreateClassroomGroupView.tsx ***!
+  \***************************************************************************************/
+/*! exports provided: CreateClassroomGroupView */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BasePreferencesView", function() { return BasePreferencesView; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CreateClassroomGroupView", function() { return CreateClassroomGroupView; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone */ "../../libs/common/src/backbone/index.ts");
-/* harmony import */ var _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/react */ "../../libs/common/src/react/index.ts");
-/* harmony import */ var _libs_common_src_backbone_enums_HttpStatus__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/enums/HttpStatus */ "../../libs/common/src/backbone/enums/HttpStatus.ts");
-/* harmony import */ var _libs_common_src_react_hooks_UseSetPageTitle__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/common/src/react/hooks/UseSetPageTitle */ "../../libs/common/src/react/hooks/UseSetPageTitle.ts");
-/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
-/* harmony import */ var _libs_shared_src_apps_subjects_components_preferences_nav_PreferencesNav__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/apps/subjects/components/preferences/nav/PreferencesNav */ "../../libs/shared/src/apps/subjects/components/preferences/nav/PreferencesNav.tsx");
-/* harmony import */ var _libs_shared_src_flight_requests_PreferenceRequests__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/flight-requests/PreferenceRequests */ "../../libs/shared/src/flight-requests/PreferenceRequests.ts");
-/* harmony import */ var _libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/flight-requests/UserRequests */ "../../libs/shared/src/flight-requests/UserRequests.ts");
-/* harmony import */ var _libs_shared_src_flight_requests_SettingRequests__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/flight-requests/SettingRequests */ "../../libs/shared/src/flight-requests/SettingRequests.ts");
-/* harmony import */ var _libs_shared_src_enums_SettingName__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/enums/SettingName */ "../../libs/shared/src/enums/SettingName.ts");
-/* harmony import */ var shared_constants_LiteActions__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! shared/constants/LiteActions */ "./src/shared/constants/LiteActions.ts");
-/* harmony import */ var shared_constants_LiteRadioChannels__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! shared/constants/LiteRadioChannels */ "./src/shared/constants/LiteRadioChannels.ts");
-/* harmony import */ var apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! apps/subjects/utils/OnboardingHelper */ "./src/apps/subjects/utils/OnboardingHelper.ts");
-/* harmony import */ var _LazyStepViews__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./LazyStepViews */ "./src/apps/subjects/views/preferences/LazyStepViews.tsx");
-/* harmony import */ var _preferences_scss__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./preferences.scss */ "./src/apps/subjects/views/preferences/preferences.scss");
-/* harmony import */ var _preferences_scss__WEBPACK_IMPORTED_MODULE_15___default = /*#__PURE__*/__webpack_require__.n(_preferences_scss__WEBPACK_IMPORTED_MODULE_15__);
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-redux */ "react-redux");
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/common/src/react */ "../../libs/common/src/react/index.ts");
+/* harmony import */ var _libs_shared_src_components_popup_Popup__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/popup/Popup */ "../../libs/shared/src/components/popup/Popup.tsx");
+/* harmony import */ var _libs_shared_src_hooks_UseAlerts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/hooks/UseAlerts */ "../../libs/shared/src/hooks/UseAlerts.ts");
+/* harmony import */ var apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! apps/classrooms/flight-requests/ClassroomRequests */ "./src/apps/classrooms/flight-requests/ClassroomRequests.ts");
+/* harmony import */ var apps_classrooms_components_edit_classroom_group_details_EditClassroomGroupDetails__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails */ "./src/apps/classrooms/components/edit-classroom-group-details/EditClassroomGroupDetails.tsx");
+/* harmony import */ var _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../../../../libs/analytics/src/AnalyticsHelper */ "../../libs/analytics/src/AnalyticsHelper.ts");
+/* harmony import */ var _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../../../../../libs/analytics/src/interfaces */ "../../libs/analytics/src/interfaces/index.ts");
 
 
 
@@ -576,191 +401,67 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+var namespace = 'classrooms.createClassroomGroup';
+var getPhrase = _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].encloseNamespace(namespace);
+function CreateClassroomGroupView(props) {
+  var classroom = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__["Flight"].useBasicFetch(apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__["ClassroomRequests"].getClassroom(props.classroomId));
+  var alerts = Object(_libs_shared_src_hooks_UseAlerts__WEBPACK_IMPORTED_MODULE_5__["useAlerts"])();
+  var dispatch = Object(react_redux__WEBPACK_IMPORTED_MODULE_1__["useDispatch"])();
 
+  var successCallback = function successCallback(group) {
+    alerts.success(getPhrase('success', {
+      groupName: group.name,
+      classroomName: classroom.data.name
+    }));
+    props.closePopup();
+  };
 
+  var addStudentsToGroup = function addStudentsToGroup(group) {
+    _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__["Flight"].fetch(dispatch, apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__["ClassroomRequests"].addStudentsToGroup(props.studentIds, group.id, function () {
+      _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].logUserAction({
+        id: group.id,
+        studentCount: props.studentIds.length
+      }, _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].mergeOptions(props.analyticsOptions, {
+        actionType: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["UserAction"].Associate,
+        descriptor: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["AssocDescriptor"].User
+      }));
+      successCallback(group);
+    }));
+  };
 
+  var saveGroupToClassroom = function saveGroupToClassroom(group) {
+    _libs_common_src_react__WEBPACK_IMPORTED_MODULE_3__["Flight"].fetch(dispatch, apps_classrooms_flight_requests_ClassroomRequests__WEBPACK_IMPORTED_MODULE_6__["ClassroomRequests"].addGroupToClassroom(group, props.classroomId, function (newGroup) {
+      var _a;
 
+      _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].logUserAction({
+        id: newGroup.id,
+        classroomId: props.classroomId
+      }, _libs_analytics_src_AnalyticsHelper__WEBPACK_IMPORTED_MODULE_8__["AnalyticsHelper"].mergeOptions(props.analyticsOptions, {
+        actionType: _libs_analytics_src_interfaces__WEBPACK_IMPORTED_MODULE_9__["UserAction"].Create
+      }));
 
-
-var namespace = 'subjects.preferences';
-
-var has = function has(response) {
-  var _a;
-  /**
-   * We're returning `true` here because we don't want to redirect users off of a page while we're still
-   * fetching data for it. Once this if-statement is passed, we can make actual decisions on
-   * if the data is present or not, and redirect the user away if they do not have the correct data.
-   */
-
-
-  if (!response.statusCode) // The presence of `statusCode` helps us recognise if the fetch call has completed.
-    return true;
-  return response.statusCode === _libs_common_src_backbone_enums_HttpStatus__WEBPACK_IMPORTED_MODULE_3__["HttpStatus"].Ok && !!((_a = response.data) === null || _a === void 0 ? void 0 : _a.length);
-};
-
-function BasePreferencesView(_ref) {
-  var currentStep = _ref.step,
-      _ref$redirectUrl = _ref.redirectUrl,
-      redirectUrl = _ref$redirectUrl === void 0 ? '' : _ref$redirectUrl;
-
-  var _a, _b, _c, _d, _e, _f, _g, _h;
-  /**
-   * Data fetching
-   */
-
-
-  var presentations = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_PreferenceRequests__WEBPACK_IMPORTED_MODULE_7__["PreferenceRequests"].currentPresentations());
-  var availablePresentations = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_PreferenceRequests__WEBPACK_IMPORTED_MODULE_7__["PreferenceRequests"].availablePresentations());
-  var levelPreferences = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_PreferenceRequests__WEBPACK_IMPORTED_MODULE_7__["PreferenceRequests"].myLevelPreferences());
-  var subjectPreferences = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_PreferenceRequests__WEBPACK_IMPORTED_MODULE_7__["PreferenceRequests"].mySubjectPreferences());
-  var currentUser = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_8__["UserRequests"].currentUser());
-  var hasCompletedOnboarding = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(currentUser.statusCode ? _libs_shared_src_flight_requests_SettingRequests__WEBPACK_IMPORTED_MODULE_9__["SettingRequests"].setting(currentUser.data.id, _libs_shared_src_enums_SettingName__WEBPACK_IMPORTED_MODULE_10__["SettingName"].HasCompletedOnboarding) : null);
-  var bulkOnboardingPreferencesState = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].useBasicFetch(currentUser.statusCode ? _libs_shared_src_flight_requests_SettingRequests__WEBPACK_IMPORTED_MODULE_9__["SettingRequests"].setting(currentUser.data.id, _libs_shared_src_enums_SettingName__WEBPACK_IMPORTED_MODULE_10__["SettingName"].BulkOnboardingPreferencesState) : null);
-  Object(_libs_common_src_react_hooks_UseSetPageTitle__WEBPACK_IMPORTED_MODULE_4__["useSetPageTitle"])(_libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_5__["LanguageService"].getPhrase(namespace, ((_a = hasCompletedOnboarding.data) === null || _a === void 0 ? void 0 : _a.value) ? 'pageTitlePreferences' : 'pageTitleOnboarding')); // Only admin's and staff are allowed to complete onboarding
-
-  if (currentUser.statusCode) {
-    if (currentUser.data.role !== 'Admin' && currentUser.data.role !== 'SuperAdmin') {
-      if (redirectUrl) {
-        _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].LocationUtils.Redirect(redirectUrl, true);
-      } else {
-        _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger({
-          application: shared_constants_LiteRadioChannels__WEBPACK_IMPORTED_MODULE_12__["AppChannels"].DASHBOARD,
-          action: shared_constants_LiteActions__WEBPACK_IMPORTED_MODULE_11__["Actions"].Dashboard.HOME
-        }, {
-          replace: true
-        });
+      if ((_a = props.studentIds) === null || _a === void 0 ? void 0 : _a.length) {
+        addStudentsToGroup(newGroup);
+        return;
       }
 
-      return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-    }
-  }
-
-  if (!hasCompletedOnboarding.statusCode) return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-
-  if (!currentStep || !apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].stepIsValid(currentStep)) {
-    var step = !((_b = hasCompletedOnboarding.data) === null || _b === void 0 ? void 0 : _b.value) ? 'welcome' : 'levels';
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger(apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink(step, redirectUrl), {
-      replace: true
-    });
-    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-  }
-
-  var isStep = apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].getIsStep(currentStep);
-
-  var _OnboardingHelper$get = apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].getBulkPreferencesState((_c = bulkOnboardingPreferencesState.data) === null || _c === void 0 ? void 0 : _c.value),
-      bulkLevelsSelected = _OnboardingHelper$get.levels,
-      bulkSubjectsSelected = _OnboardingHelper$get.subjects;
-
-  var _OnboardingHelper$has = apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].hasManyPresentationTypes(availablePresentations.data),
-      hasManySubjectPresentations = _OnboardingHelper$has.hasManySubjectPresentations,
-      hasManyCurriculumPresentations = _OnboardingHelper$has.hasManyCurriculumPresentations;
-  /**
-   * Disable flags for each step
-   */
-
-
-  var loadingPresentations = availablePresentations.isFetching || availablePresentations.shouldFetch; // If there is only 1 available presentation for a presentation type, we do not need to display a selector.
-
-  var disableSchoolLevel = ((_d = hasCompletedOnboarding.data) === null || _d === void 0 ? void 0 : _d.value) || !loadingPresentations && !hasManySubjectPresentations || has(presentations) && ((_e = hasCompletedOnboarding.data) === null || _e === void 0 ? void 0 : _e.value);
-  var disableCurriculum = ((_f = hasCompletedOnboarding.data) === null || _f === void 0 ? void 0 : _f.value) || !loadingPresentations && !hasManyCurriculumPresentations || has(presentations) && ((_g = hasCompletedOnboarding.data) === null || _g === void 0 ? void 0 : _g.value);
-  var disableLevelPage = !has(presentations);
-  var disableSubjectPage = disableLevelPage || !has(levelPreferences) && !bulkLevelsSelected;
-  var disableSummaryPage = disableSubjectPage || !has(subjectPreferences) && !bulkSubjectsSelected;
-  /**
-   * Redirect checks
-   */
-
-  if (isStep('welcome') && ((_h = hasCompletedOnboarding.data) === null || _h === void 0 ? void 0 : _h.value)) {
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger(apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('levels', redirectUrl), {
-      replace: true
-    });
-    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-  }
-
-  if (isStep('school-level') && disableSchoolLevel) {
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger(apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink(disableCurriculum ? 'levels' : 'curriculum', redirectUrl), {
-      replace: true
-    });
-    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-  }
-
-  if (isStep('curriculum') && disableCurriculum) {
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger(apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('levels', redirectUrl), {
-      replace: true
-    });
-    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-  }
-
-  if (isStep(['levels', 'subjects', 'summary']) && disableLevelPage) {
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger(apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('welcome', redirectUrl), {
-      replace: true
-    });
-    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-  }
-
-  if (isStep(['subjects', 'summary']) && disableSubjectPage) {
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger(apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('levels', redirectUrl), {
-      replace: true
-    });
-    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-  }
-
-  if (isStep('summary') && disableSummaryPage) {
-    _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.trigger(apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('subjects', redirectUrl), {
-      replace: true
-    });
-    return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null);
-  }
-
-  function getSteps() {
-    var steps = [{
-      active: isStep('levels'),
-      appLink: apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('levels', redirectUrl),
-      disabled: disableLevelPage
-    }, {
-      active: isStep('subjects'),
-      appLink: apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('subjects', redirectUrl),
-      disabled: disableSubjectPage
-    }, {
-      active: isStep('summary'),
-      appLink: apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('summary', redirectUrl),
-      disabled: disableSummaryPage
-    }];
-    if (!disableCurriculum) steps.unshift({
-      active: isStep('curriculum'),
-      appLink: apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('curriculum', redirectUrl)
-    });
-    if (!disableSchoolLevel) steps.unshift({
-      active: isStep('school-level'),
-      appLink: apps_subjects_utils_OnboardingHelper__WEBPACK_IMPORTED_MODULE_13__["OnboardingHelper"].buildAppLink('school-level', redirectUrl)
-    });
-    return steps;
-  }
-
-  var LazyStepView = _LazyStepViews__WEBPACK_IMPORTED_MODULE_14__["LazyStepViews"][currentStep];
-  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
-    className: "position-relative px-3 ".concat(_preferences_scss__WEBPACK_IMPORTED_MODULE_15___default.a.preferencesContainer)
-  }, currentStep !== 'welcome' && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_apps_subjects_components_preferences_nav_PreferencesNav__WEBPACK_IMPORTED_MODULE_6__["PreferencesNav"], {
-    steps: getSteps()
-  }), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("main", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Suspense, {
-    fallback: react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, null)
-  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(LazyStepView, {
-    redirectUrl: redirectUrl
-  }))));
+      successCallback(newGroup);
+    }, function () {
+      // TODO: Handle possible errors once we have a server side
+      alerts.error(getPhrase('error'));
+    }));
+  };
+
+  return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_libs_shared_src_components_popup_Popup__WEBPACK_IMPORTED_MODULE_4__["Popup"], {
+    title: getPhrase('title'),
+    closePopup: props.closePopup,
+    showLoadingSpinner: !classroom.data
+  }, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(apps_classrooms_components_edit_classroom_group_details_EditClassroomGroupDetails__WEBPACK_IMPORTED_MODULE_7__["EditClassroomGroupDetails"], {
+    saveGroup: saveGroupToClassroom,
+    onClickCancel: props.closePopup
+  }));
 }
 
-/***/ }),
-
-/***/ "./src/apps/subjects/views/preferences/preferences.scss":
-/*!**************************************************************!*\
-  !*** ./src/apps/subjects/views/preferences/preferences.scss ***!
-  \**************************************************************/
-/*! no static exports found */
-/***/ (function(module, exports, __webpack_require__) {
-
-// extracted by mini-css-extract-plugin
-module.exports = {"preferencesContainer":"cv--preferencesContainer--1sGnn","backgroundImage":"cv--backgroundImage--F6J5v"};
-
 /***/ })
 
 }]);