@@ -5,10 +5,11 @@ import 'reveal.js/dist/reset.css'
5
5
import 'reveal.js/dist/reveal.css'
6
6
import 'reveal.js/dist/theme/white.css'
7
7
import './index.css'
8
- import { IntroEvalsSummary } from "../../API/Types" ;
8
+ import { Batch , IntroEvalsSummary } from "../../API/Types" ;
9
9
import { getJSON , toastError } from "../../API/API" ;
10
- import { Container } from "reactstrap" ;
10
+ import { Col , Container , Row } from "reactstrap" ;
11
11
import BatchSlide from "./BatchSlide" ;
12
+ import NumberBox from "./NumberBox" ;
12
13
13
14
const IntroEvalsSlideshow = ( ) => {
14
15
@@ -20,38 +21,68 @@ const IntroEvalsSlideshow = () => {
20
21
slides . initialize ( ) ;
21
22
}
22
23
24
+ const [ removedMembers , setRemovedMembers ] = useState < string [ ] > ( [ ] ) ;
25
+
23
26
const [ frosh , setFrosh ] = useState < IntroEvalsSummary [ ] > ( [ ] ) ;
24
27
25
28
useEffect ( ( ) => {
26
29
getJSON < IntroEvalsSummary [ ] > ( "/api/evals/intro" )
27
- . then ( setFrosh ) . then ( initSlides )
30
+ . then ( setFrosh )
31
+ . then ( initSlides )
28
32
. catch ( toastError ( "Unable to fetch Intro Evals data" ) ) ;
29
33
} , [ ] )
30
34
31
- interface Batch {
32
- name : string ,
33
- names : string [ ] ,
34
- }
35
+ const [ batches , setBatches ] = useState < Batch [ ] > ( [ ] ) ;
36
+
37
+ useEffect ( ( ) => {
38
+ getJSON < Batch [ ] > ( "/api/batch" )
39
+ . then ( e => setBatches ( e . map ( b => ( {
40
+ ...b ,
41
+ members : b . members . map ( m => m . split ( "," ) [ 0 ] ) ,
42
+ } ) ) ) )
43
+ . catch ( toastError ( "Unable to fetch Batches" ) )
44
+ } , [ ] ) ;
35
45
36
- const batches : Batch [ ] = [ ] ;
46
+ const passFailBatch = ( batch : Batch ) => ( pass : boolean ) => {
47
+ setRemovedMembers ( [ ...removedMembers , ...batch . members ] )
48
+ }
37
49
38
50
return (
39
51
< div className = "reveal vh-100 vw-100" >
40
52
< div className = "slides w-100" data-transition = "slide" >
53
+ { /* placeholder, because slideshow doesn't work unless at least one slide is present from the beginning*/ }
41
54
< section data-transition = "slide" className = "vw-100" >
42
- < Container className = "d-flex flex-column vh-100 px-0 d-xl-flex w-100" >
43
- < h2 > Intro Evals Slideshow</ h2 >
44
- { /* placeholder, because slideshow doesn't work unless at least one slide is present from the beginning*/ }
45
- </ Container >
55
+ < section data-transition = "slide" className = "vw-100" >
56
+ < Container className = "d-flex flex-column vh-100 px-0 d-xl-flex w-100" >
57
+ < h2 > Intro Evals Slideshow</ h2 >
58
+ < Row className = "text-center align-self-center w-100 justify-content-center py-3" >
59
+ < Col className = "col-3" >
60
+ < NumberBox text = { `${ frosh . length } ` } subtext = "Intro Members" success = { true } />
61
+ </ Col >
62
+ < Col className = "col-3" >
63
+ < NumberBox text = { `${ batches . length } ` } subtext = "Batches" success = { true } />
64
+ </ Col >
65
+ </ Row >
66
+ </ Container >
67
+ </ section >
68
+ < section data-transition = "slide" className = "vw-100" >
69
+ < Container className = "d-flex flex-column vh-100 px-0 d-xl-flex w-100" >
70
+ < p > Hi :)</ p >
71
+ </ Container >
72
+ </ section >
46
73
</ section >
47
74
{
48
75
batches . map ( ( b , i ) =>
49
- < BatchSlide key = { i } name = { b . name } names = { b . names } onPassFail = { ( pass ) => setFrosh ( frosh . filter ( f => ! b . names . includes ( f . name ) ) ) } />
76
+ < BatchSlide
77
+ key = { i }
78
+ batch = { b }
79
+ onPassFail = { passFailBatch ( b ) }
80
+ />
50
81
)
51
82
}
52
83
53
84
{
54
- frosh . sort ( ( a , b ) => a . name . localeCompare ( b . name ) ) . map ( ( f , i ) =>
85
+ frosh . filter ( f => ! removedMembers . includes ( f . name ) ) . sort ( ( a , b ) => a . name . localeCompare ( b . name ) ) . map ( ( f , i ) =>
55
86
< Slide
56
87
key = { i }
57
88
uid = { f . uid }
0 commit comments