@selfcommunity/react-ui 0.10.5-payments.156 → 0.10.5-payments.161

package/lib/cjs/components/BottomNavigation/BottomNavigation.js

@@ -102,13 +102,13 @@ function BottomNavigation(inProps) {
                 (!postOnlyStaffEnabled || (react_core_1.UserUtils.isStaff(scUserContext.user) && postOnlyStaffEnabled)) &&
                     ((groupsEnabled && !eventsEnabled) || (!groupsEnabled && eventsEnabled)) &&
                     !exploreStreamEnabled ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: (0, classnames_1.default)(classes.composer, classes.action), component: ComposerIconButton_1.default, disableRipple: true }, "composer")) : null,
-                coursesEnabled && scUserContext.user ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "courses" }) }, "courses")) : null,
-                groupsEnabled && scUserContext.user ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }) }, "groups")) : null,
+                coursesEnabled && (scUserContext.user || contentAvailable) ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.COURSES_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "courses" }) }, "courses")) : null,
+                groupsEnabled && (scUserContext.user || contentAvailable) ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.GROUPS_SUBSCRIBED_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "groups" }) }, "groups")) : null,
                 (!postOnlyStaffEnabled || (react_core_1.UserUtils.isStaff(scUserContext.user) && postOnlyStaffEnabled)) &&
                     groupsEnabled &&
                     eventsEnabled &&
                     !exploreStreamEnabled ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: (0, classnames_1.default)(classes.composer, classes.action), component: ComposerIconButton_1.default, disableRipple: true }, "composer")) : null,
-                eventsEnabled ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.EVENTS_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }, "events")) : null,
+                eventsEnabled && (scUserContext.user || contentAvailable) ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.EVENT_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.EVENTS_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }, "events")) : null,
                 scUserContext.user && !groupsEnabled && !eventsEnabled ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.USER_NOTIFICATIONS_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Badge, Object.assign({ badgeContent: scUserContext.user.unseen_notification_banners_counter + scUserContext.user.unseen_interactions_counter, color: "secondary" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "notifications_active" }) })) }, "notifications")) : null,
                 privateMessagingEnabled && scUserContext.user ? ((0, jsx_runtime_1.jsx)(material_1.BottomNavigationAction, { className: classes.action, component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), value: scRoutingContext.url(react_core_1.SCRoutes.USER_PRIVATE_MESSAGES_ROUTE_NAME, {}), icon: (0, jsx_runtime_1.jsx)(material_1.Badge, Object.assign({ badgeContent: 0, color: "secondary" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "email" }) })) }, "messages")) : null
             ] })));

package/lib/cjs/components/CheckoutReturnDialog/CheckoutReturnDialog.d.ts

@@ -4,5 +4,6 @@ export interface CheckoutReturnDialogProps extends DialogProps {
     checkoutSessionId: string;
     disableInitialTransition?: boolean;
     onHandleViewContentPurchased?: (redirectUrl: string) => void;
+    returnUrl?: string;
 }
 export default function CheckoutReturnDialog(inProps: CheckoutReturnDialogProps): JSX.Element;

package/lib/cjs/components/CheckoutReturnDialog/CheckoutReturnDialog.js

@@ -46,7 +46,7 @@ function CheckoutReturnDialog(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { className, checkoutSessionId, disableInitialTransition = false, onHandleViewContentPurchased } = props, rest = tslib_1.__rest(props, ["className", "checkoutSessionId", "disableInitialTransition", "onHandleViewContentPurchased"]);
+    const { className, checkoutSessionId, disableInitialTransition = false, onHandleViewContentPurchased, returnUrl } = props, rest = tslib_1.__rest(props, ["className", "checkoutSessionId", "disableInitialTransition", "onHandleViewContentPurchased", "returnUrl"]);
     // STATE
     const [loading, setLoading] = (0, react_1.useState)(true);
     const [contentType, setContentType] = (0, react_1.useState)(null);
@@ -59,6 +59,8 @@ function CheckoutReturnDialog(inProps) {
     // CONTEXT
     const scRoutingContext = (0, react_core_1.useSCRouting)();
     const scUserContext = (0, react_core_1.useSCUser)();
+    const scPreferencesContext = (0, react_1.useContext)(react_core_1.SCPreferencesContext);
+    const appUrl = (0, react_1.useMemo)(() => scPreferencesContext.preferences && scPreferencesContext.preferences[react_core_1.SCPreferences.CONFIGURATIONS_APP_URL].value, [scPreferencesContext.preferences]);
     /**
      * Handle view new object purchased
      */
@@ -77,14 +79,17 @@ function CheckoutReturnDialog(inProps) {
             case types_1.SCContentType.COURSE:
                 _redirectUrl = scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, content);
                 break;
+            case types_1.SCContentType.COMMUNITY:
+                _redirectUrl = appUrl;
+                break;
             default:
                 break;
         }
         if (onHandleViewContentPurchased) {
-            onHandleViewContentPurchased(_redirectUrl);
+            onHandleViewContentPurchased(returnUrl ? returnUrl : _redirectUrl);
         }
         else if (_redirectUrl) {
-            window.location.href = _redirectUrl;
+            window.location.href = returnUrl ? returnUrl : _redirectUrl;
         }
     }, [scRoutingContext, onHandleViewContentPurchased, content, contentType]);
     /**

package/lib/cjs/components/Course/Course.d.ts

@@ -4,7 +4,7 @@ import { SCCourseTemplateType } from '../../types/course';
 import { CourseParticipantsButtonProps } from '../CourseParticipantsButton';
 import { WidgetProps } from '../Widget';
 import { CourseSkeletonProps } from './Skeleton';
-import { CacheStrategies } from '@selfcommunity/utils/src/utils/cache';
+import { CacheStrategies } from '@selfcommunity/utils';
 export interface CourseProps extends WidgetProps {
     /**
      * Course Object
@@ -21,6 +21,10 @@ export interface CourseProps extends WidgetProps {
      * @default 'preview'
      */
     template?: SCCourseTemplateType;
