diff --git a/app/soapbox/__fixtures__/pleroma-status-vertical-video-without-metadata.json b/app/soapbox/__fixtures__/pleroma-status-vertical-video-without-metadata.json
new file mode 100644
index 000000000..edb24b9ef
--- /dev/null
+++ b/app/soapbox/__fixtures__/pleroma-status-vertical-video-without-metadata.json
@@ -0,0 +1,108 @@
+{
+ "account": {
+ "acct": "alex",
+ "avatar": "https://freespeechextremist.com/images/avi.png",
+ "avatar_static": "https://freespeechextremist.com/images/avi.png",
+ "bot": false,
+ "created_at": "2022-02-28T01:55:05.000Z",
+ "display_name": "Alex Gleason",
+ "emojis": [],
+ "fields": [],
+ "followers_count": 1,
+ "following_count": 0,
+ "header": "https://freespeechextremist.com/images/banner.png",
+ "header_static": "https://freespeechextremist.com/images/banner.png",
+ "id": "AGv8wCadU7DqWgMqNk",
+ "locked": false,
+ "note": "I'm testing out compatibility with an older Pleroma version",
+ "pleroma": {
+ "accepts_chat_messages": true,
+ "ap_id": "https://freespeechextremist.com/users/alex",
+ "background_image": null,
+ "confirmation_pending": false,
+ "favicon": null,
+ "hide_favorites": true,
+ "hide_followers": false,
+ "hide_followers_count": false,
+ "hide_follows": false,
+ "hide_follows_count": false,
+ "is_admin": false,
+ "is_moderator": false,
+ "relationship": {},
+ "skip_thread_containment": false,
+ "tags": []
+ },
+ "source": {
+ "fields": [],
+ "note": "I'm testing out compatibility with an older Pleroma version",
+ "pleroma": {
+ "actor_type": "Person",
+ "discoverable": true
+ },
+ "sensitive": false
+ },
+ "statuses_count": 1,
+ "url": "https://freespeechextremist.com/users/alex",
+ "username": "alex"
+ },
+ "application": {
+ "name": "Web",
+ "website": null
+ },
+ "bookmarked": false,
+ "card": null,
+ "content": "
0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm",
+ "created_at": "2022-04-14T19:42:48.000Z",
+ "emojis": [],
+ "favourited": false,
+ "favourites_count": 0,
+ "id": "AIRxLeIzncpCtsr2hs",
+ "in_reply_to_account_id": null,
+ "in_reply_to_id": null,
+ "language": null,
+ "media_attachments": [
+ {
+ "description": "0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm",
+ "id": "1142674091",
+ "pleroma": {
+ "mime_type": "video/webm"
+ },
+ "preview_url": "https://freespeechextremist.com/media/3e34b808-1c84-4ef3-ba56-67cc86b7911a/0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm?name=0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm",
+ "remote_url": "https://freespeechextremist.com/media/3e34b808-1c84-4ef3-ba56-67cc86b7911a/0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm?name=0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm",
+ "text_url": "https://freespeechextremist.com/media/3e34b808-1c84-4ef3-ba56-67cc86b7911a/0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm?name=0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm",
+ "type": "video",
+ "url": "https://freespeechextremist.com/media/3e34b808-1c84-4ef3-ba56-67cc86b7911a/0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm?name=0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm"
+ }
+ ],
+ "mentions": [],
+ "muted": false,
+ "pinned": false,
+ "pleroma": {
+ "content": {
+ "text/plain": "0f66e92f339705ccc03079b8f647048e15730adf2cc9eaa1071c7c7cf6884b1b.webm"
+ },
+ "conversation_id": 97191096,
+ "direct_conversation_id": null,
+ "emoji_reactions": [],
+ "expires_at": null,
+ "in_reply_to_account_acct": null,
+ "local": true,
+ "parent_visible": false,
+ "spoiler_text": {
+ "text/plain": ""
+ },
+ "thread_muted": false
+ },
+ "poll": null,
+ "reblog": null,
+ "reblogged": false,
+ "reblogs_count": 0,
+ "replies_count": 0,
+ "sensitive": false,
+ "spoiler_text": "",
+ "tags": [],
+ "text": null,
+ "uri": "https://freespeechextremist.com/objects/419b2cad-656a-4dbc-b2b5-94bb75e0afc8",
+ "url": "https://freespeechextremist.com/notice/AIRxLeIzncpCtsr2hs",
+ "visibility": "public"
+}
diff --git a/app/soapbox/features/developers/developers_menu.js b/app/soapbox/features/developers/developers_menu.js
index 832c0bd60..f4ab7f8ca 100644
--- a/app/soapbox/features/developers/developers_menu.js
+++ b/app/soapbox/features/developers/developers_menu.js
@@ -47,6 +47,14 @@ const Developers = () => {
+
+
+
+
+
+
+
+
diff --git a/app/soapbox/features/test_timeline/index.tsx b/app/soapbox/features/test_timeline/index.tsx
new file mode 100644
index 000000000..ace235b8f
--- /dev/null
+++ b/app/soapbox/features/test_timeline/index.tsx
@@ -0,0 +1,53 @@
+import React from 'react';
+import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
+import { useDispatch } from 'react-redux';
+
+import { importFetchedStatuses } from 'soapbox/actions/importer';
+import { expandTimelineSuccess } from 'soapbox/actions/timelines';
+import SubNavigation from 'soapbox/components/sub_navigation';
+
+import { Column } from '../../components/ui';
+import StatusListContainer from '../ui/containers/status_list_container';
+
+const messages = defineMessages({
+ title: { id: 'column.test', defaultMessage: 'Test timeline' },
+});
+
+/**
+ * List of mock statuses to display in the timeline.
+ * These get embedded into the build, but only in this chunk, so it's okay.
+ */
+const MOCK_STATUSES: any[] = [
+ require('soapbox/__fixtures__/pleroma-status-with-poll.json'),
+ require('soapbox/__fixtures__/pleroma-status-vertical-video-without-metadata.json'),
+ require('soapbox/__fixtures__/pleroma-status-with-poll-with-emojis.json'),
+ require('soapbox/__fixtures__/pleroma-quote-of-quote-post.json'),
+ require('soapbox/__fixtures__/truthsocial-status-with-external-video.json'),
+];
+
+const timelineId = 'test';
+const onlyMedia = false;
+
+const TestTimeline: React.FC = () => {
+ const intl = useIntl();
+ const dispatch = useDispatch();
+
+ React.useEffect(() => {
+ dispatch(importFetchedStatuses(MOCK_STATUSES));
+ dispatch(expandTimelineSuccess(timelineId, MOCK_STATUSES, null, false, false, false));
+ }, []);
+
+ return (
+
+
+ }
+ divideType='space'
+ />
+
+ );
+};
+
+export default TestTimeline;
diff --git a/app/soapbox/features/ui/index.js b/app/soapbox/features/ui/index.js
index bc50ca114..6fdae02b8 100644
--- a/app/soapbox/features/ui/index.js
+++ b/app/soapbox/features/ui/index.js
@@ -120,6 +120,7 @@ import {
Developers,
CreateApp,
SettingsStore,
+ TestTimeline,
} from './util/async-components';
import { WrappedRoute } from './util/react_router_helpers';
@@ -341,6 +342,7 @@ class SwitchingColumnsArea extends React.PureComponent {
+
diff --git a/app/soapbox/features/ui/util/async-components.js b/app/soapbox/features/ui/util/async-components.js
index 15ed6cadf..9f031adbc 100644
--- a/app/soapbox/features/ui/util/async-components.js
+++ b/app/soapbox/features/ui/util/async-components.js
@@ -482,6 +482,10 @@ export function SettingsStore() {
return import(/* webpackChunkName: "features/developers" */'../../developers/settings_store');
}
+export function TestTimeline() {
+ return import(/* webpackChunkName: "features/test_timeline" */'../../test_timeline');
+}
+
export function DatePicker() {
return import(/* webpackChunkName: "date_picker" */'../../birthdays/date_picker');
}