11import React from 'react'
2- import { useSelector } from 'react-redux'
32import { Grid , Typography } from '@material-ui/core'
4- import * as DashboardSelectors from 'redux/dashboard/selectors'
53import GradientBox from 'components/generic/GradientBox'
64import { Alerts } from '../../../../../../components/messaging/alerts'
75import TimeLineBlock from '../Blocks/TimeLineBlock'
86
97const makeBoxStyles = ( ) => ( {
10-
11-
128 backgroundColor : '#f7fafc' ,
139 border : `2px solid #e2e8f0` ,
1410 borderRadius : '6px' ,
15- height : '100%'
11+ height : '100%' ,
1612
1713 //TODO: blurr the bottom
1814
1915 // backgroundColor: '#f8f8f8',
20-
2116} )
2217
2318const makeTimelineStyles = ( ) => ( {
24-
25-
26-
2719 backgroundColor : '#f7fafc' ,
2820 border : `2px solid #e2e8f0` ,
2921 borderRadius : '6px' ,
3022 height : '100%' ,
3123
3224 overflow : 'auto' ,
3325
34-
35-
3626 // backgroundColor: '#f8f8f8',
37-
3827} )
3928
4029export default ( { alerts = [ ] } ) => {
41-
4230 return (
4331 < >
44- < Grid
45- direction = "column"
46- alignItems = "stretch"
47- item
48- xs = { 8 }
49- style = { { marginLeft : '20px' , marginRight : '20px' } }
50- >
51- < GradientBox
52- style = { makeBoxStyles ( ) }
53- color = "theme_white"
54- p = { 3 }
32+ { alerts && alerts . length > 0 && (
33+ < Grid
34+ direction = "column"
35+ alignItems = "stretch"
36+ item
37+ xs = { 8 }
38+ style = { { marginLeft : '20px' , marginRight : '20px' } }
5539 >
56- < Typography variant = "button" gutterBottom >
57- Announcements
58- </ Typography >
59- < hr className = "tw-h-px tw-bg-gray-500 tw-border-0 tw-dark:bg-gray-900" > </ hr >
60- < Alerts alerts = { alerts } />
61- </ GradientBox >
62-
63- </ Grid >
64- < Grid
65- item
66- xs = { 4 } >
40+ < GradientBox
41+ style = { makeBoxStyles ( ) }
42+ color = "theme_white"
43+ p = { 3 }
44+ >
45+ < Typography variant = "button" gutterBottom >
46+ Announcements
47+ </ Typography >
48+ < hr className = "tw-h-px tw-bg-gray-500 tw-border-0 tw-dark:bg-gray-900" > </ hr >
49+ < Alerts alerts = { alerts } />
50+ </ GradientBox >
51+ </ Grid >
52+ ) }
53+ < Grid item xs = { alerts && alerts . length > 0 ? 4 : 12 } >
6754 < GradientBox
6855 style = { makeTimelineStyles ( ) }
6956 color = "theme_white"
@@ -75,7 +62,7 @@ export default ({ alerts = [] }) => {
7562 < hr className = "tw-h-px tw-bg-gray-500 tw-border-0 tw-dark:bg-gray-900" > </ hr >
7663 < TimeLineBlock />
7764 </ GradientBox >
78- </ Grid >
65+ </ Grid >
7966 </ >
8067 )
8168}
0 commit comments