diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb
index fb4283da3..7bb14aa4c 100644
--- a/app/controllers/application_controller.rb
+++ b/app/controllers/application_controller.rb
@@ -126,6 +126,7 @@ class ApplicationController < ActionController::Base
def respond_with_error(code)
respond_to do |format|
format.any { head code }
+
format.html do
set_locale
render "errors/#{code}", layout: 'error', status: code
diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index 0b23e51f8..9fa8cc008 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -9,6 +9,7 @@ import DisplayName from './display_name';
import StatusContent from './status_content';
import StatusActionBar from './status_action_bar';
import AttachmentList from './attachment_list';
+import Card from '../features/status/components/card';
import { injectIntl, FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { MediaGallery, Video } from '../features/ui/util/async-components';
@@ -256,6 +257,14 @@ class Status extends ImmutablePureComponent {
);
}
+ } else if (status.get('spoiler_text').length === 0 && status.get('card')) {
+ media = (
+
+ );
}
if (otherAccounts) {
diff --git a/app/javascript/mastodon/features/status/components/card.js b/app/javascript/mastodon/features/status/components/card.js
index b52f3c4fa..9a87f7a3f 100644
--- a/app/javascript/mastodon/features/status/components/card.js
+++ b/app/javascript/mastodon/features/status/components/card.js
@@ -59,10 +59,12 @@ export default class Card extends React.PureComponent {
card: ImmutablePropTypes.map,
maxDescription: PropTypes.number,
onOpenMedia: PropTypes.func.isRequired,
+ compact: PropTypes.boolean,
};
static defaultProps = {
maxDescription: 50,
+ compact: false,
};
state = {
@@ -131,25 +133,25 @@ export default class Card extends React.PureComponent {
}
render () {
- const { card, maxDescription } = this.props;
- const { width, embedded } = this.state;
+ const { card, maxDescription, compact } = this.props;
+ const { width, embedded } = this.state;
if (card === null) {
return null;
}
const provider = card.get('provider_name').length === 0 ? decodeIDNA(getHostname(card.get('url'))) : card.get('provider_name');
- const horizontal = card.get('width') > card.get('height') && (card.get('width') + 100 >= width) || card.get('type') !== 'link';
- const className = classnames('status-card', { horizontal });
+ const horizontal = (!compact && card.get('width') > card.get('height') && (card.get('width') + 100 >= width)) || card.get('type') !== 'link' || embedded;
const interactive = card.get('type') !== 'link';
+ const className = classnames('status-card', { horizontal, compact, interactive });
const title = interactive ? {card.get('title')} : {card.get('title')};
- const ratio = card.get('width') / card.get('height');
+ const ratio = compact ? 16 / 9 : card.get('width') / card.get('height');
const height = card.get('width') > card.get('height') ? (width / ratio) : (width * ratio);
const description = (
{title}
- {!horizontal &&
{trim(card.get('description') || '', maxDescription)}
}
+ {!(horizontal || compact) &&
{trim(card.get('description') || '', maxDescription)}
}
{provider}
);
@@ -174,7 +176,7 @@ export default class Card extends React.PureComponent {
@@ -184,7 +186,7 @@ export default class Card extends React.PureComponent {
return (
{embed}
- {description}
+ {!compact && description}
);
} else if (card.get('image')) {
diff --git a/app/javascript/mastodon/features/status/containers/card_container.js b/app/javascript/mastodon/features/status/containers/card_container.js
index a97404de1..6170d9fd8 100644
--- a/app/javascript/mastodon/features/status/containers/card_container.js
+++ b/app/javascript/mastodon/features/status/containers/card_container.js
@@ -2,7 +2,7 @@ import { connect } from 'react-redux';
import Card from '../components/card';
const mapStateToProps = (state, { statusId }) => ({
- card: state.getIn(['cards', statusId], null),
+ card: state.getIn(['statuses', statusId, 'card'], null),
});
export default connect(mapStateToProps)(Card);
diff --git a/app/javascript/mastodon/reducers/index.js b/app/javascript/mastodon/reducers/index.js
index e98566e26..2c98af1db 100644
--- a/app/javascript/mastodon/reducers/index.js
+++ b/app/javascript/mastodon/reducers/index.js
@@ -14,7 +14,6 @@ import relationships from './relationships';
import settings from './settings';
import push_notifications from './push_notifications';
import status_lists from './status_lists';
-import cards from './cards';
import mutes from './mutes';
import reports from './reports';
import contexts from './contexts';
@@ -46,7 +45,6 @@ const reducers = {
relationships,
settings,
push_notifications,
- cards,
mutes,
reports,
contexts,
diff --git a/app/javascript/mastodon/reducers/statuses.js b/app/javascript/mastodon/reducers/statuses.js
index 6e3d830da..2c58969f3 100644
--- a/app/javascript/mastodon/reducers/statuses.js
+++ b/app/javascript/mastodon/reducers/statuses.js
@@ -10,6 +10,7 @@ import {
STATUS_REVEAL,
STATUS_HIDE,
} from '../actions/statuses';
+import { STATUS_CARD_FETCH_SUCCESS } from '../actions/cards';
import { TIMELINE_DELETE } from '../actions/timelines';
import { STATUS_IMPORT, STATUSES_IMPORT } from '../actions/importer';
import { Map as ImmutableMap, fromJS } from 'immutable';
@@ -65,6 +66,8 @@ export default function statuses(state = initialState, action) {
});
case TIMELINE_DELETE:
return deleteStatus(state, action.id, action.references);
+ case STATUS_CARD_FETCH_SUCCESS:
+ return state.setIn([action.id, 'card'], fromJS(action.card));
default:
return state;
}
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index f77dc405c..419f85c36 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -2560,6 +2560,9 @@ a.status-card {
display: block;
margin-top: 5px;
font-size: 13px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
}
.status-card__image {
@@ -2584,6 +2587,31 @@ a.status-card {
}
}
+.status-card.compact {
+ border-color: lighten($ui-base-color, 4%);
+
+ &.interactive {
+ border: 0;
+ }
+
+ .status-card__content {
+ padding: 8px;
+ padding-top: 10px;
+ }
+
+ .status-card__title {
+ white-space: nowrap;
+ }
+
+ .status-card__image {
+ flex: 0 0 60px;
+ }
+}
+
+a.status-card.compact:hover {
+ background-color: lighten($ui-base-color, 4%);
+}
+
.status-card__image-image {
border-radius: 4px 0 0 4px;
display: block;
diff --git a/app/models/status.rb b/app/models/status.rb
index bcb7dd373..cb2c01040 100644
--- a/app/models/status.rb
+++ b/app/models/status.rb
@@ -89,6 +89,7 @@ class Status < ApplicationRecord
:conversation,
:status_stat,
:tags,
+ :preview_cards,
:stream_entry,
active_mentions: :account,
reblog: [
@@ -96,6 +97,7 @@ class Status < ApplicationRecord
:application,
:stream_entry,
:tags,
+ :preview_cards,
:media_attachments,
:conversation,
:status_stat,
@@ -163,6 +165,10 @@ class Status < ApplicationRecord
reblog
end
+ def preview_card
+ preview_cards.first
+ end
+
def title
if destroyed?
"#{account.acct} deleted status"
diff --git a/app/serializers/rest/status_serializer.rb b/app/serializers/rest/status_serializer.rb
index 1f2f46b7e..bfc2d78b4 100644
--- a/app/serializers/rest/status_serializer.rb
+++ b/app/serializers/rest/status_serializer.rb
@@ -20,6 +20,8 @@ class REST::StatusSerializer < ActiveModel::Serializer
has_many :tags
has_many :emojis, serializer: REST::CustomEmojiSerializer
+ has_one :preview_card, key: :card, serializer: REST::PreviewCardSerializer
+
def id
object.id.to_s
end
diff --git a/app/services/fetch_link_card_service.rb b/app/services/fetch_link_card_service.rb
index 4551aa7e0..462e5ee13 100644
--- a/app/services/fetch_link_card_service.rb
+++ b/app/services/fetch_link_card_service.rb
@@ -63,6 +63,7 @@ class FetchLinkCardService < BaseService
def attach_card
@status.preview_cards << @card
+ Rails.cache.delete(@status)
end
def parse_urls