notify user if is necessary

src/const/texts.ts

@@ -6,7 +6,7 @@ export type Texts = {
     YourTurn: string,
     OpponentTurn: string,
     GameEnded: string,
-    GameCrashed: string,
+    InternalErrorOccurred: string,
     YouWon: string,
     Won: string,
     YouLost: string,
@@ -28,7 +28,10 @@ export type Texts = {
     Loading: string,
     Playing: string,
     Error: string,
-    ErrorWhenRetrievingInformation: string;
+    ErrorWhenRetrievingInformation: string,
+    UCanOnlyPlayYourOwnPits: string,
+    UMustWaitUntilCurrentMoveComplete: string,
+    UCanNotPlayEmptyPit: string,
 }
 
 export const EnUs: Texts = {
@@ -38,7 +41,7 @@ export const EnUs: Texts = {
     YourTurn: "Your Turn",
     OpponentTurn: "Opponent Turn",
     GameEnded: "Game Ended",
-    GameCrashed: "Game Crashed",
+    InternalErrorOccurred: "An internal error has occurred",
     YouWon: "You Won",
     Won: "Won",
     YouLost: "You Lost",
@@ -60,7 +63,11 @@ export const EnUs: Texts = {
     Loading: "Loading",
     Playing: "Playing",
     Error: "Error",
-    ErrorWhenRetrievingInformation: "An error occured when retrieving information!"
+    ErrorWhenRetrievingInformation: "An error occured when retrieving information!",
+    UCanOnlyPlayYourOwnPits: "You can only play your own pits",
+    UMustWaitUntilCurrentMoveComplete: "You must wait until the current move is complete",
+    UCanNotPlayEmptyPit: "You can not play empty pit",
+    
 }
 
 export const TrTr: Texts = {
@@ -70,7 +77,7 @@ export const TrTr: Texts = {
     YourTurn: "Sıra Sende",
     OpponentTurn: "Sıra Rakipte",
     GameEnded: "Oyun Bitti",
-    GameCrashed: "Oyunda Hata Oluştu",
+    InternalErrorOccurred: "Dahili bir hata oluştu",
     YouWon: "Kazandın",
     Won: "Kazandı",
     YouLost: "Kaybettin",
@@ -92,5 +99,8 @@ export const TrTr: Texts = {
     Loading: "Yükleniyor",
     Playing: "Oynuyor",
     Error: "Hata",
-    ErrorWhenRetrievingInformation: "Bilgiler toplanırken bir hata oluştu!"
+    ErrorWhenRetrievingInformation: "Bilgiler toplanırken bir hata oluştu!",
+    UCanOnlyPlayYourOwnPits: "Sadece sana ait olan kuyular ile oynayabilirsin",
+    UMustWaitUntilCurrentMoveComplete: "Devam eden haraketin bitmesini beklemelisin",
+    UCanNotPlayEmptyPit: "Boş kuyu ile oynayamazsın",
 }

src/routes/GamePage.tsx

@@ -28,6 +28,7 @@ import { getColorByBrightness } from '../util/ColorUtil';
 import BoardViewModel from '../viewmodel/BoardViewModel';
 import Center from '../components/Center';
 import { Game, GameUsersConnectionInfo } from '../models/Game';
+import notyf from '../util/Notyf';
 
 const GamePage: FunctionComponent<{
     context: Context,
@@ -89,6 +90,7 @@ const GamePage: FunctionComponent<{
     }
     const onGameCrashed = (message: any) => {
         const newCrashMessage = message as string;
+        notyf.error(context.texts.InternalErrorOccurred);
         console.error("on_game_crash");
         console.error(newCrashMessage);
     }
@@ -147,21 +149,26 @@ const GamePage: FunctionComponent<{
         if (!game || isSpectator || !userKey) {
             return;
         }
+        if(game.mancalaGame.getPlayerIdByIndex(index) !== userKey) {
+            notyf.error(context.texts.UCanOnlyPlayYourOwnPits);
+            return;
+        }
         const pitIndexForUser = index % (game.mancalaGame.board.totalPitCount() / 2);
-        if (game.mancalaGame.getPlayerIdByIndex(index) !== userKey ||
-            !game.mancalaGame.canPlayerMove(userKey, pitIndexForUser)) {
+        if (!game.mancalaGame.canPlayerMove(userKey, pitIndexForUser)) {
+            notyf.error(context.texts.OpponentTurn);
             return;
         }
         if (checkHasAnOngoingAction()) {
+            notyf.error(context.texts.UMustWaitUntilCurrentMoveComplete);
             return;
         }
-        setHasOngoingAction(true);
         if (!boardViewModel) return;
         //TODO: this check should be in mancala.js
         if (pit.stoneCount === 0) {
-            //TODO : warn user
+            notyf.error(context.texts.UCanNotPlayEmptyPit);
             return;
         }
+        setHasOngoingAction(true);
         boardViewModel.pits[getBoardIndex(pitIndexForUser)].pitColor =
             context.themeManager.theme.pitSelectedColor;
         updateBoardViewModel(boardViewModel);

src/util/Notyf.ts

@@ -0,0 +1,4 @@
+import { Notyf } from 'notyf';
+import 'notyf/notyf.min.css'; 
+const notyf = new Notyf();
+export default notyf;