pl-fe: Use selected language for composer inputs
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
parent
61a708b162
commit
06113f2610
5 changed files with 8 additions and 4 deletions
|
@ -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'>
|
||||
|
|
|
@ -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. */
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -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}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -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>
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue