You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
session-desktop/ts/components/leftpane/overlay/OverlayCommunity.tsx

106 lines
3.5 KiB
TypeScript

import React, { useState } from 'react';
// tslint:disable: no-submodule-imports use-simple-attributes
import { SessionJoinableRooms } from './SessionJoinableDefaultRooms';
import { SessionButton, SessionButtonColor, SessionButtonType } from '../../basic/SessionButton';
import { SessionIdEditable } from '../../basic/SessionIdEditable';
import { SessionSpinner } from '../../basic/SessionSpinner';
import { OverlayHeader } from './OverlayHeader';
import { useDispatch, useSelector } from 'react-redux';
import { resetOverlayMode } from '../../../state/ducks/section';
import {
joinOpenGroupV2WithUIEvents,
JoinSogsRoomUICallbackArgs,
} from '../../../session/apis/open_group_api/opengroupV2/JoinOpenGroupV2';
import { openGroupV2CompleteURLRegex } from '../../../session/apis/open_group_api/utils/OpenGroupUtils';
import { ToastUtils } from '../../../session/utils';
import useKey from 'react-use/lib/useKey';
import { getOverlayMode } from '../../../state/selectors/section';
import { openConversationWithMessages } from '../../../state/ducks/conversations';
async function joinOpenGroup(
serverUrl: string,
uiCallback?: (args: JoinSogsRoomUICallbackArgs) => void
) {
// guess if this is an open
if (serverUrl.match(openGroupV2CompleteURLRegex)) {
const groupCreated = await joinOpenGroupV2WithUIEvents(serverUrl, true, false, uiCallback);
return groupCreated;
} else {
ToastUtils.pushToastError('invalidOpenGroupUrl', window.i18n('invalidOpenGroupUrl'));
window.log.warn('Invalid opengroupv2 url');
return false;
}
}
export const OverlayCommunity = () => {
const dispatch = useDispatch();
const [loading, setLoading] = useState(false);
const [groupUrl, setGroupUrl] = useState('');
const overlayModeIsCommunity = useSelector(getOverlayMode) === 'open-group';
function closeOverlay() {
dispatch(resetOverlayMode());
}
async function onTryJoinRoom(completeUrl?: string) {
try {
if (loading) {
return;
}
await joinOpenGroup(completeUrl || groupUrl, joinSogsUICallback);
} catch (e) {
window.log.warn(e);
} finally {
setLoading(false);
}
}
function joinSogsUICallback(args: JoinSogsRoomUICallbackArgs) {
setLoading(args.loadingState === 'started');
if (args.loadingState === 'finished' && overlayModeIsCommunity && args.conversationKey) {
closeOverlay();
void openConversationWithMessages({ conversationKey: args.conversationKey, messageId: null }); // open to last unread for a session run sogs
}
}
useKey('Escape', closeOverlay);
const title = window.i18n('joinOpenGroup');
const buttonText = window.i18n('join');
const subtitle = window.i18n('openGroupURL');
const placeholder = window.i18n('enterAnOpenGroupURL');
return (
<div className="module-left-pane-overlay">
<OverlayHeader title={title} subtitle={subtitle} />
<div className="create-group-name-input">
<SessionIdEditable
editable={true}
placeholder={placeholder}
value={groupUrl}
isGroup={true}
maxLength={300}
onChange={setGroupUrl}
onPressEnter={onTryJoinRoom}
/>
</div>
<SessionButton
buttonColor={SessionButtonColor.Green}
buttonType={SessionButtonType.BrandOutline}
text={buttonText}
disabled={!groupUrl}
onClick={onTryJoinRoom}
/>
<SessionSpinner loading={loading} />
<SessionJoinableRooms onJoinClick={onTryJoinRoom} alreadyJoining={loading} />
</div>
);
};