@selfcommunity/react-ui 0.8.0-live.55 → 0.8.0-live.57
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/CreateLiveStreamButton/CreateLiveStreamButton.d.ts +0 -5
- package/lib/cjs/components/CreateLiveStreamButton/CreateLiveStreamButton.js +2 -16
- package/lib/cjs/components/CreateLiveStreamDialog/CreateLiveStreamDialog.d.ts +0 -2
- package/lib/cjs/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js +13 -31
- package/lib/cjs/components/CreateLiveStreamDialog/LiveStreamSelector/LiveStreamSelector.js +8 -1
- package/lib/cjs/components/EventForm/EventAddress.d.ts +2 -1
- package/lib/cjs/components/EventForm/EventAddress.js +23 -3
- package/lib/cjs/components/EventForm/EventForm.js +8 -1
- package/lib/cjs/components/LiveStream/LiveStream.d.ts +79 -0
- package/lib/cjs/components/LiveStream/LiveStream.js +143 -0
- package/lib/cjs/components/LiveStream/Skeleton.d.ts +46 -0
- package/lib/cjs/components/LiveStream/Skeleton.js +92 -0
- package/lib/cjs/components/LiveStream/constants.d.ts +1 -0
- package/lib/cjs/components/LiveStream/constants.js +4 -0
- package/lib/cjs/components/LiveStream/index.d.ts +4 -0
- package/lib/cjs/components/LiveStream/index.js +8 -0
- package/lib/cjs/components/LiveStreamForm/LiveStreamForm.d.ts +1 -1
- package/lib/cjs/components/LiveStreamForm/LiveStreamForm.js +33 -38
- package/lib/cjs/components/LiveStreamForm/LiveStreamFormSettings.d.ts +46 -0
- package/lib/cjs/components/LiveStreamForm/LiveStreamFormSettings.js +61 -0
- package/lib/cjs/components/LiveStreamForm/constants.d.ts +7 -0
- package/lib/cjs/components/LiveStreamForm/constants.js +8 -1
- package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.d.ts +3 -2
- package/lib/cjs/components/LiveStreamRoom/LiveStreamRoom.js +24 -38
- package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.d.ts +7 -2
- package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +4 -4
- package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.d.ts +39 -0
- package/lib/cjs/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.js +112 -0
- package/lib/cjs/components/NavigationMenuIconButton/NavigationMenuDrawer.js +2 -16
- package/lib/cjs/index.d.ts +3 -1
- package/lib/cjs/index.js +6 -1
- package/lib/cjs/shared/LiveStreamInfoDetails/index.d.ts +17 -0
- package/lib/cjs/shared/LiveStreamInfoDetails/index.js +45 -0
- package/lib/cjs/types/liveStream.d.ts +5 -0
- package/lib/cjs/types/liveStream.js +9 -0
- package/lib/esm/components/CreateLiveStreamButton/CreateLiveStreamButton.d.ts +0 -5
- package/lib/esm/components/CreateLiveStreamButton/CreateLiveStreamButton.js +3 -17
- package/lib/esm/components/CreateLiveStreamDialog/CreateLiveStreamDialog.d.ts +0 -2
- package/lib/esm/components/CreateLiveStreamDialog/CreateLiveStreamDialog.js +10 -28
- package/lib/esm/components/CreateLiveStreamDialog/LiveStreamSelector/LiveStreamSelector.js +8 -1
- package/lib/esm/components/EventForm/EventAddress.d.ts +2 -1
- package/lib/esm/components/EventForm/EventAddress.js +23 -3
- package/lib/esm/components/EventForm/EventForm.js +8 -1
- package/lib/esm/components/LiveStream/LiveStream.d.ts +79 -0
- package/lib/esm/components/LiveStream/LiveStream.js +140 -0
- package/lib/esm/components/LiveStream/Skeleton.d.ts +46 -0
- package/lib/esm/components/LiveStream/Skeleton.js +89 -0
- package/lib/esm/components/LiveStream/constants.d.ts +1 -0
- package/lib/esm/components/LiveStream/constants.js +1 -0
- package/lib/esm/components/LiveStream/index.d.ts +4 -0
- package/lib/esm/components/LiveStream/index.js +4 -0
- package/lib/esm/components/LiveStreamForm/LiveStreamForm.d.ts +1 -1
- package/lib/esm/components/LiveStreamForm/LiveStreamForm.js +33 -38
- package/lib/esm/components/LiveStreamForm/LiveStreamFormSettings.d.ts +46 -0
- package/lib/esm/components/LiveStreamForm/LiveStreamFormSettings.js +57 -0
- package/lib/esm/components/LiveStreamForm/constants.d.ts +7 -0
- package/lib/esm/components/LiveStreamForm/constants.js +7 -0
- package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.d.ts +3 -2
- package/lib/esm/components/LiveStreamRoom/LiveStreamRoom.js +26 -40
- package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.d.ts +7 -2
- package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/LiveStreamVideoConference.js +5 -5
- package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.d.ts +39 -0
- package/lib/esm/components/LiveStreamRoom/LiveStreamVideoConference/VideoConference.js +108 -0
- package/lib/esm/components/NavigationMenuIconButton/NavigationMenuDrawer.js +3 -17
- package/lib/esm/index.d.ts +3 -1
- package/lib/esm/index.js +3 -1
- package/lib/esm/shared/LiveStreamInfoDetails/index.d.ts +17 -0
- package/lib/esm/shared/LiveStreamInfoDetails/index.js +42 -0
- package/lib/esm/types/liveStream.d.ts +5 -0
- package/lib/esm/types/liveStream.js +6 -0
- package/lib/umd/react-ui.js +1 -1
- package/package.json +7 -7
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { MessageDecoder, MessageEncoder } from '@livekit/components-core';
|
|
3
|
+
import { MessageFormatter } from '@livekit/components-react';
|
|
4
|
+
/**
|
|
5
|
+
* @public
|
|
6
|
+
*/
|
|
7
|
+
export interface VideoConferenceProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
8
|
+
chatMessageFormatter?: MessageFormatter;
|
|
9
|
+
chatMessageEncoder?: MessageEncoder;
|
|
10
|
+
chatMessageDecoder?: MessageDecoder;
|
|
11
|
+
/** @alpha */
|
|
12
|
+
SettingsComponent?: React.ComponentType;
|
|
13
|
+
speakerFocused?: string;
|
|
14
|
+
disableChat?: boolean;
|
|
15
|
+
disableMicrophone?: boolean;
|
|
16
|
+
disableCamera?: boolean;
|
|
17
|
+
disableScreenShare?: boolean;
|
|
18
|
+
hideParticipantList?: boolean;
|
|
19
|
+
showSettings?: boolean;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* The `VideoConference` ready-made component is your drop-in solution for a classic video conferencing application.
|
|
23
|
+
* It provides functionality such as focusing on one participant, grid view with pagination to handle large numbers
|
|
24
|
+
* of participants, basic non-persistent chat, screen sharing, and more.
|
|
25
|
+
*
|
|
26
|
+
* @remarks
|
|
27
|
+
* The component is implemented with other LiveKit components like `FocusContextProvider`,
|
|
28
|
+
* `GridLayout`, `ControlBar`, `FocusLayoutContainer` and `FocusLayout`.
|
|
29
|
+
* You can use these components as a starting point for your own custom video conferencing application.
|
|
30
|
+
*
|
|
31
|
+
* @example
|
|
32
|
+
* ```tsx
|
|
33
|
+
* <LiveKitRoom>
|
|
34
|
+
* <VideoConference />
|
|
35
|
+
* <LiveKitRoom>
|
|
36
|
+
* ```
|
|
37
|
+
* @public
|
|
38
|
+
*/
|
|
39
|
+
export declare function VideoConference({ chatMessageFormatter, chatMessageDecoder, chatMessageEncoder, SettingsComponent, speakerFocused, disableChat, disableMicrophone, disableCamera, disableScreenShare, hideParticipantList, showSettings, ...props }: VideoConferenceProps): JSX.Element;
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.VideoConference = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
const React = tslib_1.__importStar(require("react"));
|
|
7
|
+
const components_core_1 = require("@livekit/components-core");
|
|
8
|
+
const livekit_client_1 = require("livekit-client");
|
|
9
|
+
const components_react_1 = require("@livekit/components-react");
|
|
10
|
+
/**
|
|
11
|
+
* The `VideoConference` ready-made component is your drop-in solution for a classic video conferencing application.
|
|
12
|
+
* It provides functionality such as focusing on one participant, grid view with pagination to handle large numbers
|
|
13
|
+
* of participants, basic non-persistent chat, screen sharing, and more.
|
|
14
|
+
*
|
|
15
|
+
* @remarks
|
|
16
|
+
* The component is implemented with other LiveKit components like `FocusContextProvider`,
|
|
17
|
+
* `GridLayout`, `ControlBar`, `FocusLayoutContainer` and `FocusLayout`.
|
|
18
|
+
* You can use these components as a starting point for your own custom video conferencing application.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* ```tsx
|
|
22
|
+
* <LiveKitRoom>
|
|
23
|
+
* <VideoConference />
|
|
24
|
+
* <LiveKitRoom>
|
|
25
|
+
* ```
|
|
26
|
+
* @public
|
|
27
|
+
*/
|
|
28
|
+
function VideoConference(_a) {
|
|
29
|
+
var _b, _c;
|
|
30
|
+
var { chatMessageFormatter, chatMessageDecoder, chatMessageEncoder, SettingsComponent, speakerFocused, disableChat = false, disableMicrophone = false, disableCamera = false, disableScreenShare = true, hideParticipantList = false, showSettings } = _a, props = tslib_1.__rest(_a, ["chatMessageFormatter", "chatMessageDecoder", "chatMessageEncoder", "SettingsComponent", "speakerFocused", "disableChat", "disableMicrophone", "disableCamera", "disableScreenShare", "hideParticipantList", "showSettings"]);
|
|
31
|
+
const [widgetState, setWidgetState] = React.useState({
|
|
32
|
+
showChat: false,
|
|
33
|
+
unreadMessages: 0,
|
|
34
|
+
showSettings: showSettings || false
|
|
35
|
+
});
|
|
36
|
+
const lastAutoFocusedScreenShareTrack = React.useRef(null);
|
|
37
|
+
const tracks = (0, components_react_1.useTracks)([
|
|
38
|
+
{ source: livekit_client_1.Track.Source.Camera, withPlaceholder: true },
|
|
39
|
+
{ source: livekit_client_1.Track.Source.ScreenShare, withPlaceholder: false }
|
|
40
|
+
], { updateOnlyOn: [livekit_client_1.RoomEvent.ActiveSpeakersChanged], onlySubscribed: false });
|
|
41
|
+
const { localParticipant } = (0, components_react_1.useLocalParticipant)();
|
|
42
|
+
const participants = (0, components_react_1.useParticipants)();
|
|
43
|
+
const widgetUpdate = (state) => {
|
|
44
|
+
components_core_1.log.debug('updating widget state', state);
|
|
45
|
+
setWidgetState(state);
|
|
46
|
+
};
|
|
47
|
+
const handleFocusStateChange = (state) => {
|
|
48
|
+
var _a, _b;
|
|
49
|
+
components_core_1.log.debug('updating widget state', state);
|
|
50
|
+
if (state && state.participant) {
|
|
51
|
+
const updatedFocusTrack = tracks.find((tr) => tr.participant.identity === state.participant.identity);
|
|
52
|
+
if (updatedFocusTrack) {
|
|
53
|
+
(_b = (_a = layoutContext.pin).dispatch) === null || _b === void 0 ? void 0 : _b.call(_a, { msg: 'set_pin', trackReference: updatedFocusTrack });
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
const layoutContext = (0, components_react_1.useCreateLayoutContext)();
|
|
58
|
+
const screenShareTracks = tracks.filter(components_core_1.isTrackReference).filter((track) => track.publication.source === livekit_client_1.Track.Source.ScreenShare);
|
|
59
|
+
const focusTrack = (_b = (0, components_react_1.usePinnedTracks)(layoutContext)) === null || _b === void 0 ? void 0 : _b[0];
|
|
60
|
+
const carouselTracks = tracks.filter((track) => !(0, components_core_1.isEqualTrackRef)(track, focusTrack));
|
|
61
|
+
React.useEffect(() => {
|
|
62
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
63
|
+
// If screen share tracks are published, and no pin is set explicitly, auto set the screen share.
|
|
64
|
+
if (screenShareTracks.some((track) => track.publication.isSubscribed) && lastAutoFocusedScreenShareTrack.current === null) {
|
|
65
|
+
components_core_1.log.debug('Auto set screen share focus:', { newScreenShareTrack: screenShareTracks[0] });
|
|
66
|
+
(_b = (_a = layoutContext.pin).dispatch) === null || _b === void 0 ? void 0 : _b.call(_a, { msg: 'set_pin', trackReference: screenShareTracks[0] });
|
|
67
|
+
lastAutoFocusedScreenShareTrack.current = screenShareTracks[0];
|
|
68
|
+
}
|
|
69
|
+
else if (lastAutoFocusedScreenShareTrack.current &&
|
|
70
|
+
!screenShareTracks.some((track) => { var _a, _b; return track.publication.trackSid === ((_b = (_a = lastAutoFocusedScreenShareTrack.current) === null || _a === void 0 ? void 0 : _a.publication) === null || _b === void 0 ? void 0 : _b.trackSid); })) {
|
|
71
|
+
components_core_1.log.debug('Auto clearing screen share focus.');
|
|
72
|
+
(_d = (_c = layoutContext.pin).dispatch) === null || _d === void 0 ? void 0 : _d.call(_c, { msg: 'clear_pin' });
|
|
73
|
+
lastAutoFocusedScreenShareTrack.current = null;
|
|
74
|
+
}
|
|
75
|
+
if (focusTrack && !(0, components_core_1.isTrackReference)(focusTrack)) {
|
|
76
|
+
console.log('asdadsa');
|
|
77
|
+
const updatedFocusTrack = tracks.find((tr) => tr.participant.identity === focusTrack.participant.identity && tr.source === focusTrack.source);
|
|
78
|
+
if (updatedFocusTrack !== focusTrack && (0, components_core_1.isTrackReference)(updatedFocusTrack)) {
|
|
79
|
+
(_f = (_e = layoutContext.pin).dispatch) === null || _f === void 0 ? void 0 : _f.call(_e, { msg: 'set_pin', trackReference: updatedFocusTrack });
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
else if (speakerFocused) {
|
|
83
|
+
const speaker = participants.find((pt) => {
|
|
84
|
+
return pt.name === speakerFocused;
|
|
85
|
+
});
|
|
86
|
+
if (speaker) {
|
|
87
|
+
const updatedFocusTrack = tracks.find((tr) => {
|
|
88
|
+
if (tr) {
|
|
89
|
+
return tr.participant.identity === speaker.identity;
|
|
90
|
+
}
|
|
91
|
+
return false;
|
|
92
|
+
});
|
|
93
|
+
(_h = (_g = layoutContext.pin).dispatch) === null || _h === void 0 ? void 0 : _h.call(_g, { msg: 'set_pin', trackReference: updatedFocusTrack });
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
}, [
|
|
97
|
+
screenShareTracks.map((ref) => `${ref.publication.trackSid}_${ref.publication.isSubscribed}`).join(),
|
|
98
|
+
(_c = focusTrack === null || focusTrack === void 0 ? void 0 : focusTrack.publication) === null || _c === void 0 ? void 0 : _c.trackSid,
|
|
99
|
+
tracks,
|
|
100
|
+
participants,
|
|
101
|
+
speakerFocused
|
|
102
|
+
]);
|
|
103
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "lk-video-conference" }, props, { children: [(0, components_core_1.isWeb)() && ((0, jsx_runtime_1.jsxs)(components_react_1.LayoutContextProvider, Object.assign({ value: layoutContext, onPinChange: handleFocusStateChange, onWidgetChange: widgetUpdate }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "lk-video-conference-inner" }, { children: [!focusTrack ? ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "lk-grid-layout-wrapper" }, { children: (0, jsx_runtime_1.jsx)(components_react_1.GridLayout, Object.assign({ tracks: tracks }, { children: (0, jsx_runtime_1.jsx)(components_react_1.ParticipantTile, {}) })) }))) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "lk-focus-layout-wrapper" }, { children: (0, jsx_runtime_1.jsxs)(components_react_1.FocusLayoutContainer, { children: [!hideParticipantList && ((0, jsx_runtime_1.jsx)(components_react_1.CarouselLayout, Object.assign({ tracks: carouselTracks }, { children: (0, jsx_runtime_1.jsx)(components_react_1.ParticipantTile, {}) }))), focusTrack && (0, jsx_runtime_1.jsx)(components_react_1.FocusLayout, { trackRef: focusTrack })] }) }))), (0, jsx_runtime_1.jsx)(components_react_1.ControlBar, { controls: Object.assign(Object.assign({}, (localParticipant.name !== speakerFocused
|
|
104
|
+
? {
|
|
105
|
+
chat: !disableChat,
|
|
106
|
+
microphone: !disableMicrophone,
|
|
107
|
+
camera: !disableCamera,
|
|
108
|
+
screenShare: !disableScreenShare
|
|
109
|
+
}
|
|
110
|
+
: {})), { settings: !!SettingsComponent }) })] })), !disableChat && ((0, jsx_runtime_1.jsx)(components_react_1.Chat, { style: { display: widgetState.showChat ? 'grid' : 'none' }, messageFormatter: chatMessageFormatter, messageEncoder: chatMessageEncoder, messageDecoder: chatMessageDecoder })), SettingsComponent && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "lk-settings-menu-modal", style: { display: widgetState.showSettings ? 'block' : 'none' } }, { children: (0, jsx_runtime_1.jsx)(SettingsComponent, {}) })))] }))), (0, jsx_runtime_1.jsx)(components_react_1.RoomAudioRenderer, {}), (0, jsx_runtime_1.jsx)(components_react_1.ConnectionStateToast, {})] })));
|
|
111
|
+
}
|
|
112
|
+
exports.VideoConference = VideoConference;
|
|
@@ -37,22 +37,8 @@ function NavigationMenuDrawer(inProps) {
|
|
|
37
37
|
name: PREFIX
|
|
38
38
|
});
|
|
39
39
|
const { className = null, showDrawerHeader = true, drawerHeaderContent = (0, jsx_runtime_1.jsx)(DefaultHeaderContent_1.default, {}), drawerContent = (0, jsx_runtime_1.jsx)(DefaultDrawerContent_1.default, {}), showDrawerFooterContent = true, drawerFooterContent = null, ScrollContainerProps = {}, CreateLiveStreamButtonComponentProps = {}, open, onClose } = props, rest = tslib_1.__rest(props, ["className", "showDrawerHeader", "drawerHeaderContent", "drawerContent", "showDrawerFooterContent", "drawerFooterContent", "ScrollContainerProps", "CreateLiveStreamButtonComponentProps", "open", "onClose"]);
|
|
40
|
-
const { preferences, features } = (0, react_core_1.useSCPreferences)();
|
|
41
40
|
const scUserContext = (0, react_core_1.useSCUser)();
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
/* const liveStreamEnabled = useMemo(
|
|
45
|
-
() =>
|
|
46
|
-
preferences &&
|
|
47
|
-
features &&
|
|
48
|
-
features.includes(SCFeatureName.LIVE_STREAM) &&
|
|
49
|
-
SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in preferences &&
|
|
50
|
-
preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value,
|
|
51
|
-
[preferences, features]
|
|
52
|
-
); */
|
|
53
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
54
|
-
// @ts-ignore
|
|
55
|
-
const canCreateLiveStream = (0, react_1.useMemo)(() => true /* scUserContext?.user?.permission?.create_livestream */, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
|
|
56
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent, onClick: onClose }, { children: drawerContent })) })), showDrawerFooterContent && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [Boolean(drawerContent || (liveStreamEnabled && canCreateLiveStream)) && (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooter }, { children: drawerFooterContent ? (drawerFooterContent) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: (0, jsx_runtime_1.jsx)(CreateLiveStreamButton_1.default, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) }))] }))] })));
|
|
41
|
+
const canCreateLiveStream = (0, react_1.useMemo)(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_livestream; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
|
|
42
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ anchor: "left", className: (0, classnames_1.default)(classes.root, className), open: open, onClose: onClose }, rest, { children: [showDrawerHeader && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.drawerHeader }, { children: [drawerHeaderContent, (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.drawerHeaderAction, onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Divider, {})] })), (0, jsx_runtime_1.jsx)(ScrollContainer_1.default, Object.assign({}, ScrollContainerProps, { children: (0, jsx_runtime_1.jsx)(material_1.List, Object.assign({ className: classes.drawerContent, onClick: onClose }, { children: drawerContent })) })), showDrawerFooterContent && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [Boolean(drawerContent || canCreateLiveStream) && (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooter }, { children: drawerFooterContent ? (drawerFooterContent) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.drawerFooterLiveStream }, { children: (0, jsx_runtime_1.jsx)(CreateLiveStreamButton_1.default, Object.assign({ color: "primary", className: classes.drawerFooterLiveStreamButton, fullWidth: true }, CreateLiveStreamButtonComponentProps)) }))) }))] }))] })));
|
|
57
43
|
}
|
|
58
44
|
exports.default = NavigationMenuDrawer;
|
package/lib/cjs/index.d.ts
CHANGED
|
@@ -126,6 +126,8 @@ import UserSubscribedGroupsWidget, { UserSubscribedGroupsWidgetProps, UserSubscr
|
|
|
126
126
|
import UserSuggestionWidget, { UserSuggestionWidgetProps, UserSuggestionWidgetSkeleton } from './components/UserSuggestionWidget';
|
|
127
127
|
import Widget, { WidgetProps } from './components/Widget';
|
|
128
128
|
import { 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 } from './constants/Media';
|
|
129
|
+
import LiveStream, { LiveStreamProps, LiveStreamSkeletonProps, LiveStreamSkeleton } from './components/LiveStream';
|
|
130
|
+
import LiveStreamInfoDetails, { LiveStreamInfoDetailsProps } from './shared/LiveStreamInfoDetails';
|
|
129
131
|
import CreateLiveStreamDialog, { CreateLiveStreamDialogProps } from './components/CreateLiveStreamDialog';
|
|
130
132
|
import CreateLiveStreamButton, { CreateLiveStreamButtonProps } from './components/CreateLiveStreamButton';
|
|
131
133
|
import LiveStreamForm, { LiveStreamFormProps } from './components/LiveStreamForm';
|
|
@@ -183,4 +185,4 @@ import LogoSelfCommunity from './assets/logo';
|
|
|
183
185
|
/**
|
|
184
186
|
* List all exports
|
|
185
187
|
*/
|
|
186
|
-
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, 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, EditEventButton, EditEventButtonProps, EditGroupButton, EditGroupButtonProps, EditMediaProps, Editor, EditorProps, EditorSkeleton, EmailTextField, 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, HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorDetailProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorProps, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, InfiniteScroll, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, InviteUserEventButton, InviteUserEventButtonProps, LanguageSwitcher, LEGAL_POLICIES, Lightbox, LightboxProps, Link, LINKEDIN_SHARE, LocationAutocomplete, LocationAutocompleteProps, LogoSelfCommunity, 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, 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, SuggestedEventsWidgetProps, SuggestedEventsWidgetSkeleton, TagChip, TagChipProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserActionIconButtonProps, UserAvatar, UserAvatarProps, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserCounters, UserCountersProps, 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, useStickyBox, UseStickyBoxProps, CreateLiveStreamDialog, CreateLiveStreamDialogProps, CreateLiveStreamButton, CreateLiveStreamButtonProps, LiveStreamForm, LiveStreamFormProps, LiveStreamRoom, LiveStreamRoomProps, LiveStreamVideoConference, LiveStreamVideoConferenceProps, VirtualScrollerItemProps, Widget, WidgetProps, X_SHARE };
|
|
188
|
+
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, 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, EditEventButton, EditEventButtonProps, EditGroupButton, EditGroupButtonProps, EditMediaProps, Editor, EditorProps, EditorSkeleton, EmailTextField, 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, HiddenPlaceholder, Incubator, IncubatorDetail, IncubatorDetailProps, IncubatorListWidget, IncubatorListWidgetProps, IncubatorProps, IncubatorSubscribeButton, IncubatorSubscribeButtonProps, IncubatorSuggestionWidget, IncubatorSuggestionWidgetProps, InfiniteScroll, InlineComposerWidget, InlineComposerWidgetProps, InlineComposerWidgetSkeleton, InviteUserEventButton, InviteUserEventButtonProps, LanguageSwitcher, LEGAL_POLICIES, Lightbox, LightboxProps, Link, LINKEDIN_SHARE, LocationAutocomplete, LocationAutocompleteProps, LogoSelfCommunity, 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, 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, SuggestedEventsWidgetProps, SuggestedEventsWidgetSkeleton, TagChip, TagChipProps, ToastNotifications, ToastNotificationsProps, ToastNotificationsSkeleton, UrlTextField, User, UserActionIconButton, UserActionIconButtonProps, UserAvatar, UserAvatarProps, UserConnectionsRequestsSentWidget, UserConnectionsRequestsSentWidgetProps, UserConnectionsRequestsSentWidgetSkeleton, UserConnectionsRequestsWidget, UserConnectionsRequestsWidgetProps, UserConnectionsRequestsWidgetSkeleton, UserConnectionsWidget, UserConnectionsWidgetProps, UserConnectionsWidgetSkeleton, UserCounters, UserCountersProps, 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, useStickyBox, UseStickyBoxProps, LiveStream, LiveStreamProps, LiveStreamSkeletonProps, LiveStreamSkeleton, LiveStreamInfoDetails, LiveStreamInfoDetailsProps, CreateLiveStreamDialog, CreateLiveStreamDialogProps, CreateLiveStreamButton, CreateLiveStreamButtonProps, LiveStreamForm, LiveStreamFormProps, LiveStreamRoom, LiveStreamRoomProps, LiveStreamVideoConference, LiveStreamVideoConferenceProps, VirtualScrollerItemProps, Widget, WidgetProps, X_SHARE };
|
package/lib/cjs/index.js
CHANGED
|
@@ -5,7 +5,7 @@ exports.FeedObject = exports.Feed = exports.FACEBOOK_SHARE = exports.EventsSkele
|
|
|
5
5
|
exports.LocationAutocomplete = exports.LINKEDIN_SHARE = exports.Link = exports.Lightbox = exports.LEGAL_POLICIES = exports.LanguageSwitcher = exports.InviteUserEventButton = exports.InlineComposerWidgetSkeleton = exports.InlineComposerWidget = exports.InfiniteScroll = exports.IncubatorSuggestionWidget = exports.IncubatorSubscribeButton = exports.IncubatorListWidget = exports.IncubatorDetail = exports.Incubator = exports.HiddenPlaceholder = exports.GroupSubscribeButton = exports.GroupsSkeleton = exports.GroupSkeleton = exports.GroupSettingsIconButton = exports.Groups = exports.GroupRequestsWidgetSkeleton = exports.GroupRequestsWidget = exports.GroupMembersWidgetSkeleton = exports.GroupMembersWidget = exports.GroupMembersButton = exports.GroupInvitedWidgetSkeleton = exports.GroupInvitedWidget = exports.GroupInviteButton = exports.GroupInfoWidgetSkeleton = exports.GroupInfoWidget = exports.GroupHeaderSkeleton = exports.GroupHeader = exports.GroupForm = exports.GroupActionsMenu = exports.Group = exports.getUnseenNotificationCounter = exports.getUnseenNotification = exports.getRelativeTime = exports.GenericSkeleton = exports.FriendshipUserButton = exports.FooterSkeleton = exports.Footer = exports.FollowUserButton = exports.File = exports.FeedUpdatesWidgetSkeleton = exports.FeedUpdatesWidget = exports.FeedSkeleton = exports.FeedObjectSkeleton = exports.FeedObjectMediaPreview = void 0;
|
|
6
6
|
exports.PrivateMessageThreadItem = exports.PrivateMessageThread = exports.PrivateMessageSnippetsSkeleton = exports.PrivateMessageSnippets = exports.PrivateMessageSnippetItemSkeleton = exports.PrivateMessageSnippetItem = exports.PrivateMessageSettingsIconButton = exports.PrivateMessageEditorSkeleton = exports.PrivateMessageEditor = exports.PrivateMessageComponentSkeleton = exports.PrivateMessageComponent = exports.PollSuggestionWidget = exports.PlatformWidgetSkeleton = exports.PlatformWidget = exports.PhoneTextField = exports.PasswordTextField = exports.OnBoardingWidgetSkeleton = exports.OnBoardingWidget = exports.NotificationSkeleton = exports.Notification = exports.NavigationToolbarSkeleton = exports.NavigationToolbarMobileSkeleton = exports.NavigationToolbarMobile = exports.NavigationToolbar = exports.NavigationSettingsIconButton = exports.NavigationMenuIconButton = exports.NavigationMenuHeader = exports.NavigationMenuDrawer = exports.NavigationMenuContent = exports.MyEventsWidgetSkeleton = exports.MyEventsWidget = exports.MIN_PRELOAD_OFFSET_VIEWPORT = exports.MetadataField = exports.MessageUploaderUtils = exports.MediaChunkUploader = exports.MEDIA_TYPE_VIDEO = exports.MEDIA_TYPE_URL = exports.MEDIA_TYPE_SHARE = exports.MEDIA_TYPE_LINK = exports.MEDIA_TYPE_IMAGE = exports.MEDIA_TYPE_EVENT = exports.MEDIA_TYPE_EMBED = exports.MEDIA_TYPE_DOCUMENT = exports.MEDIA_EMBED_SC_SHARED_OBJECT = exports.MEDIA_EMBED_SC_SHARED_EVENT = exports.MEDIA_EMBED_SC_LINK_TYPE = exports.MAX_PRELOAD_OFFSET_VIEWPORT = exports.LoyaltyProgramWidgetSkeleton = exports.LoyaltyProgramWidget = exports.LogoSelfCommunity = void 0;
|
|
7
7
|
exports.UsernameTextField = exports.UserInfoSkeleton = exports.UserInfoDialog = exports.UserInfo = exports.UserFollowersWidgetSkeleton = exports.UserFollowersWidget = exports.UserFollowedUsersWidgetSkeleton = exports.UserFollowedUsersWidget = exports.UserFollowedCategoriesWidgetSkeleton = exports.UserFollowedCategoriesWidget = exports.UserDeletedSnackBar = exports.UserCounters = exports.UserConnectionsWidgetSkeleton = exports.UserConnectionsWidget = exports.UserConnectionsRequestsWidgetSkeleton = exports.UserConnectionsRequestsWidget = exports.UserConnectionsRequestsSentWidgetSkeleton = exports.UserConnectionsRequestsSentWidget = exports.UserAvatar = exports.UserActionIconButton = exports.User = exports.UrlTextField = exports.ToastNotificationsSkeleton = exports.ToastNotifications = exports.TagChip = exports.SuggestedEventsWidgetSkeleton = exports.SuggestedEventsWidget = exports.StickyBox = exports.SnippetNotificationsSkeleton = exports.SnippetNotifications = exports.Share = exports.SearchDialog = exports.SearchAutocomplete = exports.SCUserSocialAssociations = exports.SCUserProfileSettings = exports.SCUserProfileFields = exports.SCNotificationObjectTemplateType = exports.SCFeedObjectTemplateType = exports.SCFeedObjectActivitiesType = exports.SCEventTemplateType = exports.SCCommentsOrderBy = exports.SCBroadcastMessageTemplateType = exports.ReplyComment = exports.RelatedFeedObjectsWidgetSkeleton = exports.RelatedFeedObjectsWidget = exports.RelatedEventsWidgetSkeleton = exports.RelatedEventsWidget = exports.ProgressBar = exports.PrivateMessageThreadSkeleton = exports.PrivateMessageThreadItemSkeleton = void 0;
|
|
8
|
-
exports.X_SHARE = exports.Widget = exports.LiveStreamVideoConference = exports.LiveStreamRoom = exports.LiveStreamForm = exports.CreateLiveStreamButton = exports.CreateLiveStreamDialog = exports.useStickyBox = exports.UserSuggestionWidgetSkeleton = exports.UserSuggestionWidget = exports.UserSubscribedGroupsWidgetSkeleton = exports.UserSubscribedGroupsWidget = exports.UserSocialAssociation = exports.UserSkeleton = exports.UserProfileHeaderSkeleton = exports.UserProfileHeader = exports.UserProfileEditSkeleton = exports.UserProfileEditSectionSettings = exports.UserProfileEditSectionPublicInfo = exports.UserProfileEditSectionAccount = exports.UserProfileEdit = exports.UserProfileBlocked = void 0;
|
|
8
|
+
exports.X_SHARE = exports.Widget = exports.LiveStreamVideoConference = exports.LiveStreamRoom = exports.LiveStreamForm = exports.CreateLiveStreamButton = exports.CreateLiveStreamDialog = exports.LiveStreamInfoDetails = exports.LiveStreamSkeleton = exports.LiveStream = exports.useStickyBox = exports.UserSuggestionWidgetSkeleton = exports.UserSuggestionWidget = exports.UserSubscribedGroupsWidgetSkeleton = exports.UserSubscribedGroupsWidget = exports.UserSocialAssociation = exports.UserSkeleton = exports.UserProfileHeaderSkeleton = exports.UserProfileHeader = exports.UserProfileEditSkeleton = exports.UserProfileEditSectionSettings = exports.UserProfileEditSectionPublicInfo = exports.UserProfileEditSectionAccount = exports.UserProfileEdit = exports.UserProfileBlocked = void 0;
|
|
9
9
|
const tslib_1 = require("tslib");
|
|
10
10
|
/**
|
|
11
11
|
* Components
|
|
@@ -341,6 +341,11 @@ Object.defineProperty(exports, "MEDIA_TYPE_LINK", { enumerable: true, get: funct
|
|
|
341
341
|
Object.defineProperty(exports, "MEDIA_TYPE_SHARE", { enumerable: true, get: function () { return Media_1.MEDIA_TYPE_SHARE; } });
|
|
342
342
|
Object.defineProperty(exports, "MEDIA_TYPE_URL", { enumerable: true, get: function () { return Media_1.MEDIA_TYPE_URL; } });
|
|
343
343
|
Object.defineProperty(exports, "MEDIA_TYPE_VIDEO", { enumerable: true, get: function () { return Media_1.MEDIA_TYPE_VIDEO; } });
|
|
344
|
+
const LiveStream_1 = tslib_1.__importStar(require("./components/LiveStream"));
|
|
345
|
+
exports.LiveStream = LiveStream_1.default;
|
|
346
|
+
Object.defineProperty(exports, "LiveStreamSkeleton", { enumerable: true, get: function () { return LiveStream_1.LiveStreamSkeleton; } });
|
|
347
|
+
const LiveStreamInfoDetails_1 = tslib_1.__importDefault(require("./shared/LiveStreamInfoDetails"));
|
|
348
|
+
exports.LiveStreamInfoDetails = LiveStreamInfoDetails_1.default;
|
|
344
349
|
const CreateLiveStreamDialog_1 = tslib_1.__importDefault(require("./components/CreateLiveStreamDialog"));
|
|
345
350
|
exports.CreateLiveStreamDialog = CreateLiveStreamDialog_1.default;
|
|
346
351
|
const CreateLiveStreamButton_1 = tslib_1.__importDefault(require("./components/CreateLiveStreamButton"));
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { SCLiveStreamType } from '@selfcommunity/types';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
export interface LiveStreamInfoDetailsProps {
|
|
4
|
+
liveStream: SCLiveStreamType;
|
|
5
|
+
liveStreamId?: number;
|
|
6
|
+
hideDateIcon?: boolean;
|
|
7
|
+
hideLocationIcon?: boolean;
|
|
8
|
+
hideCreatedIcon?: boolean;
|
|
9
|
+
hasDateInfo?: boolean;
|
|
10
|
+
hasLocationInfo?: boolean;
|
|
11
|
+
hasCreatedInfo?: boolean;
|
|
12
|
+
hasInProgress?: boolean;
|
|
13
|
+
beforeDateInfo?: ReactNode | null;
|
|
14
|
+
beforeLocationInfo?: ReactNode | null;
|
|
15
|
+
beforeCreatedInfo?: ReactNode | null;
|
|
16
|
+
}
|
|
17
|
+
export default function LiveStreamInfoDetails(inProps: LiveStreamInfoDetailsProps): JSX.Element;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
const material_1 = require("@mui/material");
|
|
5
|
+
const react_core_1 = require("@selfcommunity/react-core");
|
|
6
|
+
const react_intl_1 = require("react-intl");
|
|
7
|
+
const PREFIX = 'SCLiveStreamInfoDetails';
|
|
8
|
+
const classes = {
|
|
9
|
+
root: `${PREFIX}-root`,
|
|
10
|
+
iconTextWrapper: `${PREFIX}-icon-text-wrapper`,
|
|
11
|
+
inProgress: `${PREFIX}-in-progress`,
|
|
12
|
+
link: `${PREFIX}-link`,
|
|
13
|
+
url: `${PREFIX}-url`,
|
|
14
|
+
creationWrapper: `${PREFIX}-creation-wrapper`
|
|
15
|
+
};
|
|
16
|
+
const Root = (0, material_1.styled)(material_1.Stack, {
|
|
17
|
+
name: PREFIX,
|
|
18
|
+
slot: 'Root',
|
|
19
|
+
overridesResolver: (_props, styles) => styles.root
|
|
20
|
+
})(() => ({}));
|
|
21
|
+
function LiveStreamInfoDetails(inProps) {
|
|
22
|
+
// PROPS
|
|
23
|
+
const props = (0, material_1.useThemeProps)({
|
|
24
|
+
props: inProps,
|
|
25
|
+
name: PREFIX
|
|
26
|
+
});
|
|
27
|
+
const { liveStream, liveStreamId, hideDateIcon = false, hideLocationIcon = false, hideCreatedIcon = false, hasDateInfo = true, hasLocationInfo = true, hasCreatedInfo = false, hasInProgress = false, beforeDateInfo, beforeLocationInfo, beforeCreatedInfo } = props;
|
|
28
|
+
// CONTEXT
|
|
29
|
+
const scRoutingContext = (0, react_core_1.useSCRouting)();
|
|
30
|
+
// HOOKS
|
|
31
|
+
const intl = (0, react_intl_1.useIntl)();
|
|
32
|
+
const { scLiveStream } = (0, react_core_1.useSCFetchLiveStream)({ id: liveStreamId, liveStream });
|
|
33
|
+
if (!scLiveStream) {
|
|
34
|
+
return null;
|
|
35
|
+
}
|
|
36
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ className: classes.root }, { children: [beforeDateInfo, hasDateInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.iconTextWrapper }, { children: [!hideDateIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: scLiveStream.closed_at ? 'calendar_off' : 'CalendarIcon' })), hasInProgress && scLiveStream.running && ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.inProgress", defaultMessage: "ui.eventInfoDetails.inProgress" }) }, { children: (0, jsx_runtime_1.jsx)(material_1.Box, { className: classes.inProgress }) })))] }))), beforeLocationInfo, hasLocationInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.iconTextWrapper }, { children: [!hideLocationIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "play_circle_outline" })), (0, jsx_runtime_1.jsx)(react_core_1.Link, Object.assign({ to: scRoutingContext.url(react_core_1.SCRoutes.LIVESTREAM_ROUTE_NAME, scLiveStream), target: "_blank", className: classes.link }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.url }, { children: scRoutingContext.url(react_core_1.SCRoutes.LIVESTREAM_ROUTE_NAME, scLiveStream) })) }))] }))), beforeCreatedInfo, hasCreatedInfo && ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.creationWrapper }, { children: [!hideCreatedIcon && (0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "small" }, { children: "create" })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventInfoDetails.date.create", defaultMessage: "ui.eventInfoDetails.date.create", values: {
|
|
37
|
+
date: intl.formatDate(scLiveStream.created_at, {
|
|
38
|
+
weekday: 'long',
|
|
39
|
+
day: 'numeric',
|
|
40
|
+
year: 'numeric',
|
|
41
|
+
month: 'long'
|
|
42
|
+
})
|
|
43
|
+
} }) }))] })))] })));
|
|
44
|
+
}
|
|
45
|
+
exports.default = LiveStreamInfoDetails;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.SCLiveStreamTemplateType = void 0;
|
|
4
|
+
var SCLiveStreamTemplateType;
|
|
5
|
+
(function (SCLiveStreamTemplateType) {
|
|
6
|
+
SCLiveStreamTemplateType["DETAIL"] = "detail";
|
|
7
|
+
SCLiveStreamTemplateType["SNIPPET"] = "snippet";
|
|
8
|
+
SCLiveStreamTemplateType["PREVIEW"] = "preview";
|
|
9
|
+
})(SCLiveStreamTemplateType = exports.SCLiveStreamTemplateType || (exports.SCLiveStreamTemplateType = {}));
|
|
@@ -12,11 +12,6 @@ export interface CreateLiveStreamButtonProps extends ButtonProps {
|
|
|
12
12
|
* @default empty object
|
|
13
13
|
*/
|
|
14
14
|
CreateLiveStreamDialogComponentProps?: CreateLiveStreamDialogProps;
|
|
15
|
-
/**
|
|
16
|
-
* On click callback function
|
|
17
|
-
* @default null
|
|
18
|
-
*/
|
|
19
|
-
onButtonClick?: (event: any, reason: any) => void;
|
|
20
15
|
/**
|
|
21
16
|
* On success callback function
|
|
22
17
|
* @default null
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { Button, Icon } from '@mui/material';
|
|
4
4
|
import { styled } from '@mui/material/styles';
|
|
5
5
|
import { useThemeProps } from '@mui/system';
|
|
6
|
-
import { SCUserContext
|
|
6
|
+
import { SCUserContext } from '@selfcommunity/react-core';
|
|
7
7
|
import classNames from 'classnames';
|
|
8
8
|
import React, { useContext, useMemo } from 'react';
|
|
9
9
|
import { FormattedMessage } from 'react-intl';
|
|
@@ -50,21 +50,7 @@ export default function CreateLiveStreamButton(inProps) {
|
|
|
50
50
|
const [open, setOpen] = React.useState(false);
|
|
51
51
|
// CONST
|
|
52
52
|
const authUserId = scUserContext.user ? scUserContext.user.id : null;
|
|
53
|
-
const {
|
|
54
|
-
// TODO
|
|
55
|
-
const liveStreamEnabled = true;
|
|
56
|
-
/* const liveStreamEnabled = useMemo(
|
|
57
|
-
() =>
|
|
58
|
-
preferences &&
|
|
59
|
-
features &&
|
|
60
|
-
features.includes(SCFeatureName.LIVE_STREAM) &&
|
|
61
|
-
SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in preferences &&
|
|
62
|
-
preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value,
|
|
63
|
-
[preferences, features]
|
|
64
|
-
); */
|
|
65
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
|
|
66
|
-
// @ts-ignore
|
|
67
|
-
const canCreateLiveStream = useMemo(() => true /* scUserContext?.user?.permission?.create_livestream */, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
|
|
53
|
+
const canCreateLiveStream = useMemo(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_live_stream; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
|
|
68
54
|
/**
|
|
69
55
|
* Handle close
|
|
70
56
|
*/
|
|
@@ -81,7 +67,7 @@ export default function CreateLiveStreamButton(inProps) {
|
|
|
81
67
|
/**
|
|
82
68
|
* If there's no authUserId, component is hidden.
|
|
83
69
|
*/
|
|
84
|
-
if (!
|
|
70
|
+
if (!canCreateLiveStream || !authUserId) {
|
|
85
71
|
return null;
|
|
86
72
|
}
|
|
87
73
|
/**
|
|
@@ -44,8 +44,6 @@ export interface CreateLiveStreamDialogProps extends BaseDialogProps {
|
|
|
44
44
|
|root|.SCCreateLivestreamDialog-root|Styles applied to the root element.|
|
|
45
45
|
|content|.SCCreateLivestreamDialog-content|Styles applied to the content element.|
|
|
46
46
|
|
|
47
|
-
|
|
48
|
-
|
|
49
47
|
* @param inProps
|
|
50
48
|
*/
|
|
51
49
|
export default function CreateLiveStreamDialog(inProps: CreateLiveStreamDialogProps): JSX.Element;
|
|
@@ -3,8 +3,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
3
3
|
import React, { useCallback, useEffect, useMemo, useState } from 'react';
|
|
4
4
|
import { styled } from '@mui/material/styles';
|
|
5
5
|
import { useThemeProps } from '@mui/system';
|
|
6
|
-
import {
|
|
7
|
-
import { SCFeatureName } from '@selfcommunity/types';
|
|
6
|
+
import { useSCUser } from '@selfcommunity/react-core';
|
|
8
7
|
import classNames from 'classnames';
|
|
9
8
|
import { FormattedMessage } from 'react-intl';
|
|
10
9
|
import BaseDialog from '../../shared/BaseDialog';
|
|
@@ -53,11 +52,10 @@ const Transition = React.forwardRef(function Transition(props, ref) {
|
|
|
53
52
|
|root|.SCCreateLivestreamDialog-root|Styles applied to the root element.|
|
|
54
53
|
|content|.SCCreateLivestreamDialog-content|Styles applied to the content element.|
|
|
55
54
|
|
|
56
|
-
|
|
57
|
-
|
|
58
55
|
* @param inProps
|
|
59
56
|
*/
|
|
60
57
|
export default function CreateLiveStreamDialog(inProps) {
|
|
58
|
+
var _a, _b;
|
|
61
59
|
//PROPS
|
|
62
60
|
const props = useThemeProps({
|
|
63
61
|
props: inProps,
|
|
@@ -65,28 +63,12 @@ export default function CreateLiveStreamDialog(inProps) {
|
|
|
65
63
|
});
|
|
66
64
|
const { className, open = true, onClose, onSuccess } = props, rest = __rest(props, ["className", "open", "onClose", "onSuccess"]);
|
|
67
65
|
// CONTEXT
|
|
68
|
-
const scContext = useSCContext();
|
|
69
66
|
const scUserContext = useSCUser();
|
|
70
|
-
const {
|
|
71
|
-
const
|
|
72
|
-
/* preferences &&
|
|
73
|
-
features &&
|
|
74
|
-
features.includes(SCFeatureName.LIVE_STREAM) &&
|
|
75
|
-
SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in preferences &&
|
|
76
|
-
preferences[SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value*/ [preferences, features]);
|
|
77
|
-
const onlyStaffLiveStreamEnabled = useMemo(() => true /* preferences[SCPreferences.CONFIGURATIONS_LIVESTREAM_ONLY_STAFF_ENABLED].value */, [preferences]);
|
|
78
|
-
const canCreateLiveStream = useMemo(() => true /* liveStreamEnabled && (scUserContext?.user?.permission?.create_livestream || (onlyStaffLiveStreamEnabled && UserUtils.isStaff(scUserContext.user)))*/, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, onlyStaffLiveStreamEnabled]);
|
|
79
|
-
const eventsEnabled = useMemo(() => preferences &&
|
|
80
|
-
features &&
|
|
81
|
-
features.includes(SCFeatureName.TAGGING) &&
|
|
82
|
-
SCPreferences.CONFIGURATIONS_EVENTS_ENABLED in preferences &&
|
|
83
|
-
preferences[SCPreferences.CONFIGURATIONS_EVENTS_ENABLED].value, [preferences, features]);
|
|
84
|
-
const onlyStaffEventEnabled = useMemo(() => preferences[SCPreferences.CONFIGURATIONS_EVENTS_ONLY_STAFF_ENABLED].value, [preferences]);
|
|
85
|
-
const canCreateEvent = useMemo(() => { var _a, _b; return eventsEnabled && (((_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_event) || true || (onlyStaffEventEnabled && UserUtils.isStaff(scUserContext.user))); }, [scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user, eventsEnabled, onlyStaffEventEnabled]);
|
|
86
|
-
const canCreateLiveStreamEvent = useMemo(() => Boolean(canCreateLiveStream && canCreateEvent), [canCreateEvent, canCreateLiveStream]);
|
|
67
|
+
const canCreateLiveStream = useMemo(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_live_stream; }, [(_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission]);
|
|
68
|
+
const canCreateEvent = useMemo(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_event; }, [(_b = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _b === void 0 ? void 0 : _b.permission]);
|
|
87
69
|
// STATE
|
|
88
|
-
const [step, setStep] = useState(
|
|
89
|
-
const [liveType, setLiveType] = useState(
|
|
70
|
+
const [step, setStep] = useState(canCreateEvent ? CreateLiveStreamStep.SELECT_TYPE : CreateLiveStreamStep.CREATE_LIVE);
|
|
71
|
+
const [liveType, setLiveType] = useState(canCreateEvent ? null : LiveStreamType.DIRECT_LIVE);
|
|
90
72
|
// HANDLER
|
|
91
73
|
const handleLiveTypeSelected = useCallback((l) => {
|
|
92
74
|
setLiveType(l);
|
|
@@ -102,16 +84,16 @@ export default function CreateLiveStreamDialog(inProps) {
|
|
|
102
84
|
onSuccess && onSuccess(e);
|
|
103
85
|
}, []);
|
|
104
86
|
useEffect(() => {
|
|
105
|
-
if (!
|
|
87
|
+
if (!canCreateEvent) {
|
|
106
88
|
setLiveType(LiveStreamType.DIRECT_LIVE);
|
|
107
89
|
}
|
|
108
|
-
}, [
|
|
90
|
+
}, [canCreateEvent]);
|
|
109
91
|
// user must be logged
|
|
110
|
-
if (!scUserContext.user) {
|
|
92
|
+
if (!scUserContext.user || !canCreateLiveStream) {
|
|
111
93
|
return null;
|
|
112
94
|
}
|
|
113
95
|
/**
|
|
114
96
|
* Renders root object
|
|
115
97
|
*/
|
|
116
|
-
return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: 'md', title: _jsxs(Box, Object.assign({ className: classes.title, component: 'span' }, { children: [Boolean(step === CreateLiveStreamStep.CREATE_LIVE &&
|
|
98
|
+
return (_jsx(Root, Object.assign({ DialogContentProps: { dividers: false }, maxWidth: 'md', title: _jsxs(Box, Object.assign({ className: classes.title, component: 'span' }, { children: [Boolean(step === CreateLiveStreamStep.CREATE_LIVE && canCreateEvent) && (_jsx(Button, Object.assign({ variant: "text", onClick: handleBack, startIcon: _jsx(Icon, { children: "arrow_back" }) }, { children: "Back" }))), _jsx(Box, Object.assign({ component: 'span' }, { children: _jsx(FormattedMessage, { id: "ui.createLivestreamDialog.title", defaultMessage: "ui.createLivestreamDialog.title" }) }))] })), fullWidth: true, open: open, scroll: 'paper', onClose: onClose, className: classNames(classes.root, className), TransitionComponent: Transition, PaperProps: { elevation: 0 } }, rest, { children: _jsxs(Box, Object.assign({ className: classes.content }, { children: [step === CreateLiveStreamStep.SELECT_TYPE && (_jsx(LiveStreamSelector, { liveSelected: liveType, onLiveSelected: handleLiveTypeSelected, onNext: handleLiveTypeSelectedNext })), step === CreateLiveStreamStep.CREATE_LIVE && (_jsx(_Fragment, { children: liveType === LiveStreamType.EVENT_LIVE ? _jsx(EventForm, { onSuccess: handleSubmit }) : _jsx(LiveStreamForm, { onSuccess: handleSubmit }) }))] })) })));
|
|
117
99
|
}
|
|
@@ -23,8 +23,15 @@ const Root = styled(Container, {
|
|
|
23
23
|
display: 'flex',
|
|
24
24
|
justifyContent: 'center',
|
|
25
25
|
alignItems: 'center',
|
|
26
|
+
[theme.breakpoints.down('sm')]: {
|
|
27
|
+
display: 'block'
|
|
28
|
+
},
|
|
26
29
|
'& > div': {
|
|
27
|
-
width: '
|
|
30
|
+
width: '290px',
|
|
31
|
+
[theme.breakpoints.down('sm')]: {
|
|
32
|
+
margin: '0px auto',
|
|
33
|
+
marginBottom: theme.spacing(2)
|
|
34
|
+
}
|
|
28
35
|
}
|
|
29
36
|
},
|
|
30
37
|
[`& .${classes.actions}`]: {
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { SCEventType } from '@selfcommunity/types';
|
|
2
2
|
import { Geolocation } from './types';
|
|
3
3
|
export interface EventAddressProps {
|
|
4
|
-
event?: SCEventType
|
|
4
|
+
event?: SCEventType | Partial<SCEventType>;
|
|
5
5
|
forwardGeolocationData: (data: Geolocation) => void;
|
|
6
|
+
forwardLivestreamSettingsData: (settings: any) => void;
|
|
6
7
|
className?: string;
|
|
7
8
|
}
|
|
8
9
|
export default function EventAddress(inProps: EventAddressProps): JSX.Element;
|
|
@@ -14,10 +14,19 @@ import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
|
|
|
14
14
|
import HiddenPlaceholder from '../../shared/HiddenPlaceholder';
|
|
15
15
|
import UrlTextField from '../../shared/UrlTextField';
|
|
16
16
|
import { PREFIX } from './constants';
|
|
17
|
+
import LiveStream from '../LiveStream';
|
|
18
|
+
import LiveStreamFormSettings from '../LiveStreamForm/LiveStreamFormSettings';
|
|
19
|
+
import { SCLiveStreamTemplateType } from '../../types/liveStream';
|
|
20
|
+
import { LIVESTREAM_DEFAULT_SETTINGS } from '../LiveStreamForm/constants';
|
|
21
|
+
import { getNewDate } from './utils';
|
|
17
22
|
const messages = defineMessages({
|
|
18
23
|
virtualPlaceholder: {
|
|
19
24
|
id: 'ui.eventForm.address.online.placeholder',
|
|
20
25
|
defaultMessage: 'ui.eventForm.address.online.placeholder'
|
|
26
|
+
},
|
|
27
|
+
name: {
|
|
28
|
+
id: 'ui.eventForm.name.placeholder',
|
|
29
|
+
defaultMessage: 'ui.eventForm.name.placeholder'
|
|
21
30
|
}
|
|
22
31
|
});
|
|
23
32
|
const classes = {
|
|
@@ -39,13 +48,21 @@ export default function EventAddress(inProps) {
|
|
|
39
48
|
// INTL
|
|
40
49
|
const intl = useIntl();
|
|
41
50
|
// PROPS
|
|
42
|
-
const { className, forwardGeolocationData, event } = props;
|
|
51
|
+
const { className, forwardGeolocationData, forwardLivestreamSettingsData, event } = props;
|
|
43
52
|
// STATE
|
|
44
53
|
const [location, setLocation] = useState((event === null || event === void 0 ? void 0 : event.location) || SCEventLocationType.PERSON);
|
|
45
54
|
const [geolocation, setGeoLocation] = useState(event ? { description: event.geolocation } : null);
|
|
46
55
|
const [inputValue, setInputValue] = useState('');
|
|
47
56
|
const [suggestions, setSuggestions] = useState([]);
|
|
48
57
|
const [timeoutId, setTimeoutId] = useState(null);
|
|
58
|
+
const liveStream = useMemo(() => {
|
|
59
|
+
console.log(event);
|
|
60
|
+
return {
|
|
61
|
+
title: (event === null || event === void 0 ? void 0 : event.name) || `${intl.formatMessage(messages.name)}`,
|
|
62
|
+
created_at: (event === null || event === void 0 ? void 0 : event.start_date) || getNewDate(),
|
|
63
|
+
settings: /* event?.livestream?.settings || */ LIVESTREAM_DEFAULT_SETTINGS
|
|
64
|
+
} /* || event.livestream? */;
|
|
65
|
+
}, [event]);
|
|
49
66
|
// CONTEXT
|
|
50
67
|
const scContext = useSCContext();
|
|
51
68
|
const geocodingApiKey = useMemo(() => scContext.settings.integrations && scContext.settings.integrations.geocoding.apiKey, [scContext.settings.integrations]);
|
|
@@ -86,6 +103,9 @@ export default function EventAddress(inProps) {
|
|
|
86
103
|
const handleLinkChange = (event) => {
|
|
87
104
|
forwardGeolocationData({ location, link: event.target.value });
|
|
88
105
|
};
|
|
106
|
+
const handleLiveStreamSettingsChange = (settings) => {
|
|
107
|
+
forwardLivestreamSettingsData(settings);
|
|
108
|
+
};
|
|
89
109
|
useEffect(() => {
|
|
90
110
|
if (timeoutId) {
|
|
91
111
|
clearTimeout(timeoutId);
|
|
@@ -112,7 +132,7 @@ export default function EventAddress(inProps) {
|
|
|
112
132
|
if (!geocodingApiKey && !isLoaded) {
|
|
113
133
|
return _jsx(HiddenPlaceholder, {});
|
|
114
134
|
}
|
|
115
|
-
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsxs(Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), _jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) })] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
|
|
135
|
+
return (_jsxs(Root, Object.assign({ className: classNames(classes.root, className) }, { children: [_jsxs(Tabs, Object.assign({ className: classes.tabs, value: location, onChange: handleChange, indicatorColor: "secondary", textColor: "secondary", variant: "fullWidth" }, { children: [_jsx(Tab, { value: SCEventLocationType.PERSON, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "add_location_alt" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.label", defaultMessage: "ui.eventForm.address.live.label" }) }), _jsx(Tab, { value: SCEventLocationType.ONLINE, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "play_circle_outline" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.label", defaultMessage: "ui.eventForm.address.online.label" }) }), _jsx(Tab, { value: SCEventLocationType.LIVESTREAM, classes: { root: classes.tab }, icon: _jsx(Icon, { children: "photo_camera" }), iconPosition: "start", label: _jsx(FormattedMessage, { id: "ui.eventForm.address.liveStream.label", defaultMessage: "ui.eventForm.address.liveStream.label" }) })] })), _jsxs(Box, Object.assign({ className: classes.tabContent }, { children: [location === SCEventLocationType.PERSON && (_jsx(Autocomplete, { size: "small", value: geolocation, onChange: handleSelection, inputValue: inputValue, onInputChange: handleLocationChange, options: suggestions, getOptionLabel: (option) => option.description || geolocation.description, noOptionsText: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.noResults", defaultMessage: "ui.eventForm.address.live.noResults" }), isOptionEqualToValue: (option, value) => option.description === value.description, renderInput: (params) => (_jsx(TextField, Object.assign({}, params, { label: _jsx(FormattedMessage, { id: "ui.eventForm.address.live.placeholder", defaultMessage: "ui.eventForm.address.live.placeholder" }), variant: "outlined", fullWidth: true, InputProps: Object.assign(Object.assign({}, params.InputProps), { endAdornment: (_jsxs(_Fragment, { children: [_jsx(InputAdornment, Object.assign({ position: "start" }, { children: _jsx(Icon, { children: "add_location_alt" }) })), params.InputProps.endAdornment] })) }) }))) })), location === SCEventLocationType.ONLINE && (_jsx(UrlTextField, { size: "small", fullWidth: true, type: "url", placeholder: `${intl.formatMessage(messages.virtualPlaceholder)}`, helperText: _jsx(FormattedMessage, { id: "ui.eventForm.address.online.help", defaultMessage: "ui.eventForm.address.online.help" }), InputProps: {
|
|
116
136
|
endAdornment: _jsx(Icon, { children: "play_circle_outline" })
|
|
117
|
-
}, onChange: handleLinkChange }))] }))] })));
|
|
137
|
+
}, onChange: handleLinkChange })), location === SCEventLocationType.LIVESTREAM && (_jsxs(_Fragment, { children: [_jsx(LiveStream, { template: SCLiveStreamTemplateType.SNIPPET, liveStream: liveStream, actions: _jsx(_Fragment, {}) }), _jsx(LiveStreamFormSettings, { settings: liveStream.settings, onChange: handleLiveStreamSettingsChange })] }))] }))] })));
|
|
118
138
|
}
|