Add elements count to antennas page
This commit is contained in:
parent
f99dde6df1
commit
d23ecd1dff
3 changed files with 30 additions and 4 deletions
|
@ -12,6 +12,7 @@ import { createSelector } from 'reselect';
|
||||||
import { fetchAntennas } from 'mastodon/actions/antennas';
|
import { fetchAntennas } from 'mastodon/actions/antennas';
|
||||||
import Column from 'mastodon/components/column';
|
import Column from 'mastodon/components/column';
|
||||||
import ColumnHeader from 'mastodon/components/column_header';
|
import ColumnHeader from 'mastodon/components/column_header';
|
||||||
|
import { Icon } from 'mastodon/components/icon';
|
||||||
import { LoadingIndicator } from 'mastodon/components/loading_indicator';
|
import { LoadingIndicator } from 'mastodon/components/loading_indicator';
|
||||||
import ScrollableList from 'mastodon/components/scrollable_list';
|
import ScrollableList from 'mastodon/components/scrollable_list';
|
||||||
import ColumnLink from 'mastodon/features/ui/components/column_link';
|
import ColumnLink from 'mastodon/features/ui/components/column_link';
|
||||||
|
@ -75,9 +76,16 @@ class Antennas extends ImmutablePureComponent {
|
||||||
prepend={<ColumnSubheading text={intl.formatMessage(messages.subheading)} />}
|
prepend={<ColumnSubheading text={intl.formatMessage(messages.subheading)} />}
|
||||||
bindToDocument={!multiColumn}
|
bindToDocument={!multiColumn}
|
||||||
>
|
>
|
||||||
{antennas.map(antenna =>
|
{antennas.map(antenna => (
|
||||||
<ColumnLink key={antenna.get('id')} to={`/antennasw/${antenna.get('id')}`} icon='wifi' text={antenna.get('title')} />,
|
<ColumnLink key={antenna.get('id')} to={`/antennasw/${antenna.get('id')}`} icon='wifi' text={antenna.get('title')}>
|
||||||
)}
|
<p className='antenna-list-detail'>
|
||||||
|
<span className='group'><Icon id='users' />{antenna.get('accounts_count')}</span>
|
||||||
|
<span className='group'><Icon id='sitemap' />{antenna.get('domains_count')}</span>
|
||||||
|
<span className='group'><Icon id='hashtag' />{antenna.get('tags_count')}</span>
|
||||||
|
<span className='group'><Icon id='paragraph' />{antenna.get('keywords_count')}</span>
|
||||||
|
</p>
|
||||||
|
</ColumnLink>
|
||||||
|
))}
|
||||||
</ScrollableList>
|
</ScrollableList>
|
||||||
|
|
||||||
<Helmet>
|
<Helmet>
|
||||||
|
|
|
@ -5,10 +5,11 @@ import { NavLink } from 'react-router-dom';
|
||||||
|
|
||||||
import { Icon } from 'mastodon/components/icon';
|
import { Icon } from 'mastodon/components/icon';
|
||||||
|
|
||||||
const ColumnLink = ({ icon, text, to, href, method, badge, transparent, ...other }) => {
|
const ColumnLink = ({ icon, text, to, href, method, badge, transparent, children, ...other }) => {
|
||||||
const className = classNames('column-link', { 'column-link--transparent': transparent });
|
const className = classNames('column-link', { 'column-link--transparent': transparent });
|
||||||
const badgeElement = typeof badge !== 'undefined' ? <span className='column-link__badge'>{badge}</span> : null;
|
const badgeElement = typeof badge !== 'undefined' ? <span className='column-link__badge'>{badge}</span> : null;
|
||||||
const iconElement = typeof icon === 'string' ? <Icon id={icon} fixedWidth className='column-link__icon' /> : icon;
|
const iconElement = typeof icon === 'string' ? <Icon id={icon} fixedWidth className='column-link__icon' /> : icon;
|
||||||
|
const childElement = typeof children !== 'undefined' ? <p>{children}</p> : null;
|
||||||
|
|
||||||
if (href) {
|
if (href) {
|
||||||
return (
|
return (
|
||||||
|
@ -24,6 +25,7 @@ const ColumnLink = ({ icon, text, to, href, method, badge, transparent, ...other
|
||||||
{iconElement}
|
{iconElement}
|
||||||
<span>{text}</span>
|
<span>{text}</span>
|
||||||
{badgeElement}
|
{badgeElement}
|
||||||
|
{childElement}
|
||||||
</NavLink>
|
</NavLink>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -37,6 +39,7 @@ ColumnLink.propTypes = {
|
||||||
method: PropTypes.string,
|
method: PropTypes.string,
|
||||||
badge: PropTypes.node,
|
badge: PropTypes.node,
|
||||||
transparent: PropTypes.bool,
|
transparent: PropTypes.bool,
|
||||||
|
children: PropTypes.any,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default ColumnLink;
|
export default ColumnLink;
|
||||||
|
|
|
@ -7364,6 +7364,21 @@ noscript {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.antenna-list-detail {
|
||||||
|
font-size: 12px;
|
||||||
|
margin-left: 24px;
|
||||||
|
|
||||||
|
.group {
|
||||||
|
margin-right: 16px;
|
||||||
|
|
||||||
|
i.fa {
|
||||||
|
color: $light-text-color;
|
||||||
|
margin-right: 4px;
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.antenna-setting {
|
.antenna-setting {
|
||||||
margin: 8px 16px;
|
margin: 8px 16px;
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue