make thwClient generic

src/components/block-content-ui/cmsClient.ts

@@ -7,10 +7,11 @@ import {
  SanityRef, SanityTransformHwHomePage
 } from '../../common/sanityIo/Types'
 
-import {WhySwitchSectionType} from "../BlockContentTypes";
+import {ThwServiceItemType, WhySwitchSectionType} from "../BlockContentTypes";
 import GroqQueries from "../../utils/groqQueries";
 import groqQueries from "../../utils/groqQueries";
 import {SanityHomePage} from "./static-pages/cmsStaticPagesClient";
+import {useQuery} from "react-query";
 
 const fetchLandingPage = (slug: string): Promise<SanityLandingPage> => {
  return sanityClient
@@ -292,6 +293,167 @@ const fetchRefs = async (sanityRefs: SanityRef[]): Promise<any> => {
  return Promise.all([...services, otherRefs])
 }
 
+const useFetchPageBySlugQuery = (slug: string) => {
+ console.log("slug", slug)
+ return useQuery(
+ ['fetchPageBySlug', slug],
+ async ({queryKey}) => {
+ const [_, pageSlug] = queryKey
+
+ console.log(" Lookin for page with slug", pageSlug, queryKey)
+ if (pageSlug) {
+ return sanityClient
+ .fetch(
+ `*[slug.current == $pageSlug && _type == "homePage"]{
+ ${groqQueries.HOMEPAGE}
+ }`, {pageSlug})
+ .then((result) => {
+ if (result.length === 0) {
+ return Promise.reject(Error("No results returned"))
+ }
+ return result[0]
+ }).catch(() => {
+ return Promise.reject(Error("Sanity Error getting pageSlug " + pageSlug))
+ })
+ } else {
+ return Promise.reject(Error("No page slug passed"))
+ }
+ },
+ {}
+ );
+}
+const useFetchMenuBySlugQuery = (menuSlug: string) => {
+ console.log("fetching menu with slug", menuSlug)
+ return useQuery(
+ menuSlug,
+ () => {
+ return sanityClient
+ .fetch(
+ `*[slug.current == $menuSlug]{
+ ${GroqQueries.MENUGROUPCONTAINER}
+ }`, {menuSlug: menuSlug ?? 'header-menu'}
+ )
+ .then((data: SanityMenuContainer[]) => {
+ return data[0]
+ })
+ },
+ {
+ staleTime: Infinity,
+ refetchInterval: false,
+ refetchOnWindowFocus: false
+ }
+ );
+}
+
+const useFetchMenuByRefQuery = (headerMenuRef?: SanityRef) => {
+ console.log("fetching menu with ref", headerMenuRef)
+
+ const menuId = headerMenuRef?._ref ?? "no-id"
+
+ return useQuery(
+ menuId,
+ () => {
+ return sanityClient
+ .fetch(
+ `*[_id == $menuId && _type == "menuContainer"]{
+ ${groqQueries.MENUGROUPCONTAINER}
+ }`, {menuId})
+ .then((result) => {
+ if (result.length === 0) {
+
+ return Promise.reject(Error("No results returned"))
+ }
+ return result[0]
+ }).catch(() => {
+ return Promise.reject(Error("Sanity Error getting pageSlug " + menuId))
+ })
+ },
+ {
+ staleTime: Infinity,
+ refetchInterval: false,
+ refetchOnWindowFocus: false,
+ refetchOnMount: false,
+ }
+ );
+
+}
+
+//
+// const fetchLandingPageFooterMenu = (footerSlug?: string): Promise<SanityMenuContainer> => {
+// const slug = footerSlug ?? 'footer-menu'
+//
+// return sanityClient
+// .fetch(
+// `*[_type=="menuContainer" && slug.current == $slug]{
+// ${GroqQueries.MENUGROUPCONTAINER}
+// }`, {slug}
+// )
+// .then((data: SanityMenuContainer[]) => {
+// return data[0]
+// })
+// }
+
+const useFetchRefsQuery = (refs: SanityRef[]) => {
+ return useQuery(
+ ['fetchRefs'],
+ async () => {
+ return fetchRefs(refs)
+ .then((results: any[]) => {
+ if (results.length === 0) {
+ console.log("whew! after fetching a bunch of refs ", results)
+ }
+ return results
+ }).catch((e: any) => {
+ console.log("error getting services", e)
+ return []
+ })
+ },
+ {
+ staleTime: Infinity,
+ refetchInterval: false,
+ refetchOnWindowFocus: false
+ }
+ );
+}
+
+
+const useFetchServicesQuery = (pageSlug?: string) => {
+ return useQuery(
+ 'fetchServices',
+ async () => {
+ console.log("fetchings services", pageSlug)
+ const serviceSlug = pageSlug
+
+ let serviceSlugClause: string = ''
+ if (serviceSlug) {
+ serviceSlugClause = " && slug.current != $serviceSlug"
+ }
+
+ const query = `*[_type == "transformServiceItem"${serviceSlugClause}]{
+ ${groqQueries.SERVICE}
+ }`
+
+ const params = serviceSlug ? {serviceSlug: serviceSlug} : {}
+
+ return sanityClient
+ .fetch(query, params)
+ .then((results: ThwServiceItemType[]) => {
+ if (results.length === 0) {
+ console.log("No Services present")
+ }
+ return results
+ }).catch((e: any) => {
+ console.log("error getting services", e)
+ return []
+ })
+ }
+ , {
+ staleTime: Infinity,
+ refetchInterval: false,
+ refetchOnWindowFocus: false
+ });
+}
+
 export default {
  fetchRef,
  fetchRefs,
@@ -305,5 +467,10 @@ export default {
  fetchLandingPageFooterMenu,
  fetchBlogCategories,
  fetchBlogGroup,
- fetchWhySwitch
+ fetchWhySwitch,
+ useFetchPageBySlugQuery,
+ useFetchMenuBySlugQuery,
+ useFetchServicesQuery,
+ useFetchRefsQuery,
+ useFetchMenuByRefQuery
 }

src/components/page-context/PageProvider.tsx

@@ -1,10 +1,10 @@
 import React, {FunctionComponent, PropsWithChildren, useContext, useMemo, useReducer,} from 'react';
 import {SanityMenuContainer, SanityTransformHwHomePage} from "../../common/sanityIo/Types";
-import thwClient from "../transform-hw/thwClient";
 import {ThwServiceItemNoRefType} from "../BlockContentTypes";
 import PageContext from './PageContext';
 import SnackbarContext from "../modal-context/SnackbarContext";
 import {v4 as uuidv4} from 'uuid'
+import cmsClient from "../block-content-ui/cmsClient";
 type IProps = {};
 
 type PageProviderState = {
@@ -82,7 +82,7 @@ const PageProvider: FunctionComponent<IProps & PropsWithChildren> = (
  const [state, dispatch] = useReducer(reducer, initialState)
 
 
- const loadedPageQuery = thwClient.useFetchPageBySlugQuery(state.pageSlug)
+ const loadedPageQuery = cmsClient.useFetchPageBySlugQuery(state.pageSlug)
 
  React.useEffect(() => {
  if (state.analyticsId) {