From ce6446f059261781ef260850a3133bab46e8aa07 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 20 Jul 2020 17:30:10 -0500 Subject: [PATCH 01/79] Center icon in theme-toggle --- app/styles/components/theme-toggle.scss | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/app/styles/components/theme-toggle.scss b/app/styles/components/theme-toggle.scss index f1a33e66b..c0cadc68f 100644 --- a/app/styles/components/theme-toggle.scss +++ b/app/styles/components/theme-toggle.scss @@ -2,7 +2,7 @@ .setting-toggle { &__label { - margin-bottom: 0px; + margin-bottom: 0; vertical-align: middle; } @@ -11,6 +11,8 @@ &-track-check, &-track-x { + display: flex; + align-items: center; height: 15px; color: #fff; } From 5c0bef4e9b01968baf96c5c170d295298403e622 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 20 Jul 2020 20:36:11 -0500 Subject: [PATCH 02/79] Fix header .still-image on mobile --- app/styles/components/account-header.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/app/styles/components/account-header.scss b/app/styles/components/account-header.scss index f20e0c3ba..bfd61aa8c 100644 --- a/app/styles/components/account-header.scss +++ b/app/styles/components/account-header.scss @@ -22,6 +22,7 @@ background: var(--accent-color--med); @media screen and (max-width: 895px) {height: 225px;} &--none {height: 125px;} + img { object-fit: cover; display: block; @@ -30,6 +31,10 @@ margin: 0; } + .still-image { + height: 100%; + } + .still-image--play-on-hover::before { content: 'GIF'; position: absolute; From f81f5d057bd43c4bd1133dc547456f5d5f13d818 Mon Sep 17 00:00:00 2001 From: Mary Kate Date: Sun, 26 Jul 2020 15:07:53 -0500 Subject: [PATCH 03/79] Make emoji selector text visible on dark mode, fixes #249 --- app/styles/emoji_picker.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/app/styles/emoji_picker.scss b/app/styles/emoji_picker.scss index 12dd4f084..e282a3c17 100644 --- a/app/styles/emoji_picker.scss +++ b/app/styles/emoji_picker.scss @@ -109,6 +109,7 @@ input { font-size: 14px; font-weight: 400; + color: var(--primary-text-color); padding: 7px 9px; font-family: inherit; display: block; From 97515b77942bec89ec1022fe993b9ec41a5ef00b Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Sun, 26 Jul 2020 15:09:45 -0500 Subject: [PATCH 04/79] yarn start --> yarn dev --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 30fa61a1d..4538075ee 100644 --- a/README.md +++ b/README.md @@ -54,7 +54,7 @@ yarn Finally, run the dev server: ```sh -yarn start +yarn dev ``` **That's it!** :tada: @@ -140,7 +140,7 @@ NODE_ENV=development ``` #### Local dev server -- `yarn dev` - Exact same as above, aliased to `yarn start` for convenience. +- `yarn dev` - Run the local dev server. #### Building - `yarn build` - Compile without a dev server, into `/static` directory. From 7fd8c860b6043e2c1cf92eba8073343005b4cf0c Mon Sep 17 00:00:00 2001 From: Mary Kate Date: Sun, 26 Jul 2020 17:30:54 -0500 Subject: [PATCH 05/79] add toggle to collapse and expand Fediverse tab explaination box, fixes #63 --- app/soapbox/actions/settings.js | 1 + .../features/ui/components/explanation_box.js | 54 ++++++++++++++++--- app/styles/basics.scss | 5 +- 3 files changed, 52 insertions(+), 8 deletions(-) diff --git a/app/soapbox/actions/settings.js b/app/soapbox/actions/settings.js index 815479b96..0c2f35a8b 100644 --- a/app/soapbox/actions/settings.js +++ b/app/soapbox/actions/settings.js @@ -22,6 +22,7 @@ const defaultSettings = ImmutableMap({ defaultPrivacy: 'public', themeMode: 'light', locale: navigator.language.split(/[-_]/)[0] || 'en', + explanationBox: true, systemFont: false, dyslexicFont: false, diff --git a/app/soapbox/features/ui/components/explanation_box.js b/app/soapbox/features/ui/components/explanation_box.js index 4f27d056b..f3d84a4f0 100644 --- a/app/soapbox/features/ui/components/explanation_box.js +++ b/app/soapbox/features/ui/components/explanation_box.js @@ -1,25 +1,65 @@ import React from 'react'; import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import { connect } from 'react-redux'; +import { defineMessages, injectIntl } from 'react-intl'; +import IconButton from 'soapbox/components/icon_button'; +import { changeSetting, getSettings } from 'soapbox/actions/settings'; -export default + +const messages = defineMessages({ + collapse: { id: 'explanation_box.collapse', defaultMessage: 'Collapse explanation box' }, + expand: { id: 'explanation_box.expand', defaultMessage: 'Expand explanation box' }, +}); + +const mapStateToProps = state => { + return { + settings: getSettings(state), + }; +}; + +const mapDispatchToProps = (dispatch) => ({ + toggleExplanationBox(setting) { + dispatch(changeSetting(['explanationBox'], setting)); + }, +}); + +export default @connect(mapStateToProps, mapDispatchToProps) +@injectIntl class ExplanationBox extends React.PureComponent { static propTypes = { title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]), explanation: PropTypes.oneOfType([PropTypes.string, PropTypes.element]), dismissable: PropTypes.bool, + intl: PropTypes.object.isRequired, + settings: ImmutablePropTypes.map.isRequired, + toggleExplanationBox: PropTypes.func, }; + handleToggleExplanationBox = () => { + this.props.toggleExplanationBox(this.props.settings.get('explanationBox') === true ? false : true); + } + render() { - const { title, explanation, dismissable } = this.props; + const { title, explanation, dismissable, settings, intl } = this.props; return (
- {title &&
{title}
} -
- {explanation} - {dismissable && Dismiss} -
+ {title &&
{title} + +
} + {settings.get('explanationBox') && +
+ {explanation} + {dismissable && Dismiss} +
+ }
); } diff --git a/app/styles/basics.scss b/app/styles/basics.scss index 7f5b06e0e..2dafa35a3 100644 --- a/app/styles/basics.scss +++ b/app/styles/basics.scss @@ -170,7 +170,10 @@ body { &__title { font-weight: bold; font-size: 16px; - margin-bottom: 1em; + } + + &__explanation { + margin-top: 1em; } &__dismiss { From 30a5a0baa955a2d649262e2d72507df5fb80f7c5 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Mon, 27 Jul 2020 23:55:23 -0500 Subject: [PATCH 06/79] Fix compose form border-radius --- app/styles/components/compose-form.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/app/styles/components/compose-form.scss b/app/styles/components/compose-form.scss index b2d61bc22..edb565832 100644 --- a/app/styles/components/compose-form.scss +++ b/app/styles/components/compose-form.scss @@ -298,6 +298,7 @@ display: flex; justify-content: space-between; flex: 0 0 auto; + border-radius: 0 0 5px 5px; .compose-form__buttons { display: flex; From 9b666115408b1c81dc958b25573c8ff1f2f35ad3 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 28 Jul 2020 10:50:51 -0500 Subject: [PATCH 07/79] Revert "Merge branch 'patch-1' into 'develop'" This reverts commit 20bfeb1db6cfc20a2d5a305d5c392c3dcf1e60e2, reversing changes made to 475881e80bb69cff2f3512987460b00de146453c. --- app/soapbox/reducers/__tests__/compose-test.js | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/app/soapbox/reducers/__tests__/compose-test.js b/app/soapbox/reducers/__tests__/compose-test.js index c3ebe7ded..d5306aa33 100644 --- a/app/soapbox/reducers/__tests__/compose-test.js +++ b/app/soapbox/reducers/__tests__/compose-test.js @@ -168,8 +168,20 @@ describe('compose reducer', () => { }); }); + //Remove this test once spoiler is decoupled from marking media as sensitive + it('should handle COMPOSE_SENSITIVITY_CHANGE on Mark Sensitive click, don\'t toggle if spoiler active', () => { + const state = ImmutableMap({ spoiler: true, sensitive: true, idempotencyKey: null }); + const action = { + type: actions.COMPOSE_SENSITIVITY_CHANGE, + }; + expect(reducer(state, action).toJS()).toMatchObject({ + sensitive: true, + }); + }); + + //Edit this test to not pass spoiler state once spoiler is decoupled from marking media as sensitive it('should handle COMPOSE_SENSITIVITY_CHANGE on Mark Sensitive click, toggle if spoiler inactive', () => { - const state = ImmutableMap({ sensitive: true }); + const state = ImmutableMap({ spoiler: false, sensitive: true }); const action = { type: actions.COMPOSE_SENSITIVITY_CHANGE, }; From 2aca716cfab5fc60dfbc4c99764707c88949386d Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 28 Jul 2020 10:52:29 -0500 Subject: [PATCH 08/79] Revert "Merge branch 'decouple_spoiler_from_nsfw' into 'develop'" This reverts commit 03c2a8f29456f41eb6c1a1350fb8044c57b6693a, reversing changes made to b6c0884a1dacd86e5ae07f032f8601cb67dbad29. --- .../compose/containers/sensitive_button_container.js | 5 ++++- app/soapbox/reducers/compose.js | 10 ++++++++-- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/app/soapbox/features/compose/containers/sensitive_button_container.js b/app/soapbox/features/compose/containers/sensitive_button_container.js index dc98de561..3497c0009 100644 --- a/app/soapbox/features/compose/containers/sensitive_button_container.js +++ b/app/soapbox/features/compose/containers/sensitive_button_container.js @@ -12,6 +12,7 @@ const messages = defineMessages({ const mapStateToProps = state => ({ active: state.getIn(['compose', 'sensitive']), + disabled: state.getIn(['compose', 'spoiler']), }); const mapDispatchToProps = dispatch => ({ @@ -26,12 +27,13 @@ class SensitiveButton extends React.PureComponent { static propTypes = { active: PropTypes.bool, + disabled: PropTypes.bool, onClick: PropTypes.func.isRequired, intl: PropTypes.object.isRequired, }; render() { - const { active, onClick, intl } = this.props; + const { active, disabled, onClick, intl } = this.props; return (
@@ -41,6 +43,7 @@ class SensitiveButton extends React.PureComponent { type='checkbox' checked={active} onChange={onClick} + disabled={disabled} /> diff --git a/app/soapbox/reducers/compose.js b/app/soapbox/reducers/compose.js index c2e39e866..d9d554d47 100644 --- a/app/soapbox/reducers/compose.js +++ b/app/soapbox/reducers/compose.js @@ -114,7 +114,7 @@ function appendMedia(state, media) { map.set('resetFileKey', Math.floor((Math.random() * 0x10000))); map.set('idempotencyKey', uuid()); - if (prevSize === 0 && state.get('default_sensitive')) { + if (prevSize === 0 && (state.get('default_sensitive') || state.get('spoiler'))) { map.set('sensitive', true); } }); @@ -211,7 +211,9 @@ export default function compose(state = initialState, action) { .set('is_composing', false); case COMPOSE_SENSITIVITY_CHANGE: return state.withMutations(map => { - map.set('sensitive', !state.get('sensitive')); + if (!state.get('spoiler')) { + map.set('sensitive', !state.get('sensitive')); + } map.set('idempotencyKey', uuid()); }); @@ -220,6 +222,10 @@ export default function compose(state = initialState, action) { map.set('spoiler_text', ''); map.set('spoiler', !state.get('spoiler')); map.set('idempotencyKey', uuid()); + + if (!state.get('sensitive') && state.get('media_attachments').size >= 1) { + map.set('sensitive', true); + } }); case COMPOSE_SPOILER_TEXT_CHANGE: return state From 665a27d4c92bd6da05970040c0d9ba1d426a0083 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 28 Jul 2020 10:57:20 -0500 Subject: [PATCH 09/79] Update compose CW tests --- app/soapbox/reducers/__tests__/compose-test.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/app/soapbox/reducers/__tests__/compose-test.js b/app/soapbox/reducers/__tests__/compose-test.js index d5306aa33..d063bc77e 100644 --- a/app/soapbox/reducers/__tests__/compose-test.js +++ b/app/soapbox/reducers/__tests__/compose-test.js @@ -168,7 +168,6 @@ describe('compose reducer', () => { }); }); - //Remove this test once spoiler is decoupled from marking media as sensitive it('should handle COMPOSE_SENSITIVITY_CHANGE on Mark Sensitive click, don\'t toggle if spoiler active', () => { const state = ImmutableMap({ spoiler: true, sensitive: true, idempotencyKey: null }); const action = { @@ -179,7 +178,6 @@ describe('compose reducer', () => { }); }); - //Edit this test to not pass spoiler state once spoiler is decoupled from marking media as sensitive it('should handle COMPOSE_SENSITIVITY_CHANGE on Mark Sensitive click, toggle if spoiler inactive', () => { const state = ImmutableMap({ spoiler: false, sensitive: true }); const action = { From bc787e0bbe4aeebfd0bc9774e0a5178d5a3336fb Mon Sep 17 00:00:00 2001 From: Mary Kate Date: Tue, 28 Jul 2020 12:23:15 -0500 Subject: [PATCH 10/79] add markdown posts --- app/soapbox/actions/compose.js | 8 +++++ .../compose/components/compose_form.js | 3 ++ .../containers/compose_form_container.js | 1 + .../containers/markdown_button_container.js | 26 ++++++++++++++++ app/soapbox/reducers/compose.js | 10 ++++++ app/styles/components/status.scss | 31 +++++++++++++++++++ 6 files changed, 79 insertions(+) create mode 100644 app/soapbox/features/compose/containers/markdown_button_container.js diff --git a/app/soapbox/actions/compose.js b/app/soapbox/actions/compose.js index 28442f994..26d63a635 100644 --- a/app/soapbox/actions/compose.js +++ b/app/soapbox/actions/compose.js @@ -43,6 +43,7 @@ export const COMPOSE_UNMOUNT = 'COMPOSE_UNMOUNT'; export const COMPOSE_SENSITIVITY_CHANGE = 'COMPOSE_SENSITIVITY_CHANGE'; export const COMPOSE_SPOILERNESS_CHANGE = 'COMPOSE_SPOILERNESS_CHANGE'; +export const COMPOSE_MARKDOWN_CHANGE = 'COMPOSE_MARKDOWN_CHANGE'; export const COMPOSE_SPOILER_TEXT_CHANGE = 'COMPOSE_SPOILER_TEXT_CHANGE'; export const COMPOSE_VISIBILITY_CHANGE = 'COMPOSE_VISIBILITY_CHANGE'; export const COMPOSE_LISTABILITY_CHANGE = 'COMPOSE_LISTABILITY_CHANGE'; @@ -175,6 +176,7 @@ export function submitCompose(routerHistory, group) { sensitive: getState().getIn(['compose', 'sensitive']), spoiler_text: getState().getIn(['compose', 'spoiler_text'], ''), visibility: getState().getIn(['compose', 'privacy']), + content_type: getState().getIn(['compose', 'markdown']) === true ? 'text/markdown' : 'text/plain', poll: getState().getIn(['compose', 'poll'], null), group_id: group ? group.get('id') : null, }, { @@ -495,6 +497,12 @@ export function changeComposeSpoilerness() { }; }; +export function changeComposeMarkdown() { + return { + type: COMPOSE_MARKDOWN_CHANGE, + }; +}; + export function changeComposeSpoilerText(text) { return { type: COMPOSE_SPOILER_TEXT_CHANGE, diff --git a/app/soapbox/features/compose/components/compose_form.js b/app/soapbox/features/compose/components/compose_form.js index ae64a75f1..3ef832bbe 100644 --- a/app/soapbox/features/compose/components/compose_form.js +++ b/app/soapbox/features/compose/components/compose_form.js @@ -11,6 +11,7 @@ import PollButtonContainer from '../containers/poll_button_container'; import UploadButtonContainer from '../containers/upload_button_container'; import { defineMessages, injectIntl } from 'react-intl'; import SpoilerButtonContainer from '../containers/spoiler_button_container'; +import MarkdownButtonContainer from '../containers/markdown_button_container'; import PrivacyDropdownContainer from '../containers/privacy_dropdown_container'; import EmojiPickerDropdown from '../containers/emoji_picker_dropdown_container'; import PollFormContainer from '../containers/poll_form_container'; @@ -48,6 +49,7 @@ class ComposeForm extends ImmutablePureComponent { text: PropTypes.string.isRequired, suggestions: ImmutablePropTypes.list, spoiler: PropTypes.bool, + markdown: PropTypes.bool, privacy: PropTypes.string, spoilerText: PropTypes.string, focusDate: PropTypes.instanceOf(Date), @@ -303,6 +305,7 @@ class ComposeForm extends ImmutablePureComponent { +
{maxTootChars &&
}
diff --git a/app/soapbox/features/compose/containers/compose_form_container.js b/app/soapbox/features/compose/containers/compose_form_container.js index 0a7cefc96..957c8d773 100644 --- a/app/soapbox/features/compose/containers/compose_form_container.js +++ b/app/soapbox/features/compose/containers/compose_form_container.js @@ -16,6 +16,7 @@ const mapStateToProps = state => ({ suggestions: state.getIn(['compose', 'suggestions']), spoiler: state.getIn(['compose', 'spoiler']), spoilerText: state.getIn(['compose', 'spoiler_text']), + markdown: state.getIn(['compose', 'markdown']), privacy: state.getIn(['compose', 'privacy']), focusDate: state.getIn(['compose', 'focusDate']), caretPosition: state.getIn(['compose', 'caretPosition']), diff --git a/app/soapbox/features/compose/containers/markdown_button_container.js b/app/soapbox/features/compose/containers/markdown_button_container.js new file mode 100644 index 000000000..fc3ae9435 --- /dev/null +++ b/app/soapbox/features/compose/containers/markdown_button_container.js @@ -0,0 +1,26 @@ +import { connect } from 'react-redux'; +import TextIconButton from '../components/text_icon_button'; +import { changeComposeMarkdown } from '../../../actions/compose'; +import { injectIntl, defineMessages } from 'react-intl'; + +const messages = defineMessages({ + marked: { id: 'compose_form.markdown.marked', defaultMessage: 'Post markdown enabled' }, + unmarked: { id: 'compose_form.markdown.unmarked', defaultMessage: 'Post markdown disabled' }, +}); + +const mapStateToProps = (state, { intl }) => ({ + label: 'MD', + title: intl.formatMessage(state.getIn(['compose', 'markdown']) ? messages.marked : messages.unmarked), + active: state.getIn(['compose', 'markdown']), + ariaControls: 'markdown-input', +}); + +const mapDispatchToProps = dispatch => ({ + + onClick() { + dispatch(changeComposeMarkdown()); + }, + +}); + +export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(TextIconButton)); diff --git a/app/soapbox/reducers/compose.js b/app/soapbox/reducers/compose.js index c2e39e866..b789139fb 100644 --- a/app/soapbox/reducers/compose.js +++ b/app/soapbox/reducers/compose.js @@ -21,6 +21,7 @@ import { COMPOSE_TAG_HISTORY_UPDATE, COMPOSE_SENSITIVITY_CHANGE, COMPOSE_SPOILERNESS_CHANGE, + COMPOSE_MARKDOWN_CHANGE, COMPOSE_SPOILER_TEXT_CHANGE, COMPOSE_VISIBILITY_CHANGE, COMPOSE_COMPOSING_CHANGE, @@ -50,6 +51,7 @@ const initialState = ImmutableMap({ sensitive: false, spoiler: false, spoiler_text: '', + markdown: true, privacy: null, text: '', focusDate: null, @@ -94,6 +96,7 @@ function clearAll(state) { map.set('text', ''); map.set('spoiler', false); map.set('spoiler_text', ''); + map.set('markdown', true); map.set('is_submitting', false); map.set('is_changing_upload', false); map.set('in_reply_to', null); @@ -213,6 +216,11 @@ export default function compose(state = initialState, action) { return state.withMutations(map => { map.set('sensitive', !state.get('sensitive')); + map.set('idempotencyKey', uuid()); + }); + case COMPOSE_MARKDOWN_CHANGE: + return state.withMutations(map => { + map.set('markdown', !state.get('markdown')); map.set('idempotencyKey', uuid()); }); case COMPOSE_SPOILERNESS_CHANGE: @@ -243,6 +251,7 @@ export default function compose(state = initialState, action) { map.set('focusDate', new Date()); map.set('caretPosition', null); map.set('idempotencyKey', uuid()); + map.set('markdown', true); if (action.status.get('spoiler_text', '').length > 0) { map.set('spoiler', true); @@ -326,6 +335,7 @@ export default function compose(state = initialState, action) { map.set('focusDate', new Date()); map.set('caretPosition', null); map.set('idempotencyKey', uuid()); + map.set('markdown', true); if (action.status.get('spoiler_text').length > 0) { map.set('spoiler', true); diff --git a/app/styles/components/status.scss b/app/styles/components/status.scss index 0d349764b..526f59cb0 100644 --- a/app/styles/components/status.scss +++ b/app/styles/components/status.scss @@ -1,3 +1,34 @@ +.status__content { + p, li { + strong { + font-weight: bold; + } + } + + p, li { + em { + font-style: italic; + } + } + + ul, ol, blockquote { + margin-bottom: 20px; + margin-left: 15px; + } + + ul { + list-style: disc inside none; + } + + ol { + list-style: decimal inside none; + } + + blockquote p { + font-style: italic; + } +} + .status__content--with-action { cursor: pointer; } From daf039d9bb098bb522007c96ba62db2b3ebc4b63 Mon Sep 17 00:00:00 2001 From: Mary Kate Date: Tue, 28 Jul 2020 13:24:31 -0500 Subject: [PATCH 11/79] generalize markdown to content_type --- app/soapbox/actions/compose.js | 9 +++++---- .../features/compose/components/compose_form.js | 2 +- .../compose/containers/compose_form_container.js | 2 +- .../containers/markdown_button_container.js | 6 +++--- app/soapbox/reducers/compose.js | 14 +++++++------- 5 files changed, 17 insertions(+), 16 deletions(-) diff --git a/app/soapbox/actions/compose.js b/app/soapbox/actions/compose.js index 26d63a635..93e923c54 100644 --- a/app/soapbox/actions/compose.js +++ b/app/soapbox/actions/compose.js @@ -43,7 +43,7 @@ export const COMPOSE_UNMOUNT = 'COMPOSE_UNMOUNT'; export const COMPOSE_SENSITIVITY_CHANGE = 'COMPOSE_SENSITIVITY_CHANGE'; export const COMPOSE_SPOILERNESS_CHANGE = 'COMPOSE_SPOILERNESS_CHANGE'; -export const COMPOSE_MARKDOWN_CHANGE = 'COMPOSE_MARKDOWN_CHANGE'; +export const COMPOSE_TYPE_CHANGE = 'COMPOSE_TYPE_CHANGE'; export const COMPOSE_SPOILER_TEXT_CHANGE = 'COMPOSE_SPOILER_TEXT_CHANGE'; export const COMPOSE_VISIBILITY_CHANGE = 'COMPOSE_VISIBILITY_CHANGE'; export const COMPOSE_LISTABILITY_CHANGE = 'COMPOSE_LISTABILITY_CHANGE'; @@ -176,7 +176,7 @@ export function submitCompose(routerHistory, group) { sensitive: getState().getIn(['compose', 'sensitive']), spoiler_text: getState().getIn(['compose', 'spoiler_text'], ''), visibility: getState().getIn(['compose', 'privacy']), - content_type: getState().getIn(['compose', 'markdown']) === true ? 'text/markdown' : 'text/plain', + content_type: getState().getIn(['compose', 'content_type']), poll: getState().getIn(['compose', 'poll'], null), group_id: group ? group.get('id') : null, }, { @@ -497,9 +497,10 @@ export function changeComposeSpoilerness() { }; }; -export function changeComposeMarkdown() { +export function changeComposeMarkdown(value) { return { - type: COMPOSE_MARKDOWN_CHANGE, + type: COMPOSE_TYPE_CHANGE, + value, }; }; diff --git a/app/soapbox/features/compose/components/compose_form.js b/app/soapbox/features/compose/components/compose_form.js index 3ef832bbe..dde769ac5 100644 --- a/app/soapbox/features/compose/components/compose_form.js +++ b/app/soapbox/features/compose/components/compose_form.js @@ -49,7 +49,7 @@ class ComposeForm extends ImmutablePureComponent { text: PropTypes.string.isRequired, suggestions: ImmutablePropTypes.list, spoiler: PropTypes.bool, - markdown: PropTypes.bool, + content_type: PropTypes.string, privacy: PropTypes.string, spoilerText: PropTypes.string, focusDate: PropTypes.instanceOf(Date), diff --git a/app/soapbox/features/compose/containers/compose_form_container.js b/app/soapbox/features/compose/containers/compose_form_container.js index 957c8d773..99189385d 100644 --- a/app/soapbox/features/compose/containers/compose_form_container.js +++ b/app/soapbox/features/compose/containers/compose_form_container.js @@ -16,7 +16,7 @@ const mapStateToProps = state => ({ suggestions: state.getIn(['compose', 'suggestions']), spoiler: state.getIn(['compose', 'spoiler']), spoilerText: state.getIn(['compose', 'spoiler_text']), - markdown: state.getIn(['compose', 'markdown']), + content_type: state.getIn(['compose', 'text/markdown']), privacy: state.getIn(['compose', 'privacy']), focusDate: state.getIn(['compose', 'focusDate']), caretPosition: state.getIn(['compose', 'caretPosition']), diff --git a/app/soapbox/features/compose/containers/markdown_button_container.js b/app/soapbox/features/compose/containers/markdown_button_container.js index fc3ae9435..1fd809966 100644 --- a/app/soapbox/features/compose/containers/markdown_button_container.js +++ b/app/soapbox/features/compose/containers/markdown_button_container.js @@ -10,15 +10,15 @@ const messages = defineMessages({ const mapStateToProps = (state, { intl }) => ({ label: 'MD', - title: intl.formatMessage(state.getIn(['compose', 'markdown']) ? messages.marked : messages.unmarked), - active: state.getIn(['compose', 'markdown']), + title: intl.formatMessage(state.getIn(['compose', 'content_type']) === 'text/markdown' ? messages.marked : messages.unmarked), + active: state.getIn(['compose', 'content_type']) === 'text/markdown', ariaControls: 'markdown-input', }); const mapDispatchToProps = dispatch => ({ onClick() { - dispatch(changeComposeMarkdown()); + dispatch(changeComposeMarkdown(this.active ? 'text/plain' : 'text/markdown')); }, }); diff --git a/app/soapbox/reducers/compose.js b/app/soapbox/reducers/compose.js index b789139fb..c8294edec 100644 --- a/app/soapbox/reducers/compose.js +++ b/app/soapbox/reducers/compose.js @@ -21,7 +21,7 @@ import { COMPOSE_TAG_HISTORY_UPDATE, COMPOSE_SENSITIVITY_CHANGE, COMPOSE_SPOILERNESS_CHANGE, - COMPOSE_MARKDOWN_CHANGE, + COMPOSE_TYPE_CHANGE, COMPOSE_SPOILER_TEXT_CHANGE, COMPOSE_VISIBILITY_CHANGE, COMPOSE_COMPOSING_CHANGE, @@ -51,7 +51,7 @@ const initialState = ImmutableMap({ sensitive: false, spoiler: false, spoiler_text: '', - markdown: true, + content_type: 'text/markdown', privacy: null, text: '', focusDate: null, @@ -96,7 +96,7 @@ function clearAll(state) { map.set('text', ''); map.set('spoiler', false); map.set('spoiler_text', ''); - map.set('markdown', true); + map.set('content_type', 'text/markdown'); map.set('is_submitting', false); map.set('is_changing_upload', false); map.set('in_reply_to', null); @@ -218,9 +218,9 @@ export default function compose(state = initialState, action) { map.set('idempotencyKey', uuid()); }); - case COMPOSE_MARKDOWN_CHANGE: + case COMPOSE_TYPE_CHANGE: return state.withMutations(map => { - map.set('markdown', !state.get('markdown')); + map.set('content_type', action.value); map.set('idempotencyKey', uuid()); }); case COMPOSE_SPOILERNESS_CHANGE: @@ -251,7 +251,7 @@ export default function compose(state = initialState, action) { map.set('focusDate', new Date()); map.set('caretPosition', null); map.set('idempotencyKey', uuid()); - map.set('markdown', true); + map.set('content_type', 'text/markdown'); if (action.status.get('spoiler_text', '').length > 0) { map.set('spoiler', true); @@ -335,7 +335,7 @@ export default function compose(state = initialState, action) { map.set('focusDate', new Date()); map.set('caretPosition', null); map.set('idempotencyKey', uuid()); - map.set('markdown', true); + map.set('content_type', 'text/markdown'); if (action.status.get('spoiler_text').length > 0) { map.set('spoiler', true); From b31cf22f43cfdca9a5258aa71eb4bd299d6ced86 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 28 Jul 2020 13:36:10 -0500 Subject: [PATCH 12/79] Markdown refactoring --- app/soapbox/actions/compose.js | 2 +- .../features/compose/components/compose_form.js | 1 - .../compose/containers/compose_form_container.js | 1 - .../compose/containers/markdown_button_container.js | 4 ++-- app/soapbox/reducers/compose.js | 3 +-- app/styles/components/status.scss | 10 +++++++--- 6 files changed, 11 insertions(+), 10 deletions(-) diff --git a/app/soapbox/actions/compose.js b/app/soapbox/actions/compose.js index 93e923c54..8466d8069 100644 --- a/app/soapbox/actions/compose.js +++ b/app/soapbox/actions/compose.js @@ -497,7 +497,7 @@ export function changeComposeSpoilerness() { }; }; -export function changeComposeMarkdown(value) { +export function changeComposeContentType(value) { return { type: COMPOSE_TYPE_CHANGE, value, diff --git a/app/soapbox/features/compose/components/compose_form.js b/app/soapbox/features/compose/components/compose_form.js index dde769ac5..af8ce4263 100644 --- a/app/soapbox/features/compose/components/compose_form.js +++ b/app/soapbox/features/compose/components/compose_form.js @@ -49,7 +49,6 @@ class ComposeForm extends ImmutablePureComponent { text: PropTypes.string.isRequired, suggestions: ImmutablePropTypes.list, spoiler: PropTypes.bool, - content_type: PropTypes.string, privacy: PropTypes.string, spoilerText: PropTypes.string, focusDate: PropTypes.instanceOf(Date), diff --git a/app/soapbox/features/compose/containers/compose_form_container.js b/app/soapbox/features/compose/containers/compose_form_container.js index 99189385d..0a7cefc96 100644 --- a/app/soapbox/features/compose/containers/compose_form_container.js +++ b/app/soapbox/features/compose/containers/compose_form_container.js @@ -16,7 +16,6 @@ const mapStateToProps = state => ({ suggestions: state.getIn(['compose', 'suggestions']), spoiler: state.getIn(['compose', 'spoiler']), spoilerText: state.getIn(['compose', 'spoiler_text']), - content_type: state.getIn(['compose', 'text/markdown']), privacy: state.getIn(['compose', 'privacy']), focusDate: state.getIn(['compose', 'focusDate']), caretPosition: state.getIn(['compose', 'caretPosition']), diff --git a/app/soapbox/features/compose/containers/markdown_button_container.js b/app/soapbox/features/compose/containers/markdown_button_container.js index 1fd809966..0b4a642ca 100644 --- a/app/soapbox/features/compose/containers/markdown_button_container.js +++ b/app/soapbox/features/compose/containers/markdown_button_container.js @@ -1,6 +1,6 @@ import { connect } from 'react-redux'; import TextIconButton from '../components/text_icon_button'; -import { changeComposeMarkdown } from '../../../actions/compose'; +import { changeComposeContentType } from '../../../actions/compose'; import { injectIntl, defineMessages } from 'react-intl'; const messages = defineMessages({ @@ -18,7 +18,7 @@ const mapStateToProps = (state, { intl }) => ({ const mapDispatchToProps = dispatch => ({ onClick() { - dispatch(changeComposeMarkdown(this.active ? 'text/plain' : 'text/markdown')); + dispatch(changeComposeContentType(this.active ? 'text/plain' : 'text/markdown')); }, }); diff --git a/app/soapbox/reducers/compose.js b/app/soapbox/reducers/compose.js index c8294edec..60418da85 100644 --- a/app/soapbox/reducers/compose.js +++ b/app/soapbox/reducers/compose.js @@ -214,8 +214,7 @@ export default function compose(state = initialState, action) { .set('is_composing', false); case COMPOSE_SENSITIVITY_CHANGE: return state.withMutations(map => { - map.set('sensitive', !state.get('sensitive')); - + map.set('sensitive', !state.get('sensitive')); map.set('idempotencyKey', uuid()); }); case COMPOSE_TYPE_CHANGE: diff --git a/app/styles/components/status.scss b/app/styles/components/status.scss index 526f59cb0..7137874de 100644 --- a/app/styles/components/status.scss +++ b/app/styles/components/status.scss @@ -1,17 +1,21 @@ .status__content { - p, li { + p, + li { strong { font-weight: bold; } } - p, li { + p, + li { em { font-style: italic; } } - ul, ol, blockquote { + ul, + ol, + blockquote { margin-bottom: 20px; margin-left: 15px; } From eda4c7d6295419f942813cd0fe58c073351ba4d5 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 28 Jul 2020 13:53:01 -0500 Subject: [PATCH 13/79] Add markdown reducer tests --- app/soapbox/reducers/__tests__/compose-test.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/app/soapbox/reducers/__tests__/compose-test.js b/app/soapbox/reducers/__tests__/compose-test.js index c3ebe7ded..62eb472a9 100644 --- a/app/soapbox/reducers/__tests__/compose-test.js +++ b/app/soapbox/reducers/__tests__/compose-test.js @@ -32,6 +32,7 @@ describe('compose reducer', () => { default_sensitive: false, idempotencyKey: null, tagHistory: [], + content_type: 'text/markdown', }); }); @@ -777,4 +778,11 @@ describe('compose reducer', () => { // }); // }); + it('sets the post content-type', () => { + const action = { + type: actions.COMPOSE_TYPE_CHANGE, + value: 'text/plain', + }; + expect(reducer(undefined, action).toJS()).toMatchObject({ content_type: 'text/plain' }); + }); }); From 5333680a3238220c413f59d6c190ef4734609a47 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 28 Jul 2020 14:13:29 -0500 Subject: [PATCH 14/79] Linter fixes --- app/soapbox/reducers/__tests__/alerts-test.js | 24 +++++++++---------- .../reducers/__tests__/notifications-test.js | 20 ++++++++-------- app/styles/components/audio-player.scss | 4 ++-- app/styles/components/columns.scss | 2 +- 4 files changed, 25 insertions(+), 25 deletions(-) diff --git a/app/soapbox/reducers/__tests__/alerts-test.js b/app/soapbox/reducers/__tests__/alerts-test.js index f5af4a50f..ab935b45c 100644 --- a/app/soapbox/reducers/__tests__/alerts-test.js +++ b/app/soapbox/reducers/__tests__/alerts-test.js @@ -50,18 +50,18 @@ describe('alerts reducer', () => { // }); it('should handle ALERT_CLEAR', () => { - const state = ImmutableList([ - { - key: 0, - message: 'message_1', - title: 'title_1', - }, - { - key: 1, - message: 'message_2', - title: 'title_2', - }, - ]); + const state = ImmutableList([ + { + key: 0, + message: 'message_1', + title: 'title_1', + }, + { + key: 1, + message: 'message_2', + title: 'title_2', + }, + ]); const action = { type: actions.ALERT_CLEAR, }; diff --git a/app/soapbox/reducers/__tests__/notifications-test.js b/app/soapbox/reducers/__tests__/notifications-test.js index 3831067ba..ef6d99d88 100644 --- a/app/soapbox/reducers/__tests__/notifications-test.js +++ b/app/soapbox/reducers/__tests__/notifications-test.js @@ -206,16 +206,16 @@ describe('notifications reducer', () => { }; expect(reducer(state, action)).toEqual(ImmutableMap({ items: ImmutableList([ - ImmutableMap({ - id: '10743', - type: 'favourite', - account: '9v5c6xSEgAi3Zu1Lv6', - created_at: '2020-06-10T02:51:05.000Z', - status: '9vvNxoo5EFbbnfdXQu', - emoji: undefined, - is_seen: true, - }), - ]), + ImmutableMap({ + id: '10743', + type: 'favourite', + account: '9v5c6xSEgAi3Zu1Lv6', + created_at: '2020-06-10T02:51:05.000Z', + status: '9vvNxoo5EFbbnfdXQu', + emoji: undefined, + is_seen: true, + }), + ]), top: false, unread: 2, })); diff --git a/app/styles/components/audio-player.scss b/app/styles/components/audio-player.scss index 551e19bc9..7073f141a 100644 --- a/app/styles/components/audio-player.scss +++ b/app/styles/components/audio-player.scss @@ -173,11 +173,11 @@ white-space: nowrap; overlow: hidden; text-overflow: ellipsis; - background: hsl( var(--brand-color_h), var(--brand-color_s), 20% ); + background: hsl(var(--brand-color_h), var(--brand-color_s), 20%); padding: 5px; &__label { - color: white; + color: #ffffff; } button { diff --git a/app/styles/components/columns.scss b/app/styles/components/columns.scss index c005a6e60..7e6bafdc0 100644 --- a/app/styles/components/columns.scss +++ b/app/styles/components/columns.scss @@ -260,7 +260,7 @@ position: absolute; right: 0; top: -49px; - + @media screen and (max-width: $nav-breakpoint-2) { top: -35px; font-size: 14px; From a3201605b44aa908b202105fa1fbff627291e804 Mon Sep 17 00:00:00 2001 From: Mary Kate Date: Tue, 28 Jul 2020 13:52:44 -0500 Subject: [PATCH 15/79] add uploads to polls --- app/soapbox/actions/compose.js | 5 ----- app/soapbox/components/status.js | 7 +++++-- .../features/compose/containers/upload_button_container.js | 1 - app/soapbox/features/status/components/detailed_status.js | 7 +++++-- app/soapbox/reducers/compose.js | 3 +-- 5 files changed, 11 insertions(+), 12 deletions(-) diff --git a/app/soapbox/actions/compose.js b/app/soapbox/actions/compose.js index 28442f994..a0e7b55b1 100644 --- a/app/soapbox/actions/compose.js +++ b/app/soapbox/actions/compose.js @@ -226,11 +226,6 @@ export function uploadCompose(files) { return; } - if (getState().getIn(['compose', 'poll'])) { - dispatch(showAlert(undefined, messages.uploadErrorPoll)); - return; - } - dispatch(uploadComposeRequest()); for (const [i, f] of Array.from(files).entries()) { diff --git a/app/soapbox/components/status.js b/app/soapbox/components/status.js index 889afc01e..15c985e4b 100644 --- a/app/soapbox/components/status.js +++ b/app/soapbox/components/status.js @@ -265,6 +265,7 @@ class Status extends ImmutablePureComponent { render() { let media = null; + let poll = null; let statusAvatar, prepend, rebloggedByText, reblogContent; const { intl, hidden, featured, otherAccounts, unread, showThread, group } = this.props; @@ -332,8 +333,9 @@ class Status extends ImmutablePureComponent { } if (status.get('poll')) { - media = ; - } else if (status.get('media_attachments').size > 0) { + poll = ; + } + if (status.get('media_attachments').size > 0) { if (this.props.muted) { media = ( {media} + {poll} {showThread && status.get('in_reply_to_id') && status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) && (