Update "useSubscribeScheduleAutoModeState()"

Author: TaiSakuma

src/api/__tests__/use-subscriptions.spec.ts

@@ -11,12 +11,15 @@ import type {
   CtrlContinuousEnabledQuery,
   CtrlContinuousEnabledSSubscription,
   ScheduleAutoModeModeQuery,
+  QScheduleAutoModeStateQuery,
+  ScheduleAutoModeStateSSubscription,
   ScheduleAutoModeModeSSubscription,
 } from "@/graphql/codegen/generated";
 
 import { useSubscribeContinuousEnabled } from "../use-continuous-enabled-subscription";
 import { useSubscribeRunNo } from "../use-run-no-subscription";
 import { useSubscribeScheduleAutoModeMode } from "../use-schedule-auto-mode-mode-subscription";
+import { useSubscribeScheduleAutoModeState } from "../use-schedule-auto-mode-state-subscription";
 import { useSubscribeState } from "../use-state-subscription";
 import { useSubscribeTraceIds } from "../use-trace_ids-subscription";
 
@@ -125,3 +128,27 @@ it("useSubscribeScheduleAutoModeMode", async () => {
     fcSubData,
   );
 });
+
+it("useSubscribeScheduleAutoModeState", async () => {
+  type QueryData = QScheduleAutoModeStateQuery;
+  type SubData = ScheduleAutoModeStateSSubscription;
+
+  const mapQuery = (d: QueryData | undefined) => d?.schedule.autoMode.state;
+  const mapSub = (d: SubData | undefined) => d?.scheduleAutoModeState;
+
+  const fcScheduleAutoModeState = fc.string();
+  const fcQueryData: fc.Arbitrary<QueryData> = fc.record({
+    schedule: fc.record({ autoMode: fc.record({ state: fcScheduleAutoModeState }) }),
+  });
+  const fcSubData: fc.Arbitrary<SubData> = fc.record({
+    scheduleAutoModeState: fcScheduleAutoModeState,
+  });
+
+  await runPropertyTest(
+    useSubscribeScheduleAutoModeState,
+    mapQuery,
+    mapSub,
+    fcQueryData,
+    fcSubData,
+  );
+});

src/api/use-schedule-auto-mode-state-subscription.ts

@@ -1,21 +1,19 @@
 import type { ComputedRef } from "vue";
-import { computed } from "vue";
 
 import {
   useQScheduleAutoModeStateQuery,
   useScheduleAutoModeStateSSubscription,
 } from "@/graphql/codegen/generated";
-import { onReady } from "@/utils/on-ready";
-import type { OnReady } from "@/utils/on-ready";
+
+import { useQueryBackedSubscription } from "./use-query-backed-subscription";
 
 interface _ScheduleAutoModeStateSubscription {
-  autoModeState: ComputedRef<string | undefined>;
+  data: ComputedRef<string | undefined>;
   error: ComputedRef<Error | undefined>;
-  subscription: ReturnType<typeof useScheduleAutoModeStateSSubscription>;
-  query: ReturnType<typeof useQScheduleAutoModeStateQuery>;
 }
 
-type ScheduleAutoModeStateSubscription = OnReady<_ScheduleAutoModeStateSubscription>;
+type ScheduleAutoModeStateSubscription = _ScheduleAutoModeStateSubscription &
+  PromiseLike<_ScheduleAutoModeStateSubscription>;
 
 export function useSubscribeScheduleAutoModeState(): ScheduleAutoModeStateSubscription {
   const query = useQScheduleAutoModeStateQuery({
@@ -24,16 +22,14 @@ export function useSubscribeScheduleAutoModeState(): ScheduleAutoModeStateSubscr
   });
   const subscription = useScheduleAutoModeStateSSubscription({ variables: {} });
 
-  const error = computed(() => subscription.error?.value || query.error?.value);
-
-  const autoModeState = computed(() =>
-    error.value
-      ? undefined
-      : subscription.data?.value?.scheduleAutoModeState ||
-        query.data?.value?.schedule.autoMode.state,
-  );
+  const mapQueryData = (d: typeof query.data) => d.value?.schedule.autoMode.state;
+  const mapSubscriptionData = (d: typeof subscription.data) =>
+    d.value?.scheduleAutoModeState;
 
-  const ret = { autoModeState, error, subscription, query };
-
-  return onReady(ret, query);
+  return useQueryBackedSubscription({
+    query,
+    subscription,
+    mapQueryData,
+    mapSubscriptionData,
+  });
 }

src/components/schedule/auto-mode/auto-mode-button/__tests__/use-pulling.spec.ts

@@ -34,7 +34,7 @@ function createMockSubscription(auto_mode_state: string): Sub {
   })();
 
   // Thenable
-  return onReady({ autoModeState }, ready) as Sub;
+  return onReady({ data: autoModeState }, ready) as Sub;
 }
 
 describe("usePulling()", () => {

src/components/schedule/auto-mode/auto-mode-button/use-pulling.ts

@@ -15,7 +15,7 @@ export function usePulling(): UsePullingReturn {
   const subscription = useSubscribeScheduleAutoModeState();
 
   // e.g., "off", "auto_pulling", "auto_running"
-  const state = subscription.autoModeState;
+  const state = subscription.data;
 
   // true if the second part of the state is "pulling"
   const pulling = computed(() => state.value?.split("_")[1] === "pulling");