feat: added haptic

app/game/index.tsx

@@ -1,7 +1,9 @@
+import * as Haptics from 'expo-haptics';
+import { ImpactFeedbackStyle } from 'expo-haptics';
 import { useRouter } from 'expo-router';
 import { StatusBar } from 'expo-status-bar';
 import { useEffect } from 'react';
-import { Alert, View, Text } from 'react-native';
+import { Alert, Text, View } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 
 import { AvailableValues } from '../../components/available-values/available-values';
@@ -21,16 +23,21 @@ export default function Game() {
     const selectedCell = useAppSelector(appRootSelectedCellSelector);
     const mistakes = useAppSelector(appRootMistakesSelector);
 
-    useEffect(() => {
+    const handleWin = async () => {
         if (!hasBlankCells(field)[0]) {
+            await Haptics.impactAsync(ImpactFeedbackStyle.Heavy);
             router.push('winner');
         }
-    }, [field]);
-    useEffect(() => {
+    };
+    const handleLose = async () => {
         if (mistakes >= MaxMistakesConstant) {
+            await Haptics.impactAsync(ImpactFeedbackStyle.Heavy);
             router.push('loser');
         }
-    }, [mistakes]);
+    };
+
+    useEffect(() => void handleWin(), [field]);
+    useEffect(() => void handleLose(), [mistakes]);
 
     const handleExit = () => {
         Alert.alert('Stop current run?', 'All progress will be lost', [

package.json

@@ -14,6 +14,7 @@
         "expo": "~48.0.15",
         "expo-constants": "~14.2.1",
         "expo-font": "~11.1.1",
+        "expo-haptics": "~12.2.1",
         "expo-linking": "~4.0.1",
         "expo-router": "^1.5.3",
         "expo-splash-screen": "~0.18.2",

store/app-root/actions/app-root-select-value.action.ts

@@ -1,5 +1,6 @@
 import { createAsyncThunk } from '@reduxjs/toolkit';
 import { isDefined } from '@rnw-community/shared';
+import * as Haptics from 'expo-haptics';
 
 import { BlankCellValueContant } from '../../../constants/blank-cell-value.contant';
 import { isCorrectCell } from '../../../utils/field/is-correct-cell.util';
@@ -20,9 +21,13 @@ export const appRootSelectValueAction = createAsyncThunk<boolean, number, { disp
                 // TODO: Add logic for group animation
                 // TODO: Add score logic
 
+                await Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
+
                 return true;
             } else {
                 thunkAPI.dispatch(appRootMadeAMistake());
+                await Haptics.notificationAsync(Haptics.NotificationFeedbackType.Error);
+
                 // TODO: Add logic for mistake and game over
             }
         }

yarn.lock

@@ -6519,6 +6519,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"expo-haptics@npm:~12.2.1":
+  version: 12.2.1
+  resolution: "expo-haptics@npm:12.2.1"
+  peerDependencies:
+    expo: "*"
+  checksum: b64d9eb3adf7ea514d50393f3aec0ecda869aac0fa56469ef2f4310b6a66e7dd06f7ebbefd7ded6151b131da39450767b2bccb451249ded6675479d55984d264
+  languageName: node
+  linkType: hard
+
 "expo-keep-awake@npm:~12.0.1":
   version: 12.0.1
   resolution: "expo-keep-awake@npm:12.0.1"
@@ -13195,6 +13204,7 @@ __metadata:
     expo: ~48.0.15
     expo-constants: ~14.2.1
     expo-font: ~11.1.1
+    expo-haptics: ~12.2.1
     expo-linking: ~4.0.1
     expo-router: ^1.5.3
     expo-splash-screen: ~0.18.2