@@ -2,6 +2,20 @@ import CloseIcon from "@mui/icons-material/Close";
22import { useHistory , useLocation } from "react-router-dom" ;
33import FabMenu from "../../components/FabMenu" ;
44import contributorsByYear from "./contributorsByYear" ;
5+ import testers from "./testers" ;
6+
7+ function titlecase ( value ) {
8+ const words = value . split ( " " ) ;
9+ return words . map ( w => w [ 0 ] . toUpperCase ( ) + w . slice ( 1 ) ) . join ( " " ) ;
10+ }
11+
12+ const descs = {
13+ 2021 : "the initial 761 project team" ,
14+ 2022 : "the first year with WDCC" ,
15+ 2023 : "the backend overhaul" ,
16+ 2024 : "the year of multiplayer" ,
17+ 2025 : "the state, authoring and ui overhaul" ,
18+ }
519
620const AboutUsPage = ( ) => {
721 const history = useHistory ( ) ;
@@ -31,14 +45,17 @@ const AboutUsPage = () => {
3145 < span > Simulator</ span >
3246 </ div >
3347 </ div >
34- < div className = "w-1/2 flex flex-col items-start px-12 overflow-y-auto pt-[12vh ]" >
48+ < div className = "w-1/2 flex flex-col items-start px-12 overflow-y-auto pt-[28vh] pb-[16vh ]" >
3549 { contributorsByYear . map ( ( group , idx ) => (
3650 < div
3751 key = { group . year }
38- className = { ` mb-12 ${ idx === 0 ? "mt-[16vh]" : "" } ${ idx === contributorsByYear . length - 1 ? "pb-[15vh]" : "" } ` }
52+ className = " mb-12"
3953 >
4054 < div className = "text-2xl mb-4 text-base-content font-normal font-ibm" >
4155 { group . year }
56+ < span className = "text-s text-primary ml-s" >
57+ { descs [ group . year ] ?? "" }
58+ </ span >
4259 </ div >
4360 < div className = "grid grid-cols-1 gap-2" >
4461 { group . members . map ( ( contributor ) => (
@@ -47,16 +64,36 @@ const AboutUsPage = () => {
4764 className = "flex flex-row items-center justify-center"
4865 >
4966 < span className = "text-sm text-right font-ibm text-primary font-normal mr-6 min-w-[240px]" >
50- { getContributionText ( contributor . contributions ) }
67+ { getContributionText ( contributor . roles ) }
5168 </ span >
52- < span className = "text-m text-left text-base-content font-bold font-ibm min-w-[220px]" >
69+ < a href = { contributor . profile } className = "text-m text-left text-base-content font-bold font-ibm min-w-[220px]" >
5370 { contributor . name }
54- </ span >
71+ </ a >
5572 </ div >
5673 ) ) }
5774 </ div >
5875 </ div >
5976 ) ) }
77+ < div className = "mb-12" >
78+ < div className = "text-2xl mb-4 text-base-content font-normal font-ibm" >
79+ Testers
80+ </ div >
81+ < div className = "grid grid-cols-1 gap-2" >
82+ { testers . map ( ( tester ) => (
83+ < div
84+ key = { tester . name }
85+ className = "flex flex-row items-center justify-center"
86+ >
87+ < span className = "text-sm text-right font-ibm text-primary font-normal mr-6 min-w-[240px]" >
88+ Solo Testing
89+ </ span >
90+ < span className = "text-m text-left text-base-content font-bold font-ibm min-w-[220px]" >
91+ { tester . name }
92+ </ span >
93+ </ div >
94+ ) ) }
95+ </ div >
96+ </ div >
6097 </ div >
6198
6299 < FabMenu />
@@ -67,29 +104,7 @@ const AboutUsPage = () => {
67104function getContributionText ( contributions ) {
68105 if ( ! contributions || ! Array . isArray ( contributions ) ) return "" ;
69106
70- if (
71- contributions . includes ( "code" ) &&
72- contributions . includes ( "projectManagement" )
73- ) {
74- return "Technical Lead" ;
75- }
76-
77- return contributions
78- . map ( ( contribution ) => {
79- switch ( contribution ) {
80- case "code" :
81- return "Software Engineer" ;
82- case "projectManagement" :
83- return "Project Manager" ;
84- case "design" :
85- return "Design Lead" ;
86- case "infra" :
87- return "Infrastructure" ;
88- default :
89- return contribution ;
90- }
91- } )
92- . join ( "/" ) ;
107+ return contributions . map ( titlecase ) . join ( " / " ) ;
93108}
94109
95110export default AboutUsPage ;
0 commit comments