Markdown editor: Remove character limit

## Issue
Closes 5687: Ensure post mode has no text limit

## Changes
- `type="markdown"` can now have unlimited length if clients don't define `textAreaMaxWidth`.
- The internal default limit of 2000 is narrowed down to `type=textarea`.
This commit is contained in:
infinite-persistence 2021-03-20 07:48:47 +08:00 committed by Sean Yesmunt
parent e164fbdeda
commit 5d40a4c9f6
3 changed files with 15 additions and 12 deletions

View file

@ -80,7 +80,7 @@ export class FormField extends React.PureComponent<Props> {
labelOnLeft,
blockWrap,
charCount,
textAreaMaxLength = FF_MAX_CHARS_DEFAULT,
textAreaMaxLength,
quickActionLabel,
quickActionHandler,
...inputProps
@ -208,7 +208,7 @@ export class FormField extends React.PureComponent<Props> {
// to pass the current value to it's callback, nor query the current
// text length from the callback. So, we'll use our own widget.
const hasCharCount = charCount !== undefined && charCount >= 0;
const countInfo = hasCharCount && (
const countInfo = hasCharCount && textAreaMaxLength !== undefined && (
<span className="comment__char-count-mde">{`${charCount || '0'}/${textAreaMaxLength}`}</span>
);
@ -242,7 +242,7 @@ export class FormField extends React.PureComponent<Props> {
);
} else if (type === 'textarea') {
const hasCharCount = charCount !== undefined && charCount >= 0;
const countInfo = hasCharCount && (
const countInfo = hasCharCount && textAreaMaxLength !== undefined && (
<span className="comment__char-count">{`${charCount || '0'}/${textAreaMaxLength}`}</span>
);
input = (
@ -255,7 +255,13 @@ export class FormField extends React.PureComponent<Props> {
{quickAction}
</div>
)}
<textarea type={type} id={name} maxLength={textAreaMaxLength} ref={this.input} {...inputProps} />
<textarea
type={type}
id={name}
maxLength={textAreaMaxLength || FF_MAX_CHARS_DEFAULT}
ref={this.input}
{...inputProps}
/>
{countInfo}
</fieldset-section>
);

View file

@ -1,6 +1,5 @@
// @flow
import React, { useEffect } from 'react';
import { FF_MAX_CHARS_IN_POST } from 'constants/form-field';
import { FormField } from 'component/common/form';
type Props = {
@ -12,10 +11,10 @@ type Props = {
fileMimeType: ?string,
streamingUrl: ?string,
isStillEditing: boolean,
fetchStreamingUrl: string => void,
setPrevFileText: string => void,
fetchStreamingUrl: (string) => void,
setPrevFileText: (string) => void,
updatePublishForm: ({}) => void,
setCurrentFileType: string => void,
setCurrentFileType: (string) => void,
};
function PostEditor(props: Props) {
@ -62,7 +61,7 @@ function PostEditor(props: Props) {
useEffect(() => {
function readFileStream(url) {
return fetch(url).then(res => res.text());
return fetch(url).then((res) => res.text());
}
async function updateEditorText(url) {
@ -107,8 +106,7 @@ function PostEditor(props: Props) {
placeholder={__('My content for this post...')}
value={ready ? fileText : __('Loading...')}
disabled={!ready || disabled}
onChange={value => updatePublishForm({ fileText: value })}
textAreaMaxLength={FF_MAX_CHARS_IN_POST}
onChange={(value) => updatePublishForm({ fileText: value })}
/>
);
}

View file

@ -1,4 +1,3 @@
export const FF_MAX_CHARS_DEFAULT = 2000;
export const FF_MAX_CHARS_IN_COMMENT = 2000;
export const FF_MAX_CHARS_IN_DESCRIPTION = 5000;
export const FF_MAX_CHARS_IN_POST = 10000;