@selfcommunity/react-ui 0.10.2-courses.186 → 0.10.2-courses.187

package/lib/esm/components/EditCourse/Lessons.js

@@ -7,19 +7,19 @@ import { CourseService } from '@selfcommunity/api-services';
 import { Logger } from '@selfcommunity/utils';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { useSnackbar } from 'notistack';
-import { Box, Icon, Stack, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography } from '@mui/material';
+import { Box, Stack, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography } from '@mui/material';
 import Status from './Status';
 import EmptyStatus from '../../shared/EmptyStatus';
 import AddButton from './Lessons/AddButton';
 import SectionRow from './Lessons/SectionRow';
 import { ActionLessonType, RowType } from './types';
 import { useIsDisabled } from './hooks';
-import classNames from 'classnames';
 import ConfirmDialog from '../../shared/ConfirmDialog/ConfirmDialog';
+import CourseTypePopover from '../../shared/CourseTypePopover';
+import classNames from 'classnames';
 const classes = {
     lessonTitle: `${PREFIX}-lesson-title`,
     lessonInfoWrapper: `${PREFIX}-lesson-info-wrapper`,
-    lessonInfo: `${PREFIX}-lesson-info`,
     lessonsSectionsWrapper: `${PREFIX}-lessons-sections-wrapper`,
     lessonsSections: `${PREFIX}-lessons-sections`,
     circle: `${PREFIX}-circle`,
@@ -33,8 +33,7 @@ const classes = {
     cellAlignCenter: `${PREFIX}-cell-align-center`,
     lessonEmptyStatus: `${PREFIX}-lesson-empty-status`,
     emptyStatusButton: `${PREFIX}-empty-status-button`,
-    contrastColor: `${PREFIX}-contrast-color`,
-    contrastBgColor: `${PREFIX}-contrast-bg-color`
+    contrastColor: `${PREFIX}-contrast-color`
 };
 const headerCells = [
     {
@@ -52,7 +51,7 @@ const headerCells = [
 ];
 function Lessons(props) {
     // PROPS
-    const { course, setCourse } = props;
+    const { course, setCourse, handleTabChange } = props;
     // STATES
     const [sections, setSections] = useState([]);
     const [dialog, setDialog] = useState(null);
@@ -179,15 +178,10 @@ function Lessons(props) {
         }
         handleOpenDialog(null);
     }, [dialog, handleOpenDialog]);
-    return (_jsxs(Box, { children: [_jsx(Typography, Object.assign({ className: classNames(classes.lessonTitle, classes.contrastColor), variant: "h4" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons", defaultMessage: "ui.editCourse.tab.lessons" }) })), _jsxs(Stack, Object.assign({ className: classes.lessonInfoWrapper }, { children: [_jsxs(Stack, Object.assign({ className: classes.lessonInfo }, { children: [_jsx(Icon, Object.assign({ className: classes.contrastColor }, { children: "courses" })), _jsx(Typography, Object.assign({ variant: "body2", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.course.type", defaultMessage: "ui.course.type", values: {
-                                        typeOfCourse: intl.formatMessage({
-                                            id: `ui.course.type.${course.type}`,
-                                            defaultMessage: `ui.course.type.${course.type}`
-                                        })
-                                    } }) }))] })), _jsx(Status, { course: course })] })), sections.length === 0 && (_jsx(EmptyStatus, { icon: "courses", title: "ui.editCourse.tab.lessons.table.empty.title", description: "ui.editCourse.tab.lessons.table.empty.description", actions: _jsx(AddButton, { className: classes.emptyStatusButton, label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "inherit", variant: "outlined" }), className: classNames(classes.lessonEmptyStatus, classes.contrastBgColor) })), sections.length > 0 && (_jsxs(Fragment, { children: [_jsxs(Stack, Object.assign({ className: classNames(classes.lessonsSectionsWrapper, classes.contrastBgColor) }, { children: [_jsxs(Stack, Object.assign({ className: classes.lessonsSections }, { children: [_jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.course.table.sections.title", defaultMessage: "ui.course.table.sections.title", values: {
+    return (_jsxs(Box, { children: [_jsx(Typography, Object.assign({ className: classNames(classes.lessonTitle, classes.contrastColor), variant: "h4" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.lessons", defaultMessage: "ui.editCourse.tab.lessons" }) })), _jsxs(Stack, Object.assign({ className: classes.lessonInfoWrapper }, { children: [_jsx(CourseTypePopover, { course: course }), _jsx(Status, { course: course, handleTabChange: handleTabChange })] })), sections.length === 0 && (_jsx(EmptyStatus, { icon: "courses", title: "ui.editCourse.tab.lessons.table.empty.title", description: "ui.editCourse.tab.lessons.table.empty.description", actions: _jsx(AddButton, { className: classes.emptyStatusButton, label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "inherit", variant: "outlined" }), className: classes.lessonEmptyStatus })), sections.length > 0 && (_jsxs(Fragment, { children: [_jsxs(Stack, Object.assign({ className: classes.lessonsSectionsWrapper }, { children: [_jsxs(Stack, Object.assign({ className: classes.lessonsSections }, { children: [_jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.course.table.sections.title", defaultMessage: "ui.course.table.sections.title", values: {
                                                 sectionsNumber: course.num_sections
                                             } }) })), _jsx(Box, { className: classes.circle }), _jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.course.table.lessons.title", defaultMessage: "ui.course.table.lessons.title", values: {
                                                 lessonsNumber: course.num_lessons
-                                            } }) }))] })), _jsx(AddButton, { label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "primary", variant: "contained", disabled: isDisabled })] })), _jsx(DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: _jsx(TableContainer, Object.assign({ className: classNames(classes.tableContainer, classes.contrastBgColor) }, { children: _jsxs(Table, Object.assign({ className: classes.table }, { children: [_jsx(TableHead, Object.assign({ className: classes.tableHeader }, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { className: classes.cellWidth }), headerCells.map((cell, i) => (_jsx(TableCell, Object.assign({ className: cell.className }, { children: _jsx(Typography, Object.assign({ className: classes.tableHeaderTypography, variant: "overline" }, { children: _jsx(FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i)))] }) })), _jsx(Droppable, Object.assign({ droppableId: "droppable-1" }, { children: (outerProvider) => (_jsxs(TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { className: classes.tableBody }, { children: [sections.map((section, i, array) => (_jsx(Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => (_jsx(SectionRow, { course: course, provider: innerProvider, section: section, isNewRow: isNewRow && i + 1 === array.length, handleManageSection: handleManageSection, handleOpenDialog: handleOpenDialog, ref: ref }, i)) }), i))), outerProvider.placeholder] }))) }))] })) })) })), dialog && _jsx(ConfirmDialog, { open: true, onClose: () => handleOpenDialog(null), onConfirm: handleDeleteRow })] }))] }));
+                                            } }) }))] })), _jsx(AddButton, { label: "ui.editCourse.tab.lessons.table.section", handleAddRow: handleAddTempSection, color: "primary", variant: "contained", disabled: isDisabled })] })), _jsx(DragDropContext, Object.assign({ onDragEnd: handleDragEnd }, { children: _jsx(TableContainer, Object.assign({ className: classes.tableContainer }, { children: _jsxs(Table, Object.assign({ className: classes.table }, { children: [_jsx(TableHead, Object.assign({ className: classes.tableHeader }, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { className: classes.cellWidth }), headerCells.map((cell, i) => (_jsx(TableCell, Object.assign({ className: cell.className }, { children: _jsx(Typography, Object.assign({ className: classes.tableHeaderTypography, variant: "overline" }, { children: _jsx(FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i)))] }) })), _jsx(Droppable, Object.assign({ droppableId: "droppable-1" }, { children: (outerProvider) => (_jsxs(TableBody, Object.assign({ ref: outerProvider.innerRef }, outerProvider.droppableProps, { className: classes.tableBody }, { children: [sections.map((section, i, array) => (_jsx(Draggable, Object.assign({ draggableId: i.toString(), index: i, isDragDisabled: isDisabled }, { children: (innerProvider) => (_jsx(SectionRow, { course: course, provider: innerProvider, section: section, isNewRow: isNewRow && i + 1 === array.length, handleManageSection: handleManageSection, handleOpenDialog: handleOpenDialog, ref: ref }, i)) }), i))), outerProvider.placeholder] }))) }))] })) })) })), dialog && _jsx(ConfirmDialog, { open: true, onClose: () => handleOpenDialog(null), onConfirm: handleDeleteRow })] }))] }));
 }
 export default memo(Lessons);

package/lib/esm/components/EditCourse/Options.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Divider, Stack, Typography } from '@mui/material';
+import { Box, Stack, Typography } from '@mui/material';
 import { FormattedMessage } from 'react-intl';
 import { PREFIX } from './constants';
-import { Fragment, memo, useCallback, useState } from 'react';
+import { memo, useCallback, useState } from 'react';
 import { Logger } from '@selfcommunity/utils';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import { useSnackbar } from 'notistack';
