refactor: move to inert handles

packages/hoppscotch-common/src/components/new-collections/rest/index.vue

@@ -607,7 +607,7 @@ watchEffect(async () => {
     return
   }
 
-  const searchResultsHandle = searchResultsHandleResult.right
+  const searchResultsHandle = searchResultsHandleResult.right.get()
 
   if (searchResultsHandle.value.type === "invalid") {
     filteredCollections.value = []
@@ -722,7 +722,7 @@ const addNewRootCollection = async (name: string) => {
   }
 
   // Workspace invalidated
-  if (result.right.value.type === "invalid") {
+  if (result.right.get().value.type === "invalid") {
     // TODO: Error Handling
     return
   }
@@ -751,7 +751,7 @@ const onRemoveRootCollection = async () => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -791,7 +791,7 @@ const onAddRequest = async (requestName: string) => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -813,7 +813,7 @@ const onAddRequest = async (requestName: string) => {
     return
   }
 
-  const requestHandle = requestHandleResult.right
+  const requestHandle = requestHandleResult.right.get()
 
   if (requestHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -830,7 +830,8 @@ const onAddRequest = async (requestName: string) => {
     return
   }
 
-  const cascadingAuthHeadersHandle = cascadingAuthHeadersHandleResult.right
+  const cascadingAuthHeadersHandle =
+    cascadingAuthHeadersHandleResult.right.get()
 
   if (cascadingAuthHeadersHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -873,7 +874,7 @@ const onAddChildCollection = async (newChildCollectionName: string) => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -890,7 +891,7 @@ const onAddChildCollection = async (newChildCollectionName: string) => {
     return
   }
 
-  if (result.right.value.type === "invalid") {
+  if (result.right.get().value.type === "invalid") {
     // COLLECTION_INVALIDATED
     return
   }
@@ -923,7 +924,7 @@ const onEditRootCollection = async (newCollectionName: string) => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -968,7 +969,7 @@ const onEditChildCollection = async (newChildCollectionName: string) => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1009,7 +1010,7 @@ const onRemoveChildCollection = async () => {
     return
   }
 
-  const parentCollectionHandle = parentCollectionHandleResult.right
+  const parentCollectionHandle = parentCollectionHandleResult.right.get()
 
   if (parentCollectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1060,7 +1061,7 @@ const onRemoveRequest = async () => {
     return
   }
 
-  const requestHandle = requestHandleResult.right
+  const requestHandle = requestHandleResult.right.get()
 
   if (requestHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1109,7 +1110,7 @@ const selectRequest = async (requestIndexPath: string) => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED | INVALID_COLLECTION_HANDLE
@@ -1126,7 +1127,7 @@ const selectRequest = async (requestIndexPath: string) => {
     return
   }
 
-  const requestHandle = requestHandleResult.right
+  const requestHandle = requestHandleResult.right.get()
 
   if (requestHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1143,7 +1144,8 @@ const selectRequest = async (requestIndexPath: string) => {
     return
   }
 
-  const cascadingAuthHeadersHandle = cascadingAuthHeadersHandleResult.right
+  const cascadingAuthHeadersHandle =
+    cascadingAuthHeadersHandleResult.right.get()
 
   if (cascadingAuthHeadersHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1190,7 +1192,7 @@ const duplicateRequest = async (requestIndexPath: string) => {
     return
   }
 
-  const requestHandle = requestHandleResult.right
+  const requestHandle = requestHandleResult.right.get()
 
   if (requestHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1238,7 +1240,7 @@ const onEditRequest = async (newRequestName: string) => {
     return
   }
 
-  const requestHandle = requestHandleResult.right
+  const requestHandle = requestHandleResult.right.get()
 
   if (requestHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1298,7 +1300,7 @@ const editCollectionProperties = async (collectionIndexPath: string) => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1316,7 +1318,8 @@ const editCollectionProperties = async (collectionIndexPath: string) => {
       return
     }
 
-    const cascadingAuthHeadersHandle = cascadingAuthHeadersHandleResult.right
+    const cascadingAuthHeadersHandle =
+      cascadingAuthHeadersHandleResult.right.get()
 
     if (cascadingAuthHeadersHandle.value.type === "invalid") {
       // COLLECTION_INVALIDATED
@@ -1363,7 +1366,7 @@ const setCollectionProperties = async (updatedCollectionProps: {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1390,7 +1393,8 @@ const setCollectionProperties = async (updatedCollectionProps: {
     return
   }
 
-  const cascadingAuthHeadersHandle = cascadingAuthHeadersHandleResult.right
+  const cascadingAuthHeadersHandle =
+    cascadingAuthHeadersHandleResult.right.get()
 
   if (cascadingAuthHeadersHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1427,7 +1431,7 @@ const exportCollection = async (collectionIndexPath: string) => {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1526,7 +1530,7 @@ const dropToRoot = async ({ dataTransfer }: DragEvent) => {
     return
   }
 
-  const draggedCollectionHandle = draggedCollectionHandleResult.right
+  const draggedCollectionHandle = draggedCollectionHandleResult.right.get()
 
   if (draggedCollectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1564,7 +1568,7 @@ const dropToRoot = async ({ dataTransfer }: DragEvent) => {
   }
 
   const destinationRootCollectionHandle =
-    destinationRootCollectionHandleResult.right
+    destinationRootCollectionHandleResult.right.get()
 
   if (destinationRootCollectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1581,7 +1585,8 @@ const dropToRoot = async ({ dataTransfer }: DragEvent) => {
     return
   }
 
-  const cascadingAuthHeadersHandle = cascadingAuthHeadersHandleResult.right
+  const cascadingAuthHeadersHandle =
+    cascadingAuthHeadersHandleResult.right.get()
 
   if (cascadingAuthHeadersHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1635,7 +1640,7 @@ const dropRequest = async (payload: {
     return
   }
 
-  const requestHandle = requestHandleResult.right
+  const requestHandle = requestHandleResult.right.get()
 
   if (requestHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1662,7 +1667,7 @@ const dropRequest = async (payload: {
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1679,7 +1684,8 @@ const dropRequest = async (payload: {
     return
   }
 
-  const cascadingAuthHeadersHandle = cascadingAuthHeadersHandleResult.right
+  const cascadingAuthHeadersHandle =
+    cascadingAuthHeadersHandleResult.right.get()
 
   if (cascadingAuthHeadersHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1768,7 +1774,7 @@ const dropCollection = async (payload: {
     return
   }
 
-  const draggedCollectionHandle = draggedCollectionHandleResult.right
+  const draggedCollectionHandle = draggedCollectionHandleResult.right.get()
 
   if (draggedCollectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1838,7 +1844,8 @@ const dropCollection = async (payload: {
     return
   }
 
-  const destinationCollectionHandle = destinationCollectionHandleResult.right
+  const destinationCollectionHandle =
+    destinationCollectionHandleResult.right.get()
 
   if (destinationCollectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED
@@ -1855,7 +1862,8 @@ const dropCollection = async (payload: {
     return
   }
 
-  const cascadingAuthHeadersHandle = cascadingAuthHeadersHandleResult.right
+  const cascadingAuthHeadersHandle =
+    cascadingAuthHeadersHandleResult.right.get()
 
   if (cascadingAuthHeadersHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1922,7 +1930,7 @@ const updateRequestOrder = async (
     return
   }
 
-  const requestHandle = requestHandleResult.right
+  const requestHandle = requestHandleResult.right.get()
 
   if (requestHandle.value.type === "invalid") {
     // COLLECTION_INVALIDATED
@@ -1982,7 +1990,7 @@ const updateCollectionOrder = async (
     return
   }
 
-  const collectionHandle = collectionHandleResult.right
+  const collectionHandle = collectionHandleResult.right.get()
 
   if (collectionHandle.value.type === "invalid") {
     // WORKSPACE_INVALIDATED

packages/hoppscotch-common/src/components/workspace/PersonalWorkspaceSelector.vue

@@ -48,6 +48,6 @@ const activeWorkspaceInfo = computed(() => {
 
 function selectWorkspace() {
   workspaceService.activeWorkspaceHandle.value =
-    personalWorkspaceProviderService.getPersonalWorkspaceHandle()
+    personalWorkspaceProviderService.getPersonalWorkspaceHandle().get()
 }
 </script>

packages/hoppscotch-common/src/components/workspace/TestWorkspaceSelector.vue

@@ -59,6 +59,6 @@ async function selectWorkspace(workspaceID: string) {
     return
   }
 
-  workspaceService.activeWorkspaceHandle.value = result.right
+  workspaceService.activeWorkspaceHandle.value = result.right.get()
 }
 </script>

packages/hoppscotch-common/src/helpers/adapters/WorkspaceRESTCollectionTreeAdapter.ts

@@ -2,12 +2,12 @@ import {
   ChildrenResult,
   SmartTreeAdapter,
 } from "@hoppscotch/ui/dist/src/helpers/treeAdapter"
+import * as E from "fp-ts/Either"
 import { Ref, ref, watchEffect } from "vue"
 import { NewWorkspaceService } from "~/services/new-workspace"
 import { HandleRef } from "~/services/new-workspace/handle"
 import { RESTCollectionViewItem } from "~/services/new-workspace/view"
 import { Workspace } from "~/services/new-workspace/workspace"
-import * as E from "fp-ts/Either"
 
 export class WorkspaceRESTCollectionTreeAdapter
   implements SmartTreeAdapter<RESTCollectionViewItem>
@@ -50,7 +50,7 @@ export class WorkspaceRESTCollectionTreeAdapter
           throw new Error(JSON.stringify(collectionHandleResult.left.error))
         }
 
-        const collectionHandle = collectionHandleResult.right
+        const collectionHandle = collectionHandleResult.right.get()
 
         const collectionChildrenResult =
           await this.workspaceService.getRESTCollectionChildrenView(
@@ -62,7 +62,8 @@ export class WorkspaceRESTCollectionTreeAdapter
           throw new Error(JSON.stringify(collectionChildrenResult.left.error))
         }
 
-        const collectionChildrenViewHandle = collectionChildrenResult.right
+        const collectionChildrenViewHandle =
+          collectionChildrenResult.right.get()
 
         watchEffect(() => {
           if (collectionChildrenViewHandle.value.type !== "ok") return
@@ -100,7 +101,7 @@ export class WorkspaceRESTCollectionTreeAdapter
           throw new Error(JSON.stringify(viewResult.left.error))
         }
 
-        const viewHandle = viewResult.right
+        const viewHandle = viewResult.right.get()
 
         watchEffect(() => {
           if (viewHandle.value.type !== "ok") return

packages/hoppscotch-common/src/services/new-workspace/handle.ts

@@ -1,12 +1,18 @@
 import { Ref, WritableComputedRef } from "vue"
 
+export type Handle<T, InvalidateReason = unknown> = {
+  get: () => HandleRef<T, InvalidateReason>
+}
+
 export type HandleRef<T, InvalidateReason = unknown> = Ref<
-  { type: "ok"; data: T } | { type: "invalid"; reason: InvalidateReason }
+  HandleState<T, InvalidateReason>
 >
 
+export type HandleState<T, InvalidateReason> =
+  | { type: "ok"; data: T }
+  | { type: "invalid"; reason: InvalidateReason }
+
 export type WritableHandleRef<
   T,
   InvalidateReason = unknown,
-> = WritableComputedRef<
+> = WritableComputedRef<HandleState<T, InvalidateReason>>
-  { type: "ok"; data: T } | { type: "invalid"; reason: InvalidateReason }
->

packages/hoppscotch-common/src/services/new-workspace/helpers.ts

@@ -3,46 +3,46 @@ import { HandleRef } from "./handle"
 import { Workspace, WorkspaceCollection, WorkspaceRequest } from "./workspace"
 
 export const isValidWorkspaceHandle = (
-  workspace: HandleRef<Workspace>,
+  workspaceHandle: HandleRef<Workspace>,
   providerID: string,
   workspaceID: string
-): workspace is Ref<{
+): workspaceHandle is Ref<{
   data: Workspace
   type: "ok"
 }> => {
   return (
-    workspace.value.type === "ok" &&
+    workspaceHandle.value.type === "ok" &&
-    workspace.value.data.providerID === providerID &&
+    workspaceHandle.value.data.providerID === providerID &&
-    workspace.value.data.workspaceID === workspaceID
+    workspaceHandle.value.data.workspaceID === workspaceID
   )
 }
 
 export const isValidCollectionHandle = (
-  collection: HandleRef<WorkspaceCollection>,
+  collectionHandle: HandleRef<WorkspaceCollection>,
   providerID: string,
   workspaceID: string
-): collection is Ref<{
+): collectionHandle is Ref<{
   data: WorkspaceCollection
   type: "ok"
 }> => {
   return (
-    collection.value.type === "ok" &&
+    collectionHandle.value.type === "ok" &&
-    collection.value.data.providerID === providerID &&
+    collectionHandle.value.data.providerID === providerID &&
-    collection.value.data.workspaceID === workspaceID
+    collectionHandle.value.data.workspaceID === workspaceID
   )
 }
 
 export const isValidRequestHandle = (
-  request: HandleRef<WorkspaceRequest>,
+  requestHandle: HandleRef<WorkspaceRequest>,
   providerID: string,
   workspaceID: string
-): request is Ref<{
+): requestHandle is Ref<{
   data: WorkspaceRequest
   type: "ok"
 }> => {
   return (
-    request.value.type === "ok" &&
+    requestHandle.value.type === "ok" &&
-    request.value.data.providerID === providerID &&
+    requestHandle.value.data.providerID === providerID &&
-    request.value.data.workspaceID === workspaceID
+    requestHandle.value.data.workspaceID === workspaceID
   )
 }

packages/hoppscotch-common/src/services/new-workspace/index.ts

@@ -10,7 +10,7 @@ import {
   shallowRef,
   watch,
 } from "vue"
-import { HandleRef } from "./handle"
+import { Handle, HandleRef } from "./handle"
 import { WorkspaceProvider } from "./provider"
 import {
   RESTCollectionChildrenView,
@@ -91,9 +91,7 @@ export class NewWorkspaceService extends Service {
   public async getWorkspaceHandle(
     providerID: string,
     workspaceID: string
-  ): Promise<
+  ): Promise<E.Either<WorkspaceError<"INVALID_PROVIDER">, Handle<Workspace>>> {
-    E.Either<WorkspaceError<"INVALID_PROVIDER">, HandleRef<Workspace>>
-  > {
     const provider = this.registeredProviders.get(providerID)
 
     if (!provider) {
@@ -117,7 +115,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<WorkspaceCollection>
+      Handle<WorkspaceCollection>
     >
   > {
     if (workspaceHandle.value.type === "invalid") {
@@ -150,7 +148,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<WorkspaceRequest>
+      Handle<WorkspaceRequest>
     >
   > {
     if (workspaceHandle.value.type === "invalid") {
@@ -180,7 +178,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<WorkspaceCollection>
+      Handle<WorkspaceCollection>
     >
   > {
     if (workspaceHandle.value.type === "invalid") {
@@ -213,7 +211,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<WorkspaceCollection>
+      Handle<WorkspaceCollection>
     >
   > {
     if (parentCollectionHandle.value.type === "invalid") {
@@ -302,7 +300,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<WorkspaceRequest>
+      Handle<WorkspaceRequest>
     >
   > {
     if (parentCollectionHandle.value.type === "invalid") {
@@ -391,7 +389,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<WorkspaceCollection>
+      Handle<WorkspaceCollection>
     >
   > {
     if (workspaceHandle.value.type === "invalid") {
@@ -605,7 +603,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<RESTCollectionChildrenView>
+      Handle<RESTCollectionChildrenView>
     >
   > {
     if (collectionHandle.value.type === "invalid") {
@@ -635,7 +633,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<RootRESTCollectionView>
+      Handle<RootRESTCollectionView>
     >
   > {
     if (workspaceHandle.value.type === "invalid") {
@@ -664,7 +662,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<RESTCollectionLevelAuthHeadersView>
+      Handle<RESTCollectionLevelAuthHeadersView>
     >
   > {
     if (collectionHandle.value.type === "invalid") {
@@ -695,7 +693,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<RESTSearchResultsView>
+      Handle<RESTSearchResultsView>
     >
   > {
     if (workspaceHandle.value.type === "invalid") {
@@ -727,7 +725,7 @@ export class NewWorkspaceService extends Service {
   ): Promise<
     E.Either<
       WorkspaceError<"INVALID_HANDLE" | "INVALID_PROVIDER">,
-      HandleRef<RESTCollectionJSONView>
+      Handle<RESTCollectionJSONView>
     >
   > {
     if (workspaceHandle.value.type === "invalid") {

packages/hoppscotch-common/src/services/new-workspace/provider.ts

@@ -1,7 +1,7 @@
 import { Ref } from "vue"
 import * as E from "fp-ts/Either"
 
-import { HandleRef } from "./handle"
+import { Handle, HandleRef } from "./handle"
 import {
   Workspace,
   WorkspaceCollection,
@@ -24,41 +24,41 @@ export interface WorkspaceProvider {
 
   getWorkspaceHandle(
     workspaceID: string
-  ): Promise<E.Either<unknown, HandleRef<Workspace>>>
+  ): Promise<E.Either<unknown, Handle<Workspace>>>
   getCollectionHandle(
     workspaceHandle: HandleRef<Workspace>,
     collectionID: string
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>>
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>>
   getRequestHandle(
     workspaceHandle: HandleRef<Workspace>,
     requestID: string
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceRequest>>>
+  ): Promise<E.Either<unknown, Handle<WorkspaceRequest>>>
 
   getRESTRootCollectionView(
     workspaceHandle: HandleRef<Workspace>
-  ): Promise<E.Either<never, HandleRef<RootRESTCollectionView>>>
+  ): Promise<E.Either<never, Handle<RootRESTCollectionView>>>
   getRESTCollectionChildrenView(
     collectionHandle: HandleRef<WorkspaceCollection>
-  ): Promise<E.Either<never, HandleRef<RESTCollectionChildrenView>>>
+  ): Promise<E.Either<never, Handle<RESTCollectionChildrenView>>>
   getRESTCollectionLevelAuthHeadersView(
     collectionHandle: HandleRef<WorkspaceCollection>
-  ): Promise<E.Either<never, HandleRef<RESTCollectionLevelAuthHeadersView>>>
+  ): Promise<E.Either<never, Handle<RESTCollectionLevelAuthHeadersView>>>
   getRESTSearchResultsView(
     workspaceHandle: HandleRef<Workspace>,
     searchQuery: Ref<string>
-  ): Promise<E.Either<never, HandleRef<RESTSearchResultsView>>>
+  ): Promise<E.Either<never, Handle<RESTSearchResultsView>>>
   getRESTCollectionJSONView(
     workspaceHandle: HandleRef<Workspace>
-  ): Promise<E.Either<never, HandleRef<RESTCollectionJSONView>>>
+  ): Promise<E.Either<never, Handle<RESTCollectionJSONView>>>
 
   createRESTRootCollection(
     workspaceHandle: HandleRef<Workspace>,
     newCollection: Partial<Exclude<HoppCollection, "id">> & { name: string }
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>>
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>>
   createRESTChildCollection(
     parentCollectionHandle: HandleRef<WorkspaceCollection>,
     newChildCollection: Partial<HoppCollection> & { name: string }
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>>
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>>
   updateRESTCollection(
     collectionHandle: HandleRef<WorkspaceCollection>,
     updatedCollection: Partial<HoppCollection>
@@ -69,7 +69,7 @@ export interface WorkspaceProvider {
   createRESTRequest(
     parentCollectionHandle: HandleRef<WorkspaceCollection>,
     newRequest: HoppRESTRequest
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceRequest>>>
+  ): Promise<E.Either<unknown, Handle<WorkspaceRequest>>>
   updateRESTRequest(
     requestHandle: HandleRef<WorkspaceRequest>,
     updatedRequest: Partial<HoppRESTRequest>
@@ -81,7 +81,7 @@ export interface WorkspaceProvider {
   importRESTCollections(
     workspaceHandle: HandleRef<Workspace>,
     collections: HoppCollection[]
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>>
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>>
   exportRESTCollections(
     workspaceHandle: HandleRef<Workspace>,
     collections: HoppCollection[]

packages/hoppscotch-common/src/services/new-workspace/providers/personal.workspace.ts

@@ -42,7 +42,11 @@ import {
 } from "~/newstore/collections"
 import { platform } from "~/platform"
 
-import { HandleRef, WritableHandleRef } from "~/services/new-workspace/handle"
+import {
+  Handle,
+  HandleRef,
+  WritableHandleRef,
+} from "~/services/new-workspace/handle"
 import { WorkspaceProvider } from "~/services/new-workspace/provider"
 import {
   RESTCollectionChildrenView,
@@ -59,7 +63,6 @@ import {
   WorkspaceRequest,
 } from "~/services/new-workspace/workspace"
 
-import { getAffectedIndexes } from "~/helpers/collection/affectedIndex"
 import {
   getFoldersByPath,
   resolveSaveContextOnCollectionReorder,
@@ -127,7 +130,7 @@ export class PersonalWorkspaceProviderService
   public createRESTRootCollection(
     workspaceHandle: HandleRef<Workspace>,
     newCollection: Partial<Exclude<HoppCollection, "id">> & { name: string }
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>> {
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>> {
     if (!isValidWorkspaceHandle(workspaceHandle, this.providerID, "personal")) {
       return Promise.resolve(E.left("INVALID_WORKSPACE_HANDLE" as const))
     }
@@ -156,39 +159,40 @@ export class PersonalWorkspaceProviderService
     })
 
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidWorkspaceHandle(
+            if (
-              workspaceHandle,
+              !isValidWorkspaceHandle(
-              this.providerID,
+                workspaceHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "WORKSPACE_INVALIDATED" as const,
+                type: "invalid" as const,
+                reason: "WORKSPACE_INVALIDATED" as const,
+              }
             }
-          }
 
-          return {
+            return {
-            type: "ok",
+              type: "ok",
-            data: {
+              data: {
-              providerID: this.providerID,
+                providerID: this.providerID,
-              workspaceID: workspaceHandle.value.data.workspaceID,
+                workspaceID: workspaceHandle.value.data.workspaceID,
-              collectionID: newCollectionID,
+                collectionID: newCollectionID,
-              name: newCollectionName,
+                name: newCollectionName,
-            },
+              },
-          }
+            }
-        })
+          }),
-      )
+      })
     )
   }
 
   public createRESTChildCollection(
     parentCollectionHandle: HandleRef<WorkspaceCollection>,
     newChildCollection: Partial<HoppCollection> & { name: string }
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>> {
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>> {
     if (
       !isValidCollectionHandle(
         parentCollectionHandle,
@@ -213,32 +217,33 @@ export class PersonalWorkspaceProviderService
     })
 
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidCollectionHandle(
+            if (
-              parentCollectionHandle,
+              !isValidCollectionHandle(
-              this.providerID,
+                parentCollectionHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "COLLECTION_INVALIDATED" as const,
+                type: "invalid" as const,
+                reason: "COLLECTION_INVALIDATED" as const,
+              }
             }
-          }
 
-          return {
+            return {
-            type: "ok",
+              type: "ok",
-            data: {
+              data: {
-              providerID,
+                providerID,
-              workspaceID,
+                workspaceID,
-              collectionID,
+                collectionID,
-              name: newCollectionName,
+                name: newCollectionName,
-            },
+              },
-          }
+            }
-        })
+          }),
-      )
+      })
     )
   }
 
@@ -352,7 +357,7 @@ export class PersonalWorkspaceProviderService
   public createRESTRequest(
     parentCollectionHandle: HandleRef<WorkspaceCollection>,
     newRequest: HoppRESTRequest
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceRequest>>> {
+  ): Promise<E.Either<unknown, Handle<WorkspaceRequest>>> {
     if (
       !isValidCollectionHandle(
         parentCollectionHandle,
@@ -441,7 +446,7 @@ export class PersonalWorkspaceProviderService
       this.issuedHandles.push(writableHandle)
     }
 
-    return Promise.resolve(E.right(handle))
+    return Promise.resolve(E.right({ get: () => handle }))
   }
 
   public removeRESTRequest(
@@ -529,7 +534,7 @@ export class PersonalWorkspaceProviderService
   public importRESTCollections(
     workspaceHandle: HandleRef<Workspace>,
     collections: HoppCollection[]
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>> {
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>> {
     if (!isValidWorkspaceHandle(workspaceHandle, this.providerID, "personal")) {
       return Promise.resolve(E.left("INVALID_WORKSPACE_HANDLE" as const))
     }
@@ -541,32 +546,33 @@ export class PersonalWorkspaceProviderService
       this.restCollectionState.value.state.length.toString()
 
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidWorkspaceHandle(
+            if (
-              workspaceHandle,
+              !isValidWorkspaceHandle(
-              this.providerID,
+                workspaceHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "WORKSPACE_INVALIDATED" as const,
+                type: "invalid" as const,
+                reason: "WORKSPACE_INVALIDATED" as const,
+              }
             }
-          }
 
-          return {
+            return {
-            type: "ok",
+              type: "ok",
-            data: {
+              data: {
-              providerID: this.providerID,
+                providerID: this.providerID,
-              workspaceID: workspaceHandle.value.data.workspaceID,
+                workspaceID: workspaceHandle.value.data.workspaceID,
-              collectionID: newCollectionID,
+                collectionID: newCollectionID,
-              name: newCollectionName,
+                name: newCollectionName,
-            },
+              },
-          }
+            }
-        })
+          }),
-      )
+      })
     )
   }
 
@@ -769,7 +775,7 @@ export class PersonalWorkspaceProviderService
   public getCollectionHandle(
     workspaceHandle: HandleRef<Workspace>,
     collectionID: string
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>> {
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>> {
     if (!isValidWorkspaceHandle(workspaceHandle, this.providerID, "personal")) {
       return Promise.resolve(E.left("INVALID_WORKSPACE_HANDLE" as const))
     }
@@ -790,39 +796,40 @@ export class PersonalWorkspaceProviderService
     const { providerID, workspaceID } = workspaceHandle.value.data
 
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidWorkspaceHandle(
+            if (
-              workspaceHandle,
+              !isValidWorkspaceHandle(
-              this.providerID,
+                workspaceHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "WORKSPACE_INVALIDATED" as const,
+                type: "invalid" as const,
+                reason: "WORKSPACE_INVALIDATED" as const,
+              }
             }
-          }
 
-          return {
+            return {
-            type: "ok",
+              type: "ok",
-            data: {
+              data: {
-              providerID,
+                providerID,
-              workspaceID,
+                workspaceID,
-              collectionID,
+                collectionID,
-              name: collection.name,
+                name: collection.name,
-            },
+              },
-          }
+            }
-        })
+          }),
-      )
+      })
     )
   }
 
   public getRequestHandle(
     workspaceHandle: HandleRef<Workspace>,
     requestID: string
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceRequest>>> {
+  ): Promise<E.Either<unknown, Handle<WorkspaceRequest>>> {
     if (!isValidWorkspaceHandle(workspaceHandle, this.providerID, "personal")) {
       return Promise.resolve(E.left("INVALID_COLLECTION_HANDLE" as const))
     }
@@ -917,250 +924,258 @@ export class PersonalWorkspaceProviderService
       this.issuedHandles.push(writableHandle)
     }
 
-    return Promise.resolve(E.right(handle))
+    return Promise.resolve(E.right({ get: () => handle }))
   }
 
   public getRESTCollectionChildrenView(
     collectionHandle: HandleRef<WorkspaceCollection>
-  ): Promise<E.Either<never, HandleRef<RESTCollectionChildrenView>>> {
+  ): Promise<E.Either<never, Handle<RESTCollectionChildrenView>>> {
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidCollectionHandle(
+            if (
-              collectionHandle,
+              !isValidCollectionHandle(
-              this.providerID,
+                collectionHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "INVALID_COLLECTION_HANDLE" as const,
+                type: "invalid" as const,
+                reason: "INVALID_COLLECTION_HANDLE" as const,
+              }
             }
-          }
 
-          const collectionID = collectionHandle.value.data.collectionID
+            const collectionID = collectionHandle.value.data.collectionID
 
-          return markRaw({
+            return markRaw({
-            type: "ok" as const,
+              type: "ok" as const,
-            data: {
+              data: {
-              providerID: this.providerID,
+                providerID: this.providerID,
-              workspaceID: collectionHandle.value.data.workspaceID,
+                workspaceID: collectionHandle.value.data.workspaceID,
-              collectionID: collectionHandle.value.data.collectionID,
+                collectionID: collectionHandle.value.data.collectionID,
 
-              loading: ref(false),
+                loading: ref(false),
 
-              content: computed(() => {
+                content: computed(() => {
-                const indexPath = collectionID
+                  const indexPath = collectionID
-                  .split("/")
+                    .split("/")
-                  .map((x) => parseInt(x))
+                    .map((x) => parseInt(x))
 
-                const item = navigateToFolderWithIndexPath(
+                  const item = navigateToFolderWithIndexPath(
-                  this.restCollectionState.value.state,
+                    this.restCollectionState.value.state,
-                  indexPath
+                    indexPath
-                )
+                  )
 
-                if (item) {
+                  if (item) {
-                  const collections = item.folders.map((childColl, id) => {
+                    const collections = item.folders.map((childColl, id) => {
-                    return <RESTCollectionViewItem>{
+                      return <RESTCollectionViewItem>{
-                      type: "collection",
+                        type: "collection",
-                      value: {
+                        value: {
-                        collectionID: `${collectionID}/${id}`,
+                          collectionID: `${collectionID}/${id}`,
-                        isLastItem:
+                          isLastItem:
-                          item.folders?.length > 1
+                            item.folders?.length > 1
-                            ? id === item.folders.length - 1
+                              ? id === item.folders.length - 1
-                            : false,
+                              : false,
-                        name: childColl.name,
+                          name: childColl.name,
-                        parentCollectionID: collectionID,
+                          parentCollectionID: collectionID,
-                      },
+                        },
-                    }
+                      }
-                  })
+                    })
 
-                  const requests = item.requests.map((req, id) => {
+                    const requests = item.requests.map((req, id) => {
-                    // TODO: Replace `parentCollectionID` with `collectionID`
+                      // TODO: Replace `parentCollectionID` with `collectionID`
-                    return <RESTCollectionViewItem>{
+                      return <RESTCollectionViewItem>{
-                      type: "request",
+                        type: "request",
-                      value: {
+                        value: {
-                        isLastItem:
+                          isLastItem:
-                          item.requests?.length > 1
+                            item.requests?.length > 1
-                            ? id === item.requests.length - 1
+                              ? id === item.requests.length - 1
-                            : false,
+                              : false,
-                        collectionID,
+                          collectionID,
-                        requestID: `${collectionID}/${id}`,
+                          requestID: `${collectionID}/${id}`,
-                        request: req,
+                          request: req,
-                      },
+                        },
-                    }
+                      }
-                  })
+                    })
 
-                  return [...collections, ...requests]
+                    return [...collections, ...requests]
-                }
+                  }
-                return []
+                  return []
-              }),
+                }),
-            },
+              },
-          })
+            })
-        })
+          }),
-      )
+      })
     )
   }
 
   public getRESTRootCollectionView(
     workspaceHandle: HandleRef<Workspace>
-  ): Promise<E.Either<never, HandleRef<RootRESTCollectionView>>> {
+  ): Promise<E.Either<never, Handle<RootRESTCollectionView>>> {
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidWorkspaceHandle(
+            if (
-              workspaceHandle,
+              !isValidWorkspaceHandle(
-              this.providerID,
+                workspaceHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "INVALID_WORKSPACE_HANDLE" as const,
+                type: "invalid" as const,
+                reason: "INVALID_WORKSPACE_HANDLE" as const,
+              }
             }
-          }
 
-          return markRaw({
+            return markRaw({
-            type: "ok" as const,
+              type: "ok" as const,
-            data: {
+              data: {
-              providerID: this.providerID,
+                providerID: this.providerID,
-              workspaceID: workspaceHandle.value.data.workspaceID,
+                workspaceID: workspaceHandle.value.data.workspaceID,
 
-              loading: ref(false),
+                loading: ref(false),
 
-              collections: computed(() => {
+                collections: computed(() => {
-                return this.restCollectionState.value.state.map((coll, id) => {
+                  return this.restCollectionState.value.state.map(
-                  return {
+                    (coll, id) => {
-                    collectionID: id.toString(),
+                      return {
-                    isLastItem:
+                        collectionID: id.toString(),
-                      id === this.restCollectionState.value.state.length - 1,
+                        isLastItem:
-                    name: coll.name,
+                          id ===
-                    parentCollectionID: null,
+                          this.restCollectionState.value.state.length - 1,
-                  }
+                        name: coll.name,
-                })
+                        parentCollectionID: null,
-              }),
+                      }
-            },
+                    }
-          })
+                  )
-        })
+                }),
-      )
+              },
+            })
+          }),
+      })
     )
   }
 
   public getRESTCollectionLevelAuthHeadersView(
     collectionHandle: HandleRef<WorkspaceCollection>
-  ): Promise<E.Either<never, HandleRef<RESTCollectionLevelAuthHeadersView>>> {
+  ): Promise<E.Either<never, Handle<RESTCollectionLevelAuthHeadersView>>> {
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidCollectionHandle(
+            if (
-              collectionHandle,
+              !isValidCollectionHandle(
-              this.providerID,
+                collectionHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "INVALID_COLLECTION_HANDLE" as const,
+                type: "invalid" as const,
+                reason: "INVALID_COLLECTION_HANDLE" as const,
+              }
             }
-          }
 
-          const { collectionID } = collectionHandle.value.data
+            const { collectionID } = collectionHandle.value.data
 
-          let auth: HoppInheritedProperty["auth"] = {
+            let auth: HoppInheritedProperty["auth"] = {
-            parentID: collectionID ?? "",
+              parentID: collectionID ?? "",
-            parentName: "",
+              parentName: "",
-            inheritedAuth: {
+              inheritedAuth: {
-              authType: "none",
+                authType: "none",
-              authActive: true,
+                authActive: true,
-            },
+              },
-          }
+            }
-          const headers: HoppInheritedProperty["headers"] = []
+            const headers: HoppInheritedProperty["headers"] = []
 
-          if (!collectionID) return { type: "ok", data: { auth, headers } }
+            if (!collectionID) return { type: "ok", data: { auth, headers } }
 
-          const path = collectionID.split("/").map((i) => parseInt(i))
+            const path = collectionID.split("/").map((i) => parseInt(i))
 
-          // Check if the path is empty or invalid
+            // Check if the path is empty or invalid
-          if (!path || path.length === 0) {
+            if (!path || path.length === 0) {
-            console.error("Invalid path:", collectionID)
+              console.error("Invalid path:", collectionID)
-            return { type: "ok", data: { auth, headers } }
-          }
-
-          // Loop through the path and get the last parent folder with authType other than 'inherit'
-          for (let i = 0; i < path.length; i++) {
-            const parentFolder = navigateToFolderWithIndexPath(
-              this.restCollectionState.value.state,
-              [...path.slice(0, i + 1)] // Create a copy of the path array
-            )
-
-            // Check if parentFolder is undefined or null
-            if (!parentFolder) {
-              console.error("Parent folder not found for path:", path)
               return { type: "ok", data: { auth, headers } }
             }
 
-            const parentFolderAuth: HoppRESTAuth = parentFolder.auth
+            // Loop through the path and get the last parent folder with authType other than 'inherit'
-            const parentFolderHeaders: HoppRESTHeaders = parentFolder.headers
+            for (let i = 0; i < path.length; i++) {
+              const parentFolder = navigateToFolderWithIndexPath(
+                this.restCollectionState.value.state,
+                [...path.slice(0, i + 1)] // Create a copy of the path array
+              )
 
-            // check if the parent folder has authType 'inherit' and if it is the root folder
+              // Check if parentFolder is undefined or null
-            if (
+              if (!parentFolder) {
-              parentFolderAuth?.authType === "inherit" &&
+                console.error("Parent folder not found for path:", path)
-              [...path.slice(0, i + 1)].length === 1
+                return { type: "ok", data: { auth, headers } }
-            ) {
-              auth = {
-                parentID: [...path.slice(0, i + 1)].join("/"),
-                parentName: parentFolder.name,
-                inheritedAuth: auth.inheritedAuth,
               }
-            }
 
-            if (parentFolderAuth?.authType !== "inherit") {
+              const parentFolderAuth: HoppRESTAuth = parentFolder.auth
-              auth = {
+              const parentFolderHeaders: HoppRESTHeaders = parentFolder.headers
-                parentID: [...path.slice(0, i + 1)].join("/"),
-                parentName: parentFolder.name,
-                inheritedAuth: parentFolderAuth,
-              }
-            }
 
-            // Update headers, overwriting duplicates by key
+              // check if the parent folder has authType 'inherit' and if it is the root folder
-            if (parentFolderHeaders) {
+              if (
-              const activeHeaders = parentFolderHeaders.filter((h) => h.active)
+                parentFolderAuth?.authType === "inherit" &&
-              activeHeaders.forEach((header) => {
+                [...path.slice(0, i + 1)].length === 1
-                const index = headers.findIndex(
+              ) {
-                  (h) => h.inheritedHeader?.key === header.key
+                auth = {
-                )
+                  parentID: [...path.slice(0, i + 1)].join("/"),
-                const currentPath = [...path.slice(0, i + 1)].join("/")
+                  parentName: parentFolder.name,
-                if (index !== -1) {
+                  inheritedAuth: auth.inheritedAuth,
-                  // Replace the existing header with the same key
-                  headers[index] = {
-                    parentID: currentPath,
-                    parentName: parentFolder.name,
-                    inheritedHeader: header,
-                  }
-                } else {
-                  headers.push({
-                    parentID: currentPath,
-                    parentName: parentFolder.name,
-                    inheritedHeader: header,
-                  })
                 }
-              })
+              }
-            }
-          }
 
-          return { type: "ok", data: { auth, headers } }
+              if (parentFolderAuth?.authType !== "inherit") {
-        })
+                auth = {
-      )
+                  parentID: [...path.slice(0, i + 1)].join("/"),
+                  parentName: parentFolder.name,
+                  inheritedAuth: parentFolderAuth,
+                }
+              }
+
+              // Update headers, overwriting duplicates by key
+              if (parentFolderHeaders) {
+                const activeHeaders = parentFolderHeaders.filter(
+                  (h) => h.active
+                )
+                activeHeaders.forEach((header) => {
+                  const index = headers.findIndex(
+                    (h) => h.inheritedHeader?.key === header.key
+                  )
+                  const currentPath = [...path.slice(0, i + 1)].join("/")
+                  if (index !== -1) {
+                    // Replace the existing header with the same key
+                    headers[index] = {
+                      parentID: currentPath,
+                      parentName: parentFolder.name,
+                      inheritedHeader: header,
+                    }
+                  } else {
+                    headers.push({
+                      parentID: currentPath,
+                      parentName: parentFolder.name,
+                      inheritedHeader: header,
+                    })
+                  }
+                })
+              }
+            }
+
+            return { type: "ok", data: { auth, headers } }
+          }),
+      })
     )
   }
 
   public getRESTSearchResultsView(
     workspaceHandle: HandleRef<Workspace>,
     searchQuery: Ref<string>
-  ): Promise<E.Either<never, HandleRef<RESTSearchResultsView>>> {
+  ): Promise<E.Either<never, Handle<RESTSearchResultsView>>> {
     const results = ref<HoppCollection[]>([])
 
     const isMatch = (inputText: string, textToMatch: string) =>
@@ -1248,77 +1263,79 @@ export class PersonalWorkspaceProviderService
     }
 
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidWorkspaceHandle(
+            if (
-              workspaceHandle,
+              !isValidWorkspaceHandle(
-              this.providerID,
+                workspaceHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "INVALID_WORKSPACE_HANDLE" as const,
+                type: "invalid" as const,
+                reason: "INVALID_WORKSPACE_HANDLE" as const,
+              }
             }
-          }
 
-          return markRaw({
+            return markRaw({
-            type: "ok" as const,
+              type: "ok" as const,
-            data: {
+              data: {
-              providerID: this.providerID,
+                providerID: this.providerID,
-              workspaceID: workspaceHandle.value.data.workspaceID,
+                workspaceID: workspaceHandle.value.data.workspaceID,
 
-              loading: ref(false),
+                loading: ref(false),
 
-              results,
+                results,
-              onSessionEnd,
+                onSessionEnd,
-            },
+              },
-          })
+            })
-        })
+          }),
-      )
+      })
     )
   }
 
   public getRESTCollectionJSONView(
     workspaceHandle: HandleRef<Workspace>
-  ): Promise<E.Either<never, HandleRef<RESTCollectionJSONView>>> {
+  ): Promise<E.Either<never, Handle<RESTCollectionJSONView>>> {
     return Promise.resolve(
-      E.right(
+      E.right({
-        computed(() => {
+        get: () =>
-          if (
+          computed(() => {
-            !isValidWorkspaceHandle(
+            if (
-              workspaceHandle,
+              !isValidWorkspaceHandle(
-              this.providerID,
+                workspaceHandle,
-              "personal"
+                this.providerID,
-            )
+                "personal"
-          ) {
+              )
-            return {
+            ) {
-              type: "invalid" as const,
+              return {
-              reason: "INVALID_WORKSPACE_HANDLE" as const,
+                type: "invalid" as const,
+                reason: "INVALID_WORKSPACE_HANDLE" as const,
+              }
             }
-          }
 
-          return markRaw({
+            return markRaw({
-            type: "ok" as const,
+              type: "ok" as const,
-            data: {
+              data: {
-              providerID: this.providerID,
+                providerID: this.providerID,
-              workspaceID: workspaceHandle.value.data.workspaceID,
+                workspaceID: workspaceHandle.value.data.workspaceID,
-              content: JSON.stringify(
+                content: JSON.stringify(
-                this.restCollectionState.value.state,
+                  this.restCollectionState.value.state,
-                null,
+                  null,
-                2
+                  2
-              ),
+                ),
-            },
+              },
-          })
+            })
-        })
+          }),
-      )
+      })
     )
   }
 
   public getWorkspaceHandle(
     workspaceID: string
-  ): Promise<E.Either<unknown, HandleRef<Workspace>>> {
+  ): Promise<E.Either<unknown, Handle<Workspace>>> {
     if (workspaceID !== "personal") {
       return Promise.resolve(E.left("INVALID_WORKSPACE_ID" as const))
     }
@@ -1326,15 +1343,18 @@ export class PersonalWorkspaceProviderService
     return Promise.resolve(E.right(this.getPersonalWorkspaceHandle()))
   }
 
-  public getPersonalWorkspaceHandle(): HandleRef<Workspace> {
+  public getPersonalWorkspaceHandle(): Handle<Workspace> {
-    return shallowRef({
+    return {
-      type: "ok" as const,
+      get: () =>
-      data: {
+        shallowRef({
-        providerID: this.providerID,
+          type: "ok" as const,
-        workspaceID: "personal",
+          data: {
+            providerID: this.providerID,
+            workspaceID: "personal",
 
-        name: "Personal Workspace",
+            name: "Personal Workspace",
-      },
+          },
-    })
+        }),
+    }
   }
 }

packages/hoppscotch-common/src/services/new-workspace/providers/test.workspace.ts

@@ -3,7 +3,7 @@ import { useTimestamp } from "@vueuse/core"
 import { Service } from "dioc"
 import { WorkspaceProvider } from "../provider"
 import * as E from "fp-ts/Either"
-import { HandleRef } from "../handle"
+import { Handle, HandleRef } from "../handle"
 import { Workspace, WorkspaceCollection } from "../workspace"
 import { NewWorkspaceService } from ".."
 import TestWorkspaceSelector from "~/components/workspace/TestWorkspaceSelector.vue"
@@ -83,7 +83,7 @@ export class TestWorkspaceProviderService
     workspaceHandle: HandleRef<Workspace>,
     collectionName: string
   ): Promise<
-    E.Either<"INVALID_WORKSPACE_HANDLE", HandleRef<WorkspaceCollection>>
+    E.Either<"INVALID_WORKSPACE_HANDLE", Handle<WorkspaceCollection>>
   > {
     if (workspaceHandle.value.type !== "ok") {
       return Promise.resolve(E.left("INVALID_WORKSPACE_HANDLE" as const))
@@ -106,14 +106,14 @@ export class TestWorkspaceProviderService
   public createRESTChildCollection(
     parentCollHandle: HandleRef<WorkspaceCollection>,
     collectionName: string
-  ): Promise<E.Either<unknown, HandleRef<WorkspaceCollection>>> {
+  ): Promise<E.Either<unknown, Handle<WorkspaceCollection>>> {
     // TODO: Implement
     throw new Error("Method not implemented.")
   }
 
   public getWorkspaceHandle(
     workspaceID: string
-  ): Promise<E.Either<never, HandleRef<Workspace>>> {
+  ): Promise<E.Either<never, Handle<Workspace>>> {
     return Promise.resolve(
       E.right(
         computed(() => {
@@ -142,7 +142,7 @@ export class TestWorkspaceProviderService
     workspaceHandle: HandleRef<Workspace>,
     collectionID: string
   ): Promise<
-    E.Either<"INVALID_WORKSPACE_HANDLE", HandleRef<WorkspaceCollection>>
+    E.Either<"INVALID_WORKSPACE_HANDLE", Handle<WorkspaceCollection>>
   > {
     return Promise.resolve(
       E.right(
@@ -187,7 +187,7 @@ export class TestWorkspaceProviderService
 
   public getRESTCollectionChildrenView(
     collectionHandle: HandleRef<WorkspaceCollection>
-  ): Promise<E.Either<never, HandleRef<RESTCollectionChildrenView>>> {
+  ): Promise<E.Either<never, Handle<RESTCollectionChildrenView>>> {
     return Promise.resolve(
       E.right(
         computed(() => {
@@ -257,7 +257,7 @@ export class TestWorkspaceProviderService
 
   public getRESTRootCollectionView(
     workspaceHandle: HandleRef<Workspace>
-  ): Promise<E.Either<never, HandleRef<RootRESTCollectionView>>> {
+  ): Promise<E.Either<never, Handle<RootRESTCollectionView>>> {
     return Promise.resolve(
       E.right(
         computed(() => {

packages/hoppscotch-common/src/services/tab/rest.ts

@@ -1,14 +1,11 @@
+import { Container } from "dioc"
 import { isEqual } from "lodash-es"
 import { computed } from "vue"
 import { getDefaultRESTRequest } from "~/helpers/rest/default"
 import { HoppRESTDocument, HoppRESTSaveContext } from "~/helpers/rest/document"
-import { TabService } from "./tab"
-<<<<<<< HEAD
-import { Container } from "dioc"
-=======
 import { HandleRef } from "../new-workspace/handle"
 import { WorkspaceRequest } from "../new-workspace/workspace"
->>>>>>> 854ffa28 (refactor: persist request handles under tab `saveContext`)
+import { TabService } from "./tab"
 
 export class RESTTabService extends TabService<HoppRESTDocument> {
   public static readonly ID = "REST_TAB_SERVICE"

packages/hoppscotch-common/src/services/tab/tab.ts

@@ -19,7 +19,7 @@ import {
 } from "."
 
 import { NewWorkspaceService } from "../new-workspace"
-import { HandleRef } from "../new-workspace/handle"
+import { Handle, HandleRef } from "../new-workspace/handle"
 import { WorkspaceRequest } from "../new-workspace/workspace"
 
 export abstract class TabService<Doc>
@@ -98,7 +98,7 @@ export abstract class TabService<Doc>
       this.tabOrdering.value = []
 
       for (const doc of data.orderedDocs) {
-        let requestHandle: HandleRef<WorkspaceRequest> | null = null
+        let requestHandle: Handle<WorkspaceRequest> | null = null
         let resolvedTabDoc = doc.doc
 
         // TODO: Account for GQL
@@ -121,7 +121,7 @@ export abstract class TabService<Doc>
             continue
           }
 
-          const workspaceHandle = workspaceHandleResult.right
+          const workspaceHandle = workspaceHandleResult.right.get()
 
           if (workspaceHandle.value.type === "invalid") {
             continue