ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Allow sending with <Enter> on tablets

Browse Source
This commit is contained in:
Alexander Zinchuk 2023-06-14 13:25:51 +02:00
parent d2a7996ea1
commit d56b61c82d
2 changed files with 15 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/left/settings/SettingsGeneral.tsx
View File

@ -8,7 +8,7 @@ import type { ISettings, TimeFormat } from '../../../types';
import { SettingsScreens } from '../../../types';
import {
getSystemTheme, IS_IOS, IS_MAC_OS, IS_TOUCH_ENV,
getSystemTheme, IS_ANDROID, IS_IOS, IS_MAC_OS,
} from '../../../util/windowEnvironment';
import { pick } from '../../../util/iteratees';
import { setTimeFormat } from '../../../util/langProvider';
@ -19,6 +19,7 @@ import ListItem from '../../ui/ListItem';
import RangeSlider from '../../ui/RangeSlider';
import type { IRadioOption } from '../../ui/RadioGroup';
import RadioGroup from '../../ui/RadioGroup';
import useAppLayout from '../../../hooks/useAppLayout';
type OwnProps = {
isActive?: boolean;
@ -61,7 +62,10 @@ const SettingsGeneral: FC<OwnProps & StateProps> = ({
const lang = useLang();
const APPEARANCE_THEME_OPTIONS: IRadioOption[] = [{
const { isMobile } = useAppLayout();
const isMobileDevice = isMobile && (IS_IOS || IS_ANDROID);
const appearanceThemeOptions: IRadioOption[] = [{
label: lang('EmptyChat.Appearance.Light'),
value: 'light',
}, {
@ -72,11 +76,11 @@ const SettingsGeneral: FC<OwnProps & StateProps> = ({
value: 'auto',
}];
const KEYBOARD_SEND_OPTIONS = !IS_TOUCH_ENV ? [
const keyboardSendOptions = !isMobileDevice ? [
{ value: 'enter', label: lang('lng_settings_send_enter'), subLabel: 'New line by Shift + Enter' },
{
value: 'ctrl-enter',
label: lang(IS_MAC_OS ? 'lng_settings_send_cmdenter' : 'lng_settings_send_ctrlenter'),
label: lang(IS_MAC_OS || IS_IOS ? 'lng_settings_send_cmdenter' : 'lng_settings_send_ctrlenter'),
subLabel: 'New line by Enter',
},
] : undefined;
@ -143,7 +147,7 @@ const SettingsGeneral: FC<OwnProps & StateProps> = ({
</h4>
<RadioGroup
name="theme"
options={APPEARANCE_THEME_OPTIONS}
options={appearanceThemeOptions}
selected={shouldUseSystemTheme ? 'auto' : theme}
onChange={handleAppearanceThemeChange}
/>
@ -161,13 +165,13 @@ const SettingsGeneral: FC<OwnProps & StateProps> = ({
/>
</div>
{KEYBOARD_SEND_OPTIONS && (
{keyboardSendOptions && (
<div className="settings-item">
<h4 className="settings-item-header" dir={lang.isRtl ? 'rtl' : undefined}>{lang('VoiceOver.Keyboard')}</h4>
<RadioGroup
name="keyboard-send-settings"
options={KEYBOARD_SEND_OPTIONS}
options={keyboardSendOptions}
onChange={handleMessageSendComboChange}
selected={messageSendKeyCombo}
/>

7
src/components/middle/composer/MessageInput.tsx
View File

@ -154,6 +154,7 @@ const MessageInput: FC<OwnProps & StateProps> = ({
const [selectedRange, setSelectedRange] = useState<Range>();
const [isTextFormatterDisabled, setIsTextFormatterDisabled] = useState<boolean>(false);
const { isMobile } = useAppLayout();
const isMobileDevice = isMobile && (IS_IOS || IS_ANDROID);
useInputCustomEmojis(
getHtml,
@ -363,7 +364,7 @@ const MessageInput: FC<OwnProps & StateProps> = ({
if (!isComposing && e.key === 'Enter' && !e.shiftKey) {
if (
!(IS_IOS || IS_ANDROID)
!isMobileDevice
&& (
(messageSendKeyCombo === 'enter' && !e.shiftKey)
|| (messageSendKeyCombo === 'ctrl-enter' && (e.ctrlKey || e.metaKey))
@ -441,7 +442,7 @@ const MessageInput: FC<OwnProps & StateProps> = ({
!chatId
|| editableInputId !== EDITABLE_INPUT_ID
|| noFocusInterception
|| (IS_TOUCH_ENV && isMobile)
|| isMobileDevice
|| isSelectModeActive
) {
return undefined;
@ -488,7 +489,7 @@ const MessageInput: FC<OwnProps & StateProps> = ({
return () => {
document.removeEventListener('keydown', handleDocumentKeyDown, true);
};
}, [chatId, editableInputId, isMobile, isSelectModeActive, noFocusInterception]);
}, [chatId, editableInputId, isMobileDevice, isSelectModeActive, noFocusInterception]);
useEffect(() => {
const captureFirstTab = debounce((e: KeyboardEvent) => {