+    /**
+     * It shows a different snippet type
+     */
+    userProfileSnippet?: boolean;
     /**
      * Actions
      * @default null
@@ -84,12 +88,9 @@ export interface CourseProps extends WidgetProps {
  |previewProgress|.SCCourses-preview-progress|Styles applied to indicate the progress section in the preview template.|
  |previewProgressBar|.SCCourses-preview-progress-bar|Styles applied to the progress bar in the preview template.|
  |snippetRoot|.SCCourses-snippet-root|Styles applied to the root element in the snippet template.|
- |snippetActions|.SCCourses-snippet-actions|Styles applied to the actions section in the snippet template.|
  |snippetAvatar|.SCCourses-snippet-avatar|Styles applied to the avatar element in the snippet template.|
  |snippetImage|.SCCourses-snippet-image|Styles applied to the image element in the snippet template.|
- |snippetPrimary|.SCCourses-snippet-primary|Styles applied to the primary section in the snippet template.|
- |snippetSecondary|.SCCourses-snippet-secondary|Styles applied to the secondary section in the snippet template.|
-
+ 
  *
  * @param inProps
  */

package/lib/cjs/components/Course/Course.js

@@ -15,9 +15,9 @@ const CourseParticipantsButton_1 = tslib_1.__importDefault(require("../CoursePar
 const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const constants_1 = require("./constants");
 const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
-const BaseItem_1 = tslib_1.__importDefault(require("../../shared/BaseItem"));
 const course_2 = require("../../utils/course");
 const UserAvatar_1 = tslib_1.__importDefault(require("../../shared/UserAvatar"));
+const BaseItemButton_1 = tslib_1.__importDefault(require("../../shared/BaseItemButton"));
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     chip: `${constants_1.PREFIX}-chip`,
@@ -36,11 +36,9 @@ const classes = {
     previewProgress: `${constants_1.PREFIX}-preview-progress`,
     previewProgressBar: `${constants_1.PREFIX}-preview-progress-bar`,
     snippetRoot: `${constants_1.PREFIX}-snippet-root`,
-    snippetActions: `${constants_1.PREFIX}-snippet-actions`,
     snippetAvatar: `${constants_1.PREFIX}-snippet-avatar`,
-    snippetImage: `${constants_1.PREFIX}-snippet-image`,
-    snippetPrimary: `${constants_1.PREFIX}-snippet-primary`,
-    snippetSecondary: `${constants_1.PREFIX}-snippet-secondary`
+    snippetAvatarUserProfile: `${constants_1.PREFIX}-snippet-avatar-user-profile-view`,
+    snippetImage: `${constants_1.PREFIX}-snippet-image`
 };
 const Root = (0, styles_1.styled)(Widget_1.default, {
     name: constants_1.PREFIX,
@@ -52,7 +50,7 @@ const PreviewRoot = (0, styles_1.styled)(material_1.Box, {
     slot: 'PreviewRoot',
     overridesResolver: (_props, styles) => styles.previewRoot
 })(() => ({}));
-const SnippetRoot = (0, styles_1.styled)(BaseItem_1.default, {
+const SnippetRoot = (0, styles_1.styled)(BaseItemButton_1.default, {
     name: constants_1.PREFIX,
     slot: 'SnippetRoot',
     overridesResolver: (_props, styles) => styles.snippetRoot
@@ -96,22 +94,20 @@ const SnippetRoot = (0, styles_1.styled)(BaseItem_1.default, {
  |previewProgress|.SCCourses-preview-progress|Styles applied to indicate the progress section in the preview template.|
  |previewProgressBar|.SCCourses-preview-progress-bar|Styles applied to the progress bar in the preview template.|
  |snippetRoot|.SCCourses-snippet-root|Styles applied to the root element in the snippet template.|
- |snippetActions|.SCCourses-snippet-actions|Styles applied to the actions section in the snippet template.|
  |snippetAvatar|.SCCourses-snippet-avatar|Styles applied to the avatar element in the snippet template.|
  |snippetImage|.SCCourses-snippet-image|Styles applied to the image element in the snippet template.|
- |snippetPrimary|.SCCourses-snippet-primary|Styles applied to the primary section in the snippet template.|
- |snippetSecondary|.SCCourses-snippet-secondary|Styles applied to the secondary section in the snippet template.|
-
+ 
  *
  * @param inProps
  */
 function Course(inProps) {
+    var _a, _b, _c, _d, _e, _f, _g;
     // PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
         name: constants_1.PREFIX
     });
-    const { id = `course_object_${props.courseId ? props.courseId : props.course ? props.course.id : ''}`, courseId = null, course = null, className = null, template = course_1.SCCourseTemplateType.PREVIEW, actions, CourseParticipantsButtonComponentProps = {}, CourseSkeletonComponentProps = {}, cacheStrategy } = props, rest = tslib_1.__rest(props, ["id", "courseId", "course", "className", "template", "actions", "CourseParticipantsButtonComponentProps", "CourseSkeletonComponentProps", "cacheStrategy"]);
+    const { id = `course_object_${props.courseId ? props.courseId : props.course ? props.course.id : ''}`, courseId = null, course = null, className = null, template = course_1.SCCourseTemplateType.PREVIEW, actions, CourseParticipantsButtonComponentProps = {}, CourseSkeletonComponentProps = {}, cacheStrategy, userProfileSnippet } = props, rest = tslib_1.__rest(props, ["id", "courseId", "course", "className", "template", "actions", "CourseParticipantsButtonComponentProps", "CourseSkeletonComponentProps", "cacheStrategy", "userProfileSnippet"]);
     // STATE
     const { scCourse } = (0, react_core_1.useSCFetchCourse)(Object.assign({ id: courseId, course }, (cacheStrategy && { cacheStrategy })));
     // CONTEXT
@@ -155,20 +151,20 @@ function Course(inProps) {
                                 ? 'primary'
                                 : isCourseAdmin && !scCourse.privacy
                                     ? 'default'
-                                    : 'secondary', label: chipLabel, className: classes.chip })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!scCourse.created_by.deleted && {
+                                    : 'secondary', label: chipLabel, className: classes.chip })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!((_a = scCourse.created_by) === null || _a === void 0 ? void 0 : _a.deleted) && {
                             to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
-                        }), { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !scCourse.created_by.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scCourse.name, src: scCourse.created_by.avatar, className: classes.previewAvatar }) })) }))] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.previewContent }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ className: classes.previewCreator }, (!scCourse.created_by.deleted && {
+                        }), { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !((_b = scCourse.created_by) === null || _b === void 0 ? void 0 : _b.community_badge), smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { alt: scCourse.name, src: (_c = scCourse.created_by) === null || _c === void 0 ? void 0 : _c.avatar, className: classes.previewAvatar }) })) }))] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.previewContent }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ className: classes.previewCreator }, (!((_d = scCourse.created_by) === null || _d === void 0 ? void 0 : _d.deleted) && {
                             to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
-                        }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: scCourse.created_by.username })) })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse), className: classes.previewNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.previewName }, { children: scCourse.name })) })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.previewInfo }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewCategory }, { children: scCourse.categories.map((category) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", label: category.name }, category.id))) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewProgress }, { children: renderProgress() }))] })), actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.previewActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "outlined", size: "small", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see.preview", id: "ui.course.see.preview" }) })) })))] })));
+                        }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (_e = scCourse.created_by) === null || _e === void 0 ? void 0 : _e.username })) })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse), className: classes.previewNameWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.previewName }, { children: scCourse.name })) })), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.previewInfo }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewCategory }, { children: scCourse.categories.map((category) => ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", label: category.name }, category.id))) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.previewProgress }, { children: renderProgress() }))] })), actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.previewActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "outlined", size: "small", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) })) })))] })));
     }
     else {
-        contentObj = ((0, jsx_runtime_1.jsx)(SnippetRoot, { elevation: 0, className: classes.snippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.snippetImage }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "square", alt: scCourse.name, src: scCourse.image_medium, className: classes.snippetAvatar }), (isCourseAdmin || (0, course_2.isCourseCompleted)(scCourse) || (0, course_2.isCourseNew)(scCourse)) && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", color: (0, course_2.isCourseCompleted)(scCourse) || (isCourseAdmin && scCourse.privacy)
+        contentObj = ((0, jsx_runtime_1.jsx)(SnippetRoot, { elevation: 0, className: classes.snippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.snippetImage }, { children: [(0, jsx_runtime_1.jsx)(material_1.Avatar, { variant: "square", alt: scCourse.name, src: scCourse.image_medium, className: userProfileSnippet ? classes.snippetAvatarUserProfile : classes.snippetAvatar }), !userProfileSnippet && (isCourseAdmin || (0, course_2.isCourseCompleted)(scCourse) || (0, course_2.isCourseNew)(scCourse)) && ((0, jsx_runtime_1.jsx)(material_1.Chip, { size: "small", component: "div", color: (0, course_2.isCourseCompleted)(scCourse) || (isCourseAdmin && scCourse.privacy)
                             ? 'primary'
                             : isCourseAdmin && !scCourse.privacy
                                 ? 'default'
-                                : 'secondary', label: chipLabel, className: classes.chip }))] })), primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!scCourse.created_by.deleted && {
+                                : 'secondary', label: chipLabel, className: classes.chip }))] })), primary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!userProfileSnippet && ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!((_f = scCourse.created_by) === null || _f === void 0 ? void 0 : _f.deleted) && {
                         to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
-                    }), { className: classes.snippetPrimary }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span" }, { children: scCourse.created_by.username })) })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse), className: classes.snippetPrimary }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.name })) }))] }), secondary: (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ component: "p", variant: "body2", className: classes.snippetSecondary }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })), actions: actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.snippetActions }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) })) }))) }));
+                    }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ component: "span" }, { children: (_g = scCourse.created_by) === null || _g === void 0 ? void 0 : _g.username })) }))), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.name })) }))] }), secondary: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: userProfileSnippet ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: !scCourse.hide_member_count && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.userProfileSnippet.students", defaultMessage: "ui.course.userProfileSnippet.students", values: { students: scCourse.member_count } })) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft', defaultMessage: scCourse.privacy ? `ui.course.privacy.${scCourse.privacy}` : 'ui.course.privacy.draft' }), "-", (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.type.${scCourse.type}`, defaultMessage: `ui.course.type.${scCourse.type}` })] })) }), actions: actions !== null && actions !== void 0 ? actions : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_ROUTE_NAME, scCourse) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.course.see", id: "ui.course.see" }) }))) }));
     }
     /**
      * Renders root object

package/lib/cjs/components/Course/Skeleton.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { SCCourseTemplateType } from '../../types/course';
 import { WidgetProps } from '../Widget';
+import { CourseProps } from './Course';
 export interface CourseSkeletonProps extends WidgetProps {
     /**
      * Overrides or extends the styles applied to the component.
@@ -20,6 +21,10 @@ export interface CourseSkeletonProps extends WidgetProps {
      * Prop to pass an action to be rendered next to the skeleton
      */
     actions?: React.ReactNode;
