Sanity GROQ Query Not Working in React Native App

Question

I am building a react native project using react native expo and sanity cms. I have done the proper set up of sanity cms and also its schema. I have added the data in the localhost:333 server of sanity cms as well as deployed it. Also i find no CORS errors also. But one issue i am facing is regarding not able to fetch the data from sanity cms. I am running the query to fetch data sanity cms server that query is working fine in sanity cms vision section we run the queries to check them , there it is working fine also the apiVersion and all is also set properly in the sanity client in my react native app.

The Error I get constantly is "Error: no query"

Below is the code for my HomeScreen.jsx which is inside the src/screens

import React, { useLayoutEffect, useState, useEffect } from "react";
import {
  View,
  Text,
  SafeAreaView,
  Image,
  TextInput,
  ScrollView,
} from "react-native";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import {
  UserIcon,
  ChevronDownIcon,
  AdjustmentsVerticalIcon,
  MagnifyingGlassIcon,
} from "react-native-heroicons/outline";
import Categories from "../components/Categories";
import FeaturedRow from "../components/FeaturedRow";
import client from "../sanity.js";

const HomeScreen = ({ navigation }) => {
  const insets = useSafeAreaInsets();

  const [featuredCategories, setFeaturedCategories] = useState([]);

  useLayoutEffect(() => {
    navigation.setOptions({
      headerShown: false,
    });
  }, []);

  useEffect(() => {
    client
      .fetch(
        `
          *[_type == "featured"]{
            ...,
           restaurants[]->{
              ...,
              dishes[]->
           }
           }
        `
      )
      .then((data) => {
        console.log(data);
      })
      .catch((err) => {
        console.log("Error Occured", err);
      });
  }, []);

  // console.log(featuredCategories);

  return (
    <SafeAreaView
      style={{
        paddingTop: insets.top,
      }}
      className="bg-white pt-5"
    >
      <View className="flex-row pb-3 items-center mx-2 space-x-2">
        <Image
          source={{
            uri: "https://links.papareact.com/wru",
          }}
          className="h-7 w-7 bg-gray-300 p-4 rounded-full"
        />

        <View className="flex-1">
          <Text className="font-bold text-gray-400 text-xs">Deliver Now!</Text>
          <View className="flex-row items-center">
            <Text className="font-bold text-xl">Current Location</Text>
            <ChevronDownIcon
              size={20}
              color="#00CCBB"
              style={{ marginLeft: 2 }}
            />
          </View>
        </View>

        <UserIcon size={25} color="#00CCBB" />
      </View>

      {/* Search */}
      <View className="flex-row items-center space-x-2 pb-2 mx-2">
        <View className="flex-row space-x-2 flex-1 bg-gray-200 p-3">
          <MagnifyingGlassIcon size={25} color="#00CCBB" />
          <TextInput
            placeholder="Resturants and Cuisines"
            keyboardType="default"
          />
        </View>

        <AdjustmentsVerticalIcon size={25} color="#00CCBB" />
      </View>

      {/* Main Content Body */}
      <ScrollView
        className="bg-gray-100"
        contentContainerStyle={{
          paddingBottom: 120,
        }}
      >
        {/* Categories */}
        <Categories />

        {/* Featured*/}
        <FeaturedRow
          id="1"
          title="Featured"
          description="Paid Placements for our parnters"
        />

        {/* Tasty Discounts */}
        <FeaturedRow
          id="2"
          title="Tasty Discounts"
          description="Everyone been enjoying this juicy discounts!"
        />

        {/* Offers Near You */}
        <FeaturedRow
          id="3"
          title="Offers near you!"
          description="why not support your local resturant tonight"
        />
      </ScrollView>
    </SafeAreaView>
  );
};

export default HomeScreen;

Below is the code for the sanity client set up which is inside the src folder.

import { createClient } from "@sanity/client";
import imageUrlBuilder from "@sanity/image-url";

const client = createClient({
  projectId: 'myprojectId',
  dataset: 'production',
  useCdn: true,
  apiVersion: '2022-03-07',
});


export default client;

const builder = imageUrlBuilder(client);

export const urlFor = (source) => builder.image(source);

Also my sanity client package version, react native and expo version is "@sanity/client": "^6.15.7", "react-native": "0.72.10", "expo": "~49.0.15",

**Also i am using my person mobile device to run the expo app on device not any android or ios emulators.

So what is the solution for this ?