diff options
Diffstat (limited to 'app/javascript/flavours/glitch')
25 files changed, 194 insertions, 95 deletions
diff --git a/app/javascript/flavours/glitch/actions/favourites.js b/app/javascript/flavours/glitch/actions/favourites.js index decdcee4f..0c0f3af44 100644 --- a/app/javascript/flavours/glitch/actions/favourites.js +++ b/app/javascript/flavours/glitch/actions/favourites.js @@ -10,6 +10,10 @@ export const FAVOURITED_STATUSES_EXPAND_FAIL = 'FAVOURITED_STATUSES_EXPAND_FA export function fetchFavouritedStatuses() { return (dispatch, getState) => { + if (getState().getIn(['status_lists', 'favourites', 'isLoading'])) { + return; + } + dispatch(fetchFavouritedStatusesRequest()); api(getState).get('/api/v1/favourites').then(response => { @@ -46,7 +50,7 @@ export function expandFavouritedStatuses() { return (dispatch, getState) => { const url = getState().getIn(['status_lists', 'favourites', 'next'], null); - if (url === null) { + if (url === null || getState().getIn(['status_lists', 'favourites', 'isLoading'])) { return; } diff --git a/app/javascript/flavours/glitch/actions/notifications.js b/app/javascript/flavours/glitch/actions/notifications.js index 9b9ebf86d..cf27eff90 100644 --- a/app/javascript/flavours/glitch/actions/notifications.js +++ b/app/javascript/flavours/glitch/actions/notifications.js @@ -42,7 +42,7 @@ const fetchRelatedRelationships = (dispatch, notifications) => { const unescapeHTML = (html) => { const wrapper = document.createElement('div'); - html = html.replace(/<br \/>|<br>|\n/, ' '); + html = html.replace(/<br \/>|<br>|\n/g, ' '); wrapper.innerHTML = html; return wrapper.textContent; }; diff --git a/app/javascript/flavours/glitch/actions/push_notifications/index.js b/app/javascript/flavours/glitch/actions/push_notifications/index.js index 376b55b62..2ffec500a 100644 --- a/app/javascript/flavours/glitch/actions/push_notifications/index.js +++ b/app/javascript/flavours/glitch/actions/push_notifications/index.js @@ -15,9 +15,9 @@ export { register, }; -export function changeAlerts(key, value) { +export function changeAlerts(path, value) { return dispatch => { - dispatch(setAlerts(key, value)); + dispatch(setAlerts(path, value)); dispatch(saveSettings()); }; } diff --git a/app/javascript/flavours/glitch/actions/push_notifications/registerer.js b/app/javascript/flavours/glitch/actions/push_notifications/registerer.js index 3003d4149..5ad11f73f 100644 --- a/app/javascript/flavours/glitch/actions/push_notifications/registerer.js +++ b/app/javascript/flavours/glitch/actions/push_notifications/registerer.js @@ -1,4 +1,4 @@ -import axios from 'axios'; +import api from 'flavours/glitch/util/api'; import { pushNotificationsSetting } from 'flavours/glitch/util/settings'; import { setBrowserSupport, setSubscription, clearSubscription } from './setter'; @@ -35,7 +35,7 @@ const subscribe = (registration) => const unsubscribe = ({ registration, subscription }) => subscription ? subscription.unsubscribe().then(() => registration) : registration; -const sendSubscriptionToBackend = (subscription, me) => { +const sendSubscriptionToBackend = (getState, subscription, me) => { const params = { subscription }; if (me) { @@ -45,7 +45,7 @@ const sendSubscriptionToBackend = (subscription, me) => { } } - return axios.post('/api/web/push_subscriptions', params).then(response => response.data); + return api(getState).post('/api/web/push_subscriptions', params).then(response => response.data); }; // Last one checks for payload support: https://web-push-book.gauntface.com/chapter-06/01-non-standards-browsers/#no-payload @@ -85,13 +85,13 @@ export function register () { } else { // Something went wrong, try to subscribe again return unsubscribe({ registration, subscription }).then(subscribe).then( - subscription => sendSubscriptionToBackend(subscription, me)); + subscription => sendSubscriptionToBackend(getState, subscription, me)); } } // No subscription, try to subscribe return subscribe(registration).then( - subscription => sendSubscriptionToBackend(subscription, me)); + subscription => sendSubscriptionToBackend(getState, subscription, me)); }) .then(subscription => { // If we got a PushSubscription (and not a subscription object from the backend) @@ -137,7 +137,7 @@ export function saveSettings() { const alerts = state.get('alerts'); const data = { alerts }; - axios.put(`/api/web/push_subscriptions/${subscription.get('id')}`, { + api(getState).put(`/api/web/push_subscriptions/${subscription.get('id')}`, { data, }).then(() => { const me = getState().getIn(['meta', 'me']); diff --git a/app/javascript/flavours/glitch/actions/push_notifications/setter.js b/app/javascript/flavours/glitch/actions/push_notifications/setter.js index a2cc41c5a..5561766bf 100644 --- a/app/javascript/flavours/glitch/actions/push_notifications/setter.js +++ b/app/javascript/flavours/glitch/actions/push_notifications/setter.js @@ -23,11 +23,11 @@ export function clearSubscription () { }; } -export function setAlerts (key, value) { +export function setAlerts (path, value) { return dispatch => { dispatch({ type: SET_ALERTS, - key, + path, value, }); }; diff --git a/app/javascript/flavours/glitch/actions/settings.js b/app/javascript/flavours/glitch/actions/settings.js index 79adca18c..87b2ae76d 100644 --- a/app/javascript/flavours/glitch/actions/settings.js +++ b/app/javascript/flavours/glitch/actions/settings.js @@ -1,14 +1,14 @@ -import axios from 'axios'; +import api from 'flavours/glitch/util/api'; import { debounce } from 'lodash'; export const SETTING_CHANGE = 'SETTING_CHANGE'; export const SETTING_SAVE = 'SETTING_SAVE'; -export function changeSetting(key, value) { +export function changeSetting(path, value) { return dispatch => { dispatch({ type: SETTING_CHANGE, - key, + path, value, }); @@ -21,9 +21,9 @@ const debouncedSave = debounce((dispatch, getState) => { return; } - const data = getState().get('settings').filter((_, key) => key !== 'saved').toJS(); + const data = getState().get('settings').filter((_, path) => path !== 'saved').toJS(); - axios.put('/api/web/settings', { data }).then(() => dispatch({ type: SETTING_SAVE })); + api(getState).put('/api/web/settings', { data }).then(() => dispatch({ type: SETTING_SAVE })); }, 5000, { trailing: true }); export function saveSettings() { diff --git a/app/javascript/flavours/glitch/components/account.js b/app/javascript/flavours/glitch/components/account.js index bb1979cc7..265ee94f6 100644 --- a/app/javascript/flavours/glitch/components/account.js +++ b/app/javascript/flavours/glitch/components/account.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Fragment } from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import Avatar from './avatar'; @@ -94,12 +94,12 @@ export default class Account extends ImmutablePureComponent { hidingNotificationsButton = <IconButton active icon='bell-slash' title={intl.formatMessage(messages.mute_notifications, { name: account.get('username') })} onClick={this.handleMuteNotifications} />; } buttons = ( - <div> + <Fragment> <IconButton active icon='volume-up' title={intl.formatMessage(messages.unmute, { name: account.get('username') })} onClick={this.handleMute} /> {hidingNotificationsButton} - </div> + </Fragment> ); - } else { + } else if (!account.get('moved')) { buttons = <IconButton icon={following ? 'user-times' : 'user-plus'} title={intl.formatMessage(following ? messages.unfollow : messages.follow)} onClick={this.handleFollow} active={following} />; } } diff --git a/app/javascript/flavours/glitch/components/media_gallery.js b/app/javascript/flavours/glitch/components/media_gallery.js index d2e80de49..6928af6d6 100644 --- a/app/javascript/flavours/glitch/components/media_gallery.js +++ b/app/javascript/flavours/glitch/components/media_gallery.js @@ -9,7 +9,26 @@ import classNames from 'classnames'; import { autoPlayGif } from 'flavours/glitch/util/initial_state'; const messages = defineMessages({ - toggle_visible: { id: 'media_gallery.toggle_visible', defaultMessage: 'Toggle visibility' }, + hidden: { + defaultMessage: 'Media hidden', + id: 'status.media_hidden', + }, + sensitive: { + defaultMessage: 'Sensitive', + id: 'media_gallery.sensitive', + }, + toggle: { + defaultMessage: 'Click to view', + id: 'status.sensitive_toggle', + }, + toggle_visible: { + defaultMessage: 'Toggle visibility', + id: 'media_gallery.toggle_visible', + }, + warning: { + defaultMessage: 'Sensitive content', + id: 'status.sensitive_warning', + }, }); class Item extends React.PureComponent { @@ -206,48 +225,79 @@ export default class MediaGallery extends React.PureComponent { this.props.onOpenMedia(this.props.media, index); } - isStandaloneEligible() { - const { media, standalone } = this.props; - return standalone && media.size === 1 && media.getIn([0, 'meta', 'small', 'aspect']); - } - render () { - const { media, intl, sensitive, letterbox, fullwidth } = this.props; + const { + handleClick, + handleOpen, + } = this; + const { + fullwidth, + intl, + letterbox, + media, + sensitive, + standalone, + } = this.props; const { visible } = this.state; const size = media.take(4).size; - - let children; - - if (!visible) { - let warning; - - if (sensitive) { - warning = <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />; - } else { - warning = <FormattedMessage id='status.media_hidden' defaultMessage='Media hidden' />; - } - - children = ( - <button className='media-spoiler' onClick={this.handleOpen}> - <span className='media-spoiler__warning'>{warning}</span> - <span className='media-spoiler__trigger'><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span> - </button> - ); - } else { - if (this.isStandaloneEligible()) { - children = <Item standalone onClick={this.handleClick} attachment={media.get(0)} />; - } else { - children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} onClick={this.handleClick} attachment={attachment} index={i} size={size} letterbox={letterbox} />); - } - } + const computedClass = classNames('media-gallery', `size-${size}`, { 'full-width': fullwidth }); return ( - <div className={`media-gallery size-${size} ${fullwidth ? 'full-width' : ''}`}> - <div className={classNames('spoiler-button', { 'spoiler-button--visible': visible })}> - <IconButton title={intl.formatMessage(messages.toggle_visible)} icon={visible ? 'eye' : 'eye-slash'} overlay onClick={this.handleOpen} /> - </div> - - {children} + <div className={computedClass}> + {visible ? ( + <div className='sensitive-info'> + <IconButton + icon='eye' + onClick={handleOpen} + overlay + title={intl.formatMessage(messages.toggle_visible)} + /> + {sensitive ? ( + <span className='sensitive-marker'> + <FormattedMessage {...messages.sensitive} /> + </span> + ) : null} + </div> + ) : null} + {function () { + switch (true) { + case !visible: + return ( + <button + className='media-spoiler' + onClick={handleOpen} + > + <span className='media-spoiler__warning'> + <FormattedMessage {...(sensitive ? messages.warning : messages.hidden)} /> + </span> + <span className='media-spoiler__trigger'> + <FormattedMessage {...messages.toggle} /> + </span> + </button> + ); + case standalone && media.size === 1 && !!media.getIn([0, 'meta', 'small', 'aspect']): + return ( + <Item + attachment={media.get(0)} + onClick={handleClick} + standalone + /> + ); + default: + return media.take(4).map( + (attachment, i) => ( + <Item + attachment={attachment} + index={i} + key={attachment.get('id')} + letterbox={letterbox} + onClick={handleClick} + size={size} + /> + ) + ); + } + }()} </div> ); } diff --git a/app/javascript/flavours/glitch/features/community_timeline/containers/column_settings_container.js b/app/javascript/flavours/glitch/features/community_timeline/containers/column_settings_container.js index 84234a836..39387abb9 100644 --- a/app/javascript/flavours/glitch/features/community_timeline/containers/column_settings_container.js +++ b/app/javascript/flavours/glitch/features/community_timeline/containers/column_settings_container.js @@ -8,8 +8,8 @@ const mapStateToProps = state => ({ const mapDispatchToProps = dispatch => ({ - onChange (key, checked) { - dispatch(changeSetting(['community', ...key], checked)); + onChange (path, checked) { + dispatch(changeSetting(['community', ...path], checked)); }, }); diff --git a/app/javascript/flavours/glitch/features/direct_timeline/containers/column_settings_container.js b/app/javascript/flavours/glitch/features/direct_timeline/containers/column_settings_container.js index d3e4b4216..7292af264 100644 --- a/app/javascript/flavours/glitch/features/direct_timeline/containers/column_settings_container.js +++ b/app/javascript/flavours/glitch/features/direct_timeline/containers/column_settings_container.js @@ -8,8 +8,8 @@ const mapStateToProps = state => ({ const mapDispatchToProps = dispatch => ({ - onChange (key, checked) { - dispatch(changeSetting(['direct', ...key], checked)); + onChange (path, checked) { + dispatch(changeSetting(['direct', ...path], checked)); }, }); diff --git a/app/javascript/flavours/glitch/features/favourited_statuses/index.js b/app/javascript/flavours/glitch/features/favourited_statuses/index.js index e20dda718..301a5ae4f 100644 --- a/app/javascript/flavours/glitch/features/favourited_statuses/index.js +++ b/app/javascript/flavours/glitch/features/favourited_statuses/index.js @@ -9,6 +9,7 @@ import { addColumn, removeColumn, moveColumn } from 'flavours/glitch/actions/col import StatusList from 'flavours/glitch/components/status_list'; import { defineMessages, injectIntl } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; +import { debounce } from 'lodash'; const messages = defineMessages({ heading: { id: 'column.favourites', defaultMessage: 'Favourites' }, @@ -16,6 +17,7 @@ const messages = defineMessages({ const mapStateToProps = state => ({ statusIds: state.getIn(['status_lists', 'favourites', 'items']), + isLoading: state.getIn(['status_lists', 'favourites', 'isLoading'], true), hasMore: !!state.getIn(['status_lists', 'favourites', 'next']), }); @@ -30,6 +32,7 @@ export default class Favourites extends ImmutablePureComponent { columnId: PropTypes.string, multiColumn: PropTypes.bool, hasMore: PropTypes.bool, + isLoading: PropTypes.bool, }; componentWillMount () { @@ -59,12 +62,12 @@ export default class Favourites extends ImmutablePureComponent { this.column = c; } - handleScrollToBottom = () => { + handleScrollToBottom = debounce(() => { this.props.dispatch(expandFavouritedStatuses()); - } + }, 300, { leading: true }) render () { - const { intl, statusIds, columnId, multiColumn, hasMore } = this.props; + const { intl, statusIds, columnId, multiColumn, hasMore, isLoading } = this.props; const pinned = !!columnId; return ( @@ -85,6 +88,7 @@ export default class Favourites extends ImmutablePureComponent { statusIds={statusIds} scrollKey={`favourited_statuses-${columnId}`} hasMore={hasMore} + isLoading={isLoading} onScrollToBottom={this.handleScrollToBottom} /> </Column> diff --git a/app/javascript/flavours/glitch/features/getting_started/index.js b/app/javascript/flavours/glitch/features/getting_started/index.js index 1b05c4da1..0077f193b 100644 --- a/app/javascript/flavours/glitch/features/getting_started/index.js +++ b/app/javascript/flavours/glitch/features/getting_started/index.js @@ -79,7 +79,7 @@ export default class GettingStarted extends ImmutablePureComponent { render () { const { intl, myAccount, columns, multiColumn, lists } = this.props; - let navItems = []; + const navItems = []; let listItems = []; if (multiColumn) { diff --git a/app/javascript/flavours/glitch/features/home_timeline/containers/column_settings_container.js b/app/javascript/flavours/glitch/features/home_timeline/containers/column_settings_container.js index 19a8e792f..16747151b 100644 --- a/app/javascript/flavours/glitch/features/home_timeline/containers/column_settings_container.js +++ b/app/javascript/flavours/glitch/features/home_timeline/containers/column_settings_container.js @@ -8,8 +8,8 @@ const mapStateToProps = state => ({ const mapDispatchToProps = dispatch => ({ - onChange (key, checked) { - dispatch(changeSetting(['home', ...key], checked)); + onChange (path, checked) { + dispatch(changeSetting(['home', ...path], checked)); }, onSave () { diff --git a/app/javascript/flavours/glitch/features/notifications/components/column_settings.js b/app/javascript/flavours/glitch/features/notifications/components/column_settings.js index 23545185c..d9638aaf3 100644 --- a/app/javascript/flavours/glitch/features/notifications/components/column_settings.js +++ b/app/javascript/flavours/glitch/features/notifications/components/column_settings.js @@ -14,8 +14,8 @@ export default class ColumnSettings extends React.PureComponent { onClear: PropTypes.func.isRequired, }; - onPushChange = (key, checked) => { - this.props.onChange(['push', ...key], checked); + onPushChange = (path, checked) => { + this.props.onChange(['push', ...path], checked); } render () { diff --git a/app/javascript/flavours/glitch/features/notifications/containers/column_settings_container.js b/app/javascript/flavours/glitch/features/notifications/containers/column_settings_container.js index 95109fe4d..9585ea556 100644 --- a/app/javascript/flavours/glitch/features/notifications/containers/column_settings_container.js +++ b/app/javascript/flavours/glitch/features/notifications/containers/column_settings_container.js @@ -18,11 +18,11 @@ const mapStateToProps = state => ({ const mapDispatchToProps = (dispatch, { intl }) => ({ - onChange (key, checked) { - if (key[0] === 'push') { - dispatch(changePushNotifications(key.slice(1), checked)); + onChange (path, checked) { + if (path[0] === 'push') { + dispatch(changePushNotifications(path.slice(1), checked)); } else { - dispatch(changeSetting(['notifications', ...key], checked)); + dispatch(changeSetting(['notifications', ...path], checked)); } }, 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 b13e20645..f042adbe6 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 @@ -8,8 +8,8 @@ const mapStateToProps = state => ({ const mapDispatchToProps = dispatch => ({ - onChange (key, checked) { - dispatch(changeSetting(['public', ...key], checked)); + onChange (path, checked) { + dispatch(changeSetting(['public', ...path], checked)); }, }); diff --git a/app/javascript/flavours/glitch/features/ui/components/embed_modal.js b/app/javascript/flavours/glitch/features/ui/components/embed_modal.js index 1afffb51b..f3553f4a9 100644 --- a/app/javascript/flavours/glitch/features/ui/components/embed_modal.js +++ b/app/javascript/flavours/glitch/features/ui/components/embed_modal.js @@ -2,7 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePureComponent from 'react-immutable-pure-component'; import { FormattedMessage, injectIntl } from 'react-intl'; -import axios from 'axios'; +import api from 'flavours/glitch/util/api'; @injectIntl export default class EmbedModal extends ImmutablePureComponent { @@ -23,7 +23,7 @@ export default class EmbedModal extends ImmutablePureComponent { this.setState({ loading: true }); - axios.post('/api/web/embed', { url }).then(res => { + api().post('/api/web/embed', { url }).then(res => { this.setState({ loading: false, oembed: res.data }); const iframeDocument = this.iframe.contentWindow.document; diff --git a/app/javascript/flavours/glitch/locales/en.js b/app/javascript/flavours/glitch/locales/en.js index de6af0990..fb3763ced 100644 --- a/app/javascript/flavours/glitch/locales/en.js +++ b/app/javascript/flavours/glitch/locales/en.js @@ -34,6 +34,8 @@ const messages = { 'status.collapse': 'Collapse', 'status.uncollapse': 'Uncollapse', + 'media_gallery.sensitive': 'Sensitive', + 'favourite_modal.combo': 'You can press {combo} to skip this next time', 'home.column_settings.show_direct': 'Show DMs', diff --git a/app/javascript/flavours/glitch/reducers/compose.js b/app/javascript/flavours/glitch/reducers/compose.js index f341977b7..ae1276685 100644 --- a/app/javascript/flavours/glitch/reducers/compose.js +++ b/app/javascript/flavours/glitch/reducers/compose.js @@ -134,7 +134,7 @@ function continueThread (state, status) { 'advanced_options', map => map.merge(new ImmutableMap({ do_not_federate: /👁\ufe0f?\u200b?(?:<\/p>)?$/.test(status.content) })) ); - map.set('privacy', privacyPreference(status.visibility, state.get('default_privacy'))); + map.set('privacy', status.visibility); map.set('sensitive', false); map.update('media_attachments', list => list.clear()); map.set('idempotencyKey', uuid()); diff --git a/app/javascript/flavours/glitch/reducers/push_notifications.js b/app/javascript/flavours/glitch/reducers/push_notifications.js index 4eba2a5e8..1b47ca962 100644 --- a/app/javascript/flavours/glitch/reducers/push_notifications.js +++ b/app/javascript/flavours/glitch/reducers/push_notifications.js @@ -44,7 +44,7 @@ export default function push_subscriptions(state = initialState, action) { case CLEAR_SUBSCRIPTION: return initialState; case SET_ALERTS: - return state.setIn(action.key, action.value); + return state.setIn(action.path, action.value); default: return state; } diff --git a/app/javascript/flavours/glitch/reducers/settings.js b/app/javascript/flavours/glitch/reducers/settings.js index aaf7938df..c04f262da 100644 --- a/app/javascript/flavours/glitch/reducers/settings.js +++ b/app/javascript/flavours/glitch/reducers/settings.js @@ -101,7 +101,7 @@ export default function settings(state = initialState, action) { return hydrate(state, action.state.get('settings')); case SETTING_CHANGE: return state - .setIn(action.key, action.value) + .setIn(action.path, action.value) .set('saved', false); case COLUMN_ADD: return state diff --git a/app/javascript/flavours/glitch/reducers/status_lists.js b/app/javascript/flavours/glitch/reducers/status_lists.js index 5a3d0db0c..6de81c6b1 100644 --- a/app/javascript/flavours/glitch/reducers/status_lists.js +++ b/app/javascript/flavours/glitch/reducers/status_lists.js @@ -1,6 +1,10 @@ import { + FAVOURITED_STATUSES_FETCH_REQUEST, FAVOURITED_STATUSES_FETCH_SUCCESS, + FAVOURITED_STATUSES_FETCH_FAIL, + FAVOURITED_STATUSES_EXPAND_REQUEST, FAVOURITED_STATUSES_EXPAND_SUCCESS, + FAVOURITED_STATUSES_EXPAND_FAIL, } from 'flavours/glitch/actions/favourites'; import { PINNED_STATUSES_FETCH_SUCCESS, @@ -30,6 +34,7 @@ const normalizeList = (state, listType, statuses, next) => { return state.update(listType, listMap => listMap.withMutations(map => { map.set('next', next); map.set('loaded', true); + map.set('isLoading', false); map.set('items', ImmutableList(statuses.map(item => item.id))); })); }; @@ -37,6 +42,7 @@ const normalizeList = (state, listType, statuses, next) => { const appendToList = (state, listType, statuses, next) => { return state.update(listType, listMap => listMap.withMutations(map => { map.set('next', next); + map.set('isLoading', false); map.set('items', map.get('items').concat(statuses.map(item => item.id))); })); }; @@ -55,6 +61,12 @@ const removeOneFromList = (state, listType, status) => { export default function statusLists(state = initialState, action) { switch(action.type) { + case FAVOURITED_STATUSES_FETCH_REQUEST: + case FAVOURITED_STATUSES_EXPAND_REQUEST: + return state.setIn(['favourites', 'isLoading'], true); + case FAVOURITED_STATUSES_FETCH_FAIL: + case FAVOURITED_STATUSES_EXPAND_FAIL: + return state.setIn(['favourites', 'isLoading'], false); case FAVOURITED_STATUSES_FETCH_SUCCESS: return normalizeList(state, 'favourites', action.statuses, action.next); case FAVOURITED_STATUSES_EXPAND_SUCCESS: diff --git a/app/javascript/flavours/glitch/styles/admin.scss b/app/javascript/flavours/glitch/styles/admin.scss index 4e923bb98..bdfa50814 100644 --- a/app/javascript/flavours/glitch/styles/admin.scss +++ b/app/javascript/flavours/glitch/styles/admin.scss @@ -396,10 +396,12 @@ } } + &__content { + max-width: calc(100% - 90px); + } + &__title { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + word-wrap: break-word; } &__timestamp { @@ -413,7 +415,7 @@ color: $ui-primary-color; font-family: 'mastodon-font-monospace', monospace; font-size: 12px; - white-space: nowrap; + word-wrap: break-word; min-height: 20px; } diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index c07d4162e..ca6fd9e99 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -1881,6 +1881,11 @@ cursor: default; } +.getting-started__wrapper, +.getting_started { + background: $ui-base-color; +} + .getting-started__wrapper { position: relative; overflow-y: auto; @@ -2487,17 +2492,29 @@ font-weight: 500; } -.spoiler-button { - display: none; - left: 4px; +.sensitive-info { + display: flex; + flex-direction: row; + align-items: center; position: absolute; - text-shadow: 0 1px 1px $base-shadow-color, 1px 0 1px $base-shadow-color; top: 4px; + left: 4px; z-index: 100; +} - &.spoiler-button--visible { - display: block; - } +.sensitive-marker { + margin: 0 3px; + border-radius: 2px; + padding: 2px 6px; + color: rgba($primary-text-color, 0.8); + background: rgba($base-overlay-background, 0.5); + font-size: 12px; + line-height: 15px; + text-transform: uppercase; + opacity: .9; + transition: opacity .1s ease; + + .media-gallery:hover & { opacity: 1 } } .modal-container--preloader { diff --git a/app/javascript/flavours/glitch/util/api.js b/app/javascript/flavours/glitch/util/api.js index ecc703c0a..0be08d7fd 100644 --- a/app/javascript/flavours/glitch/util/api.js +++ b/app/javascript/flavours/glitch/util/api.js @@ -1,4 +1,5 @@ import axios from 'axios'; +import ready from './ready'; import LinkHeader from './link_header'; export const getLinks = response => { @@ -11,10 +12,17 @@ export const getLinks = response => { return LinkHeader.parse(value); }; +let csrfHeader = {}; +function setCSRFHeader() { + const csrfToken = document.querySelector('meta[name=csrf-token]').content; + csrfHeader['X-CSRF-Token'] = csrfToken; +} +ready(setCSRFHeader); + export default getState => axios.create({ - headers: { + headers: Object.assign(csrfHeader, getState ? { 'Authorization': `Bearer ${getState().getIn(['meta', 'access_token'], '')}`, - }, + } : {}), transformResponse: [function (data) { try { |