Add empty headers to all graphql queries and mutations to fix the arg issue

Author: bhavabhuthi

app/[locale]/(user)/categories/[categorySlug]/page.tsx

@@ -1,18 +1,18 @@
 'use client';
 
+import { useEffect, useReducer, useState } from 'react';
+import Image from 'next/image';
+import { useRouter } from 'next/navigation';
 import GraphqlPagination from '@/app/[locale]/dashboard/components/GraphqlPagination/graphqlPagination';
 import { fetchDatasets } from '@/fetch';
 import { graphql } from '@/gql';
 import { useQuery } from '@tanstack/react-query';
-import Image from 'next/image';
-import { useRouter } from 'next/navigation';
 import { Pill, SearchInput, Select, Text } from 'opub-ui';
-import { useEffect, useReducer, useState } from 'react';
 
+import { GraphQL } from '@/lib/api';
 import BreadCrumbs from '@/components/BreadCrumbs';
 import { ErrorPage } from '@/components/error';
 import { Loading } from '@/components/loading';
-import { GraphQL } from '@/lib/api';
 import Card from '../../datasets/components/Card';
 import Filter from '../../datasets/components/FIlter/Filter';
 
@@ -171,7 +171,13 @@ const CategoryDetailsPage = ({ params }: { params: { categorySlug: any } }) => {
     isLoading: boolean;
     isError: boolean;
   } = useQuery([`get_category_details_${params.categorySlug}`], () =>
-    GraphQL(categoryQueryDoc, { filters: { slug: params.categorySlug } })
+    GraphQL(
+      categoryQueryDoc,
+      {
+        // Entity Headers if present
+      },
+      { filters: { slug: params.categorySlug } }
+    )
   );
 
   const [facets, setFacets] = useState<{

app/[locale]/(user)/categories/page.tsx

@@ -1,15 +1,15 @@
 'use client';
 
-import { graphql } from '@/gql';
-import { useQuery } from '@tanstack/react-query';
 import Image from 'next/image';
 import Link from 'next/link';
+import { graphql } from '@/gql';
+import { useQuery } from '@tanstack/react-query';
 import { Text } from 'opub-ui';
 
+import { GraphQL } from '@/lib/api';
 import BreadCrumbs from '@/components/BreadCrumbs';
 import { ErrorPage } from '@/components/error';
 import { Loading } from '@/components/loading';
-import { GraphQL } from '@/lib/api';
 
 const categoriesListQueryDoc: any = graphql(`
   query CategoriesList {
@@ -30,7 +30,13 @@ const CategoriesListingPage = () => {
     error: any;
     isError: boolean;
   } = useQuery([`categories_list_page`], () =>
-    GraphQL(categoriesListQueryDoc, [])
+    GraphQL(
+      categoriesListQueryDoc,
+      {
+        // Entity Headers if present
+      },
+      []
+    )
   );
 
   return (

app/[locale]/(user)/datasets/[datasetIdentifier]/components/AccessModels/index.tsx

@@ -124,9 +124,15 @@ const AccessModels = () => {
   const { data, error, isLoading } = useQuery(
     [`accessmodel_${params.datasetIdentifier}`],
     () =>
-      GraphQL(accessModelResourcesQuery, {
-        datasetId: params.datasetIdentifier,
-      })
+      GraphQL(
+        accessModelResourcesQuery,
+        {
+          // Entity Headers if present
+        },
+        {
+          datasetId: params.datasetIdentifier,
+        }
+      )
   );
 
   return (

app/[locale]/(user)/datasets/[datasetIdentifier]/components/Details/index.tsx

@@ -45,9 +45,15 @@ const Details = () => {
   }: { data: any; isLoading: boolean; refetch: any } = useQuery(
     [`chartdata_${params.datasetIdentifier}`],
     () =>
-      GraphQL(charts, {
-        datasetId: params.datasetIdentifier,
-      })
+      GraphQL(
+        charts,
+        {
+          // Entity Headers if present
+        },
+        {
+          datasetId: params.datasetIdentifier,
+        }
+      )
   );
 
   return (

app/[locale]/(user)/datasets/[datasetIdentifier]/components/Resources/index.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useState, useEffect, useRef } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import Link from 'next/link';
 import { useParams } from 'next/navigation';
 import { graphql } from '@/gql';
@@ -49,12 +49,21 @@ const Resources = () => {
 
   const { data, isLoading } = useQuery(
     [`resources_${params.datasetIdentifier}`],
-    () => GraphQL(datasetResourceQuery, { datasetId: params.datasetIdentifier })
+    () =>
+      GraphQL(
+        datasetResourceQuery,
+        {
+          // Entity Headers if present
+        },
+        { datasetId: params.datasetIdentifier }
+      )
   );
 
   // Use an object to manage the expanded state for each resource individually
   const [showMore, setShowMore] = useState<{ [key: number]: boolean }>({});
-  const [isDescriptionLong, setIsDescriptionLong] = useState<{ [key: number]: boolean }>({});
+  const [isDescriptionLong, setIsDescriptionLong] = useState<{
+    [key: number]: boolean;
+  }>({});
 
   const descriptionRefs = useRef<(HTMLDivElement | null)[]>([]);
 
@@ -70,7 +79,8 @@ const Resources = () => {
   useEffect(() => {
     descriptionRefs.current.forEach((descriptionElement, index) => {
       if (descriptionElement) {
-        const isLong = descriptionElement.scrollHeight > descriptionElement.clientHeight;
+        const isLong =
+          descriptionElement.scrollHeight > descriptionElement.clientHeight;
         setIsDescriptionLong((prevState) => ({
           ...prevState,
           [index]: isLong,
@@ -90,11 +100,11 @@ const Resources = () => {
           <Text variant="bodyLg" className="mx-6 lg:mx-0">
             Downloadable Resources
           </Text>
-          <div className="mx-6 lg:mx-0 mt-5 flex flex-col gap-8 bg-surfaceDefault p-6">
+          <div className="mx-6 mt-5 flex flex-col gap-8 bg-surfaceDefault p-6 lg:mx-0">
             {data?.datasetResources.map((item: any, index: number) => (
               <div key={index} className="flex flex-wrap justify-between gap-4">
                 <div className="gap flex flex-col lg:w-4/5">
-                  <div className="item flex gap-2 items-center">
+                  <div className="item flex items-center gap-2">
                     <Text variant="headingMd">{item.name}</Text>
                     <Tag>{item.fileDetails.format}</Tag>
                   </div>

app/[locale]/(user)/datasets/[datasetIdentifier]/page.tsx

@@ -55,7 +55,13 @@ const DatasetDetailsPage = () => {
   const params = useParams();
 
   const { data, isLoading } = useQuery([`${params.datasetIdentifier}`], () =>
-    GraphQL(datasetQuery, { filters: { id: params.datasetIdentifier } })
+    GraphQL(
+      datasetQuery,
+      {
+        // Entity Headers if present
+      },
+      { filters: { id: params.datasetIdentifier } }
+    )
   );
 
   return (

app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/charts/components/ChartsList.tsx

@@ -53,9 +53,15 @@ const ChartsList: React.FC<ChartsListProps> = ({
   }: { data: any; isLoading: boolean; refetch: any } = useQuery(
     [`chartDetails_${params.id}`],
     () =>
-      GraphQL(chartDetailsQuery, {
-        datasetId: params.id,
-      })
+      GraphQL(
+        chartDetailsQuery,
+        {
+          // Entity Headers if present
+        },
+        {
+          datasetId: params.id,
+        }
+      )
   );
 
   const [filteredRows, setFilteredRows] = useState<any[]>([]);
@@ -68,7 +74,14 @@ const ChartsList: React.FC<ChartsListProps> = ({
   }, [data, type]);
 
   const { mutate, isLoading: deleteLoading } = useMutation(
-    (data: { chartId: UUID }) => GraphQL(deleteResourceChart, data),
+    (data: { chartId: UUID }) =>
+      GraphQL(
+        deleteResourceChart,
+        {
+          // Entity Headers if present
+        },
+        data
+      ),
     {
       onSuccess: () => {
         toast('Chart Deleted Successfully');

app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/charts/components/ChartsVisualize.tsx

@@ -129,12 +129,25 @@ const ChartsVisualize: React.FC<VisualizationProps> = ({
 }) => {
   const params = useParams();
   const { data }: { data: any } = useQuery([`charts_${params.id}`], () =>
-    GraphQL(datasetResource, { datasetId: params.id })
+    GraphQL(
+      datasetResource,
+      {
+        // Entity Headers if present
+      },
+      { datasetId: params.id }
+    )
   );
 
   const { data: chartDetails, refetch }: { data: any; refetch: any } = useQuery(
     [`chartsdata_${params.id}`],
-    () => GraphQL(getResourceChartDetails, { chartDetailsId: chartId }),
+    () =>
+      GraphQL(
+        getResourceChartDetails,
+        {
+          // Entity Headers if present
+        },
+        { chartDetailsId: chartId }
+      ),
     {
       enabled: !!chartId, // Fetch only if chartId is available
     }
@@ -146,9 +159,15 @@ const ChartsVisualize: React.FC<VisualizationProps> = ({
   }: { data: any; isLoading: boolean; refetch: any } = useQuery(
     [`chartsList_${params.id}`],
     () =>
-      GraphQL(chartDetailsQuery, {
-        datasetId: params.id,
-      })
+      GraphQL(
+        chartDetailsQuery,
+        {
+          // Entity Headers if present
+        },
+        {
+          datasetId: params.id,
+        }
+      )
   );
 
   const [isSheetOpen, setIsSheetOpen] = useState(false);
@@ -223,7 +242,13 @@ const ChartsVisualize: React.FC<VisualizationProps> = ({
 
   const { mutate, isLoading: editMutationLoading } = useMutation(
     (chartInput: { chartInput: ResourceChartInput }) =>
-      GraphQL(createChart, chartInput),
+      GraphQL(
+        createChart,
+        {
+          // Entity Headers if present
+        },
+        chartInput
+      ),
     {
       onSuccess: (res: any) => {
         toast('Resource chart saved');

app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/components/AccessModelForm.tsx

@@ -105,7 +105,14 @@ const AccessModelForm: React.FC<AccessModelProps> = ({
   const params = useParams();
   const { data, isLoading }: { data: any; isLoading: boolean } = useQuery(
     [`resourcesList_${params.id}`],
-    () => GraphQL(datasetResourcesQuery, { datasetId: params.id })
+    () =>
+      GraphQL(
+        datasetResourcesQuery,
+        {
+          // Entity Headers if present
+        },
+        { datasetId: params.id }
+      )
   );
 
   const {
@@ -114,15 +121,29 @@ const AccessModelForm: React.FC<AccessModelProps> = ({
     refetch: accessModelListRefetch,
   }: { data: any; isLoading: boolean; refetch: any } = useQuery(
     [`accessModelList_${params.id}`],
-    () => GraphQL(accessModelListQuery, { datasetId: params.id })
+    () =>
+      GraphQL(
+        accessModelListQuery,
+        {
+          // Entity Headers if present
+        },
+        { datasetId: params.id }
+      )
   );
   const {
     data: accessModelDetails,
     refetch: accessModelDetailsRefetch,
     isLoading: accessModelDetailsLoading,
   }: { data: any; isLoading: boolean; refetch: any } = useQuery(
     [`accessModelDetails${params.id}`],
-    () => GraphQL(getAccessModelDetails, { accessModelId: accessModelId })
+    () =>
+      GraphQL(
+        getAccessModelDetails,
+        {
+          // Entity Headers if present
+        },
+        { accessModelId: accessModelId }
+      )
   );
 
   const [accessModelData, setAccessModelData] = useState({
@@ -288,7 +309,13 @@ const AccessModelForm: React.FC<AccessModelProps> = ({
 
   const { mutate, isLoading: editMutationLoading } = useMutation(
     (data: { accessModelInput: EditAccessModelInput }) =>
-      GraphQL(editaccessModel, data),
+      GraphQL(
+        editaccessModel,
+        {
+          // Entity Headers if present
+        },
+        data
+      ),
     {
       onSuccess: (res: any) => {
         // toast('Access Model Saved');

app/[locale]/dashboard/[entityType]/[entitySlug]/dataset/[id]/edit/components/AccessModelList.tsx

@@ -57,9 +57,15 @@ const AccessModelList: React.FC<AccessModelListProps> = ({
   }: { data: any; isLoading: boolean; refetch: any } = useQuery(
     [`accessModelList_${params.id}`],
     () =>
-      GraphQL(accessModelQuery, {
-        datasetId: params.id,
-      })
+      GraphQL(
+        accessModelQuery,
+        {
+          // Entity Headers if present
+        },
+        {
+          datasetId: params.id,
+        }
+      )
   );
 
   const [filteredRows, setFilteredRows] = useState<any[]>([]);
@@ -72,7 +78,14 @@ const AccessModelList: React.FC<AccessModelListProps> = ({
   }, [data, list]);
 
   const { mutate, isLoading: deleteLoading } = useMutation(
-    (data: { accessModelId: UUID }) => GraphQL(deleteAccessModel, data),
+    (data: { accessModelId: UUID }) =>
+      GraphQL(
+        deleteAccessModel,
+        {
+          // Entity Headers if present
+        },
+        data
+      ),
     {
       onSuccess: () => {
         toast('Access Model Deleted Successfully');