+    /**
+     * CourseProps
+     */
+    CourseProps?: CourseProps;
 }
 /**
  * > API documentation for the Community-JS Course Skeleton component. Learn about the available props and the CSS API.

package/lib/cjs/components/Course/Skeleton.js

@@ -7,10 +7,10 @@ const Skeleton_1 = tslib_1.__importDefault(require("@mui/material/Skeleton"));
 const styles_1 = require("@mui/material/styles");
 const system_1 = require("@mui/system");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const BaseItem_1 = tslib_1.__importDefault(require("../../shared/BaseItem"));
 const course_1 = require("../../types/course");
 const Widget_1 = tslib_1.__importDefault(require("../Widget"));
 const constants_1 = require("./constants");
+const BaseItemButton_1 = tslib_1.__importDefault(require("../../shared/BaseItemButton"));
 const classes = {
     root: `${constants_1.PREFIX}-skeleton-root`,
     skeletonPreviewRoot: `${constants_1.PREFIX}-skeleton-preview-root`,
@@ -29,7 +29,7 @@ const SkeletonPreviewRoot = (0, styles_1.styled)(material_1.Box, {
     name: constants_1.PREFIX,
     slot: 'SkeletonPreviewRoot'
 })(() => ({}));
-const SkeletonSnippetRoot = (0, styles_1.styled)(BaseItem_1.default, {
+const SkeletonSnippetRoot = (0, styles_1.styled)(BaseItemButton_1.default, {
     name: constants_1.PREFIX,
     slot: 'SkeletonSnippetRoot'
 })(() => ({}));
@@ -61,7 +61,7 @@ function CourseSkeleton(inProps) {
         props: inProps,
         name: constants_1.PREFIX
     });
-    const { className, template, skeletonsAnimation = 'wave', actions } = props, rest = tslib_1.__rest(props, ["className", "template", "skeletonsAnimation", "actions"]);
+    const { className, template, skeletonsAnimation = 'wave', actions, CourseProps } = props, rest = tslib_1.__rest(props, ["className", "template", "skeletonsAnimation", "actions", "CourseProps"]);
     /**
      * Renders course object
      */
@@ -70,7 +70,7 @@ function CourseSkeleton(inProps) {
         contentObj = ((0, jsx_runtime_1.jsxs)(SkeletonPreviewRoot, Object.assign({ className: classes.skeletonPreviewRoot }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ position: "relative" }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { variant: "rectangular", animation: skeletonsAnimation, width: "100%", height: "110px" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { className: classes.skeletonPreviewAvatar, variant: "rounded", animation: skeletonsAnimation })] })), (0, jsx_runtime_1.jsxs)(material_1.CardContent, Object.assign({ className: classes.skeletonPreviewContent }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "20%", height: 14, sx: { marginTop: 1 }, variant: "rectangular" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "40%", height: 14, sx: { marginTop: 1.5 }, variant: "rectangular" }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, width: "60%", height: 14, sx: { marginTop: 4.5 }, variant: "rectangular" })] })), (0, jsx_runtime_1.jsx)(material_1.CardActions, Object.assign({ className: classes.skeletonPreviewActions }, { children: actions !== undefined ? actions : (0, jsx_runtime_1.jsx)(Skeleton_1.default, { variant: "rounded", width: 100, height: 30 }) }))] })));
     }
     else {
-        contentObj = ((0, jsx_runtime_1.jsx)(SkeletonSnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.skeletonSnippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.skeletonSnippetImage }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", width: 100, height: 60 }), " ", (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "large" }, { children: "courses" }))] })), primary: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "40%", style: { marginBottom: 12 } }), secondary: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "60%", style: { marginBottom: 10, marginRight: 5 } }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: "35%" })] }), actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: actions !== undefined ? (actions) : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", disabled: true }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, height: 10, width: 30, style: { marginTop: 5, marginBottom: 5 } }) }))) }) }));
+        contentObj = ((0, jsx_runtime_1.jsx)(SkeletonSnippetRoot, { elevation: 0, square: true, disableTypography: true, className: classes.skeletonSnippetRoot, image: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.skeletonSnippetImage }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", width: (CourseProps === null || CourseProps === void 0 ? void 0 : CourseProps.userProfileSnippet) ? 60 : 100, height: 60 }), (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "large" }, { children: "courses" }))] })), primary: (CourseProps === null || CourseProps === void 0 ? void 0 : CourseProps.userProfileSnippet) ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: 120, style: { marginBottom: 10 } })) : ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: 40, style: { marginBottom: 12 } })), secondary: (CourseProps === null || CourseProps === void 0 ? void 0 : CourseProps.userProfileSnippet) ? ((0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: 60 })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: 120, style: { marginBottom: 10 } }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, variant: "rectangular", height: 10, width: 60 })] })), actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: actions !== undefined ? (actions) : ((0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", variant: "outlined", disabled: true }, { children: (0, jsx_runtime_1.jsx)(Skeleton_1.default, { animation: skeletonsAnimation, height: 15, width: 60 }) }))) }) }));
     }
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-skeleton-${template}`) }, rest, { children: contentObj })));
 }

package/lib/cjs/components/CourseDashboard/Student.js

@@ -19,15 +19,20 @@ const Errors_1 = require("../../constants/Errors");
 const notistack_1 = require("notistack");
 const Skeleton_1 = tslib_1.__importDefault(require("./Student/Skeleton"));
 const UserAvatar_1 = tslib_1.__importDefault(require("../../shared/UserAvatar"));
-const BuyButton_1 = tslib_1.__importDefault(require("../BuyButton"));
-const messages = {
+const BUTTON_MESSAGES = {
     dashboard: 'ui.course.dashboard.student.button.dashboard',
     request: 'ui.course.dashboard.student.button.request',
+    signUp: 'ui.course.dashboard.student.button.signUp',
     review: 'ui.course.dashboard.student.button.review',
     cancel: 'ui.course.dashboard.student.button.cancel',
     start: 'ui.course.dashboard.student.button.start',
     continue: 'ui.course.dashboard.student.button.continue'
 };
+const SNACKBAR_MESSAGES = {
+    cancel: 'ui.course.dashboard.student.snackbar.success.cancel',
+    enroll: 'ui.course.dashboard.student.snackbar.success.enroll',
+    request: 'ui.course.dashboard.student.snackbar.success.request'
+};
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     studentContainer: `${constants_1.PREFIX}-student-container`,
@@ -93,7 +98,7 @@ function Student(inProps) {
     // CONTEXTS
     const scRoutingContext = (0, react_core_1.useSCRouting)();
     // HOOKS
-    const { scCourse } = (0, react_core_1.useSCFetchCourse)({ id: courseId, course });
+    const { scCourse, setSCCourse } = (0, react_core_1.useSCFetchCourse)({ id: courseId, course });
     const intl = (0, react_intl_1.useIntl)();
     const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
     // PAYMENTS
@@ -108,20 +113,24 @@ function Student(inProps) {
     const handleRequest = (0, react_1.useCallback)(() => {
         setLoadingRequest(true);
         let request;
+        let updatedCourse;
         if (sentRequest) {
             request = api_services_1.CourseService.leaveOrRemoveCourseRequest(scCourse.id);
+            updatedCourse = Object.assign(Object.assign({}, scCourse), { join_status: null });
         }
         else {
             request = api_services_1.CourseService.joinOrAcceptInviteToCourse(scCourse.id);
+            updatedCourse = Object.assign(Object.assign({}, scCourse), { join_status: scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE ? types_1.SCCourseJoinStatusType.REQUESTED : types_1.SCCourseJoinStatusType.JOINED });
         }
         request
             .then(() => {
-            enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.course.dashboard.student.snackbar.success.${sentRequest ? 'cancel' : 'request'}`, defaultMessage: `ui.course.dashboard.student.snackbar.success.${sentRequest ? 'cancel' : 'request'}` }), {
+            setSCCourse(updatedCourse);
+            setSentRequest((prev) => !prev);
+            setLoadingRequest(false);
+            enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: sentRequest ? SNACKBAR_MESSAGES.request : scCourse.join_status === null ? SNACKBAR_MESSAGES.enroll : SNACKBAR_MESSAGES.cancel, defaultMessage: sentRequest ? SNACKBAR_MESSAGES.request : scCourse.join_status === null ? SNACKBAR_MESSAGES.enroll : SNACKBAR_MESSAGES.cancel }), {
                 variant: 'success',
                 autoHideDuration: 3000
             });
