Rename PocketBase SDK from window.sdk to window.pb and add QueryClien…

…t Instance to window.qc

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 %}

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) {

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;
   }