From a4b04f72550f56c07ecd1be02a54d01986e5bf5b Mon Sep 17 00:00:00 2001
From: Andre Pedroza <andre@pedroza.dev>
Date: Sat, 9 Dec 2023 12:07:23 -0300
Subject: [PATCH] Rename PocketBase SDK from window.sdk to window.pb and add
 QueryClient Instance to window.qc

---
 docs/misc/data-sources.md       |  6 +++++-
 proxy/src/api/pocketbase/sdk.ts | 11 +++--------
 proxy/window.d.ts               |  5 ++++-
 3 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/docs/misc/data-sources.md b/docs/misc/data-sources.md
index 5f0fd29a..8685a593 100644
--- a/docs/misc/data-sources.md
+++ b/docs/misc/data-sources.md
@@ -1,3 +1,7 @@
 # Where are the Data Sources/Query Library?
 
-PocketBlocks integrates Openblocks and PocketBase, or at least the client's part. As this project aims to create as much flexibility as possible between those two software, we opted not to port the **data source/query library** features as we have access to the [Pocketbase SDK](https://pocketbase.io/docs/client-side-sdks/) through **window.sdk**. We also can use the [extend features](https://pocketbase.io/docs/js-overview/) of Pocketbase to integrate with data sources using something like [n8n](https://n8n.io/) or [Zarpier](https://zapier.com/).
+PocketBlocks integrates Openblocks and PocketBase, or at least the client's part. As this project aims to create as much flexibility as possible between those two software, we opted not to port the **data source/query library** features as we have pb\*\*. We also can use the [extend features](https://pocketbase.io/docs/js-overview/) of Pocketbase to integrate with data sources using something like [n8n](https://n8n.io/) or [Zarpier](https://zapier.com/).
+
+{% hint style="info" %}
+We also provide a [QueryClient instance](https://tanstack.com/query/v4/docs/react/reference/QueryClient) for caching purposes. You can access it with **window.qc**. It uses sessionStorage with a staleTime of 5 minutes.
+{% endhint %}
diff --git a/proxy/src/api/pocketbase/sdk.ts b/proxy/src/api/pocketbase/sdk.ts
index b96ddedb..a85a9c42 100644
--- a/proxy/src/api/pocketbase/sdk.ts
+++ b/proxy/src/api/pocketbase/sdk.ts
@@ -22,20 +22,15 @@ persistQueryClientSubscribe({
   }),
 });
 
-const sdk = new Proxy(pb, {
-  get(pb, prop) {
-    if (prop === "qc") {
-      return queryClient;
-    }
-    return pb[prop as keyof typeof pb];
-  },
+const pbProxy = new Proxy(pb, {
   set() {
     throw new Error("SDK is immutable");
   },
 });
 
 export const setup = () => {
-  window.sdk = sdk;
+  window.qc = queryClient;
+  window.pb = pbProxy;
   window.uploadAvatar = async (config: UploadRequestOption) => {
     const { data: user } = await auth.getCurrentUser();
     if (user) {
diff --git a/proxy/window.d.ts b/proxy/window.d.ts
index eedc663b..56a77087 100644
--- a/proxy/window.d.ts
+++ b/proxy/window.d.ts
@@ -1,11 +1,14 @@
 import { AxiosInstance } from "axios";
 import { UploadRequestOption } from "@/types";
+import { PocketBase } from "pocketbase";
+import { QueryClient } from "@tanstack/query-core";
 
 export {};
 
 declare global {
   interface Window {
-    sdk: unknown;
+    pb: PocketBase;
+    qc: QueryClient;
     uploadAvatar: (config: UploadRequestOption) => void;
     setupProxy: (axiosIns: AxiosInstance, messageIns: unknown) => AxiosInstance;
   }