Merge branch 'events' into 'develop'
Improve event information display See merge request soapbox-pub/soapbox!2645
This commit is contained in:
commit
eafb6d318a
1 changed files with 39 additions and 15 deletions
|
@ -59,6 +59,44 @@ const EventInformation: React.FC<IEventInformation> = ({ params }) => {
|
|||
const renderEventLocation = useCallback(() => {
|
||||
const event = status!.event!;
|
||||
|
||||
if (!event.location) return null;
|
||||
|
||||
const text = [
|
||||
<React.Fragment key='event-name'>
|
||||
{event.location.get('name')}
|
||||
</React.Fragment>,
|
||||
];
|
||||
|
||||
if (event.location.get('street')?.trim()) {
|
||||
text.push (
|
||||
<React.Fragment key='event-street'>
|
||||
<br />{event.location.get('street')}
|
||||
</React.Fragment>,
|
||||
);
|
||||
}
|
||||
|
||||
const address = [event.location.get('postalCode'), event.location.get('locality'), event.location.get('country')].filter(text => text).join(', ');
|
||||
|
||||
if (address) {
|
||||
text.push(
|
||||
<React.Fragment key='event-address'>
|
||||
<br />
|
||||
{address}
|
||||
</React.Fragment>,
|
||||
);
|
||||
}
|
||||
|
||||
if (tileServer && event.location.get('latitude')) {
|
||||
text.push(
|
||||
<React.Fragment key='event-map'>
|
||||
<br />
|
||||
<a href='#' className='text-primary-600 hover:underline dark:text-accent-blue' onClick={handleShowMap}>
|
||||
<FormattedMessage id='event.show_on_map' defaultMessage='Show on map' />
|
||||
</a>
|
||||
</React.Fragment>,
|
||||
);
|
||||
}
|
||||
|
||||
return event.location && (
|
||||
<Stack space={1}>
|
||||
<Text size='xl' weight='bold'>
|
||||
|
@ -66,21 +104,7 @@ const EventInformation: React.FC<IEventInformation> = ({ params }) => {
|
|||
</Text>
|
||||
<HStack space={2} alignItems='center'>
|
||||
<Icon src={require('@tabler/icons/map-pin.svg')} />
|
||||
<Text>
|
||||
{event.location.get('name')}
|
||||
<br />
|
||||
{!!event.location.get('street')?.trim() && (<>
|
||||
{event.location.get('street')}
|
||||
<br />
|
||||
</>)}
|
||||
{[event.location.get('postalCode'), event.location.get('locality'), event.location.get('country')].filter(text => text).join(', ')}
|
||||
{tileServer && event.location.get('latitude') && (<>
|
||||
<br />
|
||||
<a href='#' className='text-primary-600 hover:underline dark:text-accent-blue' onClick={handleShowMap}>
|
||||
<FormattedMessage id='event.show_on_map' defaultMessage='Show on map' />
|
||||
</a>
|
||||
</>)}
|
||||
</Text>
|
||||
<Text>{text}</Text>
|
||||
</HStack>
|
||||
</Stack>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue