Skip to content

Commit

Permalink
lint + accessibility
Browse files Browse the repository at this point in the history
  • Loading branch information
@heybereket
heybereket committed Jun 6, 2023
1 parent 5402e76 commit c708a1e
Show file tree
Hide file tree
Showing 9 changed files with 169 additions and 160 deletions.
26 changes: 22 additions & 4 deletions components/navbar/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -132,15 +132,30 @@ export const Navbar = (props: {
</h1>
</a>

<a href={GITHUB_URL} target="_blank" rel="noopener noreferrer">
<a
href={GITHUB_URL}
target="_blank"
rel="noopener noreferrer"
aria-label="Github"
>
<Social icon={<FaGithub />} />
</a>

<a href={DISCORD_URL} target="_blank" rel="noopener noreferrer">
<a
href={DISCORD_URL}
target="_blank"
rel="noopener noreferrer"
aria-label="Discord"
>
<Social icon={<FaDiscord />} />
</a>

<a href={BMAC_URL} target="_blank" rel="noopener noreferrer">
<a
href={BMAC_URL}
target="_blank"
rel="noopener noreferrer"
aria-label="Buy Me a Coffee"
>
<Social icon={<FaCoffee />} />
</a>

Expand All @@ -150,7 +165,10 @@ export const Navbar = (props: {
} rounded-lg py-2 px-[13px]`}
onClick={() => setShowLinks(!showLinks)}
>
<FaBars className="2xl:hidden text-black dark:text-white text-xl" />
<FaBars
className="2xl:hidden text-black dark:text-white text-xl"
aria-label="Hamburger Menu"
/>
</button>
</div>

Expand Down
2 changes: 1 addition & 1 deletion components/wrapped/WrappedContainer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,4 +19,4 @@ export const WrappedContainer = ({
{children}
</div>
);
}
};
5 changes: 2 additions & 3 deletions components/wrapped/slides/TotalFavourited.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,7 @@ export const TotalFavourited = (props: any) => {
return (
<WrappedContainer>
<p className="text-2xl text-lightGray">
<b className="text-white">{props.team}</b> has been
favourited...
<b className="text-white">{props.team}</b> has been favourited...
</p>
<h1 className="text-primary font-bold text-7xl mt-[-10px] animate-in slide-in-from-bottom fade-in duration-1000">
<CountUp end={props.totalFavourited} duration={2} /> times
Expand All @@ -28,4 +27,4 @@ export const TotalFavourited = (props: any) => {
</p>
</WrappedContainer>
);
};
};
2 changes: 1 addition & 1 deletion components/wrapped/spotify/SpotifyPlayer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,4 @@ export const SpotifyPlayer = () => {
<div id="spotify"></div>
</div>
);
}
};
2 changes: 1 addition & 1 deletion pages/team/[team]/next.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ export default function NextTeamMatch({
);
}

const title = `${teamQuery}'s Upcoming Match / Scout Machine`
const title = `${teamQuery}'s Upcoming Match / Scout Machine`;

return (
<>
Expand Down
83 changes: 42 additions & 41 deletions pages/team/[team]/wrap.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,54 +58,55 @@ export const getServerSideProps: GetServerSideProps = async (
): Promise<{ props: any }> => {
const { team }: any = context.params;

const [teamMatches, totalEvents, totalAwards, totalFavourited] = await Promise.all([
await db.match.findMany({
where: {
event_key: {
contains: "2023",
},
OR: [
{
alliances: {
path: ["red", "team_keys"],
array_contains: `frc${team}`,
const [teamMatches, totalEvents, totalAwards, totalFavourited] =
await Promise.all([
await db.match.findMany({
where: {
event_key: {
contains: "2023",
},
OR: [
{
alliances: {
path: ["red", "team_keys"],
array_contains: `frc${team}`,
},
},
{
alliances: {
path: ["blue", "team_keys"],
array_contains: `frc${team}`,
},
},
],
},
}),
await db.event.count({
where: {
key: {
contains: "2023",
},
{
alliances: {
path: ["blue", "team_keys"],
array_contains: `frc${team}`,
teams: {
some: {
team_number: Number(team),
},
},
],
},
}),
await db.event.count({
where: {
key: {
contains: "2023"
},
teams: {
some: {
team_number: Number(team),
}
}),
await db.award.count({
where: {
recipient_list: {
array_contains: [{ awardee: null, team_key: `frc${team}` }],
},
year: 2023,
},
},
}),
await db.award.count({
where: {
recipient_list: {
array_contains: [{ awardee: null, team_key: `frc${team}` }],
}),
await db.favouritedTeam.count({
where: {
team_number: Number(team),
},
year: 2023,
},
}),
await db.favouritedTeam.count({
where: {
team_number: Number(team),
},
}),
]);
}),
]);

return {
props: {
Expand Down
174 changes: 85 additions & 89 deletions pages/teams.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ import { getStorage, setStorage } from "@/utils/localStorage";
import { Loading } from "@/components/Loading";

const filterOptions = [
{ name: <FaHome />, range: "" },
{ name: <FaHome aria-label="Home Button" />, range: "" },
{ name: "999s", range: "1-999" },
{ name: "1000s", range: "1000-2000" },
{ name: "2000s", range: "2000-3000" },
Expand All @@ -35,7 +35,6 @@ const filterOptions = [
export default function TeamsPage({ user }: any): JSX.Element {
const [teams, setTeams] = useState<any>();
const [allTeams, setAllTeams] = useState<any>();
const [isClient, setIsClient] = useState(false);
const [teamExistsByTime, setTeamExistsByTime] = useState<any>({});
const [time, setTime] = useState<any>();
const [query, setQuery] = useState("");
Expand Down Expand Up @@ -68,7 +67,6 @@ export default function TeamsPage({ user }: any): JSX.Element {
}, []);

useEffect(() => {
setIsClient(true);
const handleScroll = (): void => {
const scrollPosition: number = window.innerHeight + window.scrollY;
const contentHeight: number = document.documentElement.scrollHeight;
Expand Down Expand Up @@ -146,99 +144,97 @@ export default function TeamsPage({ user }: any): JSX.Element {

return (
<>
{isClient && (
<>
<SEO title="Teams / Scout Machine" />
<Navbar active="Teams" />
<>
<SEO title="Teams / Scout Machine" />
<Navbar active="Teams" />

<div className="flex flex-col">
<Header
title="Teams"
desc="Unleash the excitement of FRC with a new way to discover teams"
>
<div className="relative">
<input
type="text"
placeholder="Search teams (team #, location, name)..."
value={query}
onChange={changeSearch}
spellCheck="false"
className="border bg-white border-solid dark:border-[#2A2A2A] dark:bg-card outline-none rounded-lg text-lightGray px-3 py-[6px] px-5 text-sm pl-8 md:w-[450px] mt-5"
/>
<span className="absolute inset-y-0 left-0 flex items-center pl-3 mt-5">
<FaSearch className="text-sm text-lightGray" />
</span>
</div>
<div className="mt-3 gap-2 flex flex-wrap">
{filterOptions.map(
(
option:
| { name: JSX.Element; range: string }
| { name: string; range: string },
index: number
) => (
<FilterNumber
key={index}
name={option.name}
range={option.range}
setTeamNumberRange={setTeamNumberRange}
setButtonClicked={setButtonClicked}
buttonClicked={buttonClicked}
/>
)
)}
</div>
<div>
<button
className="mt-2 border bg-white border-solid hover:bg-gray-100 dark:bg-card dark:hover:bg-[#191919] px-3 py-1 text-lightGray text-sm rounded-lg dark:border-[#2A2A2A] hover:text-black dark:hover:text-white "
onClick={(): void => {
exportFromJSON({
data: teams,
fileName: `Teams_ScoutMachine_${CURR_YEAR}`,
exportType: exportFromJSON.types.csv,
});
}}
>
<FaFileCsv className="mr-1 inline-block text-xs mb-[3px]" />{" "}
Export Data (CSV)
</button>
</div>

{teamExistsByTime && (
<div className="mt-5">
<b className="text-black dark:text-white">
Looks like the time is{" "}
<span className="text-primary">{time}.</span>
</b>{" "}
<Link
className="text-lightGray hover:text-primary"
href={`/team/${teamExistsByTime.team_number}`}
>
Why don&apos;t ya check out {teamExistsByTime.team_number} |{" "}
{teamExistsByTime.nickname}?
</Link>
</div>
<div className="flex flex-col">
<Header
title="Teams"
desc="Unleash the excitement of FRC with a new way to discover teams"
>
<div className="relative">
<input
type="text"
placeholder="Search teams (team #, location, name)..."
value={query}
onChange={changeSearch}
spellCheck="false"
className="border bg-white border-solid dark:border-[#2A2A2A] dark:bg-card outline-none rounded-lg text-lightGray px-3 py-[6px] px-5 text-sm pl-8 md:w-[450px] mt-5"
/>
<span className="absolute inset-y-0 left-0 flex items-center pl-3 mt-5">
<FaSearch className="text-sm text-lightGray" />
</span>
</div>
<div className="mt-3 gap-2 flex flex-wrap">
{filterOptions.map(
(
option:
| { name: JSX.Element; range: string }
| { name: string; range: string },
index: number
) => (
<FilterNumber
key={index}
name={option.name}
range={option.range}
setTeamNumberRange={setTeamNumberRange}
setButtonClicked={setButtonClicked}
buttonClicked={buttonClicked}
/>
)
)}
</Header>
</div>
<div>
<button
className="mt-2 border bg-white border-solid hover:bg-gray-100 dark:bg-card dark:hover:bg-[#191919] px-3 py-1 text-lightGray text-sm rounded-lg dark:border-[#2A2A2A] hover:text-black dark:hover:text-white "
onClick={(): void => {
exportFromJSON({
data: teams,
fileName: `Teams_ScoutMachine_${CURR_YEAR}`,
exportType: exportFromJSON.types.csv,
});
}}
>
<FaFileCsv className="mr-1 inline-block text-xs mb-[3px]" />{" "}
Export Data (CSV)
</button>
</div>

<div className="w-full mx-auto pl-4 pr-4 md:pr-8 md:pl-8 mt-5">
<div className="flex flex-col w-full sm:grid sm:grid-cols-2 lg:grid-cols-4 gap-3">
{displayedTeams.map((team: any, key: number) => {
return (
<TeamCard
key={key}
team={team}
favourites={user?.favouritedTeams}
/>
);
})}
{teamExistsByTime && (
<div className="mt-5">
<b className="text-black dark:text-white">
Looks like the time is{" "}
<span className="text-primary">{time}.</span>
</b>{" "}
<Link
className="text-lightGray hover:text-primary"
href={`/team/${teamExistsByTime.team_number}`}
>
Why don&apos;t ya check out {teamExistsByTime.team_number} |{" "}
{teamExistsByTime.nickname}?
</Link>
</div>
)}
</Header>

<div className="w-full mx-auto pl-4 pr-4 md:pr-8 md:pl-8 mt-5">
<div className="flex flex-col w-full sm:grid sm:grid-cols-2 lg:grid-cols-4 gap-3">
{displayedTeams.map((team: any, key: number) => {
return (
<TeamCard
key={key}
team={team}
favourites={user?.favouritedTeams}
/>
);
})}
</div>
</div>
</div>

<Footer />
</>
)}
<Footer />
</>
</>
);
}
Expand Down
Loading

1 comment on commit c708a1e

@vercel
Copy link

@vercel vercel bot commented on c708a1e Jun 6, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

web – ./

scoutmachine.vercel.app
web-scoutmachine.vercel.app
web-git-staging-scoutmachine.vercel.app
www.scoutmachine.io
scoutmachine.io

Please sign in to comment.