-            setSentRequest((prev) => !prev);
-            setLoadingRequest(false);
         })
             .catch((error) => {
             enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
@@ -133,18 +142,21 @@ function Student(inProps) {
     }, [scCourse, sentRequest, setLoadingRequest]);
     // MEMOS
     const actionButton = (0, react_1.useMemo)(() => {
-        var _a, _b, _c;
+        var _a, _b;
         if (!scCourse) {
             return (0, jsx_runtime_1.jsx)(material_1.Skeleton, { animation: "wave", variant: "rectangular", width: "130px", height: "20px" });
         }
-        return ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionsWrapper }, { children: [(scCourse.join_status === types_1.SCCourseJoinStatusType.CREATOR || scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: messages.dashboard, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse), color: "inherit", variant: "outlined" })), isPaymentsEnabled && ((_a = scCourse.paywalls) === null || _a === void 0 ? void 0 : _a.length) > 0 && (0, jsx_runtime_1.jsx)(BuyButton_1.default, { contentType: types_1.SCContentType.COURSE, content: scCourse }), ((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE &&
-                    (scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER || (scCourse === null || scCourse === void 0 ? void 0 : scCourse.join_status) === types_1.SCCourseJoinStatusType.JOINED)) ||
-                    (scCourse.privacy === types_1.SCCoursePrivacyType.OPEN &&
-                        scCourse.join_status !== types_1.SCCourseJoinStatusType.CREATOR &&
-                        (!isPaymentsEnabled ||
-                            !((_b = scCourse.paywalls) === null || _b === void 0 ? void 0 : _b.length) ||
-                            (isPaymentsEnabled && ((_c = scCourse.paywalls) === null || _c === void 0 ? void 0 : _c.length) > 0 && scCourse.payment_order)))) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: scCourse.user_completion_rate === 0 ? messages.start : scCourse.user_completion_rate === 100 ? messages.review : messages.continue, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, getUrlNextLesson(scCourse)), disabled: getIsNextLessonLocked(scCourse), color: scCourse.user_completion_rate === 100 ? 'inherit' : undefined, variant: scCourse.user_completion_rate === 100 ? 'outlined' : undefined })), scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE &&
-                    (scCourse.join_status === null || scCourse.join_status === types_1.SCCourseJoinStatusType.REQUESTED) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: sentRequest ? messages.cancel : messages.request, color: "inherit", variant: "outlined", loading: loadingRequest, onClick: handleRequest }))] })));
+        return ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionsWrapper }, { children: [(scCourse.join_status === types_1.SCCourseJoinStatusType.CREATOR || scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: BUTTON_MESSAGES.dashboard, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse), color: "inherit", variant: "outlined" })), (((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE || scCourse.privacy === types_1.SCCoursePrivacyType.SECRET) &&
+                    (scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER || scCourse.join_status === types_1.SCCourseJoinStatusType.JOINED)) ||
+                    (scCourse.privacy === types_1.SCCoursePrivacyType.OPEN && scCourse.join_status !== types_1.SCCourseJoinStatusType.CREATOR)) &&
+                    (!isPaymentsEnabled || !((_a = scCourse.paywalls) === null || _a === void 0 ? void 0 : _a.length) || (isPaymentsEnabled && ((_b = scCourse.paywalls) === null || _b === void 0 ? void 0 : _b.length) > 0 && scCourse.payment_order)) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: scCourse.join_status === null
+                        ? BUTTON_MESSAGES.signUp
+                        : scCourse.user_completion_rate === 0
+                            ? BUTTON_MESSAGES.start
+                            : scCourse.user_completion_rate === 100
+                                ? BUTTON_MESSAGES.review
+                                : BUTTON_MESSAGES.continue, to: scCourse.join_status !== null ? scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, getUrlNextLesson(scCourse)) : undefined, disabled: scCourse.join_status !== null ? getIsNextLessonLocked(scCourse) : undefined, color: scCourse.user_completion_rate === 100 ? 'inherit' : undefined, variant: scCourse.user_completion_rate === 100 ? 'outlined' : undefined, loading: scCourse.join_status === null ? loadingRequest : undefined, onClick: scCourse.join_status === null ? handleRequest : undefined })), scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE &&
+                    (scCourse.join_status === null || scCourse.join_status === types_1.SCCourseJoinStatusType.REQUESTED) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: sentRequest ? BUTTON_MESSAGES.cancel : BUTTON_MESSAGES.request, color: "inherit", variant: "outlined", loading: loadingRequest, onClick: handleRequest }))] })));
     }, [scCourse, sentRequest, loadingRequest, handleRequest]);
     if (!scCourse) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
