fix: remove double frontend requests to controlplane (#1458)

Author: JivusAyrus

studio/src/pages/[organizationSlug]/[namespace]/graph/[slug]/analytics/index.tsx

@@ -41,44 +41,28 @@ import {
 } from "@wundergraph/cosmo-connect/dist/platform/v1/platform-PlatformService_connectquery";
 import { formatISO } from "date-fns";
 import { useContext } from "react";
+import { AnalyticsViewResultFilter } from "@wundergraph/cosmo-connect/dist/platform/v1/platform_pb";
 
 export type OperationAnalytics = {
   name: string;
   content: string;
   operationType: number;
 };
 
-const OverviewToolbar = () => {
+const OverviewToolbar = ({
+  filters,
+}: {
+  filters?: AnalyticsViewResultFilter[];
+}) => {
   const graphContext = useContext(GraphContext);
   const client = useQueryClient();
 
-  const { filters, range, dateRange, refreshInterval } =
-    useAnalyticsQueryState();
+  const { range, dateRange, refreshInterval } = useAnalyticsQueryState();
 
   const isFetching = useIsFetching();
 
-  const { data } = useQuery(
-    getGraphMetrics,
-    {
-      namespace: graphContext?.graph?.namespace,
-      federatedGraphName: graphContext?.graph?.name,
-      dateRange: range
-        ? undefined
-        : {
-            start: formatISO(dateRange.start),
-            end: formatISO(dateRange.end),
-          },
-      range,
-      filters,
-    },
-    {
-      placeholderData: keepPreviousData,
-      refetchOnWindowFocus: false,
-    },
-  );
-
   const { filtersList, selectedFilters, resetFilters } = useMetricsFilters(
-    data?.filters ?? [],
+    filters ?? [],
   );
 
   const applyParams = useApplyParams();
@@ -124,7 +108,7 @@ const OverviewToolbar = () => {
             calendarDaysLimit={analyticsRetention}
           />
 
-          <MetricsFilters filters={data?.filters ?? []} />
+          <MetricsFilters filters={filters ?? []} />
           <AnalyticsSelectedFilters
             filters={filtersList}
             selectedFilters={selectedFilters}
@@ -211,7 +195,7 @@ const AnalyticsPage: NextPageWithLayout = () => {
 
   return (
     <div className="w-full space-y-4">
-      <OverviewToolbar />
+      <OverviewToolbar filters={data?.filters} />
       <div className="flex flex-col gap-4 lg:grid lg:grid-cols-3">
         <RequestMetricsCard data={data?.requests} />
         <LatencyMetricsCard data={data?.latency} />

studio/src/pages/[organizationSlug]/apikeys.tsx

@@ -699,11 +699,13 @@ export const Empty = ({
   setApiKey,
   open,
   setOpen,
+  refetch,
 }: {
   apiKey: string | undefined;
   setApiKey: Dispatch<SetStateAction<string | undefined>>;
   open: boolean;
   setOpen: Dispatch<SetStateAction<boolean>>;
+  refetch: () => void;
 }) => {
   const user = useContext(UserContext);
 
@@ -735,6 +737,7 @@ export const Empty = ({
               setApiKey={setApiKey}
               open={open}
               setOpen={setOpen}
+              refetch={refetch}
             />
           )}
         </div>
@@ -748,14 +751,14 @@ export const CreateAPIKey = ({
   setApiKey,
   open,
   setOpen,
+  refetch,
 }: {
   apiKey: string | undefined;
   setApiKey: Dispatch<SetStateAction<string | undefined>>;
   open: boolean;
   setOpen: Dispatch<SetStateAction<boolean>>;
+  refetch: () => void;
 }) => {
-  const { refetch } = useQuery(getAPIKeys);
-
   useEffect(() => {
     if (!apiKey) return;
     setOpen(true);
@@ -810,6 +813,7 @@ const APIKeysPage: NextPageWithLayout = () => {
           setApiKey={setApiKey}
           open={openApiKeyCreatedDialog}
           setOpen={setOpenApiKeyCreatedDialog}
+          refetch={refetch}
         />
       ) : (
         <>
@@ -850,6 +854,7 @@ const APIKeysPage: NextPageWithLayout = () => {
                   setApiKey={setApiKey}
                   open={openApiKeyCreatedDialog}
                   setOpen={setOpenApiKeyCreatedDialog}
+                  refetch={refetch}
                 />
               )}
             </div>