Skip to content

Commit e13e90b

Browse files
daniel-moon32daniel-moon32
committed
merge from main
2 parents e22f66f + f364987 commit e13e90b

Some content is hidden

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

52 files changed

+4590
-2763
lines changed

‎.eslintrc.json

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,13 @@
1919
"ecmaVersion": "latest",
2020
"sourceType": "module"
2121
},
22-
"plugins": ["import", "react", "@typescript-eslint"],
23-
22+
"plugins": ["import", "react", "@typescript-eslint", "simple-import-sort"],
2423
"rules": {
24+
"prefer-const": "error",
2525
"react/react-in-jsx-scope": "off",
2626
"react/jsx-filename-extension": [
2727
1,
28-
{ "extensions": [".js", ".jsx", "ts", "tsx"] }
28+
{ "extensions": [".js", ".jsx", ".ts", ".tsx"] }
2929
],
3030
"import/no-unresolved": "off",
3131
"import/named": "warn",
@@ -42,7 +42,11 @@
4242
"caseInsensitive": true
4343
}
4444
}
45-
]
45+
],
46+
"simple-import-sort/imports": "error",
47+
"simple-import-sort/exports": "error",
48+
"import/first": "error",
49+
"import/newline-after-import": "error"
4650
},
4751
"root": true
4852
}

‎client/README.md

Lines changed: 0 additions & 20 deletions
This file was deleted.

‎client/package.json

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,9 @@
88
"@fontsource/oxygen-mono": "^4.5.2",
99
"@reach/window-size": "^0.16.0",
1010
"@styled-icons/bootstrap": "^10.34.0",
11+
"@styled-icons/boxicons-regular": "^10.38.0",
1112
"@styled-icons/boxicons-solid": "^10.38.0",
13+
"@styled-icons/evaicons-outline": "^10.34.0",
1214
"@styled-icons/open-iconic": "^10.18.0",
1315
"@testing-library/jest-dom": "^5.16.2",
1416
"@testing-library/react": "^12.1.2",
@@ -20,20 +22,24 @@
2022
"add": "^2.0.6",
2123
"axios": "^0.25.0",
2224
"cypress": "^9.4.1",
25+
"eslint-plugin-simple-import-sort": "^7.0.0",
2326
"jest": "^27.5.1",
27+
"moment": "^2.29.3",
2428
"prettier": "^2.5.1",
2529
"reach": "^1.0.1",
2630
"react": "^17.0.2",
2731
"react-beautiful-dnd": "^13.1.0",
32+
"react-bootstrap": "^2.3.0",
2833
"react-dom": "^17.0.2",
2934
"react-fast-marquee": "^1.3.1",
3035
"react-full-screen": "^1.1.0",
3136
"react-router-dom": "^6.2.1",
3237
"react-scripts": "5.0.0",
38+
"react-select": "^5.2.2",
3339
"styled-components": "^5.3.5",
40+
"styled-icons": "^10.45.0",
3441
"typescript": "^4.5.5",
35-
"web-vitals": "^2.1.4",
36-
"yarn": "^1.22.18"
42+
"web-vitals": "^2.1.4"
3743
},
3844
"scripts": {
3945
"start": "react-scripts start",

‎client/src/.eslintrc.json

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es2021": true
5+
},
6+
"extends": [
7+
"eslint:recommended",
8+
"plugin:react/recommended",
9+
"plugin:@typescript-eslint/recommended",
10+
"plugin:import/errors",
11+
"plugin:import/warnings",
12+
"plugin:import/typescript"
13+
],
14+
"parser": "@typescript-eslint/parser",
15+
"parserOptions": {
16+
"ecmaFeatures": {
17+
"jsx": true
18+
},
19+
"ecmaVersion": "latest",
20+
"sourceType": "module"
21+
},
22+
"plugins": ["import", "react", "@typescript-eslint", "simple-import-sort"],
23+
"rules": {
24+
"prefer-const": "error",
25+
"react/react-in-jsx-scope": "off",
26+
"react/jsx-filename-extension": [
27+
1,
28+
{ "extensions": [".js", ".jsx", ".ts", ".tsx"] }
29+
],
30+
"simple-import-sort/imports": "error",
31+
"simple-import-sort/exports": "error",
32+
"import/first": "error",
33+
"import/newline-after-import": "error",
34+
"sort-imports": "off"
35+
},
36+
"root": false
37+
}

