From 51508e50613322b6be359f0dd7475f0129509f98 Mon Sep 17 00:00:00 2001 From: ThibG Date: Sun, 3 May 2020 22:04:18 +0200 Subject: [Glitch] Fix use of inline CSS in public pages Port c0b849bdfda8a2386bc85836d2d181890746de98 to glitch-soc Signed-off-by: Thibaut Girka --- app/javascript/flavours/glitch/styles/about.scss | 13 ------------- .../flavours/glitch/styles/components/accounts.scss | 5 +++++ app/javascript/flavours/glitch/styles/widgets.scss | 6 ------ 3 files changed, 5 insertions(+), 19 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/about.scss b/app/javascript/flavours/glitch/styles/about.scss index f0a44aa94..ac5f3ebb0 100644 --- a/app/javascript/flavours/glitch/styles/about.scss +++ b/app/javascript/flavours/glitch/styles/about.scss @@ -545,13 +545,6 @@ $small-breakpoint: 960px; flex: 0 0 auto; } - &__avatar { - width: 44px; - height: 44px; - background-size: 44px 44px; - @include avatar-size(44px); - } - .display-name { font-size: 15px; @@ -752,12 +745,6 @@ $small-breakpoint: 960px; display: flex; align-items: center; } - - .account__avatar { - width: 44px; - height: 44px; - background-size: 44px 44px; - } } &__counters__wrapper { diff --git a/app/javascript/flavours/glitch/styles/components/accounts.scss b/app/javascript/flavours/glitch/styles/components/accounts.scss index ccd620215..610e48f92 100644 --- a/app/javascript/flavours/glitch/styles/components/accounts.scss +++ b/app/javascript/flavours/glitch/styles/components/accounts.scss @@ -38,9 +38,14 @@ .account__avatar { @include avatar-radius(); + display: block; position: relative; cursor: pointer; + width: 36px; + height: 36px; + background-size: 36px 36px; + &-inline { display: inline-block; vertical-align: middle; diff --git a/app/javascript/flavours/glitch/styles/widgets.scss b/app/javascript/flavours/glitch/styles/widgets.scss index a6f7fc0be..531425573 100644 --- a/app/javascript/flavours/glitch/styles/widgets.scss +++ b/app/javascript/flavours/glitch/styles/widgets.scss @@ -93,12 +93,6 @@ display: flex; align-items: center; } - - .account__avatar { - width: 44px; - height: 44px; - background-size: 44px 44px; - } } .trends__item { -- cgit From 559214c33fc0c5b5ee621eb2719fa1a15ac9da95 Mon Sep 17 00:00:00 2001 From: Takeshi Umeda Date: Sun, 10 May 2020 17:36:18 +0900 Subject: [Glitch] Add remote only to public timeline Port 26b08a3c54847f2816f78c3ac67ace001d3fea1f to glitch-soc Signed-off-by: Thibaut Girka --- .../flavours/glitch/actions/streaming.js | 2 +- .../flavours/glitch/actions/timelines.js | 2 +- .../public_timeline/components/column_settings.js | 30 ++++++++++++++++++++++ .../containers/column_settings_container.js | 2 +- .../glitch/features/public_timeline/index.js | 29 +++++++++++---------- .../glitch/features/ui/components/columns_area.js | 1 + 6 files changed, 50 insertions(+), 16 deletions(-) create mode 100644 app/javascript/flavours/glitch/features/public_timeline/components/column_settings.js (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/actions/streaming.js b/app/javascript/flavours/glitch/actions/streaming.js index 2f82ea805..875013efc 100644 --- a/app/javascript/flavours/glitch/actions/streaming.js +++ b/app/javascript/flavours/glitch/actions/streaming.js @@ -73,7 +73,7 @@ const refreshHomeTimelineAndNotification = (dispatch, done) => { export const connectUserStream = () => connectTimelineStream('home', 'user', refreshHomeTimelineAndNotification); export const connectCommunityStream = ({ onlyMedia } = {}) => connectTimelineStream(`community${onlyMedia ? ':media' : ''}`, `public:local${onlyMedia ? ':media' : ''}`); -export const connectPublicStream = ({ onlyMedia } = {}) => connectTimelineStream(`public${onlyMedia ? ':media' : ''}`, `public${onlyMedia ? ':media' : ''}`); +export const connectPublicStream = ({ onlyMedia, onlyRemote } = {}) => connectTimelineStream(`public${onlyRemote ? ':remote' : ''}${onlyMedia ? ':media' : ''}`, `public${onlyRemote ? ':remote' : ''}${onlyMedia ? ':media' : ''}`); export const connectHashtagStream = (id, tag, accept) => connectTimelineStream(`hashtag:${id}`, `hashtag&tag=${tag}`, null, accept); export const connectDirectStream = () => connectTimelineStream('direct', 'direct'); export const connectListStream = id => connectTimelineStream(`list:${id}`, `list&list=${id}`); diff --git a/app/javascript/flavours/glitch/actions/timelines.js b/app/javascript/flavours/glitch/actions/timelines.js index 50e36531e..b01109134 100644 --- a/app/javascript/flavours/glitch/actions/timelines.js +++ b/app/javascript/flavours/glitch/actions/timelines.js @@ -121,7 +121,7 @@ export function expandTimeline(timelineId, path, params = {}, done = noOp) { }; export const expandHomeTimeline = ({ maxId } = {}, done = noOp) => expandTimeline('home', '/api/v1/timelines/home', { max_id: maxId }, done); -export const expandPublicTimeline = ({ maxId, onlyMedia } = {}, done = noOp) => expandTimeline(`public${onlyMedia ? ':media' : ''}`, '/api/v1/timelines/public', { max_id: maxId, only_media: !!onlyMedia }, done); +export const expandPublicTimeline = ({ maxId, onlyMedia, onlyRemote } = {}, done = noOp) => expandTimeline(`public${onlyRemote ? ':remote' : ''}${onlyMedia ? ':media' : ''}`, '/api/v1/timelines/public', { remote: !!onlyRemote, max_id: maxId, only_media: !!onlyMedia }, done); export const expandCommunityTimeline = ({ maxId, onlyMedia } = {}, done = noOp) => expandTimeline(`community${onlyMedia ? ':media' : ''}`, '/api/v1/timelines/public', { local: true, max_id: maxId, only_media: !!onlyMedia }, done); export const expandDirectTimeline = ({ maxId } = {}, done = noOp) => expandTimeline('direct', '/api/v1/timelines/direct', { max_id: maxId }, done); export const expandAccountTimeline = (accountId, { maxId, withReplies } = {}) => expandTimeline(`account:${accountId}${withReplies ? ':with_replies' : ''}`, `/api/v1/accounts/${accountId}/statuses`, { exclude_replies: !withReplies, max_id: maxId }); diff --git a/app/javascript/flavours/glitch/features/public_timeline/components/column_settings.js b/app/javascript/flavours/glitch/features/public_timeline/components/column_settings.js new file mode 100644 index 000000000..756b6fe06 --- /dev/null +++ b/app/javascript/flavours/glitch/features/public_timeline/components/column_settings.js @@ -0,0 +1,30 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import { injectIntl, FormattedMessage } from 'react-intl'; +import SettingToggle from '../../notifications/components/setting_toggle'; + +export default @injectIntl +class ColumnSettings extends React.PureComponent { + + static propTypes = { + settings: ImmutablePropTypes.map.isRequired, + onChange: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + columnId: PropTypes.string, + }; + + render () { + const { settings, onChange } = this.props; + + return ( +
+
+ } /> + } /> +
+
+ ); + } + +} diff --git a/app/javascript/flavours/glitch/features/public_timeline/containers/column_settings_container.js b/app/javascript/flavours/glitch/features/public_timeline/containers/column_settings_container.js index ec4d74737..5091bfb90 100644 --- a/app/javascript/flavours/glitch/features/public_timeline/containers/column_settings_container.js +++ b/app/javascript/flavours/glitch/features/public_timeline/containers/column_settings_container.js @@ -1,5 +1,5 @@ import { connect } from 'react-redux'; -import ColumnSettings from 'flavours/glitch/features/community_timeline/components/column_settings'; +import ColumnSettings from '../components/column_settings'; import { changeSetting } from 'flavours/glitch/actions/settings'; import { changeColumnParams } from 'flavours/glitch/actions/columns'; diff --git a/app/javascript/flavours/glitch/features/public_timeline/index.js b/app/javascript/flavours/glitch/features/public_timeline/index.js index 4d139a326..3f720b885 100644 --- a/app/javascript/flavours/glitch/features/public_timeline/index.js +++ b/app/javascript/flavours/glitch/features/public_timeline/index.js @@ -19,11 +19,13 @@ const mapStateToProps = (state, { columnId }) => { const columns = state.getIn(['settings', 'columns']); const index = columns.findIndex(c => c.get('uuid') === uuid); const onlyMedia = (columnId && index >= 0) ? columns.get(index).getIn(['params', 'other', 'onlyMedia']) : state.getIn(['settings', 'public', 'other', 'onlyMedia']); + const onlyRemote = (columnId && index >= 0) ? columns.get(index).getIn(['params', 'other', 'onlyRemote']) : state.getIn(['settings', 'public', 'other', 'onlyRemote']); const timelineState = state.getIn(['timelines', `public${onlyMedia ? ':media' : ''}`]); return { hasUnread: !!timelineState && timelineState.get('unread') > 0, onlyMedia, + onlyRemote, }; }; @@ -46,15 +48,16 @@ class PublicTimeline extends React.PureComponent { multiColumn: PropTypes.bool, hasUnread: PropTypes.bool, onlyMedia: PropTypes.bool, + onlyRemote: PropTypes.bool, }; handlePin = () => { - const { columnId, dispatch, onlyMedia } = this.props; + const { columnId, dispatch, onlyMedia, onlyRemote } = this.props; if (columnId) { dispatch(removeColumn(columnId)); } else { - dispatch(addColumn('PUBLIC', { other: { onlyMedia } })); + dispatch(addColumn(onlyRemote ? 'REMOTE' : 'PUBLIC', { other: { onlyMedia, onlyRemote } })); } } @@ -68,19 +71,19 @@ class PublicTimeline extends React.PureComponent { } componentDidMount () { - const { dispatch, onlyMedia } = this.props; + const { dispatch, onlyMedia, onlyRemote } = this.props; - dispatch(expandPublicTimeline({ onlyMedia })); - this.disconnect = dispatch(connectPublicStream({ onlyMedia })); + dispatch(expandPublicTimeline({ onlyMedia, onlyRemote })); + this.disconnect = dispatch(connectPublicStream({ onlyMedia, onlyRemote })); } componentDidUpdate (prevProps) { - if (prevProps.onlyMedia !== this.props.onlyMedia) { - const { dispatch, onlyMedia } = this.props; + if (prevProps.onlyMedia !== this.props.onlyMedia || prevProps.onlyRemote !== this.props.onlyRemote) { + const { dispatch, onlyMedia, onlyRemote } = this.props; this.disconnect(); - dispatch(expandPublicTimeline({ onlyMedia })); - this.disconnect = dispatch(connectPublicStream({ onlyMedia })); + dispatch(expandPublicTimeline({ onlyMedia, onlyRemote })); + this.disconnect = dispatch(connectPublicStream({ onlyMedia, onlyRemote })); } } @@ -96,13 +99,13 @@ class PublicTimeline extends React.PureComponent { } handleLoadMore = maxId => { - const { dispatch, onlyMedia } = this.props; + const { dispatch, onlyMedia, onlyRemote } = this.props; - dispatch(expandPublicTimeline({ maxId, onlyMedia })); + dispatch(expandPublicTimeline({ maxId, onlyMedia, onlyRemote })); } render () { - const { intl, columnId, hasUnread, multiColumn, onlyMedia } = this.props; + const { intl, columnId, hasUnread, multiColumn, onlyMedia, onlyRemote } = this.props; const pinned = !!columnId; return ( @@ -121,7 +124,7 @@ class PublicTimeline extends React.PureComponent { Date: Tue, 12 May 2020 15:29:44 +0200 Subject: [Glitch] Fix first poll option not being focused when adding a poll Port af6d35627978047724612c027e60cb0a89cb2eef to glitch-soc Signed-off-by: Thibaut Girka --- .../flavours/glitch/features/compose/components/poll_form.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/compose/components/poll_form.js b/app/javascript/flavours/glitch/features/compose/components/poll_form.js index 57fac10ac..e4b5104f3 100644 --- a/app/javascript/flavours/glitch/features/compose/components/poll_form.js +++ b/app/javascript/flavours/glitch/features/compose/components/poll_form.js @@ -28,6 +28,7 @@ class Option extends React.PureComponent { title: PropTypes.string.isRequired, index: PropTypes.number.isRequired, isPollMultiple: PropTypes.bool, + autoFocus: PropTypes.bool, onChange: PropTypes.func.isRequired, onRemove: PropTypes.func.isRequired, suggestions: ImmutablePropTypes.list, @@ -58,7 +59,7 @@ class Option extends React.PureComponent { } render () { - const { isPollMultiple, title, index, intl } = this.props; + const { isPollMultiple, title, index, autoFocus, intl } = this.props; return (
  • @@ -75,6 +76,7 @@ class Option extends React.PureComponent { onSuggestionsClearRequested={this.onSuggestionsClearRequested} onSuggestionSelected={this.onSuggestionSelected} searchTokens={[':']} + autoFocus={autoFocus} /> @@ -125,10 +127,12 @@ class PollForm extends ImmutablePureComponent { return null; } + const autoFocusIndex = options.indexOf(''); + return (
      - {options.map((title, i) =>