@@ -10,12 +10,11 @@ import SwitchForm from './Options/SwitchForm';
 import useDeepCompareEffect from 'use-deep-compare-effect';
 import { LoadingButton } from '@mui/lab';
 import { CourseService } from '@selfcommunity/api-services';
-import classNames from 'classnames';
 const classes = {
+    optionsContainer: `${PREFIX}-options-container`,
     optionsWrapper: `${PREFIX}-options-wrapper`,
     optionsDivider: `${PREFIX}-options-divider`,
-    optionsButtonWrapper: `${PREFIX}-options-button-wrapper`,
-    contrastBgColor: `${PREFIX}-contrast-bg-color`
+    optionsButtonWrapper: `${PREFIX}-options-button-wrapper`
 };
 const OPTIONS = {
     enforce_lessons_order: {
@@ -89,6 +88,6 @@ function Options(props) {
             });
         });
     }, [course, tempOptions, setCanSave, setLoading]);
-    return (_jsxs(Fragment, { children: [_jsx(Stack, Object.assign({ className: classNames(classes.optionsWrapper, classes.contrastBgColor) }, { children: Object.entries(OPTIONS).map(([key, value], i) => (_jsx(SwitchForm, { name: key, title: value.title, description: value.description, checked: course[key], handleChangeOptions: handleChange }, i))) })), _jsx(Divider, { className: classNames(classes.optionsDivider, classes.contrastBgColor) }), _jsx(Stack, Object.assign({ className: classNames(classes.optionsButtonWrapper, classes.contrastBgColor) }, { children: _jsx(LoadingButton, Object.assign({ size: "small", variant: "contained", disabled: !canSave, onClick: handleSubmit, loading: loading }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.options.button.save", defaultMessage: "ui.editCourse.tab.options.button.save" }) })) })) }))] }));
+    return (_jsxs(Box, Object.assign({ className: classes.optionsContainer }, { children: [_jsx(Stack, Object.assign({ className: classes.optionsWrapper }, { children: Object.entries(OPTIONS).map(([key, value], i) => (_jsx(SwitchForm, { name: key, title: value.title, description: value.description, checked: course[key], handleChangeOptions: handleChange }, i))) })), _jsx(Stack, Object.assign({ className: classes.optionsButtonWrapper }, { children: _jsx(LoadingButton, Object.assign({ size: "small", variant: "contained", disabled: !canSave, onClick: handleSubmit, loading: loading }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.options.button.save", defaultMessage: "ui.editCourse.tab.options.button.save" }) })) })) }))] })));
 }
 export default memo(Options);

package/lib/esm/components/EditCourse/Requests.d.ts

@@ -1,8 +1,10 @@
-/// <reference types="react" />
+import { SyntheticEvent } from 'react';
 import { SCCourseType } from '@selfcommunity/types';
+import { SCCourseEditTabType } from '../../types/course';
 interface RequestsProps {
     course: SCCourseType;
     endpointQueryParams?: Record<string, string | number>;
+    handleTabChange: (_e: SyntheticEvent, newTabValue: SCCourseEditTabType) => void;
 }
 declare function Requests(props: RequestsProps): JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof Requests>;

package/lib/esm/components/EditCourse/Requests.js

@@ -13,8 +13,10 @@ import { CourseService } from '@selfcommunity/api-services';
 import { PREFIX } from './constants';
 import PubSub from 'pubsub-js';
 import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
+import { SCCourseUsersTableModeType } from '../../types/course';
 const classes = {
-    usersStatusWrapper: `${PREFIX}-users-status-wrapper`
+    usersStatusWrapper: `${PREFIX}-users-status-wrapper`,
+    contrastColor: `${PREFIX}-contrast-color`
 };
 const headerCells = [
     {
@@ -33,7 +35,7 @@ function Requests(props) {
     const { course, endpointQueryParams = {
         limit: 6,
         offset: DEFAULT_PAGINATION_OFFSET
-    } } = props;
+    }, handleTabChange } = props;
     // STATES
     const [state, dispatch] = useReducer(dataWidgetReducer, {
         isLoadingPrevious: false,
@@ -84,6 +86,6 @@ function Requests(props) {
             updatedUsers.current && PubSub.unsubscribe(updatedUsers.current);
         };
     }, [handleRemoveUser]);
-    return (_jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: "h6" }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.requests.title", defaultMessage: "ui.editCourse.tab.requests.title", values: { requestsNumber: state.results.length } }) })), _jsx(Stack, Object.assign({ className: classes.usersStatusWrapper }, { children: _jsx(Status, { course: course }) })), _jsx(CourseUsersTable, { course: course, state: state, dispatch: dispatch, headerCells: headerCells, mode: "requests", emptyStatusTitle: "ui.courseUsersTable.empty.requests.title" })] }));
+    return (_jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: "h6", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.requests.title", defaultMessage: "ui.editCourse.tab.requests.title", values: { requestsNumber: state.results.length } }) })), _jsx(Stack, Object.assign({ className: classes.usersStatusWrapper }, { children: _jsx(Status, { course: course, handleTabChange: handleTabChange }) })), _jsx(CourseUsersTable, { course: course, state: state, dispatch: dispatch, headerCells: headerCells, mode: SCCourseUsersTableModeType.REQUESTS, emptyStatusTitle: "ui.courseUsersTable.empty.requests.title" })] }));
 }
 export default memo(Requests);

package/lib/esm/components/EditCourse/Status.d.ts

@@ -1,6 +1,9 @@
 import { SCCourseType } from '@selfcommunity/types';
+import { SyntheticEvent } from 'react';
+import { SCCourseEditTabType } from '../../types';
 interface StatusProps {
     course: SCCourseType;
+    handleTabChange: (_e: SyntheticEvent, newTabValue: SCCourseEditTabType) => void;
 }
 export default function Status(props: StatusProps): JSX.Element;
 export {};

package/lib/esm/components/EditCourse/Status.js

@@ -1,23 +1,29 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Chip, Typography } from '@mui/material';
+import { Button, Chip, Typography } from '@mui/material';
 import { useIntl } from 'react-intl';
 import { PREFIX } from './constants';
 import { SCCoursePrivacyType } from '@selfcommunity/types';
 import classNames from 'classnames';
+import { useCallback } from 'react';
+import { SCCourseEditTabType } from '../../types';
 const classes = {
     status: `${PREFIX}-status`,
-    contrastBgColor: `${PREFIX}-contrast-bg-color`
+    contrastColor: `${PREFIX}-contrast-color`
 };
 export default function Status(props) {
     // STATES
-    const { course } = props;
+    const { course, handleTabChange } = props;
     // HOOKS
     const intl = useIntl();
-    return (_jsx(Chip, { label: _jsx(Typography, Object.assign({ variant: "body1" }, { children: intl.formatMessage({ id: 'ui.editCourse.tab.lessons.status', defaultMessage: 'ui.editCourse.tab.lessons.status' }, {
-                status: intl.formatMessage({
-                    id: `ui.course.privacy.${course.privacy === SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`,
-                    defaultMessage: `ui.course.privacy.${course.privacy === SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`
-                }),
-                b: (chunks) => (_jsx(Typography, Object.assign({ component: "b", fontWeight: "bold" }, { children: chunks })))
-            }) })), className: classNames(classes.status, classes.contrastBgColor) }));
+    // HANDLERS
+    const handleClick = useCallback(() => {
+        handleTabChange(null, SCCourseEditTabType.CUSTOMIZE);
+    }, [handleTabChange]);
+    return (_jsx(Chip, { label: _jsx(Button, Object.assign({ size: "small", variant: "text", color: "inherit", onClick: handleClick }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: intl.formatMessage({ id: 'ui.editCourse.tab.lessons.status', defaultMessage: 'ui.editCourse.tab.lessons.status' }, {
+                    status: intl.formatMessage({
+                        id: `ui.course.privacy.${course.privacy === SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`,
+                        defaultMessage: `ui.course.privacy.${course.privacy === SCCoursePrivacyType.DRAFT ? 'draft' : course.privacy}`
+                    }),
+                    b: (chunks) => (_jsx(Typography, Object.assign({ component: "b", fontWeight: "bold" }, { children: chunks })))
+                }) })) })), className: classNames(classes.status, classes.contrastColor) }));
 }

package/lib/esm/components/EditCourse/Users.d.ts

@@ -1,8 +1,10 @@
-/// <reference types="react" />
+import { SyntheticEvent } from 'react';
 import { SCCourseType } from '@selfcommunity/types';
+import { SCCourseEditTabType } from '../../types/course';
 interface UsersProps {
     course: SCCourseType;
     endpointQueryParams?: Record<string, string | number>;
+    handleTabChange: (_e: SyntheticEvent, newTabValue: SCCourseEditTabType) => void;
 }
 declare function Users(props: UsersProps): JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof Users>;

package/lib/esm/components/EditCourse/Users.js

@@ -15,10 +15,10 @@ import { actionWidgetTypes, dataWidgetReducer, stateWidgetInitializer } from '..
 import { CourseService, Endpoints } from '@selfcommunity/api-services';
 import PubSub from 'pubsub-js';
 import { SCGroupEventType, SCTopicType } from '../../constants/PubSub';
+import { SCCourseUsersTableModeType } from '../../types/course';
 const classes = {
     usersStatusWrapper: `${PREFIX}-users-status-wrapper`,
-    contrastColor: `${PREFIX}-contrast-color`,
-    contrastBgColor: `${PREFIX}-contrast-bg-color`
+    contrastColor: `${PREFIX}-contrast-color`
 };
 const headerCells = [
     {
@@ -40,7 +40,7 @@ function Users(props) {
         limit: 6,
         offset: DEFAULT_PAGINATION_OFFSET,
         statuses: JSON.stringify(['joined', 'manager', 'creator'])
-    } } = props;
+    }, handleTabChange } = props;
     // STATES
     const [state, dispatch] = useReducer(dataWidgetReducer, {
         isLoadingNext: false,
@@ -113,9 +113,9 @@ function Users(props) {
             });
         });
     }, [course, dispatch]);
-    return (_jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: "h6", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.users.title", defaultMessage: "ui.editCourse.tab.users.title", values: { usersNumber: state.results.length } }) })), _jsxs(Stack, Object.assign({ className: classes.usersStatusWrapper }, { children: [_jsx(Status, { course: course }), _jsx(AddUsersButton, { label: "ui.editCourse.tab.users.addUsersButton.label", endpoint: {
+    return (_jsxs(Box, { children: [_jsx(Typography, Object.assign({ variant: "h6", className: classes.contrastColor }, { children: _jsx(FormattedMessage, { id: "ui.editCourse.tab.users.title", defaultMessage: "ui.editCourse.tab.users.title", values: { usersNumber: state.results.length } }) })), _jsxs(Stack, Object.assign({ className: classes.usersStatusWrapper }, { children: [_jsx(Status, { course: course, handleTabChange: handleTabChange }), _jsx(AddUsersButton, { label: "ui.editCourse.tab.users.addUsersButton.label", endpoint: {
                             url: () => Endpoints.GetCourseSuggestedUsers.url({ id: course.id }),
                             method: Endpoints.GetCourseSuggestedUsers.method
-                        }, onConfirm: handleConfirm, className: classes.contrastBgColor })] })), _jsx(CourseUsersTable, { course: course, state: state, dispatch: dispatch, headerCells: headerCells, mode: "edit", emptyStatusTitle: "ui.courseUsersTable.empty.users.title", emptyStatusDescription: "ui.courseUsersTable.empty.users.description" })] }));
+                        }, onConfirm: handleConfirm })] })), _jsx(CourseUsersTable, { course: course, state: state, dispatch: dispatch, headerCells: headerCells, mode: SCCourseUsersTableModeType.EDIT, emptyStatusTitle: "ui.courseUsersTable.empty.users.title", emptyStatusDescription: "ui.courseUsersTable.empty.users.description" })] }));
 }
 export default memo(Users);

