Allow adding to a group by phone number

This commit is contained in:
Fedor Indutny 2022-04-04 17:38:22 -07:00 committed by GitHub
parent 76a1a805ef
commit 9568d5792e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
49 changed files with 1842 additions and 693 deletions

View file

@ -2,54 +2,105 @@
// SPDX-License-Identifier: AGPL-3.0-only
import type { FunctionComponent } from 'react';
import React, { useCallback } from 'react';
import React, { useCallback, useState } from 'react';
import {
BaseConversationListItem,
MESSAGE_TEXT_CLASS_NAME,
} from './BaseConversationListItem';
import { ButtonVariant } from '../Button';
import { ConfirmationDialog } from '../ConfirmationDialog';
import { BaseConversationListItem } from './BaseConversationListItem';
import type { ParsedE164Type } from '../../util/libphonenumberInstance';
import type { LookupConversationWithoutUuidActionsType } from '../../util/lookupConversationWithoutUuid';
import type { LocalizerType } from '../../types/Util';
import { AvatarColors } from '../../types/Colors';
const TEXT_CLASS_NAME = `${MESSAGE_TEXT_CLASS_NAME}__start-new-conversation`;
type PropsData = {
phoneNumber: string;
phoneNumber: ParsedE164Type;
isFetching: boolean;
};
type PropsHousekeeping = {
i18n: LocalizerType;
onClick: (phoneNumber: string) => void;
};
showConversation: (conversationId: string) => void;
} & LookupConversationWithoutUuidActionsType;
export type Props = PropsData & PropsHousekeeping;
export const StartNewConversation: FunctionComponent<Props> = React.memo(
function StartNewConversation({ i18n, onClick, phoneNumber }) {
const messageText = (
<div className={TEXT_CLASS_NAME}>{i18n('startConversation')}</div>
);
function StartNewConversation({
i18n,
phoneNumber,
isFetching,
lookupConversationWithoutUuid,
showUserNotFoundModal,
setIsFetchingUUID,
showConversation,
}) {
const [isModalVisible, setIsModalVisible] = useState(false);
const boundOnClick = useCallback(() => {
onClick(phoneNumber);
}, [onClick, phoneNumber]);
const boundOnClick = useCallback(async () => {
if (!phoneNumber.isValid) {
setIsModalVisible(true);
return;
}
if (isFetching) {
return;
}
const conversationId = await lookupConversationWithoutUuid({
showUserNotFoundModal,
setIsFetchingUUID,
type: 'e164',
e164: phoneNumber.e164,
phoneNumber: phoneNumber.userInput,
});
if (conversationId !== undefined) {
showConversation(conversationId);
}
}, [
showConversation,
lookupConversationWithoutUuid,
showUserNotFoundModal,
setIsFetchingUUID,
setIsModalVisible,
phoneNumber,
isFetching,
]);
let modal: JSX.Element | undefined;
if (isModalVisible) {
modal = (
<ConfirmationDialog
cancelText={i18n('ok')}
cancelButtonVariant={ButtonVariant.Secondary}
i18n={i18n}
onClose={() => setIsModalVisible(false)}
>
{i18n('startConversation--phone-number-not-valid', {
phoneNumber: phoneNumber.userInput,
})}
</ConfirmationDialog>
);
}
return (
<BaseConversationListItem
acceptedMessageRequest={false}
color={AvatarColors[0]}
conversationType="direct"
headerName={phoneNumber}
i18n={i18n}
isMe={false}
isSelected={false}
messageText={messageText}
onClick={boundOnClick}
phoneNumber={phoneNumber}
sharedGroupNames={[]}
title={phoneNumber}
/>
<>
<BaseConversationListItem
acceptedMessageRequest={false}
color={AvatarColors[0]}
conversationType="direct"
headerName={phoneNumber.userInput}
i18n={i18n}
isMe={false}
isSelected={false}
onClick={boundOnClick}
phoneNumber={phoneNumber.userInput}
shouldShowSpinner={isFetching}
sharedGroupNames={[]}
title={phoneNumber.userInput}
/>
{modal}
</>
);
}
);