From d61c3f620fd0e63a5818215fbb767bcbba1e4fc3 Mon Sep 17 00:00:00 2001
From: Natalia Gawron <natgaw1@st.amu.edu.pl>
Date: Mon, 28 Dec 2020 13:38:45 +0100
Subject: [PATCH 1/3] added pointer class, updated mockup character list

---
 .../registration/registration.component.html  |  2 +-
 .../select-character.component.css            |  4 --
 .../select-character.component.html           | 24 +++-----
 .../select-character.component.ts             | 55 ++++++++++++++++++-
 .../components/sign-in/sign-in.component.html |  2 +-
 .../SessionCompanion/ClientApp/src/styles.css |  4 ++
 6 files changed, 69 insertions(+), 22 deletions(-)

diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/registration/registration.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/registration/registration.component.html
index 59ac6f3..9f07043 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/registration/registration.component.html
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/registration/registration.component.html
@@ -1,6 +1,6 @@
   <div [formGroup]="signUpFormGroup" class="container">
     <div formGroupName="newAccount" class="container">
-      <mat-icon matSuffix class="arrow-back" (click)="GoToLoginPage()">arrow_back</mat-icon>
+      <mat-icon matSuffix class="arrow-back arrow-select" (click)="GoToLoginPage()">arrow_back</mat-icon>
       <div class="primary-text header">Create an Account</div>
 
       <mat-form-field class="form-container">
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.css b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.css
index ccf116c..41aa481 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.css
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.css
@@ -47,10 +47,6 @@ input {
   font-size: 20px;
 }
 
