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, labelOnLeft,
blockWrap, blockWrap,
charCount, charCount,
textAreaMaxLength = FF_MAX_CHARS_DEFAULT, textAreaMaxLength,
quickActionLabel, quickActionLabel,
quickActionHandler, quickActionHandler,
...inputProps ...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 // 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. // text length from the callback. So, we'll use our own widget.
const hasCharCount = charCount !== undefined && charCount >= 0; const hasCharCount = charCount !== undefined && charCount >= 0;
const countInfo = hasCharCount && ( const countInfo = hasCharCount && textAreaMaxLength !== undefined && (
<span className="comment__char-count-mde">{`${charCount || '0'}/${textAreaMaxLength}`}</span> <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') { } else if (type === 'textarea') {
const hasCharCount = charCount !== undefined && charCount >= 0; const hasCharCount = charCount !== undefined && charCount >= 0;
const countInfo = hasCharCount && ( const countInfo = hasCharCount && textAreaMaxLength !== undefined && (
<span className="comment__char-count">{`${charCount || '0'}/${textAreaMaxLength}`}</span> <span className="comment__char-count">{`${charCount || '0'}/${textAreaMaxLength}`}</span>
); );
input = ( input = (
@ -255,7 +255,13 @@ export class FormField extends React.PureComponent<Props> {
{quickAction} {quickAction}
</div> </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} {countInfo}
</fieldset-section> </fieldset-section>
); );

View file

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

View file

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