diff --git a/app/lib/models/Team.ts b/app/lib/models/Team.ts
index bcdc185..372a541 100644
--- a/app/lib/models/Team.ts
+++ b/app/lib/models/Team.ts
@@ -21,6 +21,7 @@ export interface IRoster {
* A team comprised of players
*/
export interface ITeam {
+ name: string;
QB: NullablePlayer[];
RB: NullablePlayer[];
WR: NullablePlayer[];
diff --git a/app/lib/store/actions/index.tsx b/app/lib/store/actions/index.tsx
index c734f50..e02a6c4 100644
--- a/app/lib/store/actions/index.tsx
+++ b/app/lib/store/actions/index.tsx
@@ -7,6 +7,7 @@ export const ACTION_TYPES = {
SET_ACTIVE_TEAM: 'SET_ACTIVE_TEAM',
SET_NUMBER_OF_TEAMS: 'SET_NUMBER_OF_TEAMS',
SET_PICK: 'SET_PICK',
+ SET_TEAM_NAME: 'SET_TEAM_NAME',
INIT_STORE: 'SET_PLAYERS',
SET_ROSTER_FORMAT: 'SET_ROSTER_FORMAT',
SET_SCORE_FORMAT: 'SET_SCORE_FORMAT',
@@ -14,6 +15,7 @@ export const ACTION_TYPES = {
SKIP_PICK: 'SKIP_PICK',
TOGGLE_ROSTER_FORMATTING: 'TOGGLE_ROSTER_FORMATTING',
TOGGLE_SCORE_FORMATTING: 'TOGGLE_SCORE_FORMATTING',
+ TOGGLE_TEAM_NAME_UPDATES: 'TOGGLE_TEAM_NAME_UPDATES',
UNDO_LAST: 'UNDO_LAST',
UNDO_PICK: 'UNDO_PICK',
};
diff --git a/app/lib/store/actions/teams.tsx b/app/lib/store/actions/teams.tsx
index d39cd1a..ee2890f 100644
--- a/app/lib/store/actions/teams.tsx
+++ b/app/lib/store/actions/teams.tsx
@@ -76,9 +76,27 @@ export const setActiveTeam = (activeTeam: number) => ({
type: ACTION_TYPES.SET_ACTIVE_TEAM,
});
+/**
+ * Update a specific team's name
+ * @param teamIndex index of the team you want to update
+ * @param name new team name
+ */
+export const setTeamName = (teamIndex: number, name: string) => ({
+ teamIndex,
+ name,
+ type: ACTION_TYPES.SET_TEAM_NAME,
+})
+
/**
* Toggle roster formatting. will open a modal for selecting number at each position
*/
export const toggleRosterFormatting = () => ({
type: ACTION_TYPES.TOGGLE_ROSTER_FORMATTING,
});
+
+/**
+ * Toggle roster formatting. will open a modal for selecting number at each position
+ */
+export const toggleTeamNameUpdates = () => ({
+ type: ACTION_TYPES.TOGGLE_TEAM_NAME_UPDATES,
+});
diff --git a/app/lib/store/reducers/index.tsx b/app/lib/store/reducers/index.tsx
index c7991bf..7fdf5b9 100644
--- a/app/lib/store/reducers/index.tsx
+++ b/app/lib/store/reducers/index.tsx
@@ -2,7 +2,7 @@ import { ACTION_TYPES } from '../actions';
import { initialState, IStoreState } from '../store';
import { removePlayer, initStore, setRosterFormat, undoLast, undoPick } from './players';
import { setScoreFormat } from './scoring';
-import { incrementDraft, pickPlayer, resetDraft, setNumberOfTeams, setPick, setTrackedTeam, skipPick } from './teams';
+import { incrementDraft, pickPlayer, resetDraft, setNumberOfTeams, setPick, setTeamName, setTrackedTeam, skipPick } from './teams';
export default (state = initialState, action: any): IStoreState => {
switch (action.type) {
@@ -39,6 +39,9 @@ export default (state = initialState, action: any): IStoreState => {
case ACTION_TYPES.SET_SCORE_FORMAT: {
return setScoreFormat(state, action.scoring);
}
+ case ACTION_TYPES.SET_TEAM_NAME: {
+ return setTeamName(state, action.teamIndex, action.name);
+ }
case ACTION_TYPES.SET_TRACKED_TEAM: {
return setTrackedTeam(state, action.trackedTeam);
}
@@ -51,6 +54,9 @@ export default (state = initialState, action: any): IStoreState => {
case ACTION_TYPES.TOGGLE_SCORE_FORMATTING: {
return { ...state, formattingScoring: !state.formattingScoring };
}
+ case ACTION_TYPES.TOGGLE_TEAM_NAME_UPDATES: {
+ return { ...state, updatingTeamNames: !state.updatingTeamNames };
+ }
case ACTION_TYPES.UNDO_LAST: {
return undoLast(state);
}
diff --git a/app/lib/store/reducers/players.tsx b/app/lib/store/reducers/players.tsx
index 8f0064e..448cd55 100644
--- a/app/lib/store/reducers/players.tsx
+++ b/app/lib/store/reducers/players.tsx
@@ -20,7 +20,7 @@ export const initStore = (state: IStoreState, players: IPlayer[]) =>
lastSyncPlayers: players,
players: players,
picks: [],
- teams: new Array(state.numberOfTeams).fill(0).map(() => createTeam(state.rosterFormat)),
+ teams: new Array(state.numberOfTeams).fill(0).map((value, index) => createTeam(state.rosterFormat, `Team ${index + 1}`)),
undraftedPlayers: players,
});
@@ -40,7 +40,7 @@ export const removePlayer = (state: IStoreState, player: IPlayer): IStoreState =
*/
const removeFromRoster = (roster: ITeam, player: IPlayer): ITeam => {
// @ts-ignore
- return Object.keys(roster).reduce(
+ return Object.keys(roster).filter(value => value !== 'name').reduce( // kinda janky with the filter
(acc: ITeam, pos) => ({
...acc,
// @ts-ignore
diff --git a/app/lib/store/reducers/teams.tsx b/app/lib/store/reducers/teams.tsx
index f45730f..0a66245 100644
--- a/app/lib/store/reducers/teams.tsx
+++ b/app/lib/store/reducers/teams.tsx
@@ -138,22 +138,36 @@ export const resetDraft = (store: IStoreState) => initStore(store, store.lastSyn
* Update the tracked team on the left side of the app
*/
export const setTrackedTeam = (state: IStoreState, trackedTeam: number): IStoreState => {
+ const { teams } = state;
// create a toast
if (trackedTeam !== state.trackedTeam) {
- toast.info(`Tracking Team ${trackedTeam + 1}`);
+ toast.info(`Tracking ${ teams[trackedTeam].name }`);
}
return { ...state, trackedTeam };
};
+export const setTeamName = (state: IStoreState, teamIndex: number, name: string): IStoreState => {
+ const { teams } = state;
+
+ if(!teams[teamIndex].name) {
+ console.warn(`Cannot update team index ${teamIndex}`);
+ return state;
+ }
+
+ teams[teamIndex].name = name;
+
+ return { ...state, teams };
+}
+
/**
* Update the number of teams and recalculate VOR for the players.
*/
export const setNumberOfTeams = (state: IStoreState, numberOfTeams: number): IStoreState => {
- const { picks, rosterFormat, trackedTeam } = state;
+ const { picks, rosterFormat, trackedTeam, teams } = state;
// create new teams with empty rosters
- let newTeams = new Array(numberOfTeams).fill(0).map(() => createTeam(rosterFormat));
+ let newTeams = new Array(numberOfTeams).fill(0).map((value, index) => createTeam(rosterFormat, teams[index]?.name || `Team ${index + 1}`));
// given the new team count, update each pick and destination team
const newPicks: IPick[] = [];
diff --git a/app/lib/store/store.tsx b/app/lib/store/store.tsx
index 8e733ad..3bf02f7 100644
--- a/app/lib/store/store.tsx
+++ b/app/lib/store/store.tsx
@@ -100,12 +100,18 @@ export interface IStoreState {
* An array of players that have yet to be drafted
*/
undraftedPlayers: IPlayer[];
+
+ /**
+ * Whether the app is currently in a state of updating team names
+ */
+ updatingTeamNames: boolean;
}
/**
* Create an emptyTeam without any drafted players
*/
-export const createTeam = (rosterFormat: IRoster): ITeam => ({
+export const createTeam = (rosterFormat: IRoster, name: string): ITeam => ({
+ name: name,
BENCH: new Array(rosterFormat.BENCH).fill(null),
DST: new Array(rosterFormat.DST).fill(null),
FLEX: new Array(rosterFormat.FLEX).fill(null),
@@ -173,16 +179,17 @@ export const initialState = {
lastPickedPlayer: null,
lastSync: -1,
lastSyncPlayers: [],
- numberOfTeams: 10,
+ numberOfTeams: 12,
picks: [],
players: [],
ppr: false,
rosterFormat: initialRoster,
scoring: initialScore,
selectedPlayer: null,
- teams: new Array(10).fill(0).map(() => createTeam(initialRoster)), // doing 10 empty teams by default
+ teams: new Array(10).fill(0).map((value, index) => createTeam(initialRoster, `Team ${index + 1}`)), // doing 10 empty teams by default
trackedTeam: 0, // team to track in TeamPicks
undraftedPlayers: [],
+ updatingTeamNames: false,
};
const persistConfig = {
diff --git a/app/pages/styles.css b/app/pages/styles.css
index 00b92d8..9e447ab 100644
--- a/app/pages/styles.css
+++ b/app/pages/styles.css
@@ -859,8 +859,21 @@ i.Grayed {
width: 55px;
}
-/* Settings */
+/* Team Name Modal */
+.team-name-modal-container {
+ display: flex;
+ flex-direction: column;
+}
+.team-name-container {
+ display: flex;
+ align-items: flex-end;
+}
+.team-name-input {
+ margin-top: 12px;
+ width: 235px;
+}
+/* Settings */
.Settings-Select {
width: 120px;
margin-left: auto;