connected with backend - select character

SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html

@@ -6,7 +6,7 @@
     <mat-list-item *ngFor="let character of charactersList">
       <mat-icon mat-list-icon>account_circle</mat-icon>
       <div mat-line>{{character.name}}</div>
-      <mat-icon matSuffix class="arrow-forward arrow-select" (click)="onCharacterClick()">arrow_forward</mat-icon>
+      <mat-icon matSuffix class="arrow-forward arrow-select" (click)="onCharacterClick(character.id)">arrow_forward</mat-icon>
       <div mat-line> {{character.className}} level: {{character.level}}</div>
       <mat-divider></mat-divider>
     </mat-list-item>

SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts

@@ -8,6 +8,7 @@ import {Store} from "@ngrx/store";
 import {AppState} from "../../store/models/app-state.model";
 import {CharacterService} from "../../../services/character.service";
 import {CharacterForLoginViewModel} from "../../../types/viewmodels/character-viewmodels/CharacterForLoginViewModel";
+import {AddCharacterId} from "../../store/actions/player.action";
 
 @Component({
   selector: 'app-select-character',
@@ -36,7 +37,8 @@ export class SelectCharacterComponent implements OnInit {
     });
   }
 
-  onCharacterClick(){
+  onCharacterClick(characterId: number){
+    this.store.dispatch(new AddCharacterId({characterId}))
     this.router.navigate(['player'])
   }
 

SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts

@@ -1,4 +1,3 @@
-import {AppStoreModel} from '../models/app-store.model';
 import {Action} from '@ngrx/store';
 
 export enum AppActionTypes {
@@ -26,7 +25,8 @@ export class ClearUserId implements Action {
 
   constructor() {
   }
-
 }
 
+
+
 export type AppAction = AddUserId | AddRole | ClearUserId;

SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/player.action.ts

@@ -0,0 +1,15 @@
+import {Action} from "@ngrx/store";
+
+export enum PlayerActionTypes {
+  ADD_CHARACTER_ID= '[PLAYER] Add character id'
+}
+
+export class AddCharacterId implements Action {
+  readonly type = PlayerActionTypes.ADD_CHARACTER_ID;
+
+  constructor(public payload: {characterId: number}) {
+
+  }
+}
+
+export type PlayerAction = AddCharacterId;

SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/app-state.model.ts

@@ -1,11 +1,15 @@
 import {AppStoreModel} from './app-store.model';
 import {ActionReducerMap} from '@ngrx/store';
 import {AppReducer} from '../reducers/app.reducer';
+import {PlayerStoreModel} from "./player-store.model";
+import {PlayerReducer} from "../reducers/player.reducer";
 
 export interface AppState {
   appStore: AppStoreModel;
+  playerStore: PlayerStoreModel;
 }
 
 export const reducers: ActionReducerMap<AppState> = {
   appStore: AppReducer,
+  playerStore: PlayerReducer,
 };

SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/player-store.model.ts

@@ -0,0 +1,3 @@
+export interface PlayerStoreModel {
+  characterId: number;
+}

SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/player.reducer.ts

@@ -0,0 +1,15 @@
+import {PlayerStoreModel} from "../models/player-store.model";
+import {PlayerAction, PlayerActionTypes} from "../actions/player.action";
+
+const initialState: PlayerStoreModel = {
+  characterId: null
+};
+
+export function PlayerReducer(state: PlayerStoreModel = initialState, action: PlayerAction) {
+  switch (action.type) {
+    case PlayerActionTypes.ADD_CHARACTER_ID:
+      return {...state, characterId: action.payload.characterId};
+    default:
+      return state;
+  }
+}