Error could not find react-redux context value; please ensure the component is wrapped in a <Provider> in React Native

I get the error below after setting up Redux Toolkit on my React Native application.

Error: Could not find react-redux context value; please ensure the component is wrapped in a <Provider>

This happens when i add useDispatch to the code. Below is my app.js file

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View, Image, Pressable } from 'react-native';
import ImageViewer from './components/ImageViewer';
import ButtonOne from './components/ButtonOne';
import * as ImagePicker from 'expo-image-picker'
import { useState } from 'react';
import IconButton from './components/IconButton';
import CircleButton from './components/CircleButton';
import EmojiPicker from "./components/EmojiPicker";
import EmojiList from './components/EmojiList';
import { Provider } from 'react-redux';
import { store } from './ReduxStore/store'
import { useSelector, useDispatch } from 'react-redux'
import { decrement, increment } from './ReduxStore/features/counter/counterSlice';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
// import { hello } from './modules/my-module';

import { GestureHandlerRootView } from "react-native-gesture-handler";
import ImageEditPage from './components/pages/ImagEditPage';
import CounterPage from './components/pages/counterPage';
const Stack = createNativeStackNavigator();
export default function App() {
  const count = useSelector((state) => state.counter.value)
  const dispatch = useDispatch()
  const placeholderImage = require('./assets/images/background-image.png')
  const [selectImage, setSelectImage] = useState(null)
  const [isModalVisible, setIsModalVisible] = useState(false);
  const [showAppOptions, setShowAppOptions] = useState(false)
  const [pickedEmoji, setPickedEmoji] = useState(null);
  const pickImage = async () => {
    alert("clcik")
    let result = await ImagePicker.launchImageLibraryAsync({
      allowsEditing: true,
      quality: 1
    });

    if (!result.canceled) {
      console.log("res", result)
      setSelectImage(result.assets[0].uri)
      setShowAppOptions(true)
    }
    else {
      alert('You did not select any image')
    }
  }

  const onReset = () => {
    setShowAppOptions(false)
  }

  const onAddSticker = () => {
    //
    setIsModalVisible(true);
  }
  const onModalClose = () => {
    setIsModalVisible(false);
  };


  const onSaveImageAsync = async () => {
    console.log("ghfh")
  }

  const toggleOptions = () => {
    setShowAppOptions(true)
  }

  const [currentVal, setcurrentVal] = useState(0)

  return (
    <NavigationContainer>
      <Provider store={store}>
        <GestureHandlerRootView style={styles.container}>
          <Stack.Navigator>
            <Stack.Screen
              name="Home"
              component={ImageEditPage}
              options={{ title: 'Welcome' }}
            />
            <Stack.Screen name="Counter" component={CounterPage} />
          </Stack.Navigator>


        </GestureHandlerRootView>
      </Provider>
    </NavigationContainer>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#25292e',
    alignItems: 'center',
    justifyContent: 'center',
    color: "#fff"
  },
  textColor: {
    color: '#fff'
  },
  imageContainer: {
    flex: 1,
    paddingTop: 50

  },
  optionsContainer: {
    position: 'absolute',
    bottom: 80,
  },
  optionsRow: {
    alignItems: 'center',
    flexDirection: 'row'
  }

}

);