From 94d60eb5bd36a6f4b9ccb968799cc68e97164b85 Mon Sep 17 00:00:00 2001
From: LightOfHeaven1994 <eshamard@redhat.com>
Date: Wed, 8 Oct 2025 16:38:36 +0200
Subject: [PATCH] feat(useQueryWithUtilities): Return useQuery refetch function

---
 .../useQueryWithUtilities.js                  |  2 +
 .../useQueryWithUtilities.stories.js          | 53 +++++++++++++++++++
 2 files changed, 55 insertions(+)

diff --git a/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.js b/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.js
index 7f89580..bb23347 100644
--- a/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.js
+++ b/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.js
@@ -48,6 +48,7 @@ const useQueryWithUtilities = ({
     isFetching: queryLoading,
     data: queryResult,
     error: queryError,
+    refetch,
   } = useQuery({
     queryKey,
     queryFn: async () => await queryFn(),
@@ -118,6 +119,7 @@ const useQueryWithUtilities = ({
     loading,
     result,
     error,
+    refetch,
     query,
     queryTotalBatched,
     ...tableQueries,
diff --git a/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.stories.js b/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.stories.js
index ff8c666..1f46f5f 100644
--- a/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.stories.js
+++ b/src/utilities/hooks/useQueryWithUtilities/useQueryWithUtilities.stories.js
@@ -6,6 +6,8 @@ import {
   Content,
   Spinner,
   Bullseye,
+  Button,
+  Flex,
   Tabs,
   Tab,
   TabTitleText,
@@ -13,6 +15,7 @@ import {
   ListItem,
 } from '@patternfly/react-core';
 import axios from 'axios';
+import { faker } from '@faker-js/faker';
 
 import defaultStoryMeta from '~/support/defaultStoryMeta';
 import columns from '~/support/factories/columns';
@@ -406,3 +409,53 @@ export const TableQueriesWithCombinedFiltersStory = {
   ],
   render: (args) => <TableQueriesWithCombinedFiltersExample {...args} />,
 };
+
+const QueryRefetchExample = () => {
+  const fetchFn = useCallback(
+    async (params) => await restApi('/api', params),
+    [],
+  );
+
+  const { loading, refetch, query } = useQueryWithUtilities({
+    fetchFn,
+    params: {
+      limit: 1,
+    },
+  });
+  const onDataRefetch = async () => {
+    refetch();
+  };
+  const onDataFetch = async () => {
+    query();
+  };
+
+  return (
+    <>
+      <Flex columnGap={{ default: 'columnGapSm' }}>
+        <Content component="h4">Random text:</Content>
+        {loading ? (
+          <Spinner size="md" />
+        ) : (
+          <Content>{faker.commerce.productName()}</Content>
+        )}
+      </Flex>
+      <Flex columnGap={{ default: 'columnGapSm' }}>
+        <Button onClick={onDataRefetch}>Refetch data</Button>
+        <Button onClick={onDataFetch}>Fetch data</Button>
+      </Flex>
+    </>
+  );
+};
+
+export const QueryRefetchStory = {
+  decorators: [
+    (Story) => (
+      <QueryClientProvider client={queryClient}>
+        <TableStateProvider>
+          <Story />
+        </TableStateProvider>
+      </QueryClientProvider>
+    ),
+  ],
+  render: (args) => <QueryRefetchExample {...args} />,
+};