diff --git a/app/soapbox/components/ui/column/column.tsx b/app/soapbox/components/ui/column/column.tsx
index 8813b107b..8d7c2da39 100644
--- a/app/soapbox/components/ui/column/column.tsx
+++ b/app/soapbox/components/ui/column/column.tsx
@@ -51,6 +51,8 @@ export interface IColumn {
withHeader?: boolean
/** Extra class name for top
element. */
className?: string
+ /** Extra class name for the element. */
+ bodyClassName?: string
/** Ref forwarded to column. */
ref?: React.Ref
/** Children to display in the column. */
@@ -63,7 +65,7 @@ export interface IColumn {
/** A backdrop for the main section of the UI. */
const Column: React.FC = React.forwardRef((props, ref: React.ForwardedRef): JSX.Element => {
- const { backHref, children, label, transparent = false, withHeader = true, className, action, size } = props;
+ const { backHref, children, label, transparent = false, withHeader = true, className, bodyClassName, action, size } = props;
const soapboxConfig = useSoapboxConfig();
const [isScrolled, setIsScrolled] = useState(false);
@@ -109,7 +111,7 @@ const Column: React.FC = React.forwardRef((props, ref: React.ForwardedR
/>
)}
-
+
{children}
diff --git a/app/soapbox/features/hashtag-timeline/index.tsx b/app/soapbox/features/hashtag-timeline/index.tsx
index 960b699df..e448bef8a 100644
--- a/app/soapbox/features/hashtag-timeline/index.tsx
+++ b/app/soapbox/features/hashtag-timeline/index.tsx
@@ -1,10 +1,11 @@
import React, { useEffect, useRef } from 'react';
-import { useIntl, defineMessages } from 'react-intl';
+import { useIntl, defineMessages, FormattedMessage } from 'react-intl';
import { connectHashtagStream } from 'soapbox/actions/streaming';
import { fetchHashtag, followHashtag, unfollowHashtag } from 'soapbox/actions/tags';
import { expandHashtagTimeline, clearTimeline } from 'soapbox/actions/timelines';
-import { Column } from 'soapbox/components/ui';
+import List, { ListItem } from 'soapbox/components/list';
+import { Column, Toggle } from 'soapbox/components/ui';
import Timeline from 'soapbox/features/ui/components/timeline';
import { useAppDispatch, useAppSelector, useFeatures } from 'soapbox/hooks';
@@ -19,8 +20,6 @@ const messages = defineMessages({
any: { id: 'hashtag.column_header.tag_mode.any', defaultMessage: 'or {additional}' },
all: { id: 'hashtag.column_header.tag_mode.all', defaultMessage: 'and {additional}' },
none: { id: 'hashtag.column_header.tag_mode.none', defaultMessage: 'without {additional}' },
- followHashtag: { id: 'hashtag.follow', defaultMessage: 'Follow hashtag' },
- unfollowHashtag: { id: 'hashtag.unfollow', defaultMessage: 'Unfollow hashtag' },
empty: { id: 'empty_column.hashtag', defaultMessage: 'There is nothing in this hashtag yet.' },
});
@@ -119,7 +118,19 @@ export const HashtagTimeline: React.FC = ({ params }) => {
}, [id]);
return (
-
+
+ {features.followHashtags && (
+
+ }
+ >
+
+
+
+ )}