Merge branch 'fedi-explanation-nostr' into 'main'

PublicTimeline: hide fediverse explanation on Nostr

See merge request soapbox-pub/soapbox!3018
This commit is contained in:
Alex Gleason 2024-05-11 21:00:55 +00:00
commit 315d570645
1 changed files with 34 additions and 31 deletions

View File

@ -7,7 +7,7 @@ import { expandPublicTimeline } from 'soapbox/actions/timelines';
import { usePublicStream } from 'soapbox/api/hooks'; import { usePublicStream } from 'soapbox/api/hooks';
import PullToRefresh from 'soapbox/components/pull-to-refresh'; import PullToRefresh from 'soapbox/components/pull-to-refresh';
import { Accordion, Column } from 'soapbox/components/ui'; import { Accordion, Column } from 'soapbox/components/ui';
import { useAppSelector, useAppDispatch, useInstance, useSettings, useTheme } from 'soapbox/hooks'; import { useAppSelector, useAppDispatch, useInstance, useSettings, useTheme, useFeatures } from 'soapbox/hooks';
import PinnedHostsPicker from '../remote-timeline/components/pinned-hosts-picker'; import PinnedHostsPicker from '../remote-timeline/components/pinned-hosts-picker';
import Timeline from '../ui/components/timeline'; import Timeline from '../ui/components/timeline';
@ -17,9 +17,10 @@ const messages = defineMessages({
dismiss: { id: 'fediverse_tab.explanation_box.dismiss', defaultMessage: 'Don\'t show again' }, dismiss: { id: 'fediverse_tab.explanation_box.dismiss', defaultMessage: 'Don\'t show again' },
}); });
const CommunityTimeline = () => { const PublicTimeline = () => {
const intl = useIntl(); const intl = useIntl();
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const features = useFeatures();
const theme = useTheme(); const theme = useTheme();
const instance = useInstance(); const instance = useInstance();
@ -30,7 +31,7 @@ const CommunityTimeline = () => {
const timelineId = 'public'; const timelineId = 'public';
const explanationBoxExpanded = settings.explanationBox; const explanationBoxExpanded = settings.explanationBox;
const showExplanationBox = settings.showExplanationBox; const showExplanationBox = settings.showExplanationBox && !features.nostr;
const dismissExplanationBox = () => { const dismissExplanationBox = () => {
dispatch(changeSetting(['showExplanationBox'], false)); dispatch(changeSetting(['showExplanationBox'], false));
@ -58,33 +59,35 @@ const CommunityTimeline = () => {
<Column className='-mt-3 sm:mt-0' label={intl.formatMessage(messages.title)} transparent> <Column className='-mt-3 sm:mt-0' label={intl.formatMessage(messages.title)} transparent>
<PinnedHostsPicker /> <PinnedHostsPicker />
{showExplanationBox && <div className='mb-4 black:mx-4'> {showExplanationBox && (
<Accordion <div className='mb-4 black:mx-4'>
headline={<FormattedMessage id='fediverse_tab.explanation_box.title' defaultMessage='What is the Fediverse?' />} <Accordion
action={dismissExplanationBox} headline={<FormattedMessage id='fediverse_tab.explanation_box.title' defaultMessage='What is the Fediverse?' />}
actionIcon={require('@tabler/icons/outline/x.svg')} action={dismissExplanationBox}
actionLabel={intl.formatMessage(messages.dismiss)} actionIcon={require('@tabler/icons/outline/x.svg')}
expanded={explanationBoxExpanded} actionLabel={intl.formatMessage(messages.dismiss)}
onToggle={toggleExplanationBox} expanded={explanationBoxExpanded}
> onToggle={toggleExplanationBox}
<FormattedMessage >
id='fediverse_tab.explanation_box.explanation' <FormattedMessage
defaultMessage={'{site_title} is part of the Fediverse, a social network made up of thousands of independent social media sites (aka "servers"). The posts you see here are from 3rd-party servers. You have the freedom to engage with them, or to block any server you don\'t like. Pay attention to the full username after the second @ symbol to know which server a post is from. To see only {site_title} posts, visit {local}.'} id='fediverse_tab.explanation_box.explanation'
values={{ defaultMessage={'{site_title} is part of the Fediverse, a social network made up of thousands of independent social media sites (aka "servers"). The posts you see here are from 3rd-party servers. You have the freedom to engage with them, or to block any server you don\'t like. Pay attention to the full username after the second @ symbol to know which server a post is from. To see only {site_title} posts, visit {local}.'}
site_title: instance.title, values={{
local: ( site_title: instance.title,
<Link to='/timeline/local'> local: (
<FormattedMessage <Link to='/timeline/local'>
id='empty_column.home.local_tab' <FormattedMessage
defaultMessage='the {site_title} tab' id='empty_column.home.local_tab'
values={{ site_title: instance.title }} defaultMessage='the {site_title} tab'
/> values={{ site_title: instance.title }}
</Link> />
), </Link>
}} ),
/> }}
</Accordion> />
</div>} </Accordion>
</div>
)}
<PullToRefresh onRefresh={handleRefresh}> <PullToRefresh onRefresh={handleRefresh}>
<Timeline <Timeline
className='black:p-4 black:sm:p-5' className='black:p-4 black:sm:p-5'
@ -100,4 +103,4 @@ const CommunityTimeline = () => {
); );
}; };
export default CommunityTimeline; export default PublicTimeline;