-.align-to-right {
-  text-align: right;
-}
-
 @media (max-width: 400px) {
   .container {
     margin-left: 0%;
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
index 178319d..fb89f12 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
@@ -1,21 +1,15 @@
 <div class="container">
-  <mat-icon matSuffix class="arrow-back" (click)="onArrowBackClick()">arrow_back</mat-icon>
+  <mat-icon matSuffix class="arrow-back arrow-select" (click)="onArrowBackClick()">arrow_back</mat-icon>
   <div class="primary-text header">Select character</div>
-    <mat-list >
+  <mat-list>
     <mat-divider></mat-divider>
-    <mat-list-item> Oweja 
-    <mat-icon matSuffix class="arrow-forward align-to-right" (click)="onCharacterClick()">arrow_forward</mat-icon>
+    <mat-list-item *ngFor="let character of characters">
+      <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>
+      <div mat-line> {{character.className}} level: {{character.level}}</div>
+      <mat-divider></mat-divider>
     </mat-list-item>
-    <mat-divider></mat-divider>
-    <mat-list-item> James 
-      <mat-icon matSuffix class="arrow-forward align-to-right" (click)="onCharacterClick()">arrow_forward</mat-icon>
-    </mat-list-item>
-    <mat-divider></mat-divider>
-    <mat-list-item> Legolas 
-      <mat-icon matSuffix class="arrow-forward align-to-right" (click)="onCharacterClick()">arrow_forward</mat-icon>
-    </mat-list-item>
-    <mat-divider></mat-divider>
-   </mat-list>
-
+  </mat-list>
 </div>
 
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
index 2409f57..6360982 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
@@ -1,12 +1,66 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 
+export interface Section {
+  name: string;
+  className: string;
+  level: number;
+}
+
 @Component({
   selector: 'app-select-character',
   templateUrl: './select-character.component.html',
   styleUrls: ['./select-character.component.css']
 })
 export class SelectCharacterComponent {
+  characters: Section[] = [
+    {
+      name: 'Oweja',
+      className: 'warrior',
+      level: 1,
+    },
+    {
+      name: 'James',
+      className: 'warrior',
+      level: 2,
+    },
+    {
+      name: 'Legolas',
+      className: 'warrior',
+      level: 3,
+    },
+    {
+      name: 'Oweja',
+      className: 'warrior',
+      level: 1,
+    },
+    {
+      name: 'James',
+      className: 'warrior',
+      level: 2,
+    },
+    {
+      name: 'Legolas',
+      className: 'warrior',
+      level: 3,
+    },
+    {
+      name: 'Oweja',
+      className: 'warrior',
+      level: 1,
+    },
+    {
+      name: 'James',
+      className: 'warrior',
+      level: 2,
+    },
+    {
+      name: 'Legolas',
+      className: 'warrior',
+      level: 3,
+    }
+  ];
+
   isExpanded = false;
 
   collapse() {
@@ -27,4 +81,3 @@ export class SelectCharacterComponent {
     this.router.navigate(['login'])
   }
 }
-
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.html
index 4e5cc02..6eede7b 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.html
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.html
@@ -1,6 +1,6 @@
   <div [formGroup]="signInFormGroup" class="container">
     <div formGroupName="signIn" class="container">
-    <mat-icon matSuffix class="arrow-back" (click)="onArrowBackClick()">arrow_back</mat-icon>
+    <mat-icon matSuffix class="arrow-back arrow-select" (click)="onArrowBackClick()">arrow_back</mat-icon>
     <div id="SignInText" class="primary-text header">Sign In</div>
 
       <mat-form-field class="form-container">
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/styles.css b/SessionCompanion/SessionCompanion/ClientApp/src/styles.css
index bd973fd..311e04a 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/styles.css
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/styles.css
@@ -73,6 +73,10 @@ mat-divider {
   border-top-color: #e9cca7 !important;
 }
 
+.arrow-select {
+  cursor: pointer;
+}
+
 html,
 body {
   height: 100%;

From 665ef65ec0d3c2812949dbf6f1dc26594ec51fcd Mon Sep 17 00:00:00 2001
From: Natalia Gawron <natgaw1@st.amu.edu.pl>
Date: Mon, 28 Dec 2020 17:03:53 +0100
Subject: [PATCH 2/3] conneted with backend - get user characters list

---
 .../ClientApp/src/app/app.module.ts           |  4 +-
 .../select-character.component.html           |  2 +-
 .../select-character.component.ts             | 88 ++++++-------------
 .../components/sign-in/sign-in.component.ts   |  5 +-
 .../src/app/store/actions/app.actions.ts      | 13 ++-
 .../src/app/store/reducers/app.reducer.ts     |  2 +
 .../src/services/character.service.ts         | 30 +++++++
 .../CharacterForLoginViewModel.ts             |  7 ++
 8 files changed, 83 insertions(+), 68 deletions(-)
 create mode 100644 SessionCompanion/SessionCompanion/ClientApp/src/services/character.service.ts
 create mode 100644 SessionCompanion/SessionCompanion/ClientApp/src/types/viewmodels/character-viewmodels/CharacterForLoginViewModel.ts

diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/app.module.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/app.module.ts
index a61df94..9a1d8a8 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/app.module.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/app.module.ts
@@ -26,6 +26,7 @@ import { StoreDevtoolsModule } from '@ngrx/store-devtools';
 import {environment} from '../environments/environment';
 import {SessionCompanionIconsModule} from './shared/sc-icons/session-companion-icons.module';
 import {reducers} from './store/models/app-state.model';
+import {CharacterService} from "../services/character.service";
 
 @NgModule({
   declarations: [
@@ -61,7 +62,8 @@ BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
     })
   ],
   providers: [
-    UserService
+    UserService,
+    CharacterService
   ],
   bootstrap: [AppComponent]
 })
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
index fb89f12..69f592c 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
@@ -3,7 +3,7 @@
   <div class="primary-text header">Select character</div>
   <mat-list>
     <mat-divider></mat-divider>
-    <mat-list-item *ngFor="let character of characters">
+    <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>
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
index 6360982..0581f28 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
@@ -1,83 +1,47 @@
-import { Component } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
 import { Router } from '@angular/router';
-
-export interface Section {
-  name: string;
-  className: string;
-  level: number;
-}
+import {first} from "rxjs/operators";
+import {ClearUserId} from "../../store/actions/app.actions";
+import {ErrorResponse} from "../../../types/ErrorResponse";
+import {HttpErrorResponse} from "@angular/common/http";
+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";
 
 @Component({
   selector: 'app-select-character',
   templateUrl: './select-character.component.html',
   styleUrls: ['./select-character.component.css']
 })
-export class SelectCharacterComponent {
-  characters: Section[] = [
-    {
-      name: 'Oweja',
-      className: 'warrior',
-      level: 1,
-    },
-    {
-      name: 'James',
-      className: 'warrior',
-      level: 2,
-    },
-    {
-      name: 'Legolas',
-      className: 'warrior',
-      level: 3,
-    },
-    {
-      name: 'Oweja',
-      className: 'warrior',
-      level: 1,
-    },
-    {
-      name: 'James',
-      className: 'warrior',
-      level: 2,
-    },
-    {
-      name: 'Legolas',
-      className: 'warrior',
-      level: 3,
-    },
-    {
-      name: 'Oweja',
-      className: 'warrior',
-      level: 1,
-    },
-    {
-      name: 'James',
-      className: 'warrior',
-      level: 2,
-    },
-    {
-      name: 'Legolas',
-      className: 'warrior',
-      level: 3,
-    }
-  ];
+export class SelectCharacterComponent implements OnInit {
+  charactersList: CharacterForLoginViewModel[];
 
-  isExpanded = false;
+  constructor(private router: Router, private store: Store<AppState>, private characterService: CharacterService) {}
 
-  collapse() {
-    this.isExpanded = false;
+  ngOnInit() {
+    this.getUserCharactersList();
   }
 
-  toggle() {
-    this.isExpanded = !this.isExpanded;
+  getUserCharactersList() {
+    this.store.select(s => s.appStore.userId).pipe(first()).subscribe((userId) => {
+      this.characterService.getUserCharactersList(userId).pipe(first()).subscribe((charactersList) => {
+        this.charactersList =  charactersList;
+      }, (error: ErrorResponse | HttpErrorResponse) => {
+        if(error instanceof HttpErrorResponse){
+          error = error.error as ErrorResponse
+        }
+        console.error(error.message)
+      } )
+    });
   }
 
-  constructor(private router: Router) {}
-
   onCharacterClick(){
     this.router.navigate(['player'])
   }
 
   onArrowBackClick(){
+    this.store.dispatch(new ClearUserId())
     this.router.navigate(['login'])
   }
 }
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.ts
index 9f2734b..1bf5263 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/sign-in/sign-in.component.ts
@@ -9,6 +9,7 @@ import {AppStoreModel} from '../../store/models/app-store.model';
 import {select, Store} from '@ngrx/store';
 import {AddUserId} from '../../store/actions/app.actions';
 import {AppState} from 'src/app/store/models/app-state.model';
+import {first} from "rxjs/operators";
 
 @Component({
   selector: 'app-sign-in',
@@ -43,9 +44,9 @@ export class SignInComponent implements OnDestroy, OnInit {
 
   onLoginButtonClick() {
     let role = '';
-    this.store.select(s => s.appStore.role).subscribe((v) => {
+    this.store.select(s => s.appStore.role).pipe(first()).subscribe((v) => {
       role = v;
-    }).unsubscribe();
+    });
     this.allSubscriptions.add(
       this.userService.tryLogin(
       this.signInFormGroup.get('signIn').value['username'],
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts
index 4b2b34b..73a3584 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts
@@ -3,7 +3,8 @@ import { Action } from '@ngrx/store';
 
 export enum AppActionTypes {
   ADD_USER_ID = '[APP] Add user id',
-  ADD_ROLE = '[APP] Add role'
+  ADD_ROLE = '[APP] Add role',
+  CLEAR_USER_ID = '[APP] Clear user id'
 }
 
 export class AddUserId implements Action {
@@ -20,4 +21,12 @@ export class AddRole implements Action {
   }
 }
 
-export type AppAction = AddUserId | AddRole;
+export class ClearUserId implements Action {
+  readonly type = AppActionTypes.CLEAR_USER_ID;
+
+  constructor() {
+  }
+
+}
+
+export type AppAction = AddUserId | AddRole | ClearUserId;
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/app.reducer.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/app.reducer.ts
index 777c63a..d86c636 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/app.reducer.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/app.reducer.ts
@@ -12,6 +12,8 @@ export function AppReducer(state: AppStoreModel = initialState, action: AppActio
       return {...state, userId: action.payload.userId};
     case AppActionTypes.ADD_ROLE:
       return {...state, role: action.payload.role};
+    case AppActionTypes.CLEAR_USER_ID:
+      return {...state, userId: null};
     default:
       return state;
   }
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/services/character.service.ts b/SessionCompanion/SessionCompanion/ClientApp/src/services/character.service.ts
new file mode 100644
index 0000000..01180af
--- /dev/null
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/services/character.service.ts
@@ -0,0 +1,30 @@
+import {Inject, Injectable} from '@angular/core';
+import {HttpClient, HttpParams} from '@angular/common/http';
+import {Observable, of, throwError} from 'rxjs';
+import {ErrorResponse} from '../types/ErrorResponse';
+import {Either} from '../types/Either';
+import {switchMap} from 'rxjs/operators';
+import {CharacterForLoginViewModel} from "../types/viewmodels/character-viewmodels/CharacterForLoginViewModel";
+
+Injectable({
+  providedIn: 'root'
+})
+export class CharacterService {
+  private baseUrl = 'api/character/';
+  constructor(private http: HttpClient, @Inject('BASE_URL') baseUrl: string) {
+    this.baseUrl = baseUrl + this.baseUrl;
+  }
+
+  getUserCharactersList(userId: number): Observable<CharacterForLoginViewModel[]> {
+    const params = new HttpParams().set('userId', userId.toString())
+    return this.http.get<Either<CharacterForLoginViewModel[], ErrorResponse>>(this.baseUrl + 'userCharactersList', {params}).pipe(
+      switchMap(response => {
+        if (response.isLeft) {
+          return of(response.left);
+        } else {
+          return throwError(response.right);
+        }
+      })
+    );
+  }
+}
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/types/viewmodels/character-viewmodels/CharacterForLoginViewModel.ts b/SessionCompanion/SessionCompanion/ClientApp/src/types/viewmodels/character-viewmodels/CharacterForLoginViewModel.ts
new file mode 100644
index 0000000..fa9c0d8
--- /dev/null
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/types/viewmodels/character-viewmodels/CharacterForLoginViewModel.ts
@@ -0,0 +1,7 @@
+export interface CharacterForLoginViewModel {
+  id: number;
+  userId: number;
+  name: string;
+  className: string;
+  level: number;
+}

From 18d1b75c4ab8003a81b120a2080975419a3fe3a8 Mon Sep 17 00:00:00 2001
From: Natalia Gawron <natgaw1@st.amu.edu.pl>
Date: Mon, 28 Dec 2020 17:39:55 +0100
Subject: [PATCH 3/3] connected with backend - select character

---
 .../select-character.component.html               |  2 +-
 .../select-character.component.ts                 |  4 +++-
 .../src/app/store/actions/app.actions.ts          |  6 +++---
 .../src/app/store/actions/player.action.ts        | 15 +++++++++++++++
 .../src/app/store/models/app-state.model.ts       |  4 ++++
 .../src/app/store/models/player-store.model.ts    |  3 +++
 .../src/app/store/reducers/player.reducer.ts      | 15 +++++++++++++++
 7 files changed, 44 insertions(+), 5 deletions(-)
 create mode 100644 SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/player.action.ts
 create mode 100644 SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/player-store.model.ts
 create mode 100644 SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/player.reducer.ts

diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
index 69f592c..5eae2cc 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.html
+++ b/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>
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
index 0581f28..5331821 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/components/select-character/select-character.component.ts
+++ b/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'])
   }
 
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts
index 73a3584..362b983 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/app.actions.ts
@@ -1,5 +1,4 @@
-import {AppStoreModel} from '../models/app-store.model';
-import { Action } from '@ngrx/store';
+import {Action} from '@ngrx/store';
 
 export enum AppActionTypes {
   ADD_USER_ID = '[APP] Add user id',
@@ -26,7 +25,8 @@ export class ClearUserId implements Action {
 
   constructor() {
   }
-
 }
 
+
+
 export type AppAction = AddUserId | AddRole | ClearUserId;
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/player.action.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/actions/player.action.ts
new file mode 100644
index 0000000..45c74d8
--- /dev/null
+++ b/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;
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/app-state.model.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/app-state.model.ts
index 8d87023..7fda9a7 100644
--- a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/app-state.model.ts
+++ b/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,
 };
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/player-store.model.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/player-store.model.ts
new file mode 100644
index 0000000..8cc606f
--- /dev/null
+++ b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/models/player-store.model.ts
@@ -0,0 +1,3 @@
+export interface PlayerStoreModel {
+  characterId: number;
+}
diff --git a/SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/player.reducer.ts b/SessionCompanion/SessionCompanion/ClientApp/src/app/store/reducers/player.reducer.ts
new file mode 100644
index 0000000..33cc4b6
--- /dev/null
+++ b/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;
+  }
+}