@@ -153,11 +165,12 @@ function Student(inProps) {
                                 to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
                             }), { children: (0, jsx_runtime_1.jsx)(UserAvatar_1.default, Object.assign({ hide: !scCourse.created_by.community_badge, smaller: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { className: classes.avatar, src: scCourse.created_by.avatar, alt: scCourse.created_by.username }) })) })), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!scCourse.created_by.deleted && {
                                         to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, scCourse.created_by)
-                                    }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.created_by.username })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.header.user.creator", defaultMessage: "ui.course.dashboard.header.user.creator" }) }))] })] })), actionButton] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), ((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE &&
+                                    }), { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.created_by.username })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.header.user.creator", defaultMessage: "ui.course.dashboard.header.user.creator" }) }))] })] })), actionButton] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE || scCourse.privacy === types_1.SCCoursePrivacyType.SECRET) &&
                 (scCourse.join_status === types_1.SCCourseJoinStatusType.CREATOR ||
                     scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER ||
                     scCourse.join_status === types_1.SCCourseJoinStatusType.JOINED)) ||
-                scCourse.privacy === types_1.SCCoursePrivacyType.OPEN) && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.margin }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.description", defaultMessage: "ui.course.dashboard.student.description" }) })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.box }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.description })) }))] })), ((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE &&
+                scCourse.privacy === types_1.SCCoursePrivacyType.OPEN ||
+                scCourse.privacy === types_1.SCCoursePrivacyType.DRAFT) && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.margin }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.description", defaultMessage: "ui.course.dashboard.student.description" }) })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.box }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: scCourse.description })) }))] })), (((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE || scCourse.privacy === types_1.SCCoursePrivacyType.SECRET) &&
                 (scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER || scCourse.join_status === types_1.SCCourseJoinStatusType.JOINED)) ||
                 (scCourse.privacy === types_1.SCCoursePrivacyType.OPEN && scCourse.join_status !== types_1.SCCourseJoinStatusType.CREATOR)) && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.margin }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.progress", defaultMessage: "ui.course.dashboard.student.description" }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.box }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.percentageWrapper }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.progress.described", defaultMessage: "ui.course.dashboard.student.progress.described", values: { progress: scCourse.num_lessons_completed, end: scCourse.num_lessons } }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.progress.percentage", defaultMessage: "ui.course.dashboard.student.progress.percentage", values: { percentage: scCourse.user_completion_rate } }) }))] })), (0, jsx_runtime_1.jsx)(material_1.LinearProgress, { className: classes.progress, variant: "determinate", value: scCourse === null || scCourse === void 0 ? void 0 : scCourse.user_completion_rate })] })), scCourse.user_completion_rate === 100 && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: (0, classnames_1.default)(classes.completedWrapper, classes.margin) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h3" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.completed", defaultMessage: "ui.course.dashboard.student.completed" }) })), (0, jsx_runtime_1.jsx)("img", { src: clapping_1.CLAPPING, alt: intl.formatMessage({ id: 'ui.course.dashboard.student.completed', defaultMessage: 'ui.course.dashboard.student.completed' }), width: 32, height: 32 })] }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.margin }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.dashboard.student.contents", defaultMessage: "ui.course.dashboard.student.contents" }) })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.lessonsSections }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.course.table.sections.title", defaultMessage: "ui.course.table.sections.title", values: {
                                         sectionsNumber: scCourse.num_sections

package/lib/cjs/components/CourseForm/CourseForm.js

