pl-fe: Workaround for Ladybird support
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
parent
8898de7bfb
commit
8871284405
1 changed files with 25 additions and 5 deletions
|
@ -19,7 +19,7 @@ import { $createRemarkExport, $createRemarkImport } from '@mkljczk/lexical-remar
|
|||
import clsx from 'clsx';
|
||||
import { $createParagraphNode, $createTextNode, $getRoot, type EditorState, type LexicalEditor } from 'lexical';
|
||||
import React, { useMemo, useState } from 'react';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { defineMessages, useIntl } from 'react-intl';
|
||||
|
||||
import { useAppDispatch, useCompose } from 'pl-fe/hooks';
|
||||
|
||||
|
@ -41,6 +41,12 @@ const LINK_MATCHERS = [
|
|||
),
|
||||
];
|
||||
|
||||
const messages = defineMessages({
|
||||
placeholder: { id: 'compose_form.placeholder', defaultMessage: 'What\'s on your mind?' },
|
||||
eventPlaceholder: { id: 'compose_form.event_placeholder', defaultMessage: 'Post to this event' },
|
||||
pollPlaceholder: { id: 'compose_form.poll_placeholder', defaultMessage: 'Add a poll topic…' },
|
||||
});
|
||||
|
||||
interface IComposeEditor {
|
||||
className?: string;
|
||||
editableClassName?: string;
|
||||
|
@ -54,7 +60,7 @@ interface IComposeEditor {
|
|||
onPaste?(files: FileList): void;
|
||||
onChange?(text: string): void;
|
||||
onFocus?: React.FocusEventHandler<HTMLDivElement>;
|
||||
placeholder?: JSX.Element | string;
|
||||
placeholder?: string;
|
||||
}
|
||||
|
||||
const theme: InitialConfigType['theme'] = {
|
||||
|
@ -95,6 +101,7 @@ const ComposeEditor = React.forwardRef<LexicalEditor, IComposeEditor>(({
|
|||
const { content_type: contentType } = useCompose(composeId);
|
||||
const isWysiwyg = contentType === 'wysiwyg';
|
||||
const nodes = useNodes(isWysiwyg);
|
||||
const intl = useIntl();
|
||||
|
||||
const [suggestionsHidden, setSuggestionsHidden] = useState(true);
|
||||
|
||||
|
@ -122,6 +129,19 @@ const ComposeEditor = React.forwardRef<LexicalEditor, IComposeEditor>(({
|
|||
? compose.text
|
||||
: compose.textMap.get(compose.modified_language, '');
|
||||
|
||||
if (!text && navigator.userAgent.includes('Ladybird/')) {
|
||||
const paragraph = $createParagraphNode();
|
||||
const textNode = $createTextNode(placeholder || intl.formatMessage(messages.placeholder));
|
||||
|
||||
paragraph.append(textNode);
|
||||
|
||||
$getRoot()
|
||||
.clear()
|
||||
.append(paragraph);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (isWysiwyg) {
|
||||
$createRemarkImport({
|
||||
handlers: {
|
||||
|
@ -169,12 +189,12 @@ const ComposeEditor = React.forwardRef<LexicalEditor, IComposeEditor>(({
|
|||
}
|
||||
};
|
||||
|
||||
let textareaPlaceholder = placeholder || <FormattedMessage id='compose_form.placeholder' defaultMessage="What's on your mind?" />;
|
||||
let textareaPlaceholder = placeholder || intl.formatMessage(messages.placeholder);
|
||||
|
||||
if (eventDiscussion) {
|
||||
textareaPlaceholder = <FormattedMessage id='compose_form.event_placeholder' defaultMessage='Post to this event' />;
|
||||
textareaPlaceholder = intl.formatMessage(messages.eventPlaceholder);
|
||||
} else if (hasPoll) {
|
||||
textareaPlaceholder = <FormattedMessage id='compose_form.poll_placeholder' defaultMessage='Add a poll topic…' />;
|
||||
textareaPlaceholder = intl.formatMessage(messages.pollPlaceholder);
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
Loading…
Reference in a new issue