Based off of the react-poker-game-2023-09-22 repository which is "a react functional components learning application."
Fleshed out this client to with the required features that can be found
- at the website texastoc.com
- and the fully functional client at texastoc-client-v5
Node version
- using node version v18.12.1 and npm version 8.19.2.
Create react app version
- npx create-react-app --version spit out 5.0.1.
Create the react app with typescript
- npx create-react-app --template typescript
React version
- create-react-app installed react version 18 (as you can see by the react version in the package.json).
Use flexbox for navigation bar layout.
Pick up the prefix for the route path if set in the .env* files.
Can now add a new game. Also cleaned up the calls to the api client functions since they no longer return null (they either succeed or throw an error which is caught and shown as a notification).
Could not get the nav bar to collapse properly so for the time being resurrected the v5 nav bar and put controls on the left.
An axios request interceptor now sets auth header. It also checks for expired token. If the token is expired then it uses the react router to navigate to the login page. Hence the axios instead/interceptor had to be moved into a react hook.
Show spinner when waiting on an api response.
Clean up a bunch of small TODOs.
If there are error details show them in the notification. Scroll up to the top of the browser window when a notification appears.
Run the command npm run lint and fix the linter issues.
If all the places have been determined (e.g. top 10 if game has 10 or more people, top seven if the game has 7 people, ...) then allow the game to be ended.
When viewing a game in the list of games for the season show and Edit button. When pressed the current game view is shown for the game.
Fully functional game clock (start, pause, resume, change time, change round),
Delete a game player and refresh the game.
Update the game player. After update close the edit component and refresh the game.
If the edit is cancelled then also close the edit component and refresh the game. Refreshing the game cancels any edits done on the the player that were not updated.
Figure out what is the current game of the current season and show it. Also allow a player to be added to the game.
The league, season and game components need the season Id to be initialized. Moved the initialize code to a common function.
Determine the current game for the season. Since there can only be one game for a season that is not finalized then that is the current game. If no game is unfinalized the use the game with the most recent date.
Set the season Id on top level league component.
Show the league rounds and points.
Show the league players. Still have a TODO to edit a league player.
Show the season along with its quarterly seasons and games.
Show a spinner while waiting for the login api to finish.
Make the logout navigation link operational. When clicked the token in local storage is removed and the router is navigated to the login screen.
Created the login UI component along with the supporting functions to call the server's login endpoint. Keep the token in the browser's local storage.
Initial version is a clone of react-poker-game-2023-09-22