@selfcommunity/react-ui 0.10.2-courses.193 → 0.10.2-courses.194
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.js +3 -1
- package/lib/cjs/components/Notification/Course/Course.js +19 -10
- package/lib/cjs/components/Notification/Notification.js +1 -0
- package/lib/cjs/components/SnippetNotifications/SnippetNotifications.js +1 -0
- package/lib/cjs/components/ToastNotifications/ToastNotifications.js +2 -1
- package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.js +3 -1
- package/lib/esm/components/Notification/Course/Course.js +15 -6
- package/lib/esm/components/Notification/Notification.js +1 -0
- package/lib/esm/components/SnippetNotifications/SnippetNotifications.js +1 -0
- package/lib/esm/components/ToastNotifications/ToastNotifications.js +2 -1
- package/lib/umd/react-ui.js +1 -1
- package/package.json +8 -8
|
@@ -68,7 +68,9 @@ function VideoConference(inProps) {
|
|
|
68
68
|
{ source: livekit_client_1.Track.Source.Camera, withPlaceholder: true },
|
|
69
69
|
{ source: livekit_client_1.Track.Source.ScreenShare, withPlaceholder: false }
|
|
70
70
|
], { updateOnlyOn: [livekit_client_1.RoomEvent.ActiveSpeakersChanged], onlySubscribed: false });
|
|
71
|
-
const tracksNoParticipants = (0, react_1.useMemo)(() => tracks.filter((t) => t.participant.name === scUserContext.user.username ||
|
|
71
|
+
const tracksNoParticipants = (0, react_1.useMemo)(() => tracks.filter((t) => t.participant.name === scUserContext.user.username ||
|
|
72
|
+
(speakerFocused && t.participant.name === speakerFocused.username) ||
|
|
73
|
+
t.source === 'screen_share'), [tracks, scUserContext.user]);
|
|
72
74
|
const handleBlur = React.useCallback((event) => {
|
|
73
75
|
var _a, _b;
|
|
74
76
|
if (event.target) {
|
|
@@ -6,10 +6,11 @@ const react_1 = require("react");
|
|
|
6
6
|
const styles_1 = require("@mui/material/styles");
|
|
7
7
|
const material_1 = require("@mui/material");
|
|
8
8
|
const react_core_1 = require("@selfcommunity/react-core");
|
|
9
|
+
const types_1 = require("@selfcommunity/types");
|
|
9
10
|
const react_intl_1 = require("react-intl");
|
|
10
11
|
const DateTimeAgo_1 = tslib_1.__importDefault(require("../../../shared/DateTimeAgo"));
|
|
11
12
|
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
12
|
-
const
|
|
13
|
+
const types_2 = require("../../../types");
|
|
13
14
|
const NotificationItem_1 = tslib_1.__importDefault(require("../../../shared/NotificationItem"));
|
|
14
15
|
const lab_1 = require("@mui/lab");
|
|
15
16
|
const UserDeletedSnackBar_1 = tslib_1.__importDefault(require("../../../shared/UserDeletedSnackBar"));
|
|
@@ -37,14 +38,14 @@ const Root = (0, styles_1.styled)(NotificationItem_1.default, {
|
|
|
37
38
|
*/
|
|
38
39
|
function CourseNotification(props) {
|
|
39
40
|
// PROPS
|
|
40
|
-
const { notificationObject, id = `n_${props.notificationObject['sid']}`, className, template =
|
|
41
|
+
const { notificationObject, id = `n_${props.notificationObject['sid']}`, className, template = types_2.SCNotificationObjectTemplateType.DETAIL } = props, rest = tslib_1.__rest(props, ["notificationObject", "id", "className", "template"]);
|
|
41
42
|
// CONTEXT
|
|
42
43
|
const scRoutingContext = (0, react_core_1.useSCRouting)();
|
|
43
44
|
// STATE
|
|
44
45
|
const [openAlert, setOpenAlert] = (0, react_1.useState)(false);
|
|
45
46
|
// CONST
|
|
46
|
-
const isSnippetTemplate = template ===
|
|
47
|
-
const isToastTemplate = template ===
|
|
47
|
+
const isSnippetTemplate = template === types_2.SCNotificationObjectTemplateType.SNIPPET;
|
|
48
|
+
const isToastTemplate = template === types_2.SCNotificationObjectTemplateType.TOAST;
|
|
48
49
|
if (!notificationObject.course) {
|
|
49
50
|
return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
|
|
50
51
|
}
|
|
@@ -57,9 +58,13 @@ function CourseNotification(props) {
|
|
|
57
58
|
}), { onClick: notificationObject.course.created_by.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.course.created_by.username })), ' ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.course.${notificationObject.type}`, defaultMessage: `ui.notification.course.${notificationObject.type}`, values: {
|
|
58
59
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
59
60
|
// @ts-ignore
|
|
60
|
-
|
|
61
|
-
link: (...chunks) => (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(
|
|
62
|
-
|
|
61
|
+
name: notificationObject.course.name,
|
|
62
|
+
link: (...chunks) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === types_1.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
63
|
+
? react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
64
|
+
: react_core_1.SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: chunks })))
|
|
65
|
+
} })] }), footer: isToastTemplate ? ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at }), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ color: "primary" }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === types_1.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
66
|
+
? react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
67
|
+
: react_core_1.SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.course.button.see", defaultMessage: "ui.notification.course.button.see" }) })) }))] }))) : ((0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.snippetTime })) }, rest)));
|
|
63
68
|
}
|
|
64
69
|
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className, `${constants_1.PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({}, (!notificationObject.course.created_by.deleted && {
|
|
65
70
|
to: scRoutingContext.url(react_core_1.SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.course.created_by)
|
|
@@ -68,8 +73,12 @@ function CourseNotification(props) {
|
|
|
68
73
|
}), { onClick: notificationObject.course.created_by.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.course.created_by.username })), ' ', (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.notification.course.${notificationObject.type}`, defaultMessage: `ui.notification.course.${notificationObject.type}`, values: {
|
|
69
74
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
70
75
|
// @ts-ignore
|
|
71
|
-
|
|
72
|
-
link: (...chunks) => (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(
|
|
73
|
-
|
|
76
|
+
name: notificationObject.course.name,
|
|
77
|
+
link: (...chunks) => ((0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === types_1.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
78
|
+
? react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
79
|
+
: react_core_1.SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: chunks })))
|
|
80
|
+
} }), notificationObject.type !== types_1.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON && ((0, jsx_runtime_1.jsx)(Course_1.default, { course: notificationObject.course, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}), template: types_2.SCCourseTemplateType.SNIPPET, elevation: 0 }))] }), actions: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(DateTimeAgo_1.default, { date: notificationObject.active_at, className: classes.activeAt }), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.seeButton }, component: react_core_1.Link, to: scRoutingContext.url(notificationObject.type === types_1.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
81
|
+
? react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
82
|
+
: react_core_1.SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.notification.course.button.see", defaultMessage: "ui.notification.course.button.see" }) }))] })) }, rest)), openAlert && (0, jsx_runtime_1.jsx)(UserDeletedSnackBar_1.default, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
|
|
74
83
|
}
|
|
75
84
|
exports.default = CourseNotification;
|
|
@@ -311,6 +311,7 @@ function UserNotification(inProps) {
|
|
|
311
311
|
return (0, jsx_runtime_1.jsx)(Event_1.default, { notificationObject: n }, i);
|
|
312
312
|
}
|
|
313
313
|
else if (n.type === types_1.SCNotificationTypologyType.USER_ADDED_TO_COURSE ||
|
|
314
|
+
n.type === types_1.SCNotificationTypologyType.MANAGER_ADDED_TO_COURSE ||
|
|
314
315
|
n.type === types_1.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ||
|
|
315
316
|
n.type === types_1.SCNotificationTypologyType.USER_INVITED_TO_JOIN_COURSE ||
|
|
316
317
|
n.type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_COURSE ||
|
|
@@ -272,6 +272,7 @@ function SnippetNotifications(inProps) {
|
|
|
272
272
|
return (0, jsx_runtime_1.jsx)(Event_1.default, { notificationObject: n, template: types_1.SCNotificationObjectTemplateType.SNIPPET }, i);
|
|
273
273
|
}
|
|
274
274
|
else if (n.type === types_2.SCNotificationTypologyType.USER_ADDED_TO_COURSE ||
|
|
275
|
+
n.type === types_2.SCNotificationTypologyType.MANAGER_ADDED_TO_COURSE ||
|
|
275
276
|
n.type === types_2.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ||
|
|
276
277
|
n.type === types_2.SCNotificationTypologyType.USER_INVITED_TO_JOIN_COURSE ||
|
|
277
278
|
n.type === types_2.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_COURSE ||
|
|
@@ -129,7 +129,8 @@ function UserToastNotifications(inProps) {
|
|
|
129
129
|
content = (0, jsx_runtime_1.jsx)(Event_1.default, { notificationObject: n.notification_obj, template: types_2.SCNotificationObjectTemplateType.TOAST });
|
|
130
130
|
}
|
|
131
131
|
else if (type === types_1.SCNotificationTypologyType.USER_ADDED_TO_COURSE ||
|
|
132
|
-
|
|
132
|
+
type === types_1.SCNotificationTypologyType.MANAGER_ADDED_TO_COURSE ||
|
|
133
|
+
type === types_1.SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ||
|
|
133
134
|
type === types_1.SCNotificationTypologyType.USER_INVITED_TO_JOIN_COURSE ||
|
|
134
135
|
type === types_1.SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_COURSE ||
|
|
135
136
|
type === types_1.SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_COURSE) {
|
|
@@ -65,7 +65,9 @@ export function VideoConference(inProps) {
|
|
|
65
65
|
{ source: Track.Source.Camera, withPlaceholder: true },
|
|
66
66
|
{ source: Track.Source.ScreenShare, withPlaceholder: false }
|
|
67
67
|
], { updateOnlyOn: [RoomEvent.ActiveSpeakersChanged], onlySubscribed: false });
|
|
68
|
-
const tracksNoParticipants = useMemo(() => tracks.filter((t) => t.participant.name === scUserContext.user.username ||
|
|
68
|
+
const tracksNoParticipants = useMemo(() => tracks.filter((t) => t.participant.name === scUserContext.user.username ||
|
|
69
|
+
(speakerFocused && t.participant.name === speakerFocused.username) ||
|
|
70
|
+
t.source === 'screen_share'), [tracks, scUserContext.user]);
|
|
69
71
|
const handleBlur = React.useCallback((event) => {
|
|
70
72
|
var _a, _b;
|
|
71
73
|
if (event.target) {
|
|
@@ -4,6 +4,7 @@ import { useState } from 'react';
|
|
|
4
4
|
import { styled } from '@mui/material/styles';
|
|
5
5
|
import { Avatar, Box, Stack, Typography } from '@mui/material';
|
|
6
6
|
import { Link, SCRoutes, useSCRouting } from '@selfcommunity/react-core';
|
|
7
|
+
import { SCNotificationTypologyType } from '@selfcommunity/types';
|
|
7
8
|
import { FormattedMessage } from 'react-intl';
|
|
8
9
|
import DateTimeAgo from '../../../shared/DateTimeAgo';
|
|
9
10
|
import classNames from 'classnames';
|
|
@@ -55,9 +56,13 @@ export default function CourseNotification(props) {
|
|
|
55
56
|
}), { onClick: notificationObject.course.created_by.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.course.created_by.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.course.${notificationObject.type}`, defaultMessage: `ui.notification.course.${notificationObject.type}`, values: {
|
|
56
57
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
57
58
|
// @ts-ignore
|
|
58
|
-
|
|
59
|
-
link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(
|
|
60
|
-
|
|
59
|
+
name: notificationObject.course.name,
|
|
60
|
+
link: (...chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
61
|
+
? SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
62
|
+
: SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: chunks })))
|
|
63
|
+
} })] }), footer: isToastTemplate ? (_jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at }), _jsx(Typography, Object.assign({ color: "primary" }, { children: _jsx(Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
64
|
+
? SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
65
|
+
: SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: _jsx(FormattedMessage, { id: "ui.notification.course.button.see", defaultMessage: "ui.notification.course.button.see" }) })) }))] }))) : (_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.snippetTime })) }, rest)));
|
|
61
66
|
}
|
|
62
67
|
return (_jsxs(_Fragment, { children: [_jsx(Root, Object.assign({ id: id, className: classNames(classes.root, className, `${PREFIX}-${template}`), template: template, isNew: notificationObject.is_new, disableTypography: true, image: _jsx(Link, Object.assign({}, (!notificationObject.course.created_by.deleted && {
|
|
63
68
|
to: scRoutingContext.url(SCRoutes.USER_PROFILE_ROUTE_NAME, notificationObject.course.created_by)
|
|
@@ -66,7 +71,11 @@ export default function CourseNotification(props) {
|
|
|
66
71
|
}), { onClick: notificationObject.course.created_by.deleted ? () => setOpenAlert(true) : null, className: classes.username }, { children: notificationObject.course.created_by.username })), ' ', _jsx(FormattedMessage, { id: `ui.notification.course.${notificationObject.type}`, defaultMessage: `ui.notification.course.${notificationObject.type}`, values: {
|
|
67
72
|
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
68
73
|
// @ts-ignore
|
|
69
|
-
|
|
70
|
-
link: (...chunks) => _jsx(Link, Object.assign({ to: scRoutingContext.url(
|
|
71
|
-
|
|
74
|
+
name: notificationObject.course.name,
|
|
75
|
+
link: (...chunks) => (_jsx(Link, Object.assign({ to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
76
|
+
? SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
77
|
+
: SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: chunks })))
|
|
78
|
+
} }), notificationObject.type !== SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON && (_jsx(CourseItem, { course: notificationObject.course, actions: _jsx(_Fragment, {}), template: SCCourseTemplateType.SNIPPET, elevation: 0 }))] }), actions: _jsxs(Stack, Object.assign({ direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 2 }, { children: [_jsx(DateTimeAgo, { date: notificationObject.active_at, className: classes.activeAt }), _jsx(LoadingButton, Object.assign({ color: 'primary', variant: "outlined", size: "small", classes: { root: classes.seeButton }, component: Link, to: scRoutingContext.url(notificationObject.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON
|
|
79
|
+
? SCRoutes.COURSE_LESSON_ROUTE_NAME
|
|
80
|
+
: SCRoutes.COURSE_ROUTE_NAME, notificationObject.course) }, { children: _jsx(FormattedMessage, { id: "ui.notification.course.button.see", defaultMessage: "ui.notification.course.button.see" }) }))] })) }, rest)), openAlert && _jsx(UserDeletedSnackBar, { open: openAlert, handleClose: () => setOpenAlert(false) })] }));
|
|
72
81
|
}
|
|
@@ -309,6 +309,7 @@ export default function UserNotification(inProps) {
|
|
|
309
309
|
return _jsx(EventNotification, { notificationObject: n }, i);
|
|
310
310
|
}
|
|
311
311
|
else if (n.type === SCNotificationTypologyType.USER_ADDED_TO_COURSE ||
|
|
312
|
+
n.type === SCNotificationTypologyType.MANAGER_ADDED_TO_COURSE ||
|
|
312
313
|
n.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ||
|
|
313
314
|
n.type === SCNotificationTypologyType.USER_INVITED_TO_JOIN_COURSE ||
|
|
314
315
|
n.type === SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_COURSE ||
|
|
@@ -270,6 +270,7 @@ export default function SnippetNotifications(inProps) {
|
|
|
270
270
|
return _jsx(EventNotification, { notificationObject: n, template: SCNotificationObjectTemplateType.SNIPPET }, i);
|
|
271
271
|
}
|
|
272
272
|
else if (n.type === SCNotificationTypologyType.USER_ADDED_TO_COURSE ||
|
|
273
|
+
n.type === SCNotificationTypologyType.MANAGER_ADDED_TO_COURSE ||
|
|
273
274
|
n.type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ||
|
|
274
275
|
n.type === SCNotificationTypologyType.USER_INVITED_TO_JOIN_COURSE ||
|
|
275
276
|
n.type === SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_COURSE ||
|
|
@@ -126,7 +126,8 @@ export default function UserToastNotifications(inProps) {
|
|
|
126
126
|
content = _jsx(EventNotification, { notificationObject: n.notification_obj, template: SCNotificationObjectTemplateType.TOAST });
|
|
127
127
|
}
|
|
128
128
|
else if (type === SCNotificationTypologyType.USER_ADDED_TO_COURSE ||
|
|
129
|
-
|
|
129
|
+
type === SCNotificationTypologyType.MANAGER_ADDED_TO_COURSE ||
|
|
130
|
+
type === SCNotificationTypologyType.USER_COMMENTED_A_COURSE_LESSON ||
|
|
130
131
|
type === SCNotificationTypologyType.USER_INVITED_TO_JOIN_COURSE ||
|
|
131
132
|
type === SCNotificationTypologyType.USER_ACCEPTED_TO_JOIN_COURSE ||
|
|
132
133
|
type === SCNotificationTypologyType.USER_REQUESTED_TO_JOIN_COURSE) {
|