bigbuffet/pleroma
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Admin: refactor email list downloads into List, get rid of .dashwidget css

Browse source
This commit is contained in:
Alex Gleason 2022-12-17 14:23:52 -06:00
parent ee443158b6
commit 52bdb48bfb
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
3 changed files with 52 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/soapbox/features/admin/components/dashcounter.tsx
View file

@ -45,7 +45,7 @@ interface IDashCounters {
/** Wrapper container for dash counters. */
const DashCounters: React.FC<IDashCounters> = ({ children }) => {
return (
<div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2 mb-4 mt-8'>
<div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2'>
{children}
</div>
);

72
app/soapbox/features/admin/tabs/dashboard.tsx
View file

@ -2,6 +2,8 @@ import React from 'react';
import { FormattedMessage } from 'react-intl';
import { getSubscribersCsv, getUnsubscribersCsv, getCombinedCsv } from 'soapbox/actions/email-list';
import List, { ListItem } from 'soapbox/components/list';
import { CardTitle, IconButton, Stack } from 'soapbox/components/ui';
import { useAppDispatch, useOwnAccount, useFeatures, useInstance } from 'soapbox/hooks';
import sourceCode from 'soapbox/utils/code';
import { download } from 'soapbox/utils/download';
@ -49,7 +51,7 @@ const Dashboard: React.FC = () => {
if (!account) return null;
return (
<>
<Stack space={6} className='mt-4'>
<DashCounters>
<DashCounter
count={mau}
@ -78,26 +80,54 @@ const Dashboard: React.FC = () => {
{account.admin && <RegistrationModePicker />}
<div className='dashwidgets'>
<div className='dashwidget'>
<h4><FormattedMessage id='admin.dashwidgets.software_header' defaultMessage='Software' /></h4>
<ul>
<li>{sourceCode.displayName} <span className='pull-right'>{sourceCode.version}</span></li>
<li>{v.software + (v.build ? `+${v.build}` : '')} <span className='pull-right'>{v.version}</span></li>
</ul>
</div>
{features.emailList && account.admin && (
<div className='dashwidget'>
<h4><FormattedMessage id='admin.dashwidgets.email_list_header' defaultMessage='Email list' /></h4>
<ul>
<li><a href='#' onClick={handleSubscribersClick} target='_blank'>subscribers.csv</a></li>
<li><a href='#' onClick={handleUnsubscribersClick} target='_blank'>unsubscribers.csv</a></li>
<li><a href='#' onClick={handleCombinedClick} target='_blank'>combined.csv</a></li>
</ul>
</div>
)}
</div>
</>
<CardTitle
title={<FormattedMessage id='admin.dashwidgets.software_header' defaultMessage='Software' />}
/>
<List>
<ListItem label={<FormattedMessage id='admin.software.frontend' defaultMessage='Frontend' />}>
<span>{sourceCode.displayName} {sourceCode.version}</span>
</ListItem>
<ListItem label={<FormattedMessage id='admin.software.backend' defaultMessage='Backend' />}>
<span>{v.software + (v.build ? `+${v.build}` : '')} {v.version}</span>
</ListItem>
</List>
{(features.emailList && account.admin) && (
<>
<CardTitle
title={<FormattedMessage id='admin.dashwidgets.email_list_header' defaultMessage='Email list' />}
/>
<List>
<ListItem label='subscribers.csv'>
<IconButton
src={require('@tabler/icons/download.svg')}
onClick={handleSubscribersClick}
iconClassName='w-5 h-5'
/>
</ListItem>
<ListItem label='unsubscribers.csv'>
<IconButton
src={require('@tabler/icons/download.svg')}
onClick={handleUnsubscribersClick}
iconClassName='w-5 h-5'
/>
</ListItem>
<ListItem label='combined.csv'>
<IconButton
src={require('@tabler/icons/download.svg')}
onClick={handleCombinedClick}
iconClassName='w-5 h-5'
/>
</ListItem>
</List>
</>
)}
</Stack>
);
};

27
app/styles/components/admin.scss
View file

@ -1,30 +1,3 @@
.dashwidgets {
display: flex;
flex-wrap: wrap;
margin: 0 -5px;
padding: 0 20px 20px 20px;
}
.dashwidget {
flex: 1;
margin-bottom: 20px;
padding: 0 5px;
h4 {
text-transform: uppercase;
font-size: 13px;
font-weight: 700;
color: hsla(var(--primary-text-color_hsl), 0.6);
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px solid var(--accent-color--med);
}
a {
color: var(--brand-color);
}
}
.unapproved-account {
padding: 15px 20px;
font-size: 14px;