‎client/src/App.test.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import React from 'react'
21
import { render, screen } from '@testing-library/react'
2+
import React from 'react'
3+
34
import App from './App'
45

56
test('renders learn react link', () => {

‎client/src/App.tsx

Lines changed: 15 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,25 @@
1-
import { useState } from 'react'
21
import { WindowSize } from '@reach/window-size'
2+
import { BrowserRouter, Route, Routes } from 'react-router-dom'
33
import { ThemeProvider } from 'styled-components'
4-
// import { get } from './api/config'
5-
import { BrowserRouter, Routes, Route } from 'react-router-dom'
6-
import { FullScreen, useFullScreenHandle } from 'react-full-screen'
4+
5+
import PageEmbed from './components/embed/PageEmbed'
6+
import LifelineCreationForm from './components/settings/LifelineCreationForm'
77
import GlobalStyle, { theme } from './components/ui/GlobalStyle'
8-
import LanguageCustomization from './components/settings/LanguageCustomizationForm'
9-
import LifelineCreation from './pages/lifelineCreation'
10-
import EnterFullScreen from './components/buttons/EnterFullscreen'
11-
import ExitFullScreen from './components/buttons/ExitFullscreen'
128
import Home from './pages/Home'
13-
function App() {
14-
const [showFullscreenButton, setFullscreenButton] = useState(false)
15-
const handle = useFullScreenHandle()
9+
import Settings from './pages/Settings'
1610

11+
function App() {
12+
/* Sets the lifeline modules upon load and every defaultLanguage change */
1713
return (
1814
<ThemeProvider theme={theme}>
19-
<FullScreen
20-
handle={handle}
21-
onChange={() => setFullscreenButton(!showFullscreenButton)}
22-
>
23-
<BrowserRouter>
24-
<Routes>
25-
<Route path="/langForm/*" element={<LanguageCustomization />} />
26-
<Route path="/moduleForm/*" element={<LifelineCreation />} />
27-
<Route path="/settings/*" element={<LanguageCustomization />} />
28-
<Route path="/lifelines/*" element={<LifelineCreation />} />
29-
<Route path="/*" element={<Home />} />
30-
</Routes>
31-
</BrowserRouter>
32-
{showFullscreenButton ? (
33-
<EnterFullScreen handle={handle.enter} />
34-
) : (
35-
<ExitFullScreen handle={handle.exit} />
36-
)}
37-
</FullScreen>
15+
<BrowserRouter>
16+
<Routes>
17+
<Route path="/settings" element={<Settings />} />
18+
<Route path="/lifelines" element={<LifelineCreationForm />} />
19+
<Route path="/" element={<Home />} />
20+
<Route path="/embed" element={<PageEmbed />} />
21+
</Routes>
22+
</BrowserRouter>
3823
<WindowSize>
3924
{(windowSize) => <GlobalStyle windowSize={windowSize} />}
4025
</WindowSize>

‎client/src/api/config.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import axios, { AxiosResponse } from 'axios'
2+
23
import { ApiRequestUrl } from './constants'
34

4-
interface ErrorWrapper {
5+
export interface ErrorWrapper {
56
type: string
6-
error: any
7+
error: string
78
}
89

910
const instance = axios.create({

‎client/src/components/LifelineCard.tsx

Lines changed: 0 additions & 51 deletions
This file was deleted.

‎client/src/components/buttons/EnterFullscreen.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { FullscreenEnter } from '@styled-icons/open-iconic'
2+
import { FullScreenHandle } from 'react-full-screen'
23

3-
function EnterFullScreen({ handle }: { handle: any }) {
4-
return <FullscreenEnter size="2%" onClick={handle} />
4+
function EnterFullScreen({ handle }: { handle: FullScreenHandle }) {
5+
return <FullscreenEnter size="20px" onClick={handle.enter} />
56
}
67
export default EnterFullScreen

‎client/src/components/buttons/ExitFullscreen.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
1-
import styled from 'styled-components'
21
import { FullscreenExit } from '@styled-icons/open-iconic'
2+
import { FullScreenHandle } from 'react-full-screen'
3+
import styled from 'styled-components'
4+
35
const ExitButton = styled.div`
46
color: white;
57
`
68

7-
function ExitFullScreen({ handle }: { handle: any }) {
9+
function ExitFullScreen({ handle }: { handle: FullScreenHandle }) {
810
return (
911
<ExitButton>
10-
<FullscreenExit onClick={handle} size="5%" />
12+
<FullscreenExit onClick={handle.exit} size="20px" />
1113
</ExitButton>
1214
)
1315
}

‎client/src/components/buttons/MobileBar.tsx

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import { Link, useLocation } from 'react-router-dom'
2+
import styled, { css } from 'styled-components'
3+
4+
const Navbar = styled.div`
5+
@media screen and (max-width: 800px) {
6+
font-family: ${({ theme }) => theme.secondaryFonts};
7+
position: absolute;
8+
z-index: 10;
9+
top: 0;
10+
left: 0;
11+
overflow-x: hidden;
12+
padding-top: 20px;
13+
transform: ${(props) =>
14+
props.showMobileNavbar ? 'translateY(0em)' : 'translateY(-60em)'};
15+
transition: 0.6s ease;
16+
width: 100%;
17+
height: 100%;
18+
display: flex;
19+
flex-direction: column;
20+
justify-content: center;
21+
align-items: center;
22+
text-align: center;
23+
background-color: ${({ theme }) => theme.black};
24+
}
25+
`
26+
27+
const StyledLink = styled(Link)`
28+
text-decoration: none;
29+
color: white;
30+
padding-left: 200px;
31+
padding-right: 200px;
32+
font-weight: bold;
33+
transition: 0.2s ease;
34+
margin: 0.3em;
35+
font-size: 6vw;
36+
:hover {
37+
background-color: ${({ theme }) => theme.navy};
38+
}
39+
${({ selected }) =>
40+
selected &&
41+
css`
42+
background-color: ${({ theme }) => theme.navy};
43+
`}
44+
`
45+
46+
function MobileBar({ showMobileNavbar }: { showMobileNavbar: boolean }) {
47+
const location = useLocation()
48+
return (
49+
<Navbar showMobileNavbar={showMobileNavbar}>
50+
<StyledLink to="" selected={location.pathname === '/'}>
51+
Clock
52+
</StyledLink>
53+
<StyledLink to="/lifelines" selected={location.pathname === '/lifelines'}>
54+
Lifelines
55+
</StyledLink>
56+
<StyledLink to="/settings" selected={location.pathname === '/settings'}>
57+
Settings
58+
</StyledLink>
59+
</Navbar>
60+
)
61+
}
62+
63+
export default MobileBar

‎client/src/components/buttons/Toggle.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { useState } from 'react'
22
import styled from 'styled-components'
3+
34
const Toggler = styled.div`
45
.toggle-button {
56
position: relative;

‎client/src/components/buttons/button.tsx

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import styled from 'styled-components'
2+
3+
const StyledButton = styled.button`
4+
background-color: ${({ theme }) => theme.buttonBackground};
5+
border: none;
6+
cursor: pointer;
7+
text-align: center;
8+
text-decoration: none;
9+
margin: 4px 2px;
10+
display: inline-block;
11+
color: white;
12+
border-radius: 5px;
13+
font-size: 12px;
14+
font-weight: 700;
15+
padding: 10px 15px;
16+
font-family: ${({ theme }) => theme.secondaryFonts};
17+
&:hover {
18+
background-image: linear-gradient(rgba(0, 0, 0, 0.06) 0 0);
19+
}
20+
`
21+
22+
// const HideButton = styled(StyledButton)`
23+
// background: ${({ theme }) => theme.background };
24+
// border: 1px solid gray;
25+
// cursor: pointer;
26+
// text-align: center;
27+
// text-decoration: none;
28+
// margin: 4px 2px;
29+
// display: inline-block;
30+
// color: ${({ theme }) => theme.text };
31+
// border-radius: 3px;
32+
// font-size: 12px;
33+
// padding: 6.5px 20px;
34+
// font-weight: 500;
35+
// font-family: ${({ theme }) => theme.secondaryFonts };
36+
// &:hover {
37+
// background-color: #F1F1F1;
38+
// }
39+
// `;
40+
41+
const Button = ({ buttonLabel }: { buttonLabel: string }) => {
42+
return <StyledButton>{buttonLabel}</StyledButton>
43+
}
44+
export default Button

0 commit comments

Comments
 (0)