pl-fe: Use selected language for composer inputs

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak 2024-11-13 19:53:31 +01:00
parent 61a708b162
commit 06113f2610
5 changed files with 8 additions and 4 deletions

View file

@ -17,7 +17,7 @@ import type { Emoji } from 'pl-fe/features/emoji';
type AutoSuggestion = string | Emoji | Location;
interface IAutosuggestInput extends Pick<React.HTMLAttributes<HTMLInputElement>, 'onChange' | 'onKeyUp' | 'onKeyDown'> {
interface IAutosuggestInput extends Pick<React.HTMLAttributes<HTMLInputElement>, 'lang' | 'onChange' | 'onKeyUp' | 'onKeyDown'> {
value: string;
suggestions: Array<AutoSuggestion>;
disabled?: boolean;
@ -271,6 +271,7 @@ const AutosuggestInput: React.FC<IAutosuggestInput> = ({
maxLength={props.maxLength}
data-testid='autosuggest-input'
theme={props.theme}
lang={props.lang}
/>
</div>,
<Portal key='portal'>

View file

@ -17,7 +17,7 @@ const messages = defineMessages({
/** Possible theme names for an Input. */
type InputThemes = 'normal' | 'search' | 'transparent'
interface IInput extends Pick<React.InputHTMLAttributes<HTMLInputElement>, 'maxLength' | 'onChange' | 'onBlur' | 'type' | 'autoComplete' | 'autoCorrect' | 'autoCapitalize' | 'required' | 'disabled' | 'onClick' | 'readOnly' | 'min' | 'pattern' | 'onKeyDown' | 'onKeyUp' | 'onFocus' | 'style' | 'id'> {
interface IInput extends Pick<React.InputHTMLAttributes<HTMLInputElement>, 'maxLength' | 'onChange' | 'onBlur' | 'type' | 'autoComplete' | 'autoCorrect' | 'autoCapitalize' | 'required' | 'disabled' | 'onClick' | 'readOnly' | 'min' | 'pattern' | 'onKeyDown' | 'onKeyUp' | 'onFocus' | 'style' | 'id' | 'lang'> {
/** Put the cursor into the input on mount. */
autoFocus?: boolean;
/** The initial text in the input. */

View file

@ -55,7 +55,7 @@ const Option: React.FC<IOption> = ({
const dispatch = useAppDispatch();
const intl = useIntl();
const { suggestions } = useCompose(composeId);
const { suggestions, modified_language: language } = useCompose(composeId);
const handleOptionTitleChange = (event: React.ChangeEvent<HTMLInputElement>) => onChange(index, event.target.value);
@ -96,6 +96,7 @@ const Option: React.FC<IOption> = ({
onSuggestionSelected={onSuggestionSelected}
searchTokens={[':']}
autoFocus={index === 0 || index >= 2}
lang={language || undefined}
/>
</HStack>

View file

@ -45,6 +45,7 @@ const SpoilerInput: React.FC<ISpoilerInput> = ({
searchTokens={[':']}
id='cw-spoiler-input'
className='rounded-md !bg-transparent dark:!bg-transparent'
lang={modified_language || undefined}
/>
);
};

View file

@ -99,7 +99,7 @@ const ComposeEditor = React.forwardRef<LexicalEditor, IComposeEditor>(({
placeholder,
}, ref) => {
const dispatch = useAppDispatch();
const { content_type: contentType } = useCompose(composeId);
const { content_type: contentType, modified_language: language } = useCompose(composeId);
const isWysiwyg = contentType === 'wysiwyg';
const nodes = useNodes(isWysiwyg);
const intl = useIntl();
@ -210,6 +210,7 @@ const ComposeEditor = React.forwardRef<LexicalEditor, IComposeEditor>(({
'min-h-[99px]': !condensed,
},
)}
lang={language || undefined}
/>
</div>
}