package/lib/esm/index.d.ts

@@ -159,6 +159,7 @@ import BaseItem, { BaseItemProps } from './shared/BaseItem';
 import Calendar, { CalendarProps } from './shared/Calendar';
 import ConfirmDialog from './shared/ConfirmDialog/ConfirmDialog';
 import CourseUsersTable, { CourseUsersTableProps, CourseUsersTableSkeleton } from './shared/CourseUsersTable';
+import CourseTypePopover, { CourseTypePopoverProps } from './shared/CourseTypePopover';
 import EmailTextField from './shared/EmailTextField';
 import EventActionsMenu, { EventActionsMenuProps } from './shared/EventActionsMenu';
 import EventInfoDetails, { EventInfoDetailsProps } from './shared/EventInfoDetails';
@@ -209,4 +210,4 @@ import DefaultCoverSelfCommunity from './assets/deafultCover';
 /**
  * List all exports
  */
-export { AcceptRequestUserEventButton, AcceptRequestUserEventButtonProps, AccountChangeMailValidation, AccountChangeMailValidationProps, AccountDataPortability, AccountDataPortabilityButton, AccountDataPortabilityButtonProps, AccountDataPortabilityProps, AccountDelete, AccountDeleteButton, AccountDeleteButtonProps, AccountDeleteProps, AccountRecover, AccountRecoverProps, AccountReset, AccountResetProps, AccountVerify, AccountVerifyProps, AvatarGroupSkeleton, BaseDialog, BaseDialogProps, BaseItem, BaseItemProps, BaseLightbox, BaseLightboxProps, BottomNavigation, BottomNavigationProps, BroadcastMessages, BroadcastMessagesProps, BroadcastMessagesSkeleton, bytesToSize, generateRoomId, randomString, decodePassphrase, encodePassphrase, Calendar, CalendarProps, Categories, CategoriesPopularWidget, CategoriesPopularWidgetSkeleton, CategoriesProps, CategoriesSkeleton, CategoriesSkeletonProps, CategoriesSuggestionWidget, CategoriesSuggestionWidgetProps, CategoriesSuggestionWidgetSkeleton, Category, CategoryAutocomplete, CategoryAutocompleteProps, CategoryFollowButton, CategoryFollowButtonProps, CategoryFollowersButton, CategoryFollowersButtonProps, CategoryHeader, CategoryHeaderProps, CategoryHeaderSkeleton, CategoryProps, CategorySkeleton, CategoryTrendingFeedWidget, CategoryTrendingFeedWidgetProps, CategoryTrendingFeedWidgetSkeleton, CategoryTrendingPeopleWidgetSkeleton, CategoryTrendingUsersWidget, CategoryTrendingUsersWidgetProps, CentralProgress, ChangeCover, ChangeCoverProps, ChangeGroupCover, ChangeGroupCoverProps, ChangeGroupPicture, ChangeGroupPictureProps, ChangePicture, ChangePictureProps, CommentObject, CommentObjectProps, CommentObjectReply, CommentObjectReplyProps, CommentObjectSkeleton, CommentsFeedObject, CommentsFeedObjectProps, CommentsFeedObjectSkeleton, CommentsObject, CommentsObjectProps, CommentsObjectSkeleton, Composer, ComposerIconButton, ComposerIconButtonProps, ComposerProps, ConfirmDialog, ConnectionUserButton, ConsentSolution, ConsentSolutionButton, ConsentSolutionButtonProps, ConsentSolutionProps, ConsentSolutionSkeleton, ContributionUtils, SCCourseEditTabType, Course, CourseProps, CourseSkeleton, CourseSkeletonProps, CourseJoinButton, CourseJoinButtonProps, Courses, CreateCourseButton, CreateCourseButtonProps, CoursesProps, CoursesSkeleton, CoursesSkeletonProps, CourseContentMenu, CourseContentMenuProps, CourseDashboard, TeacherCourseDashboardProps, TeacherSkeleton, StudentCourseDashboardProps, StudentSkeleton, CreateEventButton, CreateEventButtonProps, CreateEventWidget, CreateEventWidgetProps, CreateEventWidgetSkeleton, CreateGroupButton, EventForm, EventFormProps, EventFormDialog, EventFormDialogProps, CreateGroupButtonProps, CustomAdv, CustomAdvProps, CustomAdvSkeleton, DEFAULT_FIELDS, DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PRELOAD_OFFSET_VIEWPORT, DEFAULT_WIDGETS_NUMBER, DefaultDrawerContent, DefaultDrawerContentProps, DefaultHeaderContent, DefaultHeaderContentProps, DefaultDrawerSkeleton, DefaultDrawerSkeletonProps, EditEventButton, EditEventButtonProps, EditGroupButton, EditGroupButtonProps, EditMediaProps, Editor, EditorProps, EditorSkeleton, EmailTextField, EditCourse, EditCourseProps, EditCourseSkeleton, Event, EventActionsMenu, EventActionsMenuProps, EventHeader, EventHeaderProps, EventHeaderSkeleton, EventInfoDetails, EventInfoDetailsProps, EventInfoWidget, EventInfoWidgetProps, EventInviteButton, EventInviteButtonProps, EventLocationWidget, EventLocationWidgetProps, EventLocationWidgetSkeleton, EventMediaWidget, EventMediaWidgetProps, EventMediaWidgetSkeleton, EventMembersWidget, EventMembersWidgetProps, EventMembersWidgetSkeleton, EventParticipantsButton, EventParticipantsButtonProps, EventProps, Events, EventSkeleton, EventSkeletonProps, EventsProps, EventsSkeleton, EventsSkeletonProps, FACEBOOK_SHARE, Feed, FeedObject, FeedObjectMediaPreview, FeedObjectMediaPreviewProps, FeedObjectProps, FeedObjectSkeleton, FeedProps, FeedRef, FeedSidebarProps, FeedSkeleton, FeedUpdatesWidget, FeedUpdatesWidgetProps, FeedUpdatesWidgetSkeleton, File, FollowUserButton, FollowUserButtonProps, Footer, FooterProps, FooterSkeleton, FriendshipButtonProps, FriendshipUserButton, GenericSkeleton, getRelativeTime, getUnseenNotification, getUnseenNotificationCounter, Group, GroupActionsMenu, GroupActionsMenuProps, GroupForm, GroupFormProps, GroupHeader, GroupHeaderProps, GroupHeaderSkeleton, GroupInfoWidget, GroupInfoWidgetProps, GroupInfoWidgetSkeleton, GroupInviteButton, GroupInviteButtonProps, GroupInvitedWidget, GroupInvitedWidgetProps, GroupInvitedWidgetSkeleton, GroupMembersButton, GroupMembersButtonProps, GroupMembersWidget, GroupMembersWidgetProps, GroupMembersWidgetSkeleton, GroupProps, GroupRequestsWidget, GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton, Groups, GroupSettingsIconButton, GroupSettingsIconButtonProps, GroupSkeleton, GroupsProps, GroupsSkeleton, GroupSubscribeButton, GroupSubscribeButtonProps, AccordionLessons, AccordionLessonsProps, AccordionLessonsSkeleton, AddUsersButton, AddUsersButtonProps, CourseUsersTable, CourseUsersTableProps, CourseUsersTableSkeleton, EmptyStatus, EmptyStatusProps, HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorDetailProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorProps, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, InfiniteScroll, ScrollContainer, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, InviteUserEventButton, LessonAppbar, LessonAppbarProps, LessonDrawer, LessonDrawerProps, LessonEditForm, LessonEditFormProps, LessonObject, LessonObjectProps, InviteUserEventButtonProps, LanguageSwitcher, LEGAL_POLICIES, CourseCompletedDialog, CourseCompletedDialogProps, Lightbox, LightboxProps, Link, LINKEDIN_SHARE, LocationAutocomplete, LocationAutocompleteProps, LogoSelfCommunity, DefaultCoverSelfCommunity, LoyaltyProgramWidget, LoyaltyProgramWidgetProps, LoyaltyProgramWidgetSkeleton, MAX_PRELOAD_OFFSET_VIEWPORT, MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO, SCCourseFormStepType, MediaChunkUploader, MediaChunkUploaderProps, MessageUploaderUtils, MetadataField, MetadataFieldProps, MIN_PRELOAD_OFFSET_VIEWPORT, MyEventsWidget, MyEventsWidgetProps, MyEventsWidgetSkeleton, NavigationMenuContent, NavigationMenuDrawer, NavigationMenuDrawerProps, NavigationMenuHeader, NavigationMenuIconButton, NavigationMenuIconButtonProps, NavigationSettingsIconButton, NavigationSettingsIconButtonProps, NavigationSettingsItem, NavigationToolbar, NavigationToolbarMobile, NavigationToolbarMobileProps, NavigationToolbarMobileSkeleton, NavigationToolbarProps, NavigationToolbarSkeleton, Notification, NotificationProps, NotificationSkeleton, OnBoardingWidget, OnBoardingWidgetProps, OnBoardingWidgetSkeleton, PasswordTextField, PhoneTextField, PlatformWidget, PlatformWidgetActionType, PlatformWidgetProps, PlatformWidgetSkeleton, PollSuggestionWidget, PollSuggestionWidgetProps, PrivateMessageComponent, PrivateMessageComponentProps, PrivateMessageComponentSkeleton, PrivateMessageEditor, PrivateMessageEditorProps, PrivateMessageEditorSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSettingsIconButtonProps, PrivateMessageSnippetItem, PrivateMessageSnippetItemProps, PrivateMessageSnippetItemSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsProps, PrivateMessageSnippetsSkeleton, PrivateMessageThread, PrivateMessageThreadItem, PrivateMessageThreadItemProps, PrivateMessageThreadItemSkeleton, PrivateMessageThreadProps, PrivateMessageThreadSkeleton, ProgressBar, ProgressBarProps, RelatedEventsWidget, RelatedEventsWidgetProps, RelatedEventsWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectsWidgetSkeleton, RelatedFeedObjectWidgetProps, ReplyComment, SCBroadcastMessageTemplateType, SCCommentsOrderBy, SCEventMembersEventType, SCEventTemplateType, SCFeedObjectActivitiesType, SCFeedObjectTemplateType, SCFeedWidgetType, SCGroupMembersEventType, SCMediaChunkType, SCMediaObjectType, SCNotificationObjectTemplateType, SCUserProfileFields, SCUserProfileSettings, SCUserSocialAssociations, SearchAutocomplete, SearchAutocompleteProps, SearchDialog, SearchDialogProps, Share, SnippetNotifications, SnippetNotificationsProps, SnippetNotificationsSkeleton, StickyBox, StickyBoxComponent, StickyBoxProps, SuggestedEventsWidget, TagAutocomplete, TagAutocompleteProps, SuggestedEventsWidgetProps, SuggestedEventsWidgetSkeleton, TagChip, TagChipProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserActionIconButtonProps, UserAvatar, UserAvatarProps, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserCounters, UserCountersProps, UserCreatedCoursesWidget, UserCreatedCoursesWidgetProps, UserCreatedCoursesWidgetSkeleton, UserDeletedSnackBar, UserDeletedSnackBarProps, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetProps, UserFollowedCategoriesWidgetSkeleton, UserFollowedUsersWidget, UserFollowedUsersWidgetProps, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetProps, UserFollowersWidgetSkeleton, UserInfo, UserInfoDialog, UserInfoDialogProps, UserInfoProps, UserInfoSkeleton, UsernameTextField, UserProfileBlocked, UserProfileBlockedProps, UserProfileEdit, UserProfileEditProps, UserProfileEditSectionAccount, UserProfileEditSectionAccountProps, UserProfileEditSectionPublicInfo, UserProfileEditSectionPublicInfoProps, UserProfileEditSectionSettings, UserProfileEditSectionSettingsProps, UserProfileEditSkeleton, UserProfileHeader, UserProfileHeaderProps, UserProfileHeaderSkeleton, UserProps, UserSkeleton, UserSocialAssociation, UserSocialAssociationProps, UserSubscribedGroupsWidget, UserSubscribedGroupsWidgetProps, UserSubscribedGroupsWidgetSkeleton, UserSuggestionWidget, UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton, UserLiveStreamWidget, UserLiveStreamWidgetProps, UserLiveStreamWidgetSkeleton, useStickyBox, UseStickyBoxProps, LiveStream, LiveStreamProps, LiveStreamSkeletonProps, LiveStreamSkeleton, LiveStreamInfoDetails, LiveStreamInfoDetailsProps, UpScalingTierBadge, UpScalingTierProps, CreateLiveStreamDialog, CreateLiveStreamDialogProps, CreateLiveStreamButton, CreateLiveStreamButtonProps, LiveStreamForm, LiveStreamFormProps, LiveStreamRoom, LiveStreamRoomProps, LiveStreamVideoConference, LiveStreamVideoConferenceProps, VirtualScrollerItemProps, SCCourseTemplateType, SCLessonActionsType, SCLessonModeType, Widget, WidgetProps, X_SHARE, PROVIDER_ICONS_CONTAINED, PROVIDER_ICONS_OUTLINED };
+export { AcceptRequestUserEventButton, AcceptRequestUserEventButtonProps, AccountChangeMailValidation, AccountChangeMailValidationProps, AccountDataPortability, AccountDataPortabilityButton, AccountDataPortabilityButtonProps, AccountDataPortabilityProps, AccountDelete, AccountDeleteButton, AccountDeleteButtonProps, AccountDeleteProps, AccountRecover, AccountRecoverProps, AccountReset, AccountResetProps, AccountVerify, AccountVerifyProps, AvatarGroupSkeleton, BaseDialog, BaseDialogProps, BaseItem, BaseItemProps, BaseLightbox, BaseLightboxProps, BottomNavigation, BottomNavigationProps, BroadcastMessages, BroadcastMessagesProps, BroadcastMessagesSkeleton, bytesToSize, generateRoomId, randomString, decodePassphrase, encodePassphrase, Calendar, CalendarProps, Categories, CategoriesPopularWidget, CategoriesPopularWidgetSkeleton, CategoriesProps, CategoriesSkeleton, CategoriesSkeletonProps, CategoriesSuggestionWidget, CategoriesSuggestionWidgetProps, CategoriesSuggestionWidgetSkeleton, Category, CategoryAutocomplete, CategoryAutocompleteProps, CategoryFollowButton, CategoryFollowButtonProps, CategoryFollowersButton, CategoryFollowersButtonProps, CategoryHeader, CategoryHeaderProps, CategoryHeaderSkeleton, CategoryProps, CategorySkeleton, CategoryTrendingFeedWidget, CategoryTrendingFeedWidgetProps, CategoryTrendingFeedWidgetSkeleton, CategoryTrendingPeopleWidgetSkeleton, CategoryTrendingUsersWidget, CategoryTrendingUsersWidgetProps, CentralProgress, ChangeCover, ChangeCoverProps, ChangeGroupCover, ChangeGroupCoverProps, ChangeGroupPicture, ChangeGroupPictureProps, ChangePicture, ChangePictureProps, CommentObject, CommentObjectProps, CommentObjectReply, CommentObjectReplyProps, CommentObjectSkeleton, CommentsFeedObject, CommentsFeedObjectProps, CommentsFeedObjectSkeleton, CommentsObject, CommentsObjectProps, CommentsObjectSkeleton, Composer, ComposerIconButton, ComposerIconButtonProps, ComposerProps, ConfirmDialog, ConnectionUserButton, ConsentSolution, ConsentSolutionButton, ConsentSolutionButtonProps, ConsentSolutionProps, ConsentSolutionSkeleton, ContributionUtils, SCCourseEditTabType, Course, CourseProps, CourseSkeleton, CourseSkeletonProps, CourseJoinButton, CourseJoinButtonProps, Courses, CoursesProps, CoursesSkeleton, CoursesSkeletonProps, CourseTypePopover, CourseTypePopoverProps, CreateCourseButton, CreateCourseButtonProps, CourseContentMenu, CourseContentMenuProps, CourseDashboard, TeacherCourseDashboardProps, TeacherSkeleton, StudentCourseDashboardProps, StudentSkeleton, CreateEventButton, CreateEventButtonProps, CreateEventWidget, CreateEventWidgetProps, CreateEventWidgetSkeleton, CreateGroupButton, EventForm, EventFormProps, EventFormDialog, EventFormDialogProps, CreateGroupButtonProps, CustomAdv, CustomAdvProps, CustomAdvSkeleton, DEFAULT_FIELDS, DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PRELOAD_OFFSET_VIEWPORT, DEFAULT_WIDGETS_NUMBER, DefaultDrawerContent, DefaultDrawerContentProps, DefaultHeaderContent, DefaultHeaderContentProps, DefaultDrawerSkeleton, DefaultDrawerSkeletonProps, EditEventButton, EditEventButtonProps, EditGroupButton, EditGroupButtonProps, EditMediaProps, Editor, EditorProps, EditorSkeleton, EmailTextField, EditCourse, EditCourseProps, EditCourseSkeleton, Event, EventActionsMenu, EventActionsMenuProps, EventHeader, EventHeaderProps, EventHeaderSkeleton, EventInfoDetails, EventInfoDetailsProps, EventInfoWidget, EventInfoWidgetProps, EventInviteButton, EventInviteButtonProps, EventLocationWidget, EventLocationWidgetProps, EventLocationWidgetSkeleton, EventMediaWidget, EventMediaWidgetProps, EventMediaWidgetSkeleton, EventMembersWidget, EventMembersWidgetProps, EventMembersWidgetSkeleton, EventParticipantsButton, EventParticipantsButtonProps, EventProps, Events, EventSkeleton, EventSkeletonProps, EventsProps, EventsSkeleton, EventsSkeletonProps, FACEBOOK_SHARE, Feed, FeedObject, FeedObjectMediaPreview, FeedObjectMediaPreviewProps, FeedObjectProps, FeedObjectSkeleton, FeedProps, FeedRef, FeedSidebarProps, FeedSkeleton, FeedUpdatesWidget, FeedUpdatesWidgetProps, FeedUpdatesWidgetSkeleton, File, FollowUserButton, FollowUserButtonProps, Footer, FooterProps, FooterSkeleton, FriendshipButtonProps, FriendshipUserButton, GenericSkeleton, getRelativeTime, getUnseenNotification, getUnseenNotificationCounter, Group, GroupActionsMenu, GroupActionsMenuProps, GroupForm, GroupFormProps, GroupHeader, GroupHeaderProps, GroupHeaderSkeleton, GroupInfoWidget, GroupInfoWidgetProps, GroupInfoWidgetSkeleton, GroupInviteButton, GroupInviteButtonProps, GroupInvitedWidget, GroupInvitedWidgetProps, GroupInvitedWidgetSkeleton, GroupMembersButton, GroupMembersButtonProps, GroupMembersWidget, GroupMembersWidgetProps, GroupMembersWidgetSkeleton, GroupProps, GroupRequestsWidget, GroupRequestsWidgetProps, GroupRequestsWidgetSkeleton, Groups, GroupSettingsIconButton, GroupSettingsIconButtonProps, GroupSkeleton, GroupsProps, GroupsSkeleton, GroupSubscribeButton, GroupSubscribeButtonProps, AccordionLessons, AccordionLessonsProps, AccordionLessonsSkeleton, AddUsersButton, AddUsersButtonProps, CourseUsersTable, CourseUsersTableProps, CourseUsersTableSkeleton, EmptyStatus, EmptyStatusProps, HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorDetailProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorProps, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, InfiniteScroll, ScrollContainer, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, InviteUserEventButton, LessonAppbar, LessonAppbarProps, LessonDrawer, LessonDrawerProps, LessonEditForm, LessonEditFormProps, LessonObject, LessonObjectProps, InviteUserEventButtonProps, LanguageSwitcher, LEGAL_POLICIES, CourseCompletedDialog, CourseCompletedDialogProps, Lightbox, LightboxProps, Link, LINKEDIN_SHARE, LocationAutocomplete, LocationAutocompleteProps, LogoSelfCommunity, DefaultCoverSelfCommunity, LoyaltyProgramWidget, LoyaltyProgramWidgetProps, LoyaltyProgramWidgetSkeleton, MAX_PRELOAD_OFFSET_VIEWPORT, MEDIA_EMBED_SC_LINK_TYPE, MEDIA_EMBED_SC_SHARED_EVENT, MEDIA_EMBED_SC_SHARED_OBJECT, MEDIA_TYPE_DOCUMENT, MEDIA_TYPE_EMBED, MEDIA_TYPE_EVENT, MEDIA_TYPE_IMAGE, MEDIA_TYPE_LINK, MEDIA_TYPE_SHARE, MEDIA_TYPE_URL, MEDIA_TYPE_VIDEO, SCCourseFormStepType, MediaChunkUploader, MediaChunkUploaderProps, MessageUploaderUtils, MetadataField, MetadataFieldProps, MIN_PRELOAD_OFFSET_VIEWPORT, MyEventsWidget, MyEventsWidgetProps, MyEventsWidgetSkeleton, NavigationMenuContent, NavigationMenuDrawer, NavigationMenuDrawerProps, NavigationMenuHeader, NavigationMenuIconButton, NavigationMenuIconButtonProps, NavigationSettingsIconButton, NavigationSettingsIconButtonProps, NavigationSettingsItem, NavigationToolbar, NavigationToolbarMobile, NavigationToolbarMobileProps, NavigationToolbarMobileSkeleton, NavigationToolbarProps, NavigationToolbarSkeleton, Notification, NotificationProps, NotificationSkeleton, OnBoardingWidget, OnBoardingWidgetProps, OnBoardingWidgetSkeleton, PasswordTextField, PhoneTextField, PlatformWidget, PlatformWidgetActionType, PlatformWidgetProps, PlatformWidgetSkeleton, PollSuggestionWidget, PollSuggestionWidgetProps, PrivateMessageComponent, PrivateMessageComponentProps, PrivateMessageComponentSkeleton, PrivateMessageEditor, PrivateMessageEditorProps, PrivateMessageEditorSkeleton, PrivateMessageSettingsIconButton, PrivateMessageSettingsIconButtonProps, PrivateMessageSnippetItem, PrivateMessageSnippetItemProps, PrivateMessageSnippetItemSkeleton, PrivateMessageSnippets, PrivateMessageSnippetsProps, PrivateMessageSnippetsSkeleton, PrivateMessageThread, PrivateMessageThreadItem, PrivateMessageThreadItemProps, PrivateMessageThreadItemSkeleton, PrivateMessageThreadProps, PrivateMessageThreadSkeleton, ProgressBar, ProgressBarProps, RelatedEventsWidget, RelatedEventsWidgetProps, RelatedEventsWidgetSkeleton, RelatedFeedObjectsWidget, RelatedFeedObjectsWidgetSkeleton, RelatedFeedObjectWidgetProps, ReplyComment, SCBroadcastMessageTemplateType, SCCommentsOrderBy, SCEventMembersEventType, SCEventTemplateType, SCFeedObjectActivitiesType, SCFeedObjectTemplateType, SCFeedWidgetType, SCGroupMembersEventType, SCMediaChunkType, SCMediaObjectType, SCNotificationObjectTemplateType, SCUserProfileFields, SCUserProfileSettings, SCUserSocialAssociations, SearchAutocomplete, SearchAutocompleteProps, SearchDialog, SearchDialogProps, Share, SnippetNotifications, SnippetNotificationsProps, SnippetNotificationsSkeleton, StickyBox, StickyBoxComponent, StickyBoxProps, SuggestedEventsWidget, TagAutocomplete, TagAutocompleteProps, SuggestedEventsWidgetProps, SuggestedEventsWidgetSkeleton, TagChip, TagChipProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserActionIconButtonProps, UserAvatar, UserAvatarProps, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserCounters, UserCountersProps, UserCreatedCoursesWidget, UserCreatedCoursesWidgetProps, UserCreatedCoursesWidgetSkeleton, UserDeletedSnackBar, UserDeletedSnackBarProps, UserFollowedCategoriesWidget, UserFollowedCategoriesWidgetProps, UserFollowedCategoriesWidgetSkeleton, UserFollowedUsersWidget, UserFollowedUsersWidgetProps, UserFollowedUsersWidgetSkeleton, UserFollowersWidget, UserFollowersWidgetProps, UserFollowersWidgetSkeleton, UserInfo, UserInfoDialog, UserInfoDialogProps, UserInfoProps, UserInfoSkeleton, UsernameTextField, UserProfileBlocked, UserProfileBlockedProps, UserProfileEdit, UserProfileEditProps, UserProfileEditSectionAccount, UserProfileEditSectionAccountProps, UserProfileEditSectionPublicInfo, UserProfileEditSectionPublicInfoProps, UserProfileEditSectionSettings, UserProfileEditSectionSettingsProps, UserProfileEditSkeleton, UserProfileHeader, UserProfileHeaderProps, UserProfileHeaderSkeleton, UserProps, UserSkeleton, UserSocialAssociation, UserSocialAssociationProps, UserSubscribedGroupsWidget, UserSubscribedGroupsWidgetProps, UserSubscribedGroupsWidgetSkeleton, UserSuggestionWidget, UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton, UserLiveStreamWidget, UserLiveStreamWidgetProps, UserLiveStreamWidgetSkeleton, useStickyBox, UseStickyBoxProps, LiveStream, LiveStreamProps, LiveStreamSkeletonProps, LiveStreamSkeleton, LiveStreamInfoDetails, LiveStreamInfoDetailsProps, UpScalingTierBadge, UpScalingTierProps, CreateLiveStreamDialog, CreateLiveStreamDialogProps, CreateLiveStreamButton, CreateLiveStreamButtonProps, LiveStreamForm, LiveStreamFormProps, LiveStreamRoom, LiveStreamRoomProps, LiveStreamVideoConference, LiveStreamVideoConferenceProps, VirtualScrollerItemProps, SCCourseTemplateType, SCLessonActionsType, SCLessonModeType, Widget, WidgetProps, X_SHARE, PROVIDER_ICONS_CONTAINED, PROVIDER_ICONS_OUTLINED };

