add editor fixes (#144)

* add editor fixes
This commit is contained in:
Ilya Y 2023-07-27 20:38:38 +03:00 committed by GitHub
parent bc0cf9ef2a
commit 40af94e101
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 22 additions and 25 deletions

View File

@ -163,6 +163,7 @@ export const PlayerPlaylist = (props: Props) => {
onSubmit={(value) => handleMediaItemFieldChange('body', value)} onSubmit={(value) => handleMediaItemFieldChange('body', value)}
placeholder={t('Description')} placeholder={t('Description')}
smallHeight={true} smallHeight={true}
submitButtonText={t('Save')}
/> />
<GrowingTextarea <GrowingTextarea
allowEnterKey={true} allowEnterKey={true}

View File

@ -159,6 +159,8 @@ export const Comment = (props: Props) => {
<Show when={editMode()} fallback={<MD body={body()} />}> <Show when={editMode()} fallback={<MD body={body()} />}>
<Suspense fallback={<p>{t('Loading')}</p>}> <Suspense fallback={<p>{t('Loading')}</p>}>
<SimplifiedEditor <SimplifiedEditor
initialContent={comment().body}
submitButtonText={t('Save')}
quoteEnabled={true} quoteEnabled={true}
imageEnabled={true} imageEnabled={true}
placeholder={t('Write a comment...')} placeholder={t('Write a comment...')}

View File

@ -43,7 +43,6 @@ export const CommentsTree = (props: Props) => {
const { t } = useLocalize() const { t } = useLocalize()
const [commentsOrder, setCommentsOrder] = createSignal<CommentsOrder>('createdAt') const [commentsOrder, setCommentsOrder] = createSignal<CommentsOrder>('createdAt')
const [newReactions, setNewReactions] = createSignal<Reaction[]>([]) const [newReactions, setNewReactions] = createSignal<Reaction[]>([])
const [submitted, setSubmitted] = createSignal(false)
const { const {
reactionEntities, reactionEntities,
actions: { createReaction } actions: { createReaction }
@ -97,7 +96,6 @@ export const CommentsTree = (props: Props) => {
body: value, body: value,
shout: props.shoutId shout: props.shoutId
}) })
setSubmitted(true)
} catch (error) { } catch (error) {
console.error('[handleCreate reaction]:', error) console.error('[handleCreate reaction]:', error)
} }

View File

@ -1,4 +1,4 @@
import { createEffect, createSignal, onMount } from 'solid-js' import { createEffect, createSignal, onMount, untrack } from 'solid-js'
import { createTiptapEditor, useEditorHTML } from 'solid-tiptap' import { createTiptapEditor, useEditorHTML } from 'solid-tiptap'
import { useLocalize } from '../../context/localize' import { useLocalize } from '../../context/localize'
import { Bold } from '@tiptap/extension-bold' import { Bold } from '@tiptap/extension-bold'
@ -43,7 +43,6 @@ import type { Doc } from 'yjs/dist/src/utils/Doc'
import './Prosemirror.scss' import './Prosemirror.scss'
import { TrailingNode } from './extensions/TrailingNode' import { TrailingNode } from './extensions/TrailingNode'
import Article from './extensions/Article' import Article from './extensions/Article'
import styles from './SimplifiedEditor.module.scss'
type Props = { type Props = {
shoutId: number shoutId: number
@ -111,7 +110,7 @@ export const Editor = (props: Props) => {
} = { } = {
current: null current: null
} }
const { initialContent } = props
const editor = createTiptapEditor(() => ({ const editor = createTiptapEditor(() => ({
element: editorElRef.current, element: editorElRef.current,
editorProps: { editorProps: {
@ -222,7 +221,7 @@ export const Editor = (props: Props) => {
TrailingNode, TrailingNode,
Article Article
], ],
content: props.initialContent ?? null content: initialContent ?? null
})) }))
const { const {

View File

@ -18,7 +18,6 @@ import { Popover } from '../_shared/Popover'
import { Italic } from '@tiptap/extension-italic' import { Italic } from '@tiptap/extension-italic'
import { Modal } from '../Nav/Modal' import { Modal } from '../Nav/Modal'
import { hideModal, showModal } from '../../stores/ui' import { hideModal, showModal } from '../../stores/ui'
import { Link } from '@tiptap/extension-link'
import { Blockquote } from '@tiptap/extension-blockquote' import { Blockquote } from '@tiptap/extension-blockquote'
import { CustomImage } from './extensions/CustomImage' import { CustomImage } from './extensions/CustomImage'
import { UploadModalContent } from './UploadModalContent' import { UploadModalContent } from './UploadModalContent'
@ -27,11 +26,13 @@ import { clsx } from 'clsx'
import styles from './SimplifiedEditor.module.scss' import styles from './SimplifiedEditor.module.scss'
import { Placeholder } from '@tiptap/extension-placeholder' import { Placeholder } from '@tiptap/extension-placeholder'
import { InsertLinkForm } from './InsertLinkForm' import { InsertLinkForm } from './InsertLinkForm'
import { Link } from '@tiptap/extension-link'
type Props = { type Props = {
initialContent?: string initialContent?: string
onSubmit: (text: string) => void onSubmit: (text: string) => void
placeholder: string placeholder: string
submitButtonText?: string
quoteEnabled?: boolean quoteEnabled?: boolean
imageEnabled?: boolean imageEnabled?: boolean
setClear?: boolean setClear?: boolean
@ -137,9 +138,7 @@ const SimplifiedEditor = (props: Props) => {
} }
onMount(() => { onMount(() => {
if (props.submitByShiftEnter || props.submitByEnter) {
window.addEventListener('keydown', handleKeyDown) window.addEventListener('keydown', handleKeyDown)
}
}) })
onCleanup(() => { onCleanup(() => {
@ -224,7 +223,7 @@ const SimplifiedEditor = (props: Props) => {
<div class={styles.buttons}> <div class={styles.buttons}>
<Button value={t('cancel')} variant="secondary" disabled={isEmpty()} onClick={handleClear} /> <Button value={t('cancel')} variant="secondary" disabled={isEmpty()} onClick={handleClear} />
<Button <Button
value={t('Send')} value={props.submitButtonText ?? t('Send')}
variant="primary" variant="primary"
disabled={isEmpty()} disabled={isEmpty()}
onClick={() => props.onSubmit(html())} onClick={() => props.onSubmit(html())}

View File

@ -236,8 +236,8 @@ export const TextBubbleMenu = (props: BubbleMenuProps) => {
</button> </button>
)} )}
</Popover> </Popover>
</Show>
<div class={styles.delimiter} /> <div class={styles.delimiter} />
</Show>
<Popover content={t('Add url')}> <Popover content={t('Add url')}>
{(triggerRef: (el) => void) => ( {(triggerRef: (el) => void) => (
<button <button

View File

@ -19,11 +19,6 @@ type Props = {
replyAuthor?: string replyAuthor?: string
} }
const md = new MarkdownIt({
linkify: true,
breaks: true
})
export const Message = (props: Props) => { export const Message = (props: Props) => {
const isOwn = props.ownId === Number(props.content.author) const isOwn = props.ownId === Number(props.content.author)
const user = props.members?.find((m) => m.id === Number(props.content.author)) const user = props.members?.find((m) => m.id === Number(props.content.author))

View File

@ -50,6 +50,7 @@
color: #000; color: #000;
opacity: 1; opacity: 1;
position: absolute; position: absolute;
z-index: 1;
right: 0.6rem; right: 0.6rem;
bottom: -1.2rem; bottom: -1.2rem;
font-size: 1.1rem; font-size: 1.1rem;

View File

@ -205,6 +205,7 @@ export const SolidSwiper = (props: Props) => {
smallHeight={true} smallHeight={true}
placeholder={t('Enter image description')} placeholder={t('Enter image description')}
onSubmit={(value) => handleSlideDescriptionChange(index(), 'body', value)} onSubmit={(value) => handleSlideDescriptionChange(index(), 'body', value)}
submitButtonText={t('Save')}
/> />
</div> </div>
</Match> </Match>

View File

@ -71,14 +71,15 @@ export const InboxProvider = (props: { children: JSX.Element }) => {
return chat return chat
} }
pipe( // pipe(
subclient().subscription(newMessage, {}), // subclient().subscription(newMessage, {}),
subscribe((result) => { // subscribe((result) => {
// console.info('[subscription]') // console.info('[subscription]')
// console.debug(result) // console.debug(result)
// TODO: handle data result // // TODO: handle data result
}) // })
) // )
const actions = { const actions = {
createChat, createChat,
loadChats, loadChats,