tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Glitch] Prevent logged out users from accessing collection & list creation routes

Browse Source 
Port e00d16474e51111f0a89c81ae976d08a2082d6ec to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
diondiondion 2026-06-04 14:08:26 +02:00 committed by Claire
parent e2d0e4517d
commit 45a21db621
8 changed files with 92 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/flavours/glitch/features/account_featured/index.tsx
View File

@ -29,7 +29,7 @@ import { useAppDispatch, useAppSelector } from '@/flavours/glitch/store';
import AddIcon from '@/material-icons/400-24px/add.svg?react';
import { CollectionListItem } from '../collections/components/collection_list_item';
import { useCollectionsCreatedBy } from '../collections/overview/created_by_you';
import { useCollectionsCreatedBy } from '../collections/overview/created_by_account';
import { EmptyMessage } from './components/empty_message';
import { Subheading, SubheadingLink } from './components/subheading';

2
app/javascript/flavours/glitch/features/collection_adder/index.tsx
View File

@ -15,7 +15,7 @@ import { IconButton } from 'flavours/glitch/components/icon_button';
import { useAppDispatch, useAppSelector } from 'flavours/glitch/store';
import { MAX_COLLECTION_ACCOUNT_COUNT } from '../collections/editor/accounts';
import { useCollectionsCreatedBy } from '../collections/overview/created_by_you';
import { useCollectionsCreatedBy } from '../collections/overview/created_by_account';
import { CollectionToggle } from './collection_toggle';

19
app/javascript/flavours/glitch/features/collections/editor/index.tsx
View File

@ -13,20 +13,21 @@ import {
import { Helmet } from '@unhead/react/helmet';
import { Callout } from '@/flavours/glitch/components/callout';
import { useCurrentAccountId } from '@/flavours/glitch/hooks/useAccountId';
import { initialState } from '@/flavours/glitch/initial_state';
import ListAltIcon from '@/material-icons/400-24px/list_alt.svg?react';
import { Callout } from 'flavours/glitch/components/callout';
import { Column } from 'flavours/glitch/components/column';
import { ColumnHeader } from 'flavours/glitch/components/column_header';
import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
import { NotSignedInIndicator } from 'flavours/glitch/components/not_signed_in_indicator';
import { useIdentity } from 'flavours/glitch/identity_context';
import { initialState } from 'flavours/glitch/initial_state';
import {
collectionEditorActions,
fetchCollection,
} from 'flavours/glitch/reducers/slices/collections';
import { useAppDispatch, useAppSelector } from 'flavours/glitch/store';
import { useCollectionsCreatedBy } from '../overview/created_by_you';
import { useCollectionsCreatedBy } from '../overview/created_by_account';
import { CollectionAccounts } from './accounts';
import { CollectionDetails } from './details';
@ -75,7 +76,7 @@ export const CollectionEditorPage: React.FC<{
}> = ({ multiColumn }) => {
const intl = useIntl();
const dispatch = useAppDispatch();
const accountId = useCurrentAccountId();
const { accountId, signedIn } = useIdentity();
const { id = null } = useParams<{ id?: string }>();
const { path } = useRouteMatch();
const collection = useAppSelector((state) =>
@ -94,13 +95,13 @@ export const CollectionEditorPage: React.FC<{
(!isEditMode && collectionListStatus === 'loading');
const canCreateMoreCollections =
isEditMode || collectionList.length < userCollectionLimit;
signedIn && (isEditMode || collectionList.length < userCollectionLimit);
useEffect(() => {
if (id) {
if (id && signedIn) {
void dispatch(fetchCollection({ collectionId: id }));
}
}, [dispatch, id]);
}, [dispatch, id, signedIn]);
useEffect(() => {
if (id !== editorStateId) {
@ -129,6 +130,8 @@ export const CollectionEditorPage: React.FC<{
<div className='scrollable'>
{isLoading ? (
<LoadingIndicator />
) : !signedIn ? (
<NotSignedInIndicator />
) : canCreateMoreCollections ? (
<Switch>
<Route

6
app/javascript/flavours/glitch/features/collections/index.tsx
View File

@ -4,18 +4,18 @@ import { Route, Switch, useRouteMatch } from 'react-router-dom';
import { Helmet } from '@unhead/react/helmet';
import { TabLink, TabList } from '@/flavours/glitch/components/tab_list';
import { Column } from 'flavours/glitch/components/column';
import { ColumnHeader } from 'flavours/glitch/components/column_header';
import { DisplayNameSimple } from 'flavours/glitch/components/display_name/simple';
import { Scrollable } from 'flavours/glitch/components/scrollable_list/components';
import { TabLink, TabList } from 'flavours/glitch/components/tab_list';
import { useAccount } from 'flavours/glitch/hooks/useAccount';
import {
useAccountId,
useCurrentAccountId,
} from 'flavours/glitch/hooks/useAccountId';
import { CollectionsCreatedByYou } from './overview/created_by_you';
import { CollectionsCreatedByAccount } from './overview/created_by_account';
import { CollectionsFeaturingYou } from './overview/featuring_you';
import classes from './styles.module.scss';
@ -92,7 +92,7 @@ export const Collections: React.FC<{
</TabList>
</header>
<Switch>
<Route exact path={path} component={CollectionsCreatedByYou} />
<Route exact path={path} component={CollectionsCreatedByAccount} />
<Route
exact
path={`${path}/featuring-you`}

59
app/javascript/flavours/glitch/features/collections/overview/created_by_you.tsx → app/javascript/flavours/glitch/features/collections/overview/created_by_account.tsx
View File

@ -5,10 +5,12 @@ import { FormattedMessage } from 'react-intl';
import { Link } from 'react-router-dom';
import AddIcon from '@/material-icons/400-24px/add.svg?react';
import { DisplayName } from 'flavours/glitch/components/display_name';
import { EmptyState } from 'flavours/glitch/components/empty_state';
import { Icon } from 'flavours/glitch/components/icon';
import { LoadingIndicator } from 'flavours/glitch/components/loading_indicator';
import { ItemList } from 'flavours/glitch/components/scrollable_list/components';
import { useAccount } from 'flavours/glitch/hooks/useAccount';
import {
useAccountId,
useCurrentAccountId,
@ -61,9 +63,10 @@ export function useCollectionsCreatedBy(accountId: string | null | undefined) {
);
}
export const CollectionsCreatedByYou: React.FC = () => {
export const CollectionsCreatedByAccount: React.FC = () => {
const me = useCurrentAccountId();
const accountId = useAccountId();
const account = useAccount(accountId);
const { collections, status } = useCollectionsCreatedBy(accountId);
@ -81,24 +84,40 @@ export const CollectionsCreatedByYou: React.FC = () => {
}
if (collections.length === 0) {
return (
<EmptyState
title={
<FormattedMessage
id='empty_column.account_featured_self.showcase_accounts'
defaultMessage='Showcase your favorite accounts'
/>
}
message={
<FormattedMessage
id='empty_column.account_featured_self.showcase_accounts_desc'
defaultMessage='Collections are curated lists of accounts to help others discover more of the Fediverse.'
/>
}
>
<CreateButton />
</EmptyState>
);
if (isOwnCollectionPage) {
return (
<EmptyState
title={
<FormattedMessage
id='empty_column.account_featured_self.showcase_accounts'
defaultMessage='Showcase your favorite accounts'
/>
}
message={
<FormattedMessage
id='empty_column.account_featured_self.showcase_accounts_desc'
defaultMessage='Collections are curated lists of accounts to help others discover more of the Fediverse.'
/>
}
>
<CreateButton />
</EmptyState>
);
} else {
return (
<EmptyState
title={
<FormattedMessage
id='empty_column.collections'
defaultMessage='{acct} has not created any collections yet.'
values={{
acct: <DisplayName variant='simple' account={account} />,
}}
/>
}
/>
);
}
}
return (
@ -116,7 +135,7 @@ export const CollectionsCreatedByYou: React.FC = () => {
{showCreateButton && <CreateButton />}
</div>
<ItemList>
{!canCreateMoreCollections && (
{isOwnCollectionPage && !canCreateMoreCollections && (
<MaxCollectionsCallout className={classes.maxCollectionsError} />
)}
{collections.map((item, index) => (

2
app/javascript/flavours/glitch/features/collections/overview/featuring_you.tsx
View File

@ -16,7 +16,7 @@ import { useAppSelector, useAppDispatch } from 'flavours/glitch/store';
import { CollectionListItem } from '../components/collection_list_item';
import classes from '../styles.module.scss';
import { CollectionListError } from './created_by_you';
import { CollectionListError } from './created_by_account';
function useCollectionsFeaturing(accountId: string | null | undefined) {
const dispatch = useAppDispatch();

37
app/javascript/flavours/glitch/features/lists/index.tsx
View File

@ -6,6 +6,8 @@ import { Link } from 'react-router-dom';
import { Helmet } from '@unhead/react/helmet';
import { NotSignedInIndicator } from '@/flavours/glitch/components/not_signed_in_indicator';
import { useIdentity } from '@/flavours/glitch/identity_context';
import AddIcon from '@/material-icons/400-24px/add.svg?react';
import ListAltIcon from '@/material-icons/400-24px/list_alt.svg?react';
import MoreHorizIcon from '@/material-icons/400-24px/more_horiz.svg?react';
@ -78,10 +80,13 @@ const Lists: React.FC<{
const dispatch = useAppDispatch();
const intl = useIntl();
const lists = useAppSelector((state) => getOrderedLists(state));
const { signedIn } = useIdentity();
useEffect(() => {
void dispatch(fetchLists());
}, [dispatch]);
if (signedIn) {
void dispatch(fetchLists());
}
}, [signedIn, dispatch]);
const emptyMessage = (
<>
@ -112,14 +117,16 @@ const Lists: React.FC<{
iconComponent={ListAltIcon}
multiColumn={multiColumn}
extraButton={
<Link
to='/lists/new'
className='column-header__button'
title={intl.formatMessage(messages.create)}
aria-label={intl.formatMessage(messages.create)}
>
<Icon id='plus' icon={AddIcon} />
</Link>
signedIn && (
<Link
to='/lists/new'
className='column-header__button'
title={intl.formatMessage(messages.create)}
aria-label={intl.formatMessage(messages.create)}
>
<Icon id='plus' icon={AddIcon} />
</Link>
)
}
/>
@ -128,9 +135,13 @@ const Lists: React.FC<{
emptyMessage={emptyMessage}
bindToDocument={!multiColumn}
>
{lists.map((list) => (
<ListItem key={list.id} id={list.id} title={list.title} />
))}
{signedIn ? (
lists.map((list) => (
<ListItem key={list.id} id={list.id} title={list.title} />
))
) : (
<NotSignedInIndicator />
)}
</ScrollableList>
<Helmet>

15
app/javascript/flavours/glitch/features/lists/new.tsx
View File

@ -8,6 +8,8 @@ import { isFulfilled } from '@reduxjs/toolkit';
import { Helmet } from '@unhead/react/helmet';
import { NotSignedInIndicator } from '@/flavours/glitch/components/not_signed_in_indicator';
import { useIdentity } from '@/flavours/glitch/identity_context';
import ChevronRightIcon from '@/material-icons/400-24px/chevron_right.svg?react';
import ListAltIcon from '@/material-icons/400-24px/list_alt.svg?react';
import { fetchList } from 'flavours/glitch/actions/lists';
@ -250,16 +252,17 @@ const NewListWrapper: React.FC<{
}> = ({ multiColumn }) => {
const intl = useIntl();
const dispatch = useAppDispatch();
const { signedIn } = useIdentity();
const { id } = useParams<{ id?: string }>();
const list = useAppSelector((state) =>
id ? state.lists.get(id) : undefined,
);
useEffect(() => {
if (id) {
if (signedIn && id) {
dispatch(fetchList(id));
}
}, [dispatch, id]);
}, [dispatch, signedIn, id]);
const isLoading = id && !list;
@ -277,7 +280,13 @@ const NewListWrapper: React.FC<{
/>
<div className='scrollable'>
{isLoading ? <LoadingIndicator /> : <NewList list={list} />}
{!signedIn ? (
<NotSignedInIndicator />
) : isLoading ? (
<LoadingIndicator />
) : (
<NewList list={list} />
)}
</div>
<Helmet>