Show last four weeks of card scans chart by default

This commit is contained in:
Tanner Collin 2020-11-22 05:56:06 +00:00
parent 5458e4d408
commit 6a6fa7d504

View File

@ -13,6 +13,7 @@ export function Charts(props) {
const [memberCount, setMemberCount] = useState(memberCountCache); const [memberCount, setMemberCount] = useState(memberCountCache);
const [signupCount, setSignupCount] = useState(signupCountCache); const [signupCount, setSignupCount] = useState(signupCountCache);
const [spaceActivity, setSpaceActivity] = useState(spaceActivityCache); const [spaceActivity, setSpaceActivity] = useState(spaceActivityCache);
const [fullActivity, setFullActivity] = useState(false);
useEffect(() => { useEffect(() => {
requester('/charts/membercount/', 'GET') requester('/charts/membercount/', 'GET')
@ -194,12 +195,19 @@ export function Charts(props) {
<Header size='medium'>Space Activity</Header> <Header size='medium'>Space Activity</Header>
<p>Daily since March 7th, 2020, updates hourly.</p> {fullActivity ?
<p>Daily since March 7th, 2020, updates hourly.</p>
:
<p>
Last four weeks, updates hourly.
{' '}<Button size='tiny' onClick={() => setFullActivity(true)} >View All</Button>
</p>
}
<p> <p>
{spaceActivity && {spaceActivity &&
<ResponsiveContainer width='100%' height={300}> <ResponsiveContainer width='100%' height={300}>
<BarChart data={spaceActivity}> <BarChart data={fullActivity ? spaceActivity : spaceActivity.slice(-28)}>
<XAxis dataKey='date' minTickGap={10} /> <XAxis dataKey='date' minTickGap={10} />
<YAxis /> <YAxis />
<CartesianGrid strokeDasharray='3 3'/> <CartesianGrid strokeDasharray='3 3'/>
@ -212,7 +220,7 @@ export function Charts(props) {
name='Card Scans' name='Card Scans'
fill='#8884d8' fill='#8884d8'
maxBarSize={20} maxBarSize={20}
animationDuration={1000} isAnimationActive={false}
/> />
</BarChart> </BarChart>
</ResponsiveContainer> </ResponsiveContainer>