Update blankslate for Group Timeline

environments/review-group-comp-s3yeyp/deployments/2859
Chewbacca 2023-03-13 13:23:40 -04:00
rodzic 8a36561ec8
commit 08f97a133e
1 zmienionych plików z 26 dodań i 5 usunięć

Wyświetl plik

@ -5,9 +5,9 @@ import { Link } from 'react-router-dom';
import { groupCompose } from 'soapbox/actions/compose';
import { connectGroupStream } from 'soapbox/actions/streaming';
import { expandGroupTimeline } from 'soapbox/actions/timelines';
import { Avatar, HStack, Stack } from 'soapbox/components/ui';
import { Avatar, HStack, Icon, Stack, Text } from 'soapbox/components/ui';
import ComposeForm from 'soapbox/features/compose/components/compose-form';
import { useAppDispatch, useAppSelector, useOwnAccount } from 'soapbox/hooks';
import { useAppDispatch, useGroup, useOwnAccount } from 'soapbox/hooks';
import Timeline from '../ui/components/timeline';
@ -23,7 +23,9 @@ const GroupTimeline: React.FC<IGroupTimeline> = (props) => {
const groupId = props.params.id;
const relationship = useAppSelector((state) => state.group_relationships.get(groupId));
const { group } = useGroup(groupId);
const canComposeGroupStatus = !!account && group?.relationship?.member;
const handleLoadMore = (maxId: string) => {
dispatch(expandGroupTimeline(groupId, { maxId }));
@ -41,9 +43,13 @@ const GroupTimeline: React.FC<IGroupTimeline> = (props) => {
};
}, [groupId]);
if (!group) {
return null;
}
return (
<Stack space={2}>
{!!account && relationship?.member && (
{canComposeGroupStatus && (
<div className='border-b border-solid border-gray-200 px-2 py-4 dark:border-gray-800'>
<HStack alignItems='start' space={4}>
<Link to={`/@${account.acct}`}>
@ -59,11 +65,26 @@ const GroupTimeline: React.FC<IGroupTimeline> = (props) => {
</HStack>
</div>
)}
<Timeline
scrollKey='group_timeline'
timelineId={`group:${groupId}`}
onLoadMore={handleLoadMore}
emptyMessage={<FormattedMessage id='empty_column.group' defaultMessage='There are no posts in this group yet.' />}
emptyMessage={
<Stack space={4} className='py-6' justifyContent='center' alignItems='center'>
<div className='rounded-full bg-gray-200 p-4'>
<Icon
src={require('@tabler/icons/message-2.svg')}
className='h-6 w-6 text-gray-600'
/>
</div>
<Text theme='muted'>
<FormattedMessage id='empty_column.group' defaultMessage='There are no posts in this group yet.' />
</Text>
</Stack>
}
emptyMessageCard={false}
divideType='border'
showGroup={false}
/>