package/lib/esm/index.js

@@ -159,6 +159,7 @@ import BaseItem from './shared/BaseItem';
 import Calendar from './shared/Calendar';
 import ConfirmDialog from './shared/ConfirmDialog/ConfirmDialog';
 import CourseUsersTable, { CourseUsersTableSkeleton } from './shared/CourseUsersTable';
+import CourseTypePopover from './shared/CourseTypePopover';
 import EmailTextField from './shared/EmailTextField';
 import EventActionsMenu from './shared/EventActionsMenu';
 import EventInfoDetails from './shared/EventInfoDetails';
@@ -210,7 +211,7 @@ import DefaultCoverSelfCommunity from './assets/deafultCover';
  */
 export { AcceptRequestUserEventButton, AccountChangeMailValidation, AccountDataPortability, AccountDataPortabilityButton, AccountDelete, AccountDeleteButton, AccountRecover, AccountReset, AccountVerify, AvatarGroupSkeleton, BaseDialog, BaseItem, BaseLightbox, BottomNavigation, BroadcastMessages, BroadcastMessagesSkeleton, bytesToSize, generateRoomId, randomString, decodePassphrase, encodePassphrase, Calendar, Categories, CategoriesPopularWidget, CategoriesPopularWidgetSkeleton, CategoriesSkeleton, CategoriesSuggestionWidget, CategoriesSuggestionWidgetSkeleton, Category, CategoryAutocomplete, CategoryFollowButton, CategoryFollowersButton, CategoryHeader, CategoryHeaderSkeleton, CategorySkeleton, CategoryTrendingFeedWidget, CategoryTrendingFeedWidgetSkeleton, CategoryTrendingPeopleWidgetSkeleton, CategoryTrendingUsersWidget, CentralProgress, ChangeCover, ChangeGroupCover, ChangeGroupPicture, ChangePicture, CommentObject, CommentObjectReply, CommentObjectSkeleton, CommentsFeedObject, CommentsFeedObjectSkeleton, CommentsObject, CommentsObjectSkeleton, Composer, ComposerIconButton, ConfirmDialog, ConnectionUserButton, 
 /* SC CONSENT SOLUTION */
-ConsentSolution, ConsentSolutionButton, ConsentSolutionSkeleton, ContributionUtils, SCCourseEditTabType, Course, CourseSkeleton, CourseJoinButton, Courses, CreateCourseButton, CoursesSkeleton, CourseContentMenu, CourseDashboard, TeacherSkeleton, StudentSkeleton, CreateEventButton, CreateEventWidget, CreateEventWidgetSkeleton, CreateGroupButton, EventForm, EventFormDialog, CustomAdv, CustomAdvSkeleton, DEFAULT_FIELDS, DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, 
+ConsentSolution, ConsentSolutionButton, ConsentSolutionSkeleton, ContributionUtils, SCCourseEditTabType, Course, CourseSkeleton, CourseJoinButton, Courses, CoursesSkeleton, CourseTypePopover, CreateCourseButton, CourseContentMenu, CourseDashboard, TeacherSkeleton, StudentSkeleton, CreateEventButton, CreateEventWidget, CreateEventWidgetSkeleton, CreateGroupButton, EventForm, EventFormDialog, CustomAdv, CustomAdvSkeleton, DEFAULT_FIELDS, DEFAULT_PAGINATION_LIMIT, DEFAULT_PAGINATION_OFFSET, 
 /* SC UI PAGINATION */
 DEFAULT_PAGINATION_QUERY_PARAM_NAME, DEFAULT_PRELOAD_OFFSET_VIEWPORT, DEFAULT_WIDGETS_NUMBER, DefaultDrawerContent, DefaultHeaderContent, DefaultDrawerSkeleton, EditEventButton, EditGroupButton, Editor, EditorSkeleton, EmailTextField, EditCourse, EditCourseSkeleton, Event, EventActionsMenu, EventHeader, EventHeaderSkeleton, EventInfoDetails, EventInfoWidget, EventInviteButton, EventLocationWidget, EventLocationWidgetSkeleton, EventMediaWidget, EventMediaWidgetSkeleton, EventMembersWidget, EventMembersWidgetSkeleton, EventParticipantsButton, Events, EventSkeleton, EventsSkeleton, FACEBOOK_SHARE, Feed, FeedObject, FeedObjectMediaPreview, FeedObjectSkeleton, FeedSkeleton, FeedUpdatesWidget, FeedUpdatesWidgetSkeleton, File, FollowUserButton, Footer, FooterSkeleton, FriendshipUserButton, GenericSkeleton, getRelativeTime, getUnseenNotification, getUnseenNotificationCounter, Group, GroupActionsMenu, GroupForm, GroupHeader, GroupHeaderSkeleton, GroupInfoWidget, GroupInfoWidgetSkeleton, GroupInviteButton, GroupInvitedWidget, GroupInvitedWidgetSkeleton, GroupMembersButton, GroupMembersWidget, GroupMembersWidgetSkeleton, GroupRequestsWidget, GroupRequestsWidgetSkeleton, Groups, GroupSettingsIconButton, GroupSkeleton, GroupsSkeleton, GroupSubscribeButton, 
 /* SC UI SHARED */

package/lib/esm/shared/AddUsersButton/AddUsersButton.js

@@ -17,7 +17,8 @@ const classes = {
     dialogRoot: `${PREFIX}-dialog-root`,
     dialogAutocompleteWrapper: `${PREFIX}-dialog-autocomplete-wrapper`,
     dialogUserWrapper: `${PREFIX}-dialog-user-wrapper`,
-    dialogChipWrapper: `${PREFIX}-dialog-chip-wrapper`
+    dialogChipWrapper: `${PREFIX}-dialog-chip-wrapper`,
+    contrastColor: `${PREFIX}-contrast-color`
 };
 const messages = defineMessages({
     placeholder: {
@@ -126,7 +127,7 @@ function AddUsersButton(inProps) {
     const handleDelete = useCallback((userToDelete) => {
         setInvited((prev) => prev.filter((user) => user.id !== userToDelete.id));
     }, [setInvited]);
-    return (_jsxs(Fragment, { children: [_jsx(Root, Object.assign({ onClick: handleToggleDialogOpen, variant: variant, color: color, size: size, className: classNames(classes.root, className) }, rest, { children: _jsx(FormattedMessage, { id: label, defaultMessage: label }) })), openDialog && (_jsx(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, onClose: handleToggleDialogOpen, title: _jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.addUserButton.dialog.title", defaultMessage: "ui.addUserButton.dialog.title" }) })), actions: _jsx(LoadingButton, Object.assign({ onClick: handleConfirm, size: "medium", variant: "contained", autoFocus: true, disabled: !invited.length }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.addUserButton.dialog.confirm", defaultMessage: "ui.addUserButton.dialog.confirm" }) })) })), className: classes.dialogRoot }, { children: _jsxs(Stack, Object.assign({ className: classes.dialogAutocompleteWrapper }, { children: [_jsx(Autocomplete, { loading: loading, size: "small", multiple: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option === null || option === void 0 ? void 0 : option.username) || '...', isOptionEqualToValue: (option, value) => (option === null || option === void 0 ? void 0 : option.id) === value.id, loadingText: _jsx(FormattedMessage, { id: "ui.addUserButton.autocomplete.loading", defaultMessage: "ui.addUserButton.autocomplete.loading" }), noOptionsText: _jsx(FormattedMessage, { id: "ui.addUserButton.autocomplete.noResults", defaultMessage: "ui.addUserButton.autocomplete.noResults" }), renderTags: () => null, popupIcon: null, disableClearable: true, renderOption: (props, option) => (_jsxs(Stack, Object.assign({ component: "li", flexDirection: "row", gap: "5px" }, props, { children: [_jsx(Avatar, { alt: option.username, src: option.avatar }), _jsx(Typography, { children: option.username })] }))), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, InputProps: Object.assign({}, params.InputProps) }))) }), _jsx(Stack, Object.assign({ className: classes.dialogChipWrapper }, { children: invited.map((option, index) => (_jsx(Chip, { avatar: _jsx(Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
+    return (_jsxs(Fragment, { children: [_jsx(Root, Object.assign({ onClick: handleToggleDialogOpen, variant: variant, color: color, size: size, className: classNames(classes.root, classes.contrastColor, className) }, rest, { children: _jsx(FormattedMessage, { id: label, defaultMessage: label }) })), openDialog && (_jsx(DialogRoot, Object.assign({ DialogContentProps: { dividers: false }, open: true, onClose: handleToggleDialogOpen, title: _jsx(Typography, Object.assign({ variant: "h5" }, { children: _jsx(FormattedMessage, { id: "ui.addUserButton.dialog.title", defaultMessage: "ui.addUserButton.dialog.title" }) })), actions: _jsx(LoadingButton, Object.assign({ onClick: handleConfirm, size: "medium", variant: "contained", autoFocus: true, disabled: !invited.length }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: "ui.addUserButton.dialog.confirm", defaultMessage: "ui.addUserButton.dialog.confirm" }) })) })), className: classes.dialogRoot }, { children: _jsxs(Stack, Object.assign({ className: classes.dialogAutocompleteWrapper }, { children: [_jsx(Autocomplete, { loading: loading, size: "small", multiple: true, options: suggested, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, filterOptions: filterOptions, value: invited, getOptionLabel: (option) => (option === null || option === void 0 ? void 0 : option.username) || '...', isOptionEqualToValue: (option, value) => (option === null || option === void 0 ? void 0 : option.id) === value.id, loadingText: _jsx(FormattedMessage, { id: "ui.addUserButton.autocomplete.loading", defaultMessage: "ui.addUserButton.autocomplete.loading" }), noOptionsText: _jsx(FormattedMessage, { id: "ui.addUserButton.autocomplete.noResults", defaultMessage: "ui.addUserButton.autocomplete.noResults" }), renderTags: () => null, popupIcon: null, disableClearable: true, renderOption: (props, option) => (_jsxs(Stack, Object.assign({ component: "li", flexDirection: "row", gap: "5px" }, props, { children: [_jsx(Avatar, { alt: option.username, src: option.avatar }), _jsx(Typography, { children: option.username })] }))), renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { variant: "outlined", placeholder: `${intl.formatMessage(messages.placeholder)}`, InputProps: Object.assign({}, params.InputProps) }))) }), _jsx(Stack, Object.assign({ className: classes.dialogChipWrapper }, { children: invited.map((option, index) => (_jsx(Chip, { avatar: _jsx(Avatar, { alt: option.username, src: option.avatar }), label: option.username, onDelete: () => {
                                     handleDelete(option);
                                 } }, index))) }))] })) })))] }));
 }