@@ -97,7 +97,7 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  * @param inProps
  */
 function CourseForm(inProps) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     //PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -186,7 +186,7 @@ function CourseForm(inProps) {
         let courseService;
         if (course) {
             // Update
-            const data = Object.assign(Object.assign({ name: field.name, description: field.description, type: field.type, categories: field.categories }, (field.imageOriginalFile && { image_original: field.imageOriginalFile })), (field.privacy && { privacy: field.privacy }));
+            const data = Object.assign({ name: field.name, description: field.description, type: field.type, categories: field.categories }, (field.privacy && { privacy: field.privacy }));
             courseService = api_services_1.CourseService.updateCourse(course.id, data, {
                 headers: { 'Content-Type': 'application/json' }
             });
@@ -248,11 +248,11 @@ function CourseForm(inProps) {
     /**
      * Renders root object
      */
-    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: _step === Course_1.SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === Course_1.SCCourseFormStepType.GENERAL && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Object.values(types_1.SCCourseTypologyType).map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Card, Object.assign({ className: (0, classnames_1.default)(classes.card, { [classes.selected]: option === field.type }) }, { children: (0, jsx_runtime_1.jsx)(material_1.CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && ((0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [course && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadCourseCover_1.default, { isCreationMode: true, onChange: handleChangeCover }) })), (0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
+    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: _step === Course_1.SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === Course_1.SCCourseFormStepType.GENERAL && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Object.values(types_1.SCCourseTypologyType).map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Card, Object.assign({ className: (0, classnames_1.default)(classes.card, { [classes.selected]: option === field.type }) }, { children: (0, jsx_runtime_1.jsx)(material_1.CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "subtitle2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && ((0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [course && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadCourseCover_1.default, { courseId: (_a = course === null || course === void 0 ? void 0 : course.id) !== null && _a !== void 0 ? _a : null, isCreationMode: !course, onChange: handleChangeCover }) })), (0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
                                         endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Course_1.COURSE_TITLE_MAX_LENGTH - field.name.length }))
                                     }, error: Boolean(field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.name.error.maxLength", defaultMessage: "ui.courseForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                                        endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_a = field.description) === null || _a === void 0 ? void 0 : _a.length) ? Course_1.COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : Course_1.COURSE_DESCRIPTION_MAX_LENGTH })))
