-
Notifications
You must be signed in to change notification settings - Fork 1
Alex+Ryan/Add Lockout Period #563
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: develop
Are you sure you want to change the base?
Changes from all commits
4e6700e
0c5ebe8
c93a773
9973ae7
6fdee85
ad04f2c
988de13
a576cab
5c69b6e
7f9a693
b9bdd9f
fa1c5ea
c25250a
cf4af9e
a7d2a11
86cacb5
41a72a5
b97abe0
3730ab6
3ce0434
2bfc389
42eb061
2deb8ba
d8b2f69
303f8a4
a8ff6a1
0996cd7
b99ebb0
bd81e39
220d865
d32c663
52beb96
5cbe943
0b0ec0b
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -2,38 +2,40 @@ | |
| // Licensed under the MIT License. | ||
|
|
||
| 'use client'; | ||
| import React, { JSX, useEffect, useState } from 'react'; | ||
| import { AlertVariants } from '@/components/AlertNotification/Alerts.enum'; | ||
| import { ChevronLeft } from 'lucide-react'; | ||
| import { cn, getNFLTeamLogo } from '@/utils/utils'; | ||
| import { Control, FormProvider, useForm } from 'react-hook-form'; | ||
| import { | ||
| FormControl, | ||
| FormField, | ||
| FormItem, | ||
| FormControl, | ||
| FormMessage, | ||
| } from '@/components/Form/Form'; | ||
| import { FormProvider, Control, useForm } from 'react-hook-form'; | ||
| import { z } from 'zod'; | ||
| import { IWeekProps } from './Week.interface'; | ||
| import { zodResolver } from '@hookform/resolvers/zod'; | ||
| import { useDataStore } from '@/store/dataStore'; | ||
| import { ISchedule } from './WeekTeams.interface'; | ||
| import { | ||
| getAllWeeklyPicks, | ||
| getCurrentUserEntries, | ||
| getCurrentLeague, | ||
| getCurrentUserEntries, | ||
| getGameWeek, | ||
| } from '@/api/apiFunctions'; | ||
| import { ILeague } from '@/api/apiFunctions.interface'; | ||
| import WeekTeams from './WeekTeams'; | ||
| import GlobalSpinner from '@/components/GlobalSpinner/GlobalSpinner'; | ||
| import { onWeeklyPickChange } from './WeekHelper'; | ||
| import Alert from '@/components/AlertNotification/AlertNotification'; | ||
| import { AlertVariants } from '@/components/AlertNotification/Alerts.enum'; | ||
| import { ISchedule } from './WeekTeams.interface'; | ||
| import { IWeekProps } from './Week.interface'; | ||
| import { NFLTeams } from '@/api/apiFunctions.enum'; | ||
| import { onWeeklyPickChange } from './WeekHelper'; | ||
| import { useAuthContext } from '@/context/AuthContextProvider'; | ||
| import { cn, getNFLTeamLogo } from '@/utils/utils'; | ||
| import Image from 'next/image'; | ||
| import { useDataStore } from '@/store/dataStore'; | ||
| import { useRouter } from 'next/navigation'; | ||
| import { z } from 'zod'; | ||
| import { zodResolver } from '@hookform/resolvers/zod'; | ||
| import Alert from '@/components/AlertNotification/AlertNotification'; | ||
| import GlobalSpinner from '@/components/GlobalSpinner/GlobalSpinner'; | ||
| import Image from 'next/image'; | ||
| import LinkCustom from '@/components/LinkCustom/LinkCustom'; | ||
| import { ChevronLeft } from 'lucide-react'; | ||
| import React, { JSX, useEffect, useState } from 'react'; | ||
| import toast from 'react-hot-toast'; | ||
| import useIsUserLockedOut from '@/hooks/useIsUserLockedOut'; | ||
| import WeekTeams from './WeekTeams'; | ||
|
|
||
| /** | ||
| * Renders the weekly picks page. | ||
|
|
@@ -54,6 +56,7 @@ const Week = ({ entry, league, NFLTeams, week }: IWeekProps): JSX.Element => { | |
| useDataStore((state) => state); | ||
| const { isSignedIn } = useAuthContext(); | ||
| const router = useRouter(); | ||
| const lockedOut = useIsUserLockedOut(); | ||
|
|
||
| /** | ||
| * Fetches the current game week. | ||
|
|
@@ -217,9 +220,19 @@ const Week = ({ entry, league, NFLTeams, week }: IWeekProps): JSX.Element => { | |
| }; | ||
|
|
||
| try { | ||
| await onWeeklyPickChange(params); | ||
| setUserPick(teamSelect); | ||
| router.push(`/league/${league}/entry/all`); | ||
| if (lockedOut) { | ||
|
Collaborator
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I don't see any new unit tests for this.
Member
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I will add these in ASAP.
Member
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @shashilo can you elaborate what test exactly you're looking for?
Collaborator
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. It's a conditional statement, so you need to have a positive and negative unit tests for this. Checking that both conditions are accurate when their conditions are met. |
||
| toast.custom( | ||
| <Alert | ||
| variant={AlertVariants.Error} | ||
| message={`Team selection has been locked for the week!`} | ||
| />, | ||
| ); | ||
| } else { | ||
| await onWeeklyPickChange(params); | ||
| setUserPick(teamSelect); | ||
| router.push(`/league/${league}/entry/all`); | ||
| } | ||
|
choir241 marked this conversation as resolved.
|
||
| console.error(params); | ||
| } catch (error) { | ||
| console.error('Submission error:', error); | ||
| } | ||
|
|
||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,13 +1,13 @@ | ||
| // Copyright (c) Gridiron Survivor. | ||
| // Licensed under the MIT License. | ||
|
|
||
| import { Button } from '../Button/Button'; | ||
| import { cn } from '@/utils/utils'; | ||
| import { EntryStatus } from '../EntryStatus/EntryStatus'; | ||
| import { ILeagueEntriesProps } from './LeagueEntries.interface'; | ||
| import React, { JSX } from 'react'; | ||
| import Link from 'next/link'; | ||
| import Image from 'next/image'; | ||
| import LinkCustom from '../LinkCustom/LinkCustom'; | ||
| import React, { JSX } from 'react'; | ||
| import useLockout from '@/hooks/useIsUserLockedOut'; | ||
|
|
||
| /** | ||
| * A card that contains information on the user's entry for this league. Contains the entry number, their entry status (alive or eliminated), team logo once a pick is set, and a button to make a pick or change their pick | ||
|
|
@@ -18,16 +18,25 @@ import Image from 'next/image'; | |
| * @param props.isPickSet - if true, the team logo of the picked team shows up on the LeagueEntries card and the button changes from "make a pick" to "chagne pick" | ||
| * @param props.userPickHistory - the user's pick history for this entry | ||
| * @param props.selectedTeamLogo - the team logo | ||
| * @param props.lockout - if true, the user is locked out from making a pick | ||
| * @returns {React.JSX.Element} - A div element that contains the user's entry information | ||
| */ | ||
|
|
||
| /** | ||
| * Display all entries for a league. | ||
| * @param {string} leagueId - The league id. | ||
| * @returns {JSX.Element} The rendered entries component. | ||
| */ | ||
| const LeagueEntries = ({ | ||
| entryName, | ||
| linkUrl, | ||
| isEliminated = false, | ||
| isPickSet = false, | ||
| linkUrl, | ||
| userPickHistory, | ||
| selectedTeamLogo = '', | ||
| }: ILeagueEntriesProps): JSX.Element => { | ||
| const lockedOut = useLockout(); | ||
|
|
||
| return ( | ||
| <div | ||
| data-testid="league-entry-container-card" | ||
|
|
@@ -107,14 +116,22 @@ const LeagueEntries = ({ | |
| data-testid="league-entry-pick-button-container" | ||
| > | ||
| {!isEliminated && ( | ||
| <Link href={linkUrl} data-testid="league-entry-pick-button-link"> | ||
| <Button | ||
| className="league-entry-pick-button" | ||
| data-testid="league-entry-pick-button" | ||
| label={isPickSet ? 'Change Pick' : 'Make Pick'} | ||
| variant={isPickSet ? 'secondary' : 'default'} | ||
| /> | ||
| </Link> | ||
| <LinkCustom | ||
|
Collaborator
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. There are 3 conditions in this component. This is best, it's having conditional statements for 2 separate components. It's easier to read and maintain. |
||
| aria-disabled={lockedOut ? 'true' : 'false'} | ||
| className={cn( | ||
| 'league-entry-pick-link', | ||
| lockedOut ? 'opacity-50 cursor-not-allowed' : '', | ||
| )} | ||
| dataTestidProp="league-entry-pick-link" | ||
| href={linkUrl} | ||
| onClick={(e: { preventDefault: () => unknown }) => | ||
| lockedOut && e.preventDefault() | ||
| } | ||
| size={'defaultButton'} | ||
| variant={isPickSet ? 'secondaryButton' : 'primaryButton'} | ||
|
choir241 marked this conversation as resolved.
|
||
| > | ||
| {isPickSet ? 'Change Pick' : 'Make Pick'} | ||
| </LinkCustom> | ||
| )} | ||
| </div> | ||
| </section> | ||
|
|
||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| import { renderHook } from '@testing-library/react'; | ||
| import useIsUserLockedOut from './useIsUserLockedOut'; | ||
|
|
||
| describe('useLockout hook', () => { | ||
| let getUTCDaySpy: jest.SpyInstance; | ||
| let getUTCHoursSpy: jest.SpyInstance; | ||
|
|
||
| beforeEach(() => { | ||
| getUTCDaySpy = jest.spyOn(Date.prototype, 'getUTCDay'); | ||
| getUTCHoursSpy = jest.spyOn(Date.prototype, 'getUTCHours'); | ||
| }); | ||
|
|
||
| afterEach(() => { | ||
| getUTCDaySpy.mockRestore(); | ||
| getUTCHoursSpy.mockRestore(); | ||
| }); | ||
|
|
||
| it('should lock out on Saturday at 12am UTC', () => { | ||
| getUTCDaySpy.mockReturnValue(6); //Mocking Saturday | ||
| getUTCHoursSpy.mockReturnValue(0); //Mocking 12am UTC | ||
|
|
||
| const { result } = renderHook(() => useIsUserLockedOut()); | ||
|
|
||
| expect(result.current).toBe(true); | ||
| }); | ||
|
|
||
| it('should not be locked out on Wednesday at any time', () => { | ||
| getUTCDaySpy.mockReturnValue(3); //Mocking Wednesday | ||
| getUTCHoursSpy.mockReturnValue(12); //Mocking 12pm UTC | ||
|
|
||
| const { result } = renderHook(() => useIsUserLockedOut()); | ||
|
|
||
| expect(result.current).toBe(false); | ||
| }); | ||
| }); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we need to nest this if statement in the try block?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes. So what it does is run the api functions inside the try block. But, if its during the lockdown period it will block the api functions from running and instead run the toast notification. It is a way to stop hackers from hitting the api's when they shouldn't.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@braydoncoyer please let me know if you need more info on this
Uh oh!
There was an error while loading. Please reload this page.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@alexappleget @ryandotfurrer Yep, I get the purpose of the Try block. I think I was more asking if the try block could be moved inside the conditional to better represent which part of the code may cause/throw an error.
I'll leave this as a nit because as-is this likely works. However, I'm always a big fan of being more specific about which part of the code may need to have errors caught.