package/lib/esm/shared/CourseTypePopover/CourseTypePopover.d.ts

@@ -0,0 +1,9 @@
+import { SCCourseType } from '@selfcommunity/types';
+import { HTMLAttributes } from 'react';
+export interface CourseTypePopoverProps {
+    course: SCCourseType;
+    className?: HTMLAttributes<HTMLDivElement>['className'];
+}
+declare function CourseTypePopover(props: CourseTypePopoverProps): JSX.Element;
+declare const _default: import("react").MemoExoticComponent<typeof CourseTypePopover>;
+export default _default;

package/lib/esm/shared/CourseTypePopover/CourseTypePopover.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Button, Icon, Popover, Stack, styled, Typography } from '@mui/material';
+import classNames from 'classnames';
+import { memo, useCallback, useState } from 'react';
+import { FormattedMessage, useIntl } from 'react-intl';
+const PREFIX = 'SCCourseTypePopover';
+const classes = {
+    root: `${PREFIX}-root`,
+    button: `${PREFIX}-button`,
+    contrastColor: `${PREFIX}-contrast-color`
+};
+const Root = styled(Stack, {
+    name: PREFIX,
+    slot: 'Root',
+    overridesResolver: (_props, styles) => styles.root
+})(() => ({}));
+function CourseTypePopover(props) {
+    // PROPS
+    const { course, className } = props;
+    // STATES
+    const [anchorEl, setAnchorEl] = useState(null);
+    const open = Boolean(anchorEl);
+    // INTL
+    const intl = useIntl();
+    // HANDLERS
+    const handleOpenPopover = useCallback((e) => {
+        setAnchorEl(e.currentTarget);
+    }, [setAnchorEl]);
+    const handlePopoverClose = useCallback(() => {
+        setAnchorEl(null);
+    }, [setAnchorEl]);
+    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, classes.contrastColor, className) }, { children: [_jsx(Icon, Object.assign({ fontSize: "small" }, { children: "courses" })), _jsx(Button, Object.assign({ variant: "text", color: "inherit", size: "small", className: classes.button, onClick: handleOpenPopover }, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.course.type", defaultMessage: "ui.course.type", values: {
+                            typeOfCourse: intl.formatMessage({
+                                id: `ui.course.type.${course.type}`,
+                                defaultMessage: `ui.course.type.${course.type}`
+                            })
+                        } }) })) })), open && (_jsx(Popover, Object.assign({ open: true, anchorEl: anchorEl, anchorOrigin: {
+                    vertical: 'bottom',
+                    horizontal: 'left'
+                }, transformOrigin: {
+                    vertical: 'top',
+                    horizontal: 'left'
+                }, onClose: handlePopoverClose }, { children: _jsx(Box, Object.assign({ sx: { padding: '10px' } }, { children: _jsx(Typography, Object.assign({ component: "span", variant: "body2", sx: { whiteSpace: 'pre-line' } }, { children: _jsx(FormattedMessage, { id: `ui.courseForm.${course.type}.info`, defaultMessage: `ui.courseForm.${course.type}.info` }) })) })) })))] })));
+}
+export default memo(CourseTypePopover);

