From 09d552b17a439e6e4faef04d32ae9b27d15534c7 Mon Sep 17 00:00:00 2001 From: Andrew Bastin Date: Thu, 29 Jul 2021 22:44:43 -0400 Subject: [PATCH] fix: fix cancel request issues and stream setup issues --- components/http/Request.vue | 19 +++++++++++--- helpers/utils/composables.ts | 50 +++++++++++++++++++----------------- 2 files changed, 42 insertions(+), 27 deletions(-) diff --git a/components/http/Request.vue b/components/http/Request.vue index 80960e9ee..fac3e6677 100644 --- a/components/http/Request.vue +++ b/components/http/Request.vue @@ -197,7 +197,7 @@ import { } from "~/newstore/RESTSession" import { getPlatformSpecialKey } from "~/helpers/platformutils" import { runRESTRequest$ } from "~/helpers/RequestRunner" -import { subscribeToStream, useStream } from "~/helpers/utils/composables" +import { useStreamSubscriber, useStream } from "~/helpers/utils/composables" import { defineActionHandler } from "~/helpers/actions" import { copyToClipboard } from "~/helpers/utils/clipboard" @@ -221,6 +221,7 @@ export default defineComponent({ app: { i18n }, } = useContext() const t = i18n.t.bind(i18n) + const { subscribeToStream } = useStreamSubscriber() const newEndpoint = useStream(restEndpoint$, "", setRESTEndpoint) const newMethod = useStream(restMethod$, "", updateRESTMethod) @@ -240,7 +241,11 @@ export default defineComponent({ runRESTRequest$(), (responseState) => { console.log(responseState) - updateRESTResponse(responseState) + if (loading.value) { + // Check exists because, loading can be set to false + // when cancelled + updateRESTResponse(responseState) + } }, () => { loading.value = false @@ -251,6 +256,11 @@ export default defineComponent({ ) } + const cancelRequest = () => { + loading.value = false + updateRESTResponse(null) + } + const updateMethod = (method: string) => { updateRESTMethod(method) } @@ -304,7 +314,10 @@ export default defineComponent({ } } - defineActionHandler("request.send-cancel", newSendRequest) + defineActionHandler("request.send-cancel", () => { + if (!loading.value) newSendRequest() + else cancelRequest() + }) defineActionHandler("request.reset", clearContent) defineActionHandler("request.copy-link", copyRequest) defineActionHandler("request.method.next", cycleDownMethod) diff --git a/helpers/utils/composables.ts b/helpers/utils/composables.ts index cf366f6c8..ee903943f 100644 --- a/helpers/utils/composables.ts +++ b/helpers/utils/composables.ts @@ -90,33 +90,35 @@ export function pluckRef(ref: Ref, key: K): Ref { } /** - * A composable that listens to the stream and fires update callbacks - * but respects the component lifecycle - * - * @param stream The stream to subscribe to - * @param next Callback called on value emission - * @param error Callback called on stream error - * @param complete Callback called on stream completion + * A composable that provides the ability to run streams + * and subscribe to them and respect the component lifecycle. */ -export function subscribeToStream( - stream: Observable, - next: (value: T) => void, - error: (e: any) => void, - complete: () => void -) { - let sub: Subscription | null = null +export function useStreamSubscriber() { + const subs: Subscription[] = [] + + const runAndSubscribe = ( + stream: Observable, + next: (value: T) => void, + error: (e: any) => void, + complete: () => void + ) => { + const sub = stream.subscribe({ + next, + error, + complete: () => { + complete() + subs.splice(subs.indexOf(sub), 1) + }, + }) + + subs.push(sub) + } - // Don't perform anymore updates if the component is - // gonna unmount onBeforeUnmount(() => { - if (sub) { - sub.unsubscribe() - } + subs.forEach((sub) => sub.unsubscribe()) }) - sub = stream.subscribe({ - next, - error, - complete, - }) + return { + subscribeToStream: runAndSubscribe, + } }