Skip to content

Commit 5004b08

Browse files
snigdha-kansalsnigdha-kansal
authored
chore: update dependencies (#753)
1 parent 67ad98e commit 5004b08

File tree

97 files changed

+1983
-2986
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

97 files changed

+1983
-2986
lines changed

‎.eslintrc.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ module.exports = {
3030
'eol-last': ['error', 'always'],
3131
'react/prop-types': 'off',
3232
'react/no-unknown-property': 'off',
33+
'react/react-in-jsx-scope': 'off',
3334

3435
// many of these rules are taken from our friends at Creative Labs;
3536
// see their config here: https://github.com/UCLA-Creative-Labs/sunshine/blob/master/.eslintrc.js
@@ -87,7 +88,7 @@ module.exports = {
8788
'quote-props': ['error', 'consistent-as-needed'],
8889

8990
// No multiple empty lines
90-
'no-multiple-empty-lines': ['error'],
91+
'no-multiple-empty-lines': ['error', { max: 1 }],
9192

9293
// Max line lengths
9394
'max-len': [

‎__tests__/components/Footer.test.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { render } from '@testing-library/react';
22
import { axe, toHaveNoViolations } from 'jest-axe';
3-
import React from 'react';
4-
import { act } from 'react-dom/test-utils';
3+
4+
import { act } from 'react';
55
import Footer from '../../components/Footer';
66

77
expect.extend(toHaveNoViolations);

‎__tests__/components/NewsArticle.test.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { render } from '@testing-library/react';
22
import { axe, toHaveNoViolations } from 'jest-axe';
3-
import React from 'react';
4-
import { act } from 'react-dom/test-utils';
3+
4+
import { act } from 'react';
55
import NewsArticle from '../../components/NewsArticle';
66
import data from '../../data';
77

‎components/ActiveLink.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import Link from 'next/link';
22
import { useRouter } from 'next/router';
3-
import React, { Children } from 'react';
3+
import { Children, cloneElement } from 'react';
44

55
const ActiveLink = ({ children, activeClassName, ...props }) => {
66
const { asPath } = useRouter();
@@ -14,9 +14,9 @@ const ActiveLink = ({ children, activeClassName, ...props }) => {
1414
: childClassName;
1515

1616
return (
17-
//clones child with className if className exists
17+
//clones child with className if className exists
1818
(<Link {...props} legacyBehavior>
19-
{React.cloneElement(child, {
19+
{cloneElement(child, {
2020
className: className || null,
2121
})}
2222
</Link>)

‎components/Banner.js‎

Lines changed: 78 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import { useState, useEffect } from 'react';
22

33
// this can get refactored into something better
44
const mapUpToSum = (num, fn) => {
@@ -30,18 +30,16 @@ const generateCols = (n, m, classPattern = [''], randomize = false) => {
3030
));
3131
};
3232

33-
export default class Banner extends React.Component {
34-
constructor(props) {
35-
super(props);
36-
this.timer = null;
37-
this.color = 0;
38-
this.state = { randomize: false };
39-
}
33+
const Banner = (props) => {
34+
const [randomize, setRandomize] = useState(false);
35+
const [color, setColor] = useState(0);
36+
let timer;
37+
38+
useEffect(() => {
39+
setRandomize(true);
4040

41-
componentDidMount() {
42-
this.setState({ randomize: true });
4341
const committees = ['acm'];
44-
if (!this.props.decorative)
42+
if (!props.decorative) {
4543
committees.push(
4644
'studio',
4745
'icpc',
@@ -52,78 +50,78 @@ export default class Banner extends React.Component {
5250
'ai',
5351
'hack',
5452
);
53+
}
54+
5555
const el = document.querySelector('.banner');
56-
this.timer = setInterval(() => {
57-
el.classList.remove(committees[this.color]);
58-
this.color = (this.color + 1) % committees.length;
59-
el.classList.add(committees[this.color]);
60-
this.forceUpdate();
56+
timer = setInterval(() => {
57+
el.classList.remove(committees[color]);
58+
setColor((prevColor) => (prevColor + 1) % committees.length);
59+
el.classList.add(committees[color]);
6160
}, 4000);
62-
}
6361

64-
componentWillUnmount() {
65-
clearInterval(this.timer);
66-
this.timer = null;
67-
}
62+
return () => {
63+
clearInterval(timer); // Cleanup on unmount
64+
};
65+
}, [color, props.decorative]); // Re-run when color or decorative props change
6866

69-
render() {
70-
const decorative = this.props.decorative || false;
67+
const decorative = props.decorative || false;
68+
const sideCols = props.sideCols || (decorative ? 12 : 7);
69+
const height = props.height || (decorative ? 2 : 7);
70+
const width = props.width || 5;
7171

72-
const sideCols = this.props.sideCols || (decorative ? 12 : 7);
73-
const height = this.props.height || (decorative ? 2 : 7);
74-
const width = this.props.width || 5;
75-
return (
76-
<div className={`banner ${decorative ? 'decorative' : ''}`}>
77-
<div className="square-col-container">
78-
{!decorative &&
79-
generateCols(1, height, [
80-
'',
81-
'',
82-
'',
83-
'',
84-
'white',
85-
'white',
86-
'white',
87-
])}
88-
{!decorative &&
89-
generateCols(1, height, ['', '', '', '', '', 'white', 'white'])}
90-
{generateCols(1, height, ['', '', '', '', '', '', 'white'])}
91-
{generateCols(sideCols, height, undefined, this.state.randomize)}
92-
{!decorative &&
93-
generateCols(1, height, ['', '', 'white', 'white', '', '', ''])}
94-
{!decorative &&
95-
generateCols(width, height, [
96-
'',
97-
'',
98-
'white',
99-
'white',
100-
'white',
101-
'',
102-
'',
103-
])}
104-
{!decorative &&
105-
generateCols(1, height, ['', '', '', 'white', 'white', '', ''])}
106-
{generateCols(sideCols, height, undefined, this.state.randomize)}
107-
{generateCols(1, height, ['white', '', '', '', '', '', ''])}
108-
{!decorative &&
109-
generateCols(1, height, ['white', 'white', '', '', '', '', ''])}
110-
{!decorative &&
111-
generateCols(1, height, [
112-
'white',
113-
'white',
114-
'white',
115-
'',
116-
'',
117-
'',
118-
'',
119-
])}
120-
</div>
121-
{!decorative && (
122-
<div className="title">
123-
<h1>code the future.</h1>
124-
</div>
125-
)}
72+
return (
73+
<div className={`banner ${decorative ? 'decorative' : ''}`}>
74+
<div className="square-col-container">
75+
{!decorative &&
76+
generateCols(1, height, [
77+
'',
78+
'',
79+
'',
80+
'',
81+
'white',
82+
'white',
83+
'white',
84+
])}
85+
{!decorative &&
86+
generateCols(1, height, ['', '', '', '', '', 'white', 'white'])}
87+
{generateCols(1, height, ['', '', '', '', '', '', 'white'])}
88+
{generateCols(sideCols, height, undefined, randomize)}
89+
{!decorative &&
90+
generateCols(1, height, ['', '', 'white', 'white', '', '', ''])}
91+
{!decorative &&
92+
generateCols(width, height, [
93+
'',
94+
'',
95+
'white',
96+
'white',
97+
'white',
98+
'',
99+
'',
100+
])}
101+
{!decorative &&
102+
generateCols(1, height, ['', '', '', 'white', 'white', '', ''])}
103+
{generateCols(sideCols, height, undefined, randomize)}
104+
{generateCols(1, height, ['white', '', '', '', '', '', ''])}
105+
{!decorative &&
106+
generateCols(1, height, ['white', 'white', '', '', '', '', ''])}
107+
{!decorative &&
108+
generateCols(1, height, [
109+
'white',
110+
'white',
111+
'white',
112+
'',
113+
'',
114+
'',
115+
'',
116+
])}
126117
</div>
127-
);
128-
}
129-
}
118+
{!decorative && (
119+
<div className="title">
120+
<h1>code the future.</h1>
121+
</div>
122+
)}
123+
</div>
124+
);
125+
};
126+
127+
export default Banner;

‎components/Carousel.js‎

Lines changed: 40 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
11
import Image from 'next/legacy/image';
2-
import React from 'react';
2+
import { useState, useEffect } from 'react';
33

44
// width of each img in px
55
// needs to be updated if style.scss changes
66
const IMAGE_WIDTH = 360;
77
const ITEMS_PER_SECTION = 4;
88

9-
export default class Carousel extends React.Component {
10-
constructor(props) {
11-
super(props);
9+
const Carousel = ({ images }) => {
10+
const [sections, setSections] = useState([]);
11+
const sectionWidth = (IMAGE_WIDTH * ITEMS_PER_SECTION) / 2;
1212

13-
const numItems = this.props.images.length;
14-
const sections = [];
15-
this.sectionWidth = (IMAGE_WIDTH * ITEMS_PER_SECTION) / 2;
13+
useEffect(() => {
14+
const numItems = images.length;
15+
const sectionsData = [];
1616

1717
for (let i = 0; i < numItems; i += ITEMS_PER_SECTION) {
18-
sections.push({
19-
left: (i / ITEMS_PER_SECTION) * this.sectionWidth,
20-
width: this.sectionWidth,
21-
items: this.props.images.slice(i, i + 4).map((item, i) => (
18+
sectionsData.push({
19+
left: (i / ITEMS_PER_SECTION) * sectionWidth,
20+
width: sectionWidth,
21+
items: images.slice(i, i + ITEMS_PER_SECTION).map((item, index) => (
2222
<a
2323
href={item}
2424
target="_blank"
2525
rel="noreferrer noopener"
26-
key={i}
26+
key={index}
2727
tabIndex="-1"
2828
>
2929
<Image src={item} width={IMAGE_WIDTH} height={IMAGE_WIDTH} alt="" />
@@ -32,49 +32,41 @@ export default class Carousel extends React.Component {
3232
});
3333
}
3434

35-
this.timer = null;
36-
this.state = {
37-
sections,
38-
};
39-
}
35+
setSections(sectionsData);
4036

41-
componentDidMount() {
42-
this.timer = setInterval(() => {
43-
this.setState({
44-
sections: this.state.sections.map((section) => {
37+
const timer = setInterval(() => {
38+
setSections((prevSections) => {
39+
return prevSections.map((section) => {
4540
section.left -= 1;
46-
if (section.left < -this.sectionWidth) {
41+
if (section.left < -sectionWidth) {
4742
section.left =
48-
(this.state.sections.length - 1) * this.sectionWidth - 1;
43+
(prevSections.length - 1) * sectionWidth - 1;
4944
}
5045
return section;
51-
}),
46+
});
5247
});
5348
}, 30);
54-
}
5549

56-
componentWillUnmount() {
57-
clearInterval(this.timer);
58-
this.timer = null;
59-
}
50+
return () => clearInterval(timer);
51+
}, [images]);
6052

61-
render() {
62-
return (
63-
<div id="carousel">
64-
<div id="carousel-inner">
65-
{this.state.sections.map((section, i) => {
66-
const carouselStyle = {
67-
left: section.left + 'px',
68-
width: section.width + 'px',
69-
};
70-
return (
71-
<div className="carousel-sect" style={carouselStyle} key={i}>
72-
{section.items}
73-
</div>
74-
);
75-
})}
76-
</div>
53+
return (
54+
<div id="carousel">
55+
<div id="carousel-inner">
56+
{sections.map((section, i) => {
57+
const carouselStyle = {
58+
left: section.left + 'px',
59+
width: section.width + 'px',
60+
};
61+
return (
62+
<div className="carousel-sect" style={carouselStyle} key={i}>
63+
{section.items}
64+
</div>
65+
);
66+
})}
7767
</div>
78-
);
79-
}
80-
}
68+
</div>
69+
);
70+
};
71+
72+
export default Carousel;

‎components/CommitteeSpread.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
// import Image from 'next/image';
2-
import React from 'react';
3-
42
function Committee(props) {
53
return (
64
<a

‎components/Committees/ArchiveSidebar.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
// import Image from 'next/image';
2-
import React, { useEffect, useState } from 'react';
2+
import { useEffect, useState } from 'react';
33

44
function SidebarLink(props) {
55
return (

‎components/Committees/CommitteeEventCard.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import Image from 'next/legacy/image';
2-
import React from 'react';
32

43
function CommitteeEventCard(props) {
54
const hasImage = props.image.src;

‎components/Committees/CommitteeSection.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
// import Image from 'next/image';
2-
import React from 'react';
2+
33
import CommitteeEventCard from './CommitteeEventCard';
44
import Intro from './CommitteeSectionIntro';
55

0 commit comments

Comments
 (0)