Skip to content

Commit

Permalink
FRON-10 Document site url endpoints (#18)
Browse files Browse the repository at this point in the history
* chore: FRON-10 main filter url navigation

* chore: FRON-10 adding placeholder pages
  • Loading branch information
Lombardoc4 authored Feb 4, 2024
1 parent c2f13b5 commit e2e8013
Show file tree
Hide file tree
Showing 11 changed files with 91 additions and 57 deletions.
14 changes: 14 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ Table of Contents:
- [Contribution Guidelines](#contribution-guidelines)
- [Tests](#tests)
- [Deployment](#deployment)
- [URL Structure](#url-structure)
- [Resources](#resources)

## Setting up the project
Expand Down Expand Up @@ -97,6 +98,19 @@ This project is using [conventional commits](https://www.conventionalcommits.org

// TODO [vercel](https://vercel.com/)

## URL Structure

```
`/`
├── Results of past seasons
└──`[season]` -> year
└── `[location]` -> race location of race in season
└── `[session]` -> session of race
└── `[driver]` -> driverId in race session
├── `/` -> ???
└── `/telemetry` -> ???
```

## Resources

Key tools in use: `daisy-ui`, `tailwindcss`, `react`, `nextjs`, `pnpm`, `cypress`
7 changes: 7 additions & 0 deletions src/app/[season]/[location]/[driver]/[session]/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
export default function SessionPage({
params,
}: {
params: { session: string };
}) {
return <h1>{params.session}</h1>;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export default function TelemetryPage() {
return <h1>Telemetry</h1>;
}
3 changes: 3 additions & 0 deletions src/app/[season]/[location]/[driver]/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export default function DriverPage({ params }: { params: { driver: string } }) {
return <h1>{params.driver}</h1>;
}
22 changes: 3 additions & 19 deletions src/app/[season]/[location]/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,34 +25,18 @@ export default function ResultsPage({
const [races] = useAtom(seasonRacesAtom);
const [_, setRace] = useAtom(raceAtom);

// On Mount we need to update the race to use the url params
useEffect(() => {
setRace(
races.find((race) => race.Location === params.location) || 'All Races',
races.find((race) => race.Location.toLowerCase() === params.location) ||
'All Races',
);
}, [races, params.location, setRace]);
// useAtom(fetchStandings);
// useAtom(fetchSessionResults);
useAtom(fetchSessionResults);

// const [constructorStandings] = useAtom(constructorStandingsAtom);
// const [driverStandings] = useAtom(driverStandingsAtom);
const [drivers] = useAtom(allDriversAtom);
const [constructors] = useAtom(allConstructorAtom);

// const [driverStandings] = useAtom(driverStandingsAtom);

// const [, handleRaceChange] = useAtom(handleRaceChangeAtom);
// const [allRaces] = useAtom(seasonRacesAtom)

// if (!params) return <></>;
// Get all

// if (allRaces && allRaces.length > 0) {
// console.log('all races', allRaces[parseInt(params.round) - 1])

// handleRaceChange(allRaces[parseInt(params.round) - 1]);
// }

return (
<main>
<Tabs
Expand Down
27 changes: 17 additions & 10 deletions src/app/ui/MainFilters.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
'use client';

import { useAtom } from 'jotai/react';
// import Link from 'next/link';
import { usePathname, useRouter } from 'next/navigation';
import React from 'react';

import {
allDriversAtom,
Expand All @@ -16,7 +14,11 @@ import {
raceAtom,
seasonRacesAtom,
} from '@/atoms/races';
import { handleMainFilterSubmit, telemetryDisableAtom } from '@/atoms/results';
import {
handleMainFilterSubmit,
telemetryDisableAtom,
toggleTelemetryDisableAtom,
} from '@/atoms/results';
import {
allSeasonsAtom,
fetchSeasons,
Expand All @@ -25,6 +27,7 @@ import {
} from '@/atoms/seasons';
import {
allSessionsAtom,
fetchSessionResults,
handleSessionChangeAtom,
sessionAtom,
} from '@/atoms/sessions';
Expand All @@ -43,17 +46,18 @@ export const MainFilters = () => {
const [, handleResultsSubmit] = useAtom(handleMainFilterSubmit);

// useAtom(fetchSeasons);
// useAtom(toggleTelemetryDisableAtom);
useAtom(toggleTelemetryDisableAtom);
// useAtom(fetchSessionResults);

const changePath = (url: string) => {
// If not home page auto change page
if (pathname !== '/') router.push(url);
};

const handleSubmit = () => {
const handleSubmit = (e: React.MouseEvent) => {
const telemetry = (e.target as HTMLButtonElement).innerHTML === 'Telemetry';
const url = handleResultsSubmit();
router.push('/' + url);
router.push('/' + url + (telemetry && '/telemetry'));
};

return (
Expand All @@ -70,10 +74,11 @@ export const MainFilters = () => {
</div>

<div className='flex gap-4 px-2'>
<button className='btn btn-primary btn-sm'>
<a onClick={() => handleSubmit()}>Results</a>
<button onClick={handleSubmit} className='btn btn-primary btn-sm'>
Results
</button>
<button
onClick={handleSubmit}
disabled={telemetryDisable}
className='btn btn-secondary btn-sm'
>
Expand Down Expand Up @@ -127,7 +132,7 @@ const RaceDropdown = ({ action }: actionT) => {
};

const DriverDropdown = ({ action }: actionT) => {
const [driverName] = useAtom(driverAtom);
const [driver] = useAtom(driverAtom);
const [, handleDriverChange] = useAtom(handleDriverChangeAtom);
const [driverList] = useAtom(allDriversAtom);

Expand All @@ -139,7 +144,7 @@ const DriverDropdown = ({ action }: actionT) => {

return (
<Dropdown
value={driverName}
value={driver !== 'All Drivers' ? driver.FullName : driver}
items={driverList.map((driver) => driver.FullName)}
action={handleAction}
/>
Expand All @@ -150,6 +155,8 @@ const SessionDropdown = ({ action }: actionT) => {
const [, handleSessionChange] = useAtom(handleSessionChangeAtom);
const [sessionList] = useAtom(allSessionsAtom);

useAtom(fetchSessionResults);

const handleAction = (val: string) => {
handleSessionChange(val).then((url: string) => {
action(url);
Expand Down
19 changes: 15 additions & 4 deletions src/atoms/drivers.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,25 @@ import { seasonAtom } from './seasons';

// Drivers
export const allDriversAtom = atom<DriverResult[]>([]);
export const driverAtom = atom('All Drivers');
export const driverAtom = atom<DriverResult | 'All Drivers'>('All Drivers');

export const handleDriverChangeAtom = atom(
null,
async (get, set, update: string) => {
set(driverAtom, update);
async (get, set, driverName: string) => {
const baseUrl = '/' + get(seasonAtom);

const race = get(raceAtom);
const raceLoc = race !== 'All Races' && race.Location.toLowerCase();

const drivers = get(allDriversAtom);
const driver = drivers.find((driver) => driver.FullName === driverName);

if (driver) {
set(driverAtom, driver);
return baseUrl + (raceLoc && `/${raceLoc}/${driver.DriverId}`);
}
// return nagivation url
return '/' + get(seasonAtom) + '/' + get(raceAtom) + '/' + update;
set(driverAtom, 'All Drivers');
return baseUrl + (raceLoc && `/${raceLoc}`);
},
);
2 changes: 1 addition & 1 deletion src/atoms/races.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,6 @@ export const handleRaceChangeAtom = atom(
set(sessionAtom, lastSession(raceEvent));

// return navigation url
return '/' + get(seasonAtom) + '/' + raceEvent.Location;
return '/' + get(seasonAtom) + '/' + raceEvent.Location.toLowerCase();
},
);
37 changes: 19 additions & 18 deletions src/atoms/results.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { atom } from 'jotai';
import { atomEffect } from 'jotai-effect';

import { allDriversAtom, driverAtom } from './drivers';
import { driverAtom } from './drivers';
import { raceAtom } from './races';
import { seasonAtom } from './seasons';
import { allSessionsAtom, sessionAtom } from './sessions';
Expand All @@ -17,30 +17,31 @@ export const toggleTelemetryDisableAtom = atomEffect((get, set) => {
});

export const handleMainFilterSubmit = atom(null, (get) => {
const url = [get(seasonAtom)];
const season = get(seasonAtom);
const race = get(raceAtom);
const driver = get(driverAtom);
const session = get(sessionAtom);
const url = [];

// Return if no race specified
if (!season) return;
// Add season to url
else url.push(season);

// Return if no race specified
if (race === 'All Races') return url.join('/');
else url.push(race.Location);
// Add race location to url
else url.push(race.Location.toLowerCase());

// Return if no driver specified
if (driver === 'All Drivers') return url.join('/');
else {
const driverInfo = get(allDriversAtom).find(
(driver) => driver.FullName === get(driverAtom),
);
if (driverInfo) url.push(driverInfo.DriverId);
else return url.join('/');
}
// Add driver id to url
else url.push(driver.DriverId);

// Return if no sessions
if (get(allSessionsAtom).length === 0) return url.join('/');
else {
const sessionIndex = get(allSessionsAtom).indexOf(get(sessionAtom)) + 1;
url.push(sessionIndex.toString());
}
// Add session to url
else url.push(session.toLowerCase());

return url.join('/');
});

// export const handleParams = atomEffect((get, set) => {

// })
4 changes: 2 additions & 2 deletions src/atoms/sessions.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ const formatConstructorResults = (drivers: DriverResult[]) =>

// Sessions
export const allSessionsAtom = atom<string[]>([]);
export const sessionAtom = atom('Race');
export const sessionAtom = atom<string>('Race');

// Get session results
// Set allDriversAtom to drivers from session
Expand Down Expand Up @@ -95,6 +95,6 @@ export const handleSessionChangeAtom = atom(

// return navigation url
return `/${get(seasonAtom)}/${get(raceAtom)}/
${get(driverAtom)}/${session}`;
${get(driverAtom)}/${session.toLowerCase()}`;
},
);
10 changes: 7 additions & 3 deletions src/lib/utils.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -80,9 +80,13 @@ export const sessionTitles = (event: ScheduleSchema) => {
};

export const lastSession = (event: ScheduleSchema) => {
if (event.Session5 !== 'None') return event.Session5;
else if (event.Session4 !== 'None') return event.Session4;
else return event.Session3;
let session = 'None';

if (event.Session5 !== 'None') session = event.Session5;
else if (event.Session4 !== 'None') session = event.Session4;
else session = event.Session3;

return session;
};

export const fetchAPI = async (
Expand Down

0 comments on commit e2e8013

Please sign in to comment.