-                                    }, error: Boolean(((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" })) : null }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && (0, jsx_runtime_1.jsx)(Edit_1.default, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) })] }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === Course_1.SCCourseFormStepType.GENERAL
+                                        endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) ? Course_1.COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : Course_1.COURSE_DESCRIPTION_MAX_LENGTH })))
+                                    }, error: Boolean(((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" })) : null }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && (0, jsx_runtime_1.jsx)(Edit_1.default, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) })] }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === Course_1.SCCourseFormStepType.GENERAL
                                     ? !field.type || Object.keys(error).length !== 0
                                     : _step === Course_1.SCCourseFormStepType.CUSTOMIZATION &&
                                         (!field.name ||

package/lib/cjs/components/CourseForm/UploadCourseCover.js

@@ -57,7 +57,7 @@ function UploadCourseCover(inProps) {
         props: inProps,
         name: constants_1.PREFIX
     });
-    const { courseId, onChange, className = false, isCreationMode = false } = props, rest = tslib_1.__rest(props, ["courseId", "onChange", "className", "isCreationMode"]);
+    const { courseId = null, onChange, className = false, isCreationMode = false } = props, rest = tslib_1.__rest(props, ["courseId", "onChange", "className", "isCreationMode"]);
     //CONTEXT
     const scUserContext = (0, react_1.useContext)(react_core_1.SCUserContext);
     //STATE
@@ -72,40 +72,44 @@ function UploadCourseCover(inProps) {
     }
     /**
      * Handles file upload
-     * @param course
+     * @param event
      */
-    const handleUpload = (course) => {
-        fileInput = course.target.files[0];
-        if (fileInput) {
-            const reader = new FileReader();
-            reader.onload = (e) => {
-                const img = new Image();
-                img.onload = () => {
-                    isCreationMode ? onChange && onChange(fileInput) : handleSave();
-                };
-                // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-                // @ts-ignore
-                img.src = e.target.result;
+    const handleUpload = (event) => {
+        const selectedFile = event.target.files[0];
+        if (!selectedFile)
+            return;
+        fileInput = selectedFile;
+        const reader = new FileReader();
+        reader.onload = (e) => {
+            const img = new Image();
+            img.onload = () => {
+                if (isCreationMode) {
+                    onChange(fileInput);
+                }
+                else {
+                    onChange(fileInput);
+                    handleSave();
+                }
             };
-            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-            // @ts-ignore
-            reader.readAsDataURL(fileInput);
-        }
+            img.src = e.target.result;
+        };
+        reader.readAsDataURL(selectedFile);
     };
     /**
      * Handles cover saving after upload action
      */
     function handleSave() {
+        if (!fileInput) {
+            return;
+        }
         setLoading(true);
         const formData = new FormData();
-        // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore
         formData.append('image_original', fileInput);
         api_services_1.CourseService.changeCourseCover(courseId, formData, { headers: { 'Content-Type': 'multipart/form-data' } })
-            // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-            // @ts-ignore
             .then((data) => {
-            onChange && onChange(data.image_medium);
+            // onChange && onChange(data.image_medium);
             setLoading(false);
         })
             .catch((error) => {

package/lib/cjs/components/EditCourse/Lessons/FieldName.js

@@ -25,12 +25,12 @@ function FieldName(props) {
     const { endpoint, row, isNewRow, handleManageRow, editMode, handleDisableEditMode } = props;
     // STATES
     const [loading, setLoading] = (0, react_1.useState)(false);
-    const [name, setName] = (0, react_1.useState)(null);
+    const [name, setName] = (0, react_1.useState)(row.name);
     // HOOKS
     const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
     // DEBOUNCE
-    const debounceSetData = (0, material_1.debounce)((name) => {
-        setName(name);
+    const debounceSetData = (0, material_1.debounce)((newName) => {
+        setName(newName);
     }, 300);
     // HANDLERS
     const handleChange = (0, react_1.useCallback)((e) => {

package/lib/cjs/components/EditCourse/Lessons/LessonRow.js

@@ -17,6 +17,7 @@ const react_core_1 = require("@selfcommunity/react-core");
 const Errors_1 = require("../../../constants/Errors");
 const types_1 = require("../types");
 const hooks_1 = require("../hooks");
+const ConfirmDialog_1 = tslib_1.__importDefault(require("../../../shared/ConfirmDialog/ConfirmDialog"));
 const classes = {
     cellWidth: `${constants_1.PREFIX}-cell-width`,
     cellAlignRight: `${constants_1.PREFIX}-cell-align-right`,
@@ -37,13 +38,14 @@ function LessonRow(props) {
     const { provider, course, section, lesson, isNewRow, handleManageLesson } = props;
     // STATES
     const [editMode, setEditMode] = (0, react_1.useState)(false);
+    const [open, setOpen] = (0, react_1.useState)(false);
     // CONTEXTS
     const scRoutingContext = (0, react_core_1.useSCRouting)();
     // HOOKS
     const { isDisabled } = (0, hooks_1.useDisabled)();
     const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
     // HANDLERS
-    const handleAbleEditMode = (0, react_1.useCallback)(() => setTimeout(() => setEditMode(true)), [setEditMode]);
+    const handleAbleEditMode = (0, react_1.useCallback)(() => setTimeout(() => setEditMode(true), 100), [setEditMode]);
     const handleDisableEditMode = (0, react_1.useCallback)(() => setEditMode(false), [setEditMode]);
     const handleDeleteLesson = (0, react_1.useCallback)(() => {
         api_services_1.CourseService.deleteCourseLesson(course.id, section.id, lesson.id)
@@ -62,11 +64,14 @@ function LessonRow(props) {
             });
         });
     }, [course, section, lesson, handleManageLesson]);
+    const handleOpenDialog = (0, react_1.useCallback)(() => {
+        setOpen((prev) => !prev);
+    }, [setOpen]);
     return ((0, jsx_runtime_1.jsxs)(material_1.TableRow, Object.assign({}, provider.draggableProps, { ref: provider.innerRef }, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, { width: "4%" }), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ component: "th", scope: "row" }, provider.dragHandleProps, { className: (0, classnames_1.default)(classes.cellWidth, classes.cellPadding) }, { children: (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ className: classes.tableBodyIconWrapper }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ color: "disabled" }, { children: "drag" })) })) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(FieldName_1.default, { endpoint: {
                         url: () => isNewRow
                             ? api_services_1.Endpoints.CreateCourseLesson.url({ id: course.id, section_id: section.id })
                             : api_services_1.Endpoints.PatchCourseLesson.url({ id: course.id, section_id: section.id, lesson_id: lesson.id }),
                         method: isNewRow ? api_services_1.Endpoints.CreateCourseLesson.method : api_services_1.Endpoints.PatchCourseLesson.method
-                    }, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, {}), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ className: classes.cellAlignRight }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionsWrapper }, { children: [(0, jsx_runtime_1.jsx)(ChangeLessonStatus_1.default, { course: course, section: section, lesson: lesson, disabled: isDisabled }), (0, jsx_runtime_1.jsxs)(MenuRow_1.default, Object.assign({ disabled: isDisabled }, { children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.edit", defaultMessage: "ui.editCourse.tab.lessons.table.menu.edit" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.view", defaultMessage: "ui.editCourse.tab.lessons.table.menu.view" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleAbleEditMode }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.rename", defaultMessage: "ui.editCourse.tab.lessons.table.menu.rename" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleDeleteLesson }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.delete", defaultMessage: "ui.editCourse.tab.lessons.table.menu.delete" }) })) }))] }))] })) }))] })));
+                    }, row: lesson, isNewRow: isNewRow, handleManageRow: handleManageLesson, editMode: editMode, handleDisableEditMode: handleDisableEditMode }) }), (0, jsx_runtime_1.jsx)(material_1.TableCell, {}), (0, jsx_runtime_1.jsxs)(material_1.TableCell, Object.assign({ className: classes.cellAlignRight }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionsWrapper }, { children: [(0, jsx_runtime_1.jsx)(ChangeLessonStatus_1.default, { course: course, section: section, lesson: lesson, disabled: isDisabled }), (0, jsx_runtime_1.jsxs)(MenuRow_1.default, Object.assign({ disabled: isDisabled }, { children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_EDIT_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.edit", defaultMessage: "ui.editCourse.tab.lessons.table.menu.edit" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ component: react_core_1.Link, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, getUrlLesson(course, section, lesson)) }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.view", defaultMessage: "ui.editCourse.tab.lessons.table.menu.view" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleAbleEditMode }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.rename", defaultMessage: "ui.editCourse.tab.lessons.table.menu.rename" }) })) })), (0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ onClick: handleOpenDialog }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.editCourse.tab.lessons.table.menu.delete", defaultMessage: "ui.editCourse.tab.lessons.table.menu.delete" }) })) }))] }))] })), open && (0, jsx_runtime_1.jsx)(ConfirmDialog_1.default, { open: true, onClose: handleOpenDialog, onConfirm: handleDeleteLesson })] }))] })));
 }
 exports.default = (0, react_1.memo)(LessonRow);