package/lib/esm/shared/CourseTypePopover/index.d.ts

@@ -0,0 +1,3 @@
+import CourseTypePopover, { CourseTypePopoverProps } from './CourseTypePopover';
+export default CourseTypePopover;
+export { CourseTypePopoverProps };

package/lib/esm/shared/CourseTypePopover/index.js

@@ -0,0 +1,2 @@
+import CourseTypePopover from './CourseTypePopover';
+export default CourseTypePopover;

package/lib/esm/shared/CourseUsersTable/CourseUsersTable.d.ts

@@ -1,5 +1,6 @@
 import { Dispatch } from 'react';
 import { SCCourseType } from '@selfcommunity/types';
+import { SCCourseUsersTableModeType } from '../../types/course';
 type HeaderCellsType = {
     id?: string;
 };
@@ -8,7 +9,7 @@ export interface CourseUsersTableProps {
     dispatch: Dispatch<any>;
     course: SCCourseType;
     headerCells: HeaderCellsType[];
-    mode: 'dashboard' | 'edit' | 'requests';
+    mode: SCCourseUsersTableModeType;
     emptyStatusTitle: string;
     emptyStatusDescription?: string;
 }

package/lib/esm/shared/CourseUsersTable/CourseUsersTable.js

@@ -16,15 +16,14 @@ import { SCOPE_SC_UI } from '../../constants/Errors';
 import ChangeUserStatus from './ChangeUsersStatus';
 import { useSCUser } from '@selfcommunity/react-core';
 import RequestButton from './RequestButton';
-import classNames from 'classnames';
+import { SCCourseUsersTableModeType } from '../../types/course';
 const classes = {
     root: `${PREFIX}-root`,
     search: `${PREFIX}-search`,
     avatarWrapper: `${PREFIX}-avatar-wrapper`,
     progressWrapper: `${PREFIX}-progress-wrapper`,
     progress: `${PREFIX}-progress`,
-    loadingButton: `${PREFIX}-loading-button`,
-    contrastBgColor: `${PREFIX}-contrast-bg-color`
+    loadingButton: `${PREFIX}-loading-button`
 };
 const Root = styled(Box, {
     name: PREFIX,
@@ -89,17 +88,17 @@ function CourseUsersTable(inProps) {
     if (!users) {
         return _jsx(CourseUsersTableSkeleton, {});
     }
-    return (_jsxs(Root, Object.assign({ className: classNames(classes.root, classes.contrastBgColor) }, { children: [_jsx(TextField, { placeholder: intl.formatMessage({
+    return (_jsxs(Root, Object.assign({ className: classes.root }, { children: [_jsx(TextField, { placeholder: intl.formatMessage({
                     id: 'ui.courseUsersTable.searchBar.placeholder',
                     defaultMessage: 'ui.courseUsersTable.searchBar.placeholder'
                 }), InputProps: {
                     startAdornment: (_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "search" }) })))
                 }, value: value, onChange: handleChange, disabled: users.length === 0 && value.length === 0, fullWidth: true, className: classes.search }), _jsx(TableContainer, { children: _jsxs(Table, { children: [_jsx(TableHead, { children: _jsx(TableRow, { children: headerCells.map((cell, i, array) => {
-                                    if (mode !== 'edit' && i === array.length - 1) {
+                                    if (mode !== SCCourseUsersTableModeType.EDIT && i === array.length - 1) {
                                         return _jsx(TableCell, { width: "14%" }, i);
                                     }
-                                    return (_jsx(TableCell, Object.assign({ width: mode === 'dashboard' ? '20%' : '25%' }, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i));
+                                    return (_jsx(TableCell, Object.assign({ width: mode === SCCourseUsersTableModeType.DASHBOARD ? '20%' : '25%' }, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: cell.id, defaultMessage: cell.id }) })) }), i));
                                 }) }) }), _jsxs(TableBody, { children: [users.length > 0 &&
-                                    users.map((user, i) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsxs(Stack, Object.assign({ className: classes.avatarWrapper }, { children: [_jsx(Avatar, { alt: user.username, src: user.avatar }), _jsx(Typography, Object.assign({ variant: "body2" }, { children: user.username }))] })) }), mode === 'dashboard' && (_jsx(TableCell, { children: _jsxs(Stack, Object.assign({ className: classes.progressWrapper }, { children: [_jsx(LinearProgress, { className: classes.progress, variant: "determinate", value: user.user_completion_rate }), _jsx(Typography, Object.assign({ variant: "body1" }, { children: `${Math.round(user.user_completion_rate)}%` }))] })) })), mode === 'edit' && (_jsx(TableCell, { children: user.join_status !== SCCourseJoinStatusType.CREATOR && scUserContext.user.id !== user.id ? (_jsx(ChangeUserStatus, { course: course, user: user })) : (_jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: `ui.editCourse.tab.users.table.select.${user.join_status}`, defaultMessage: `ui.editCourse.tab.users.table.select.${user.join_status}` }) }))) })), _jsx(TableCell, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: new Date(mode === 'requests' ? user.date_joined : user.joined_at || new Date()).toLocaleDateString() })) }), _jsx(TableCell, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: new Date(mode === 'requests' ? user.date_joined : user.last_active_at || new Date()).toLocaleDateString() })) }), mode === 'dashboard' && (_jsx(TableCell, { children: _jsx(SeeProgressButton, { course: course, user: user }) })), mode === 'requests' && (_jsx(TableCell, { children: _jsx(RequestButton, { course: course, user: user }) }))] }, i))), state.isLoadingNext && _jsx(RowSkeleton, { editMode: mode !== 'dashboard' })] })] }) }), users.length > 0 && (_jsx(LoadingButton, Object.assign({ size: "small", variant: "outlined", color: "inherit", loading: state.isLoadingNext, disabled: !state.next, className: classes.loadingButton, onClick: handleNext }, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.courseUsersTable.btn.label", defaultMessage: "ui.courseUsersTable.btn.label" }) })) }))), users.length === 0 && value.length === 0 && _jsx(EmptyStatus, { icon: "face", title: emptyStatusTitle, description: emptyStatusDescription })] })));
+                                    users.map((user, i) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsxs(Stack, Object.assign({ className: classes.avatarWrapper }, { children: [_jsx(Avatar, { alt: user.username, src: user.avatar }), _jsx(Typography, Object.assign({ variant: "body2" }, { children: user.username }))] })) }), mode === SCCourseUsersTableModeType.DASHBOARD && (_jsx(TableCell, { children: _jsxs(Stack, Object.assign({ className: classes.progressWrapper }, { children: [_jsx(LinearProgress, { className: classes.progress, variant: "determinate", value: user.user_completion_rate }), _jsx(Typography, Object.assign({ variant: "body1" }, { children: `${Math.round(user.user_completion_rate)}%` }))] })) })), mode === SCCourseUsersTableModeType.EDIT && (_jsx(TableCell, { children: user.join_status !== SCCourseJoinStatusType.CREATOR && scUserContext.user.id !== user.id ? (_jsx(ChangeUserStatus, { course: course, user: user })) : (_jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: `ui.editCourse.tab.users.table.select.${user.join_status}`, defaultMessage: `ui.editCourse.tab.users.table.select.${user.join_status}` }) }))) })), _jsx(TableCell, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: new Date(mode === SCCourseUsersTableModeType.REQUESTS ? user.date_joined : user.joined_at || new Date()).toLocaleDateString() })) }), _jsx(TableCell, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: new Date(mode === SCCourseUsersTableModeType.REQUESTS ? user.date_joined : user.last_active_at || new Date()).toLocaleDateString() })) }), mode === SCCourseUsersTableModeType.DASHBOARD && (_jsx(TableCell, { children: _jsx(SeeProgressButton, { course: course, user: user }) })), mode === SCCourseUsersTableModeType.REQUESTS && (_jsx(TableCell, { children: _jsx(RequestButton, { course: course, user: user }) }))] }, i))), state.isLoadingNext && _jsx(RowSkeleton, { editMode: mode !== SCCourseUsersTableModeType.DASHBOARD })] })] }) }), users.length > 0 && (_jsx(LoadingButton, Object.assign({ size: "small", variant: "outlined", color: "inherit", loading: state.isLoadingNext, disabled: !state.next, className: classes.loadingButton, onClick: handleNext }, { children: _jsx(Typography, Object.assign({ variant: "body2" }, { children: _jsx(FormattedMessage, { id: "ui.courseUsersTable.btn.label", defaultMessage: "ui.courseUsersTable.btn.label" }) })) }))), users.length === 0 && value.length === 0 && _jsx(EmptyStatus, { icon: "face", title: emptyStatusTitle, description: emptyStatusDescription })] })));
 }
 export default memo(CourseUsersTable);

package/lib/esm/types/course.d.ts

@@ -18,3 +18,8 @@ export declare enum SCCourseEditTabType {
     REQUESTS = "requests",
     OPTIONS = "options"
 }
+export declare enum SCCourseUsersTableModeType {
+    DASHBOARD = "dashboard",
+    EDIT = "edit",
+    REQUESTS = "requests"
+}

package/lib/esm/types/course.js

@@ -22,3 +22,9 @@ export var SCCourseEditTabType;
     SCCourseEditTabType["REQUESTS"] = "requests";
     SCCourseEditTabType["OPTIONS"] = "options";
 })(SCCourseEditTabType || (SCCourseEditTabType = {}));
+export var SCCourseUsersTableModeType;
+(function (SCCourseUsersTableModeType) {
+    SCCourseUsersTableModeType["DASHBOARD"] = "dashboard";
+    SCCourseUsersTableModeType["EDIT"] = "edit";
+    SCCourseUsersTableModeType["REQUESTS"] = "requests";
+})(SCCourseUsersTableModeType || (SCCourseUsersTableModeType = {}));

package/lib/esm/utils/course.js

@@ -1,5 +1,6 @@
+import { SCCourseJoinStatusType } from '@selfcommunity/types';
 export function isCourseNew(course) {
-    if (course && course.user_completion_rate !== 100) {
+    if (course && course.join_status === SCCourseJoinStatusType.JOINED) {
         const createdAtDate = new Date(course.created_at);
         const twoWeeksAgo = new Date();
         twoWeeksAgo.setDate(twoWeeksAgo.getDate() - 14);