astro-integration-pocketbase 1.3.0 → 1.4.0-next.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "astro-integration-pocketbase",
-  "version": "1.3.0",
+  "version": "1.4.0-next.2",
   "description": "An Astro integration to support developers working with astro-loader-pocketbase.",
   "license": "MIT",
   "author": "Luis Wolf <development@pawcode.de> (https://pawcode.de)",

package/src/core/refresh-collections-realtime.ts

@@ -51,7 +51,7 @@ export function refreshCollectionsRealtime(
   let isConnected = false;
 
   // Log potential errors
-  eventSource.onerror = (error) => {
+  eventSource.onerror = (error): void => {
     isConnected = false;
 
     // Wait for 5 seconds in case of a connection error

package/src/core/refresh-collections.ts

@@ -16,24 +16,30 @@ export function handleRefreshCollections({
   logger.info("Setting up refresh listener for PocketBase integration");
 
   // Listen for the refresh event of the toolbar
-  toolbar.on("astro-integration-pocketbase:refresh", async () => {
-    // Send a loading state to the toolbar
-    toolbar.send("astro-integration-pocketbase:refresh", {
-      loading: true
-    });
+  toolbar.on(
+    "astro-integration-pocketbase:refresh",
+    async ({ force }: { force: boolean }) => {
+      // Send a loading state to the toolbar
+      toolbar.send("astro-integration-pocketbase:refresh", {
+        loading: true
+      });
 
-    // Refresh content loaded by the PocketBase loader
-    logger.info("Refreshing content loaded by PocketBase loader");
-    await refreshContent({
-      loaders: ["pocketbase-loader"],
-      context: {
-        source: "astro-integration-pocketbase"
-      }
-    });
+      // Refresh content loaded by the PocketBase loader
+      logger.info(
+        `Refreshing ${force ? "all " : ""}content loaded by PocketBase loader`
+      );
+      await refreshContent({
+        loaders: ["pocketbase-loader"],
+        context: {
+          source: "astro-integration-pocketbase",
+          force: force
+        }
+      });
 
-    // Reset the loading state in the toolbar
-    toolbar.send("astro-integration-pocketbase:refresh", {
-      loading: false
-    });
-  });
+      // Reset the loading state in the toolbar
+      toolbar.send("astro-integration-pocketbase:refresh", {
+        loading: false
+      });
+    }
+  );
 }

package/src/pocketbase-integration.ts

@@ -14,7 +14,7 @@ export function pocketbaseIntegration(
   return {
     name: "pocketbase-integration",
     hooks: {
-      "astro:config:setup": ({ addDevToolbarApp, addMiddleware, command }) => {
+      "astro:config:setup": ({ addDevToolbarApp, addMiddleware, command }): void => {
         // This integration is only available in dev mode
         if (command !== "dev") {
           return;
@@ -34,7 +34,7 @@ export function pocketbaseIntegration(
           entrypoint: fileURLToPath(new URL("./middleware", import.meta.url))
         });
       },
-      "astro:server:setup": (setupOptions) => {
+      "astro:server:setup": (setupOptions): void => {
         if (!initialSetupDone) {
           // Listen for the refresh event of the toolbar
           handleRefreshCollections(setupOptions);
@@ -58,7 +58,7 @@ export function pocketbaseIntegration(
 
         initialSetupDone = true;
       },
-      "astro:server:done": ({ logger }) => {
+      "astro:server:done": ({ logger }): void => {
         // Close the EventSource connection when the server is done
         if (eventSource) {
           logger.info("Closing EventSource connection");

package/src/toolbar/dom/create-entity.ts

@@ -15,7 +15,7 @@ export function createEntity(data: Entity, baseUrl?: string): DevToolbarCard {
 
   // Add the "View in PocketBase" button
   if (baseUrl) {
-    const url = `${baseUrl}/_/#/collections?collectionId=${data.collectionId}&recordId=${data.id}`;
+    const url = `${baseUrl}/_/#/collections?collection=${data.collectionId}&recordId=${data.id}`;
 
     const viewInPocketbase = document.createElement("astro-dev-toolbar-button");
     viewInPocketbase.size = "small";

package/src/toolbar/dom/create-header.ts

@@ -48,11 +48,13 @@ export function createHeader(server: ToolbarServerHelpers): HeaderElements {
   const toggleLabel = document.createElement("label");
   toggleLabel.textContent = "Real-time updates";
   toggleLabel.htmlFor = "real-time-toggle";
+  toggleLabel.title = "Enable or disable real-time updates temporarily";
   toggleLabel.style.fontSize = "0.8rem";
   toggleContainer.appendChild(toggleLabel);
 
   const toggle = document.createElement("astro-dev-toolbar-toggle");
   toggle.input.id = "real-time-toggle";
+  toggle.input.title = "Enable or disable real-time updates temporarily";
   // Set the toggle state based on the local storage, default to true
   toggle.input.checked = !(
     localStorage.getItem("astro-integration-pocketbase:real-time") === "false"
@@ -76,10 +78,15 @@ export function createHeader(server: ToolbarServerHelpers): HeaderElements {
   refresh.size = "small";
   refresh.buttonStyle = "green";
   refresh.textContent = "Refresh content";
+  refresh.title = "Right click to force refresh every collection";
   // The refresh button is hidden by default
   refresh.style.display = "none";
   refresh.addEventListener("click", () => {
-    server.send("astro-integration-pocketbase:refresh", true);
+    server.send("astro-integration-pocketbase:refresh", { force: false });
+  });
+  refresh.addEventListener("contextmenu", (event) => {
+    event.preventDefault();
+    server.send("astro-integration-pocketbase:refresh", { force: true });
   });
   actions.appendChild(refresh);
 

package/src/toolbar/init-toolbar.ts

@@ -71,7 +71,7 @@ export async function initToolbar(
   // Update the toolbar placement based on the user's preference
   function updateToolbarPlacement(
     placement: "bottom-left" | "bottom-right" | "bottom-center"
-  ) {
+  ): void {
     if (placement === "bottom-left") {
       container.style.left = "16px";
       container.style.right = "unset";