diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 2c90e65c..ef09f313 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -26,6 +26,8 @@ jobs: bun-version-file: package.json - run: bun install --frozen-lockfile - run: bun run typecheck + - run: bun run lint + - run: bun run format:check - run: bun run build - run: bunx playwright install --with-deps chromium - run: bun run test:e2e diff --git a/knip.json b/knip.json index b082accb..e7bf52bd 100644 --- a/knip.json +++ b/knip.json @@ -2,12 +2,12 @@ "$schema": "https://unpkg.com/knip@6/schema.json", "workspaces": { ".": { - "entry": ["src/index.{js,jsx,ts,tsx}"], - "project": ["src/**/*.{js,jsx,ts,tsx}"] + "entry": ["src/index.tsx"], + "project": ["src/**/*.{ts,tsx}"] }, "sanity": { - "entry": ["sanity.config.{js,ts}", "sanity.cli.{js,ts}"], - "project": ["**/*.{js,ts}"] + "entry": ["sanity.config.ts", "sanity.cli.ts"], + "project": ["**/*.ts"] } }, "treatTagHintsAsErrors": true, diff --git a/netlify.toml b/netlify.toml index a7405332..b609ab2b 100644 --- a/netlify.toml +++ b/netlify.toml @@ -1,2 +1,2 @@ [build.environment] - BUN_VERSION = "1.4.2" +BUN_VERSION = "1.4.2" diff --git a/oxlint.config.ts b/oxlint.config.ts index 3c547c94..a301aba9 100644 --- a/oxlint.config.ts +++ b/oxlint.config.ts @@ -26,6 +26,7 @@ export default defineConfig({ '.roo/**', '.windsurf/**', 'tools/oxlint/anti-slop/**', + 'sanity/**', ], jsPlugins: [ { @@ -90,7 +91,10 @@ export default defineConfig({ 'unicorn/prefer-spread': 'warn', 'react/rules-of-hooks': 'error', 'react/require-render-return': 'error', - 'react/no-multi-comp': 'error', + 'react/no-multi-comp': 'off', + 'react/jsx-key': ['error', { checkFragmentShorthand: true }], + 'import/no-unassigned-import': ['warn', { allow: ['**/*.css'] }], + 'jsx-a11y/no-noninteractive-tabindex': ['error', { tags: ['section'] }], 'react/no-unstable-nested-components': 'error', 'react/only-export-components': ['error', { allowConstantExport: true }], 'react-you-might-not-need-an-effect/no-adjust-state-on-prop-change': 'error', @@ -121,5 +125,11 @@ export default defineConfig({ 'typescript/explicit-function-return-type': 'off', }, }, + { + files: ['src/assets/**/*.tsx', 'src/pages/LandingPageV3/ChooseYourCharacter/Mascot.tsx'], + rules: { + 'eslint/max-lines-per-function': 'off', + }, + }, ], }); diff --git a/public/css/applyPage.css b/public/css/applyPage.css index 4983008f..ade1d307 100644 --- a/public/css/applyPage.css +++ b/public/css/applyPage.css @@ -15,16 +15,16 @@ } .ap_img { - background-image: url('/images/applyBackground.JPG'); - height: 100%; - width: 100%; - position: fixed; - background-color: rgba(0, 0, 0, 0.7); - background-position: center; - background-repeat: no-repeat; - background-size: cover; - z-index: -1; - filter: brightness(50%); + background-image: url('/images/applyBackground.JPG'); + height: 100%; + width: 100%; + position: fixed; + background-color: rgba(0, 0, 0, 0.7); + background-position: center; + background-repeat: no-repeat; + background-size: cover; + z-index: -1; + filter: brightness(50%); } .ap_text { diff --git a/public/css/style.css b/public/css/style.css index 1a65a958..53b20833 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -1,78 +1,97 @@ * { - transition-timing-function: ease-in-out; - -ms-transition-timing-function: ease-in-out; - -moz-transition-timing-function: ease-in-out; - -webkit-transition-timing-function: ease-in-out; - -o-transition-timing-function: ease-in-out; - transition-duration: 0.3s; - -ms-transition-duration: 0.3s; - -moz-transition-duration: 0.3s; - -webkit-transition-duration: 0.3s; - -o-transition-duration: 0.3s; + transition-timing-function: ease-in-out; + -ms-transition-timing-function: ease-in-out; + -moz-transition-timing-function: ease-in-out; + -webkit-transition-timing-function: ease-in-out; + -o-transition-timing-function: ease-in-out; + transition-duration: 0.3s; + -ms-transition-duration: 0.3s; + -moz-transition-duration: 0.3s; + -webkit-transition-duration: 0.3s; + -o-transition-duration: 0.3s; } @font-face { - font-family: "Commuters Sans 800"; - src: url("https://use.typekit.net/af/e66d72/00000000000000007735c462/30/l?subset_id=2&fvd=n8&v=3") format("woff2"), url("https://use.typekit.net/af/e66d72/00000000000000007735c462/30/d?subset_id=2&fvd=n8&v=3") format("woff"), url("https://use.typekit.net/af/e66d72/00000000000000007735c462/30/a?subset_id=2&fvd=n8&v=3") format("opentype"); - font-display: auto; - font-style: normal; - font-weight: 800; + font-family: 'Commuters Sans 800'; + src: + url('https://use.typekit.net/af/e66d72/00000000000000007735c462/30/l?subset_id=2&fvd=n8&v=3') format('woff2'), + url('https://use.typekit.net/af/e66d72/00000000000000007735c462/30/d?subset_id=2&fvd=n8&v=3') format('woff'), + url('https://use.typekit.net/af/e66d72/00000000000000007735c462/30/a?subset_id=2&fvd=n8&v=3') format('opentype'); + font-display: auto; + font-style: normal; + font-weight: 800; } @font-face { - font-family: "Commuters Sans 700"; - src: url("https://use.typekit.net/af/857ae9/00000000000000007735c460/30/l?subset_id=2&fvd=n7&v=3") format("woff2"), url("https://use.typekit.net/af/857ae9/00000000000000007735c460/30/d?subset_id=2&fvd=n7&v=3") format("woff"), url("https://use.typekit.net/af/857ae9/00000000000000007735c460/30/a?subset_id=2&fvd=n7&v=3") format("opentype"); - font-display: auto; - font-style: normal; - font-weight: 700; + font-family: 'Commuters Sans 700'; + src: + url('https://use.typekit.net/af/857ae9/00000000000000007735c460/30/l?subset_id=2&fvd=n7&v=3') format('woff2'), + url('https://use.typekit.net/af/857ae9/00000000000000007735c460/30/d?subset_id=2&fvd=n7&v=3') format('woff'), + url('https://use.typekit.net/af/857ae9/00000000000000007735c460/30/a?subset_id=2&fvd=n7&v=3') format('opentype'); + font-display: auto; + font-style: normal; + font-weight: 700; } @font-face { - font-family: "Commuters Sans 600"; - src: url("https://use.typekit.net/af/857ae9/00000000000000007735c460/30/l?subset_id=2&fvd=n7&v=3") format("woff2"), url("https://use.typekit.net/af/857ae9/00000000000000007735c460/30/d?subset_id=2&fvd=n7&v=3") format("woff"), url("https://use.typekit.net/af/857ae9/00000000000000007735c460/30/a?subset_id=2&fvd=n7&v=3") format("opentype"); - font-display: auto; - font-style: normal; - font-weight: 600; + font-family: 'Commuters Sans 600'; + src: + url('https://use.typekit.net/af/857ae9/00000000000000007735c460/30/l?subset_id=2&fvd=n7&v=3') format('woff2'), + url('https://use.typekit.net/af/857ae9/00000000000000007735c460/30/d?subset_id=2&fvd=n7&v=3') format('woff'), + url('https://use.typekit.net/af/857ae9/00000000000000007735c460/30/a?subset_id=2&fvd=n7&v=3') format('opentype'); + font-display: auto; + font-style: normal; + font-weight: 600; } @font-face { - font-family: 'Space Mono 400'; - font-style: normal; - font-weight: 400; - font-display: swap; - src: url(https://fonts.gstatic.com/s/spacemono/v6/i7dNIFZifjKcF5UAWdDRYERMR3K_MQacbw.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; + font-family: 'Space Mono 400'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url(https://fonts.gstatic.com/s/spacemono/v6/i7dNIFZifjKcF5UAWdDRYERMR3K_MQacbw.woff2) format('woff2'); + unicode-range: + U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, + U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { - font-family: 'Space Mono 700'; - font-style: normal; - font-weight: 700; - src: url(https://fonts.gstatic.com/s/spacemono/v10/i7dMIFZifjKcF5UAWdDRaPpZUFWaHi6WZ3Q.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; - } + font-family: 'Space Mono 700'; + font-style: normal; + font-weight: 700; + src: url(https://fonts.gstatic.com/s/spacemono/v10/i7dMIFZifjKcF5UAWdDRaPpZUFWaHi6WZ3Q.woff2) format('woff2'); + unicode-range: + U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, + U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +} - @font-face { - font-family: 'Outfit 300'; - font-style: normal; - font-weight: 300; - src: url(https://fonts.gstatic.com/s/outfit/v4/QGYyz_MVcBeNP4NjuGObqx1XmO1I4W61O4a0FQItq6fNIg.woff) format('woff'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; - } +@font-face { + font-family: 'Outfit 300'; + font-style: normal; + font-weight: 300; + src: url(https://fonts.gstatic.com/s/outfit/v4/QGYyz_MVcBeNP4NjuGObqx1XmO1I4W61O4a0FQItq6fNIg.woff) format('woff'); + unicode-range: + U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, + U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +} @font-face { - font-family: 'Outfit 400'; - font-style: normal; - font-weight: 400; - font-display: swap; - src: url(https://fonts.gstatic.com/s/outfit/v2/QGYyz_MVcBeNP4NjuGObqx1XmO1I4TC1O4a0FQItq6fNIg.woff) format('woff'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; + font-family: 'Outfit 400'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url(https://fonts.gstatic.com/s/outfit/v2/QGYyz_MVcBeNP4NjuGObqx1XmO1I4TC1O4a0FQItq6fNIg.woff) format('woff'); + unicode-range: + U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, + U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { - font-family: 'Outfit 600'; - font-style: normal; - font-weight: 600; - src: url(https://fonts.gstatic.com/s/outfit/v4/QGYyz_MVcBeNP4NjuGObqx1XmO1I4e6yO4a0FQItq6fNIg.woff) format('woff'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; - } \ No newline at end of file + font-family: 'Outfit 600'; + font-style: normal; + font-weight: 600; + src: url(https://fonts.gstatic.com/s/outfit/v4/QGYyz_MVcBeNP4NjuGObqx1XmO1I4e6yO4a0FQItq6fNIg.woff) format('woff'); + unicode-range: + U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, + U+2193, U+2212, U+2215, U+FEFF, U+FFFD; +} diff --git a/pull_request_template.md b/pull_request_template.md deleted file mode 100644 index ceb04880..00000000 --- a/pull_request_template.md +++ /dev/null @@ -1,36 +0,0 @@ -# What was the ticket? - -WT-65 UI Design: Construct JSX page to match the UI of Teams landing page. - [Link to Ticket](https://generatenu.atlassian.net/jira/software/projects/WT/boards/2?selectedIssue=WT-65) - -# What did I do? - -Created new Teams page with route at /teams, based off the figma design for it. Currently waiting for images to populate -the rest of the page, and works to be completed on the figma for an expanded view of each of the teams - -# How did I test it? - -Describe in detail steps you used to test the changes you have made. -Key Parts - -Compared the figma and current page to ensure it correctly reflected what the design should be. Ran tests for resizing the window to ensure page -did not ahve any scaling issues. - - Required checks: - -- [Y] Did you conduct a self-review? -- [NA] Have you written unit or integration tests? - -# What could go wrong in the future? What parts of your code should the reviewer pay the most attention to? - -Describe aspects of the PR that may become problems in the future. -Key Questions - -Currently the page doesn't go anywhere, it is mainly jsut a simple gray space to build onto morechanges as figma designs are updated - -# Additional comments for the reviewers - -[!image](./public/images/PRImages/Screenshot%202023-03-20%20at%208.15.02%20PM.png) - -![image](./public/images/PRImages/Screenshot%202023-03-20%20204229.png) -![image](./public/images/PRImages/Screenshot%202023-03-20%20204258.png) diff --git a/sanity/package.json b/sanity/package.json index f2cc3fbc..5728a4eb 100644 --- a/sanity/package.json +++ b/sanity/package.json @@ -1,9 +1,12 @@ { "name": "generate-sanity", - "private": true, "version": "1.0.0", - "main": "package.json", + "private": true, + "keywords": [ + "sanity" + ], "license": "UNLICENSED", + "main": "package.json", "scripts": { "dev": "sanity dev", "start": "sanity start", @@ -12,9 +15,6 @@ "deploy-graphql": "sanity graphql deploy", "typecheck": "tsc" }, - "keywords": [ - "sanity" - ], "dependencies": { "@sanity/cli": "^8.2.1", "@sanity/color-input": "^6.1.4", @@ -32,9 +32,9 @@ "typescript": "^7.0.2" }, "prettier": { - "semi": false, - "printWidth": 100, "bracketSpacing": false, + "printWidth": 100, + "semi": false, "singleQuote": true } } diff --git a/src/component/ApplyPage/Position/index.tsx b/src/component/ApplyPage/Position/index.tsx index 527f312d..ac12a930 100644 --- a/src/component/ApplyPage/Position/index.tsx +++ b/src/component/ApplyPage/Position/index.tsx @@ -5,6 +5,7 @@ import Row from 'react-bootstrap/Row'; import { useParams } from 'react-router-dom'; import applicationsByTeams from '../../../data/ApplyData/allApps'; +import type { Position as PositionData } from '../../../data/ApplyData/types'; import './style.css'; import useWebsite from '../../../shared/useWebsite'; import NavBar from '../../NavBar'; @@ -12,9 +13,186 @@ import ShadowedButton from '../../ShadowedButton'; type ApplicationGroup = keyof typeof applicationsByTeams; +type PositionViewProps = { + position: PositionData; + showText: string; + onApply: () => void; + onShare: () => void; + routeIndex?: string; +}; + const isApplicationGroup = (value: string | undefined): value is ApplicationGroup => value !== undefined && Object.hasOwn(applicationsByTeams, value); +const parseList = (stringList: string) => { + if (stringList) { + return stringList.split('.'); + } else { + return []; + } +}; + +function DesktopPositionSummary({ position, showText, onApply, onShare }: PositionViewProps) { + return ( + + + +

{position.positionTitle}

+

{position.categoryType}

+ + + + + {(position.active && ( + + )) || + (!position.active && ( + undefined} + /> + ))} + + + + + + ); +} + +function DesktopPositionDetails({ position, routeIndex }: PositionViewProps) { + return ( + + + < -- positions + + +

{position.description}

+ + {position.responsibilities &&

What you’ll do

} + + + {position.requirements &&

Requirements

} + + + + +
Duration
+

+ {position.startDate} to {position.endDate} +

+ + +
Weekly commitment
+

{`Up to ${position.workCommitment} hours`}

+ + + +
+

+ {position.remarks} +

+
+ + + learn more -- > + + + ); +} + +function DesktopPosition(props: PositionViewProps) { + return ( + + + + + + + + ); +} + +function MobilePosition({ position, onApply, onShare }: PositionViewProps) { + return ( +
+
+
+ +
+
{position.positionTitle}
+
{position.categoryType}
+
+ + +
+
+
+ + < -- positions + +
{position.description}
+
What you'll do
+ +
Requirements
+ +
+
+
Duration
+
+ {position.startDate} to {position.endDate} +
+
+
+
Weekly Commitment
+
{`Up to ${position.workCommitment} hours`}
+
+
+
{position.remarks}
+ + learn more -- > + +
+
+ ); +} + export default function Position() { const isWebsite = useWebsite(); const isBigScreen = !window.matchMedia('(max-device-width: 650px)').matches; @@ -28,18 +206,11 @@ export default function Position() { const [showText, setShowText] = useState('Share'); - const parseList = (stringList: string) => { - if (stringList) { - return stringList.split('.'); - } else { - return []; - } - }; - const copyShareLink = () => { - console.log(window.location.href); - navigator.clipboard.writeText(window.location.href); - setShowText('Copied!'); + navigator.clipboard.writeText(window.location.href).then( + () => setShowText('Copied!'), + () => setShowText('Copy failed') + ); }; const handleApply = () => { @@ -50,160 +221,15 @@ export default function Position() { if (position) { return !mobile ? ( - - - {/* Left */} - - - -

{position.positionTitle}

-

{position.categoryType}

- - - - - {(position.active && ( - - )) || - (!position.active && ( - console.log('not implemented')} - /> - ))} - - - - - - - {/* Right */} - - {/* Link back to list of positions */} - - < -- positions - - - {/* Position summary */} -

{position.description}

- - {/* Position responsibilities */} - {position.responsibilities &&

What you’ll do

} - - - {/* Position qualifications */} - {position.requirements &&

Requirements

} - - - {/* Position timeline */} - - -
Duration
-

- {position.startDate} to {position.endDate} -

- - -
Weekly commitment
-

{`Up to ${position.workCommitment} hours`}

- - - -
-

- {position.remarks} -

-
- - {/* Link to information about position type */} - - learn more -- > - - - - + ) : ( -
-
-
- -
-
{position.positionTitle}
-
{position.categoryType}
-
- - -
-
-
- - < -- positions - -
{position.description}
-
What you'll do
-
    - {parseList(position.responsibilities).map((info, index) => ( -
  • - {info} -
    • - ))} -
-
Requirements
-
    - {parseList(position.requirements).map((info, index) => ( -
  • - {info} -
    • - ))} -
-
-
-
Duration
-
- {position.startDate} to {position.endDate} -
-
-
-
Weekly Commitment
-
{`Up to ${position.workCommitment} hours`}
-
-
-
{position.remarks}
- - learn more -- > - -
-
+ ); } else { return null; diff --git a/src/component/CulturePage/Events3/style.css b/src/component/CulturePage/Events3/style.css index 339cc7f9..d1a4c5ce 100644 --- a/src/component/CulturePage/Events3/style.css +++ b/src/component/CulturePage/Events3/style.css @@ -1,5 +1,5 @@ .all-hands-title { - font-family: "Space Mono 700"; + font-family: 'Space Mono 700'; font-style: normal; font-size: 48px; margin-top: 200px; @@ -20,9 +20,7 @@ column-gap: 100px; } - .all-hands-div { width: 400px; margin: 0 50px 0 50px; } - diff --git a/src/component/CulturePage/IntroImages/index.tsx b/src/component/CulturePage/IntroImages/index.tsx index 7e029a30..2fb252e3 100644 --- a/src/component/CulturePage/IntroImages/index.tsx +++ b/src/component/CulturePage/IntroImages/index.tsx @@ -25,7 +25,7 @@ const desktopContent = () => { const mobileContent = () => { return (
- HAVE SOME FUN WITH US + HAVE SOME FUN WITH US IntroImage1 IntroImage2 IntroImage3 diff --git a/src/component/CulturePage/IntroImages/style.css b/src/component/CulturePage/IntroImages/style.css index e2e65b28..5fc63d0d 100644 --- a/src/component/CulturePage/IntroImages/style.css +++ b/src/component/CulturePage/IntroImages/style.css @@ -43,6 +43,7 @@ color: white; font-size: 9.25vw; font-family: 'Space Mono 700'; + line-height: inherit; transform: rotate(90deg); margin-top: 55%; margin-left: 16%; diff --git a/src/component/CulturePage/IntroSection/index.tsx b/src/component/CulturePage/IntroSection/index.tsx index 38aeaea0..aaa337a3 100644 --- a/src/component/CulturePage/IntroSection/index.tsx +++ b/src/component/CulturePage/IntroSection/index.tsx @@ -33,8 +33,8 @@ const mobileContent = () => (
- Our Culture - We make wicked projects & plan wicked events + Our Culture + We make wicked projects & plan wicked events Generate Mascot
diff --git a/src/component/CulturePage/Showcase/style.css b/src/component/CulturePage/Showcase/style.css index f9843df9..bd03112f 100644 --- a/src/component/CulturePage/Showcase/style.css +++ b/src/component/CulturePage/Showcase/style.css @@ -1,10 +1,10 @@ .showcase-div { - width: 400px; - margin: 0 50px 0 50px; - } + width: 400px; + margin: 0 50px 0 50px; +} - .showcase-title { - font-family: "Space Mono 700"; +.showcase-title { + font-family: 'Space Mono 700'; font-style: normal; font-size: 48px; margin-top: 335px; @@ -16,14 +16,13 @@ .showcase-text { width: 400px; color: black; - font-size: 20px; + font-size: 20px; line-height: 30px; text-align: left; font-style: normal; font-weight: 300; column-gap: 100px; } - .showcase { - margin-right:5%; - } - +.showcase { + margin-right: 5%; +} diff --git a/src/component/CulturePage/index.tsx b/src/component/CulturePage/index.tsx index 0ccf1292..c383c7e1 100644 --- a/src/component/CulturePage/index.tsx +++ b/src/component/CulturePage/index.tsx @@ -23,21 +23,23 @@ export default function CulturePage() { const isBigScreen = !window.matchMedia('(max-device-width: 650px)').matches; const mobile = !isBigScreen || !isWebsite; - const children = [ - , - , - , - , - , - , - , - , - mobile ? undefined : , - mobile ? undefined : , - , -