Simplify greentext code
This commit is contained in:
parent
67392cbc12
commit
d9202baa58
7 changed files with 39 additions and 38 deletions
|
@ -94,7 +94,6 @@ class Status extends ImmutablePureComponent {
|
|||
group: ImmutablePropTypes.map,
|
||||
displayMedia: PropTypes.string,
|
||||
allowedEmoji: ImmutablePropTypes.list,
|
||||
greentext: PropTypes.bool,
|
||||
};
|
||||
|
||||
// Avoid checking props that are functions (and whose equality will always
|
||||
|
@ -495,7 +494,6 @@ class Status extends ImmutablePureComponent {
|
|||
onClick={this.handleClick}
|
||||
expanded={!status.get('hidden')}
|
||||
onExpandedToggle={this.handleExpandedToggle}
|
||||
greentext={this.props.greentext}
|
||||
collapsable
|
||||
/>
|
||||
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import React from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import PropTypes from 'prop-types';
|
||||
import { isRtl } from '../rtl';
|
||||
|
@ -6,11 +7,17 @@ import { FormattedMessage } from 'react-intl';
|
|||
import Permalink from './permalink';
|
||||
import classnames from 'classnames';
|
||||
import Icon from 'soapbox/components/icon';
|
||||
import { processHtml } from 'soapbox/utils/tiny_post_html_processor';
|
||||
import { getSoapboxConfig } from 'soapbox/actions/soapbox';
|
||||
import { addGreentext } from 'soapbox/utils/greentext';
|
||||
|
||||
const MAX_HEIGHT = 642; // 20px * 32 (+ 2px padding at the top)
|
||||
|
||||
export default class StatusContent extends React.PureComponent {
|
||||
const mapStateToProps = state => ({
|
||||
greentext: getSoapboxConfig(state).get('greentext'),
|
||||
});
|
||||
|
||||
export default @connect(mapStateToProps)
|
||||
class StatusContent extends React.PureComponent {
|
||||
|
||||
static contextTypes = {
|
||||
router: PropTypes.object,
|
||||
|
@ -150,35 +157,16 @@ export default class StatusContent extends React.PureComponent {
|
|||
this.node = c;
|
||||
}
|
||||
|
||||
parseHtml = html => {
|
||||
const { greentext } = this.props;
|
||||
if (greentext) return addGreentext(html);
|
||||
return html;
|
||||
}
|
||||
|
||||
getHtmlContent = () => {
|
||||
const { status } = this.props;
|
||||
|
||||
const properContent = status.get('contentHtml');
|
||||
|
||||
return this.greentext(properContent);
|
||||
}
|
||||
|
||||
greentext = html => {
|
||||
if (!this.props.greentext) return html;
|
||||
|
||||
// Copied from Pleroma FE
|
||||
// https://git.pleroma.social/pleroma/pleroma-fe/-/blob/19475ba356c3fd6c54ca0306d3ae392358c212d1/src/components/status_content/status_content.js#L132
|
||||
return processHtml(html, (string) => {
|
||||
try {
|
||||
if (string.includes('>') &&
|
||||
string
|
||||
.replace(/<[^>]+?>/gi, '') // remove all tags
|
||||
.replace(/@\w+/gi, '') // remove mentions (even failed ones)
|
||||
.trim()
|
||||
.startsWith('>')) {
|
||||
return `<span class='greentext'>${string}</span>`;
|
||||
} else {
|
||||
return string;
|
||||
}
|
||||
} catch(e) {
|
||||
return string;
|
||||
}
|
||||
});
|
||||
const html = status.get('contentHtml');
|
||||
return this.parseHtml(html);
|
||||
}
|
||||
|
||||
render() {
|
||||
|
|
|
@ -59,7 +59,6 @@ const makeMapStateToProps = () => {
|
|||
status: getStatus(state, props),
|
||||
displayMedia: getSettings(state).get('displayMedia'),
|
||||
allowedEmoji: soapbox.get('allowedEmoji'),
|
||||
greentext: soapbox.get('greentext'),
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -36,7 +36,6 @@ export default class DetailedStatus extends ImmutablePureComponent {
|
|||
compact: PropTypes.bool,
|
||||
showMedia: PropTypes.bool,
|
||||
onToggleMediaVisibility: PropTypes.func,
|
||||
greentext: PropTypes.bool,
|
||||
};
|
||||
|
||||
state = {
|
||||
|
@ -192,7 +191,6 @@ export default class DetailedStatus extends ImmutablePureComponent {
|
|||
<StatusContent
|
||||
status={status}
|
||||
expanded={!status.get('hidden')}
|
||||
greentext={this.props.greentext}
|
||||
onExpandedToggle={this.handleExpandedToggle}
|
||||
/>
|
||||
|
||||
|
|
|
@ -31,7 +31,6 @@ import { openModal } from '../../../actions/modal';
|
|||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import { showAlertForError } from '../../../actions/alerts';
|
||||
import { getSettings } from 'soapbox/actions/settings';
|
||||
import { getSoapboxConfig } from 'soapbox/actions/soapbox';
|
||||
import { deactivateUserModal, deleteUserModal, deleteStatusModal, toggleStatusSensitivityModal } from 'soapbox/actions/moderation';
|
||||
|
||||
const messages = defineMessages({
|
||||
|
@ -51,7 +50,6 @@ const makeMapStateToProps = () => {
|
|||
const mapStateToProps = (state, props) => ({
|
||||
status: getStatus(state, props),
|
||||
domain: state.getIn(['meta', 'domain']),
|
||||
greentext: getSoapboxConfig(state).get('greentext'),
|
||||
});
|
||||
|
||||
return mapStateToProps;
|
||||
|
|
|
@ -116,7 +116,6 @@ const makeMapStateToProps = () => {
|
|||
me: state.get('me'),
|
||||
displayMedia: getSettings(state).get('displayMedia'),
|
||||
allowedEmoji: soapbox.get('allowedEmoji'),
|
||||
greentext: soapbox.get('greentext'),
|
||||
};
|
||||
};
|
||||
|
||||
|
@ -546,7 +545,6 @@ class Status extends ImmutablePureComponent {
|
|||
onToggleHidden={this.handleToggleHidden}
|
||||
domain={domain}
|
||||
showMedia={this.state.showMedia}
|
||||
greentext={this.props.greentext}
|
||||
onToggleMediaVisibility={this.handleToggleMediaVisibility}
|
||||
/>
|
||||
|
||||
|
|
22
app/soapbox/utils/greentext.js
Normal file
22
app/soapbox/utils/greentext.js
Normal file
|
@ -0,0 +1,22 @@
|
|||
import { processHtml } from './tiny_post_html_processor';
|
||||
|
||||
export const addGreentext = html => {
|
||||
// Copied from Pleroma FE
|
||||
// https://git.pleroma.social/pleroma/pleroma-fe/-/blob/19475ba356c3fd6c54ca0306d3ae392358c212d1/src/components/status_content/status_content.js#L132
|
||||
return processHtml(html, (string) => {
|
||||
try {
|
||||
if (string.includes('>') &&
|
||||
string
|
||||
.replace(/<[^>]+?>/gi, '') // remove all tags
|
||||
.replace(/@\w+/gi, '') // remove mentions (even failed ones)
|
||||
.trim()
|
||||
.startsWith('>')) {
|
||||
return `<span class='greentext'>${string}</span>`;
|
||||
} else {
|
||||
return string;
|
||||
}
|
||||
} catch(e) {
|
||||
return string;
|
||||
}
|
||||
});
|
||||
};
|
Loading…
Reference in a new issue