npm - @pinia/colada-devtools - Versions diffs - 0.0.5 → 0.1.0 - Mend

@pinia/colada-devtools 0.0.5 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (31) hide show

package/dist-panel/{_queryId_-BGMH9Qyr.js → _queryId_-C_7uiscL.js} RENAMED Viewed

@@ -1,6 +1,6 @@
-import { _ as O } from "./mouse-pointer-click-BVbSKgPQ.js";
-import { m, c as l, o as n, a as e, d as j, Q as A, l as U, p as F, R as Q, C as M, P as v, g as w, h as b, S as W, t as u, _ as Y, T as G, M as P, b as X, U as Z, V as J, y as I, z as K, F as q, k as r, w as d, i, W as B, X as ee, j as te } from "./index-hPJdBAcc.js";
-import { _ as oe, a as se } from "./loader-HsZ_tw6Q.js";
+import { _ as N } from "./mouse-pointer-click-cg7KXnOS.js";
+import { m, c as l, o as n, a as e, d as I, Q as A, l as U, p as F, R as Q, C as M, P as v, g as w, h as b, S as W, t as u, _ as Y, T as G, M as P, b as X, U as Z, V as J, y as z, z as K, F as q, k as r, w as d, i, W as B, X as ee, j as te } from "./index-CC3C7HKx.js";
+import { _ as oe, a as se } from "./loader-BuVT322U.js";
 const ne = {
   viewBox: "0 0 24 24",
   width: "1.2em",
@@ -76,11 +76,11 @@ function me(a, s) {
     ], -1)
   ]));
 }
-const he = m({ name: "lucide-refresh-cw", render: me }), fe = { class: "collapse collapse-arrow" }, _e = { class: "collapse-title px-2 py-0.5 bg-neutral-200 dark:bg-neutral-800 theme-neutral" }, ge = { class: "font-semibold text-sm flex gap-x-1 items-center" }, ke = /* @__PURE__ */ j({
+const he = m({ name: "lucide-refresh-cw", render: me }), _e = { class: "collapse collapse-arrow" }, fe = { class: "collapse-title px-2 py-0.5 bg-neutral-200 dark:bg-neutral-800 theme-neutral" }, ge = { class: "font-semibold text-sm flex gap-x-1 items-center" }, ke = /* @__PURE__ */ I({
   __name: "UCollapse.ce",
   props: /* @__PURE__ */ A({
     title: { type: String },
-    icon: { type: null }
+    icon: { type: [Object, Function] }
   }, {
     open: { type: Boolean, default: !0 },
     openModifiers: {}
@@ -88,7 +88,7 @@ const he = m({ name: "lucide-refresh-cw", render: me }), fe = { class: "collapse
   emits: ["update:open"],
   setup(a) {
     const s = U(a, "open");
-    function _(o) {
+    function f(o) {
       if (o.target instanceof HTMLElement) {
         const h = {
           block: "nearest",
@@ -98,14 +98,14 @@ const he = m({ name: "lucide-refresh-cw", render: me }), fe = { class: "collapse
         o.target.scrollIntoView(h);
       }
     }
-    return (o, h) => (n(), l("div", fe, [
+    return (o, h) => (n(), l("div", _e, [
       F(e("input", {
         "onUpdate:modelValue": h[0] || (h[0] = (C) => s.value = C),
         type: "checkbox"
       }, null, 512), [
         [Q, s.value]
       ]),
-      e("div", _e, [
+      e("div", fe, [
         M(o.$slots, "title", {
           open: s.value,
           title: o.title
@@ -123,7 +123,7 @@ const he = m({ name: "lucide-refresh-cw", render: me }), fe = { class: "collapse
       ]),
       e("div", {
         class: "collapse-content px-2 text-sm overflow-hidden",
-        onTransitionend: _
+        onTransitionend: f
       }, [
         M(o.$slots, "default", { open: s.value }, void 0, !0)
       ], 32)
@@ -138,8 +138,8 @@ function we(a) {
     return `${s.toFixed(3)} seconds`;
   if (a < 6e4)
     return `${Math.floor(s)} seconds`;
-  const _ = Math.floor(s / 60);
-  return a < 36e5 ? `${_} minute${_ > 1 ? "s" : ""}` : `${Math.floor(_ / 60)}h${_ % 60}m${s % 60}s`;
+  const f = Math.floor(s / 60);
+  return a < 36e5 ? `${f} minute${f > 1 ? "s" : ""}` : `${Math.floor(f / 60)}h${f % 60}m${s % 60}s`;
 }
 const be = {
   viewBox: "0 0 24 24",
@@ -200,13 +200,13 @@ function Se(a, s) {
     ], -1)
   ]));
 }
-const He = m({ name: "lucide-file-text", render: Se }), ze = {
+const He = m({ name: "lucide-file-text", render: Se }), je = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-function Ie(a, s) {
-  return n(), l("svg", ze, s[0] || (s[0] = [
+function ze(a, s) {
+  return n(), l("svg", je, s[0] || (s[0] = [
     e("g", {
       fill: "none",
       stroke: "currentColor",
@@ -223,7 +223,7 @@ function Ie(a, s) {
     ], -1)
   ]));
 }
-const je = m({ name: "lucide-circle-x", render: Ie }), De = {
+const Ie = m({ name: "lucide-circle-x", render: ze }), De = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
@@ -240,13 +240,13 @@ function Ve(a, s) {
     }, null, -1)
   ]));
 }
-const Re = m({ name: "lucide-braces", render: Ve }), Ee = {
+const Oe = m({ name: "lucide-braces", render: Ve }), Re = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
-function Le(a, s) {
-  return n(), l("svg", Ee, s[0] || (s[0] = [
+function Ee(a, s) {
+  return n(), l("svg", Re, s[0] || (s[0] = [
     e("g", {
       fill: "none",
       stroke: "currentColor",
@@ -259,13 +259,13 @@ function Le(a, s) {
     ], -1)
   ]));
 }
-const Ne = m({ name: "lucide-history", render: Le }), Oe = {
+const Le = m({ name: "lucide-history", render: Ee }), Ne = {
   viewBox: "0 0 24 24",
   width: "1.2em",
   height: "1.2em"
 };
 function Ae(a, s) {
-  return n(), l("svg", Oe, s[0] || (s[0] = [
+  return n(), l("svg", Ne, s[0] || (s[0] = [
     e("g", {
       fill: "none",
       stroke: "currentColor",
@@ -314,16 +314,16 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
 }, ut = {
   key: 1,
   class: "text-neutral-500/50"
-}, ct = { class: "py-1" }, pt = { class: "grid grid-cols-[auto_1fr] gap-1" }, vt = { class: "font-bold" }, mt = { class: "font-bold" }, ht = { class: "font-bold" }, ft = { class: "font-bold" }, _t = { class: "py-1" }, gt = { class: "rounded p-1 overflow-auto max-h-[1200px]" }, kt = { class: "py-1" }, yt = {
+}, ct = { class: "py-1" }, pt = { class: "grid grid-cols-[auto_1fr] gap-1" }, vt = { class: "font-bold" }, mt = { class: "font-bold" }, ht = { class: "font-bold" }, _t = { class: "font-bold" }, ft = { class: "py-1" }, gt = { class: "rounded p-1 overflow-auto max-h-[1200px]" }, kt = { class: "py-1" }, yt = {
   key: 0,
   class: "rounded bg-neutral-500/20 p-1 overflow-auto max-h-[1200px]"
 }, xt = { key: 1 }, wt = {
   key: 1,
   class: "py-6 mx-auto"
-}, bt = { class: "flex flex-col text-center items-center gap-2 text-lg px-2" }, qt = /* @__PURE__ */ j({
+}, bt = { class: "flex flex-col text-center items-center gap-2 text-lg px-2" }, qt = /* @__PURE__ */ I({
   __name: "[queryId]",
   setup(a) {
-    const s = G(), _ = P(), o = X(() => _.value.find((c) => c.keyHash === s.params.queryId) ?? null), h = {
+    const s = G(), f = P(), o = X(() => f.value.find((c) => c.keyHash === s.params.queryId) ?? null), h = {
       showSecond: !0,
       rounding: "floor",
       max: 1e3 * 60 * 5
@@ -334,9 +334,9 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
     }, {
       ...h,
       updateInterval: 3e3
-    }), k = J(), x = I(!1);
+    }), k = J(), x = z(!1);
     let T = x.value, S = null;
-    const $ = I(!1);
+    const $ = z(!1);
     return K(
       () => {
         var c;
@@ -346,7 +346,7 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
         !c || S === c.status || (S = c.status, c.status === "error" ? ($.value = !0, T = x.value, x.value = !1) : c.status === "success" && (x.value = T, $.value = !1));
       }
     ), (c, t) => {
-      const g = xe, D = he, y = ee, V = pe, H = oe, R = se, E = de, L = ae, N = O;
+      const g = xe, D = he, y = ee, V = pe, H = oe, O = se, R = de, E = ae, L = N;
       return n(), l("div", Fe, [
         o.value ? (n(), l(q, { key: 0 }, [
           r(g, {
@@ -354,7 +354,7 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
             icon: i(Be)
           }, {
             default: d(() => {
-              var p, f, z;
+              var p, _, j;
               return [
                 e("div", Qe, [
                   e("p", We, [
@@ -374,7 +374,7 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
                       max: void 0
                     })), 1)
                   ])) : b("", !0),
-                  (z = (f = o.value.devtools.history.at(0)) == null ? void 0 : f.fetchTime) != null && z.end ? (n(), l("p", Je, [
+                  (j = (_ = o.value.devtools.history.at(0)) == null ? void 0 : _.fetchTime) != null && j.end ? (n(), l("p", Je, [
                     t[12] || (t[12] = e("span", null, "Fetch duration:", -1)),
                     e("span", Ke, u(i(we)(
                       o.value.devtools.history.at(0).fetchTime.end - o.value.devtools.history.at(0).fetchTime.start
@@ -419,87 +419,94 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
                     size: "sm",
                     title: "Refetch this query",
                     disabled: ((p = o.value.options) == null ? void 0 : p.enabled) === !1,
-                    onClick: t[0] || (t[0] = (f) => i(k).emit("queries:refetch", o.value.key))
+                    onClick: t[0] || (t[0] = (_) => i(k).emit("queries:refetch", o.value.key))
                   }, {
                     default: d(() => [
                       r(D, { class: "size-3.5" }),
                       t[15] || (t[15] = v(" Refetch "))
                     ]),
-                    _: 1
+                    _: 1,
+                    __: [15]
                   }, 8, ["disabled"]),
                   r(y, {
                     class: "theme-neutral",
                     size: "sm",
                     title: "Invalidate this query",
-                    onClick: t[1] || (t[1] = (f) => i(k).emit("queries:invalidate", o.value.key))
+                    onClick: t[1] || (t[1] = (_) => i(k).emit("queries:invalidate", o.value.key))
                   }, {
                     default: d(() => [
                       r(V),
                       t[16] || (t[16] = v(" Invalidate "))
                     ]),
-                    _: 1
+                    _: 1,
+                    __: [16]
                   }),
                   o.value.devtools.simulate !== "loading" ? (n(), w(y, {
                     key: 0,
                     class: "theme-purple",
                     size: "sm",
                     title: "Restore the previous state",
-                    onClick: t[2] || (t[2] = (f) => i(k).emit("queries:simulate:loading", o.value.key))
+                    onClick: t[2] || (t[2] = (_) => i(k).emit("queries:simulate:loading", o.value.key))
                   }, {
                     default: d(() => [
                       r(H),
                       t[17] || (t[17] = v(" Simulate loading "))
                     ]),
-                    _: 1
+                    _: 1,
+                    __: [17]
                   })) : (n(), w(y, {
                     key: 1,
                     class: "theme-purple",
                     size: "sm",
                     title: "Simulate a loading state",
-                    onClick: t[3] || (t[3] = (f) => i(k).emit("queries:simulate:loading:stop", o.value.key))
+                    onClick: t[3] || (t[3] = (_) => i(k).emit("queries:simulate:loading:stop", o.value.key))
                   }, {
                     default: d(() => [
                       r(H, { class: "animate-spin" }),
                       t[18] || (t[18] = v(" Stop loading "))
                     ]),
-                    _: 1
+                    _: 1,
+                    __: [18]
                   })),
                   o.value.devtools.simulate !== "error" ? (n(), w(y, {
                     key: 2,
                     class: "theme-error",
                     size: "sm",
                     title: "Simulate an Error state",
-                    onClick: t[4] || (t[4] = (f) => i(k).emit("queries:simulate:error", o.value.key))
+                    onClick: t[4] || (t[4] = (_) => i(k).emit("queries:simulate:error", o.value.key))
                   }, {
                     default: d(() => [
-                      r(R),
+                      r(O),
                       t[19] || (t[19] = v(" Simulate error "))
                     ]),
-                    _: 1
+                    _: 1,
+                    __: [19]
                   })) : (n(), w(y, {
                     key: 3,
                     class: "theme-error",
                     size: "sm",
                     title: "Restore the previous state",
-                    onClick: t[5] || (t[5] = (f) => i(k).emit("queries:simulate:error:stop", o.value.key))
+                    onClick: t[5] || (t[5] = (_) => i(k).emit("queries:simulate:error:stop", o.value.key))
                   }, {
                     default: d(() => [
-                      r(E),
+                      r(R),
                       t[20] || (t[20] = v(" Remove error "))
                     ]),
-                    _: 1
+                    _: 1,
+                    __: [20]
                   })),
                   r(y, {
                     class: "theme-warning",
                     size: "sm",
                     title: "Reset this query to its initial (pending) state",
-                    onClick: t[6] || (t[6] = (f) => i(k).emit("queries:reset", o.value.key))
+                    onClick: t[6] || (t[6] = (_) => i(k).emit("queries:reset", o.value.key))
                   }, {
                     default: d(() => [
-                      r(L),
+                      r(E),
                       t[21] || (t[21] = v(" Reset "))
                     ]),
-                    _: 1
+                    _: 1,
+                    __: [21]
                   })
                 ])
               ];
@@ -523,7 +530,7 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
             open: $.value,
             "onUpdate:open": t[8] || (t[8] = (p) => $.value = p),
             title: `Error${o.value.state.status === "error" ? " (!)" : ""}`,
-            icon: i(je)
+            icon: i(Ie)
           }, {
             default: d(() => [
               e("div", rt, [
@@ -554,7 +561,7 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
                   ]),
                   t[25] || (t[25] = e("span", null, "Cancelled:", -1)),
                   e("span", null, [
-                    e("code", ft, u(o.value.devtools.count.cancelled), 1)
+                    e("code", _t, u(o.value.devtools.count.cancelled), 1)
                   ])
                 ])
               ])
@@ -563,11 +570,11 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
           }, 8, ["icon"]),
           r(g, {
             title: `History (${o.value.devtools.history.length})`,
-            icon: i(Ne),
+            icon: i(Le),
             open: !1
           }, {
             default: d(() => [
-              e("div", _t, [
+              e("div", ft, [
                 (n(!0), l(q, null, te(o.value.devtools.history, (p) => (n(), w(g, {
                   key: p.updatedAt,
                   title: `Entry nº${p.id} (${i(B)(new Date(p.updatedAt), h)})`,
@@ -585,7 +592,7 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
           r(g, {
             title: "Options",
             open: !1,
-            icon: i(Re)
+            icon: i(Oe)
           }, {
             default: d(() => [
               e("div", kt, [
@@ -601,7 +608,7 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
         ], 64)) : (n(), l("div", wt, [
           e("p", bt, [
             t[27] || (t[27] = v(" Select a Query to inspect ")),
-            r(N)
+            r(L)
           ])
         ]))
       ]);
@@ -611,4 +618,4 @@ const Ue = m({ name: "lucide-sigma-square", render: Ae }), Fe = { class: "flex f
 export {
   qt as default
 };
-//# sourceMappingURL=_queryId_-BGMH9Qyr.js.map
+//# sourceMappingURL=_queryId_-C_7uiscL.js.map

package/dist-panel/{_queryId_-BGMH9Qyr.js.map → _queryId_-C_7uiscL.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"_queryId_-BGMH9Qyr.js","sources":["../src/panel/components/UCollapse.ce.vue","../src/panel/utils/time.ts","../src/panel/pages/queries/[queryId].vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Component } from 'vue'\n\ndefineProps<{\n title?: string\n icon?: Component\n}>()\n\nconst open = defineModel<boolean>('open', {\n default: true,\n})\n\nfunction scrollIfNeeded(event: TransitionEvent) {\n if (event.target instanceof HTMLElement) {\n const scrollOptions: ScrollIntoViewOptions = {\n block: 'nearest',\n inline: 'nearest',\n behavior: 'smooth',\n }\n event.target.scrollIntoView(scrollOptions)\n }\n}\n</script>\n\n<template>\n <div class=\"collapse collapse-arrow\">\n <input v-model=\"open\" type=\"checkbox\">\n <div class=\"collapse-title px-2 py-0.5 bg-neutral-200 dark:bg-neutral-800 theme-neutral\">\n <slot name=\"title\" :open :title>\n <h3 class=\"font-semibold text-sm flex gap-x-1 items-center\">\n <slot name=\"icon\">\n <component :is=\"icon\" v-if=\"icon\" class=\"size-4\" />\n </slot>\n {{ title ?? 'Group' }}\n </h3>\n </slot>\n </div>\n <div class=\"collapse-content px-2 text-sm overflow-hidden\" @transitionend=\"scrollIfNeeded\">\n <slot :open />\n </div>\n </div>\n</template>\n\n<style scoped>\n.collapse:not(td, tr, colgroup) {\n visibility: visible;\n}\n\n.collapse {\n position: relative;\n display: grid;\n overflow: hidden;\n width: 100%;\n grid-template-rows: max-content 0fr;\n transition: grid-template-rows 0.2s;\n isolation: isolate;\n\n > input:is([type='checkbox'], [type='radio']) {\n grid-column-start: 1;\n grid-row-start: 1;\n appearance: none;\n opacity: 0;\n }\n\n &:is([open], :focus),\n &:has(> input:is([type='checkbox'], [type='radio']):checked) {\n grid-template-rows: max-content 1fr;\n }\n\n &:is([open], :focus) > .collapse-content,\n &:not(.collapse-close)\n > :where(input:is([type='checkbox'], [type='radio']):checked ~ .collapse-content) {\n visibility: visible;\n min-height: fit-content;\n }\n &:focus-visible,\n &:has(> input:is([type='checkbox'], [type='radio']):focus-visible) {\n outline-color: var(--ui-text);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n\n &:not(.collapse-close) {\n > input[type='checkbox'],\n > input[type='radio']:not(:checked),\n > .collapse-title {\n cursor: pointer;\n }\n }\n\n &:focus:not(.collapse-close, .collapse[open]) > .collapse-title {\n cursor: unset;\n }\n\n &:is([open]) {\n &.collapse-arrow {\n > .collapse-title:after {\n transform: translateY(-50%) rotate(225deg);\n }\n }\n }\n\n &.collapse-arrow:focus {\n > .collapse-title:after {\n transform: translateY(-50%) rotate(225deg);\n }\n }\n\n &.collapse-arrow {\n > input:is([type='checkbox'], [type='radio']):checked ~ .collapse-title:after {\n transform: translateY(-50%) rotate(225deg);\n }\n }\n\n > input:is([type='checkbox'], [type='radio']) {\n z-index: 1;\n width: 100%;\n }\n}\n\n.collapse-title,\n.collapse-content {\n grid-column-start: 1;\n grid-row-start: 1;\n}\n\n.collapse-content {\n visibility: hidden;\n grid-column-start: 1;\n grid-row-start: 2;\n min-height: 0;\n cursor: unset;\n transition: visibility 0.2s;\n}\n\n.collapse-arrow {\n > .collapse-title:after {\n position: absolute;\n display: block;\n height: 0.5rem;\n width: 0.5rem;\n transform: translateY(-100%) rotate(45deg);\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.2s;\n top: 50%;\n right: 0.8em;\n inset-inline-end: 0.75rem;\n content: '';\n transform-origin: 75% 75%;\n box-shadow: 2px 2px;\n pointer-events: none;\n }\n}\n\n.collapse-title {\n position: relative;\n width: 100%;\n transition: background-color 0.2s ease-out;\n}\n</style>\n","export function formatDuration(timeInMs: number): string {\n if (timeInMs < 1000) {\n return `${Math.round(timeInMs)} ms`\n }\n\n const seconds = timeInMs / 1000\n if (timeInMs < 10_000) {\n return `${seconds.toFixed(3)} seconds`\n }\n\n if (timeInMs < 60_000) {\n return `${Math.floor(seconds)} seconds`\n }\n\n const minutes = Math.floor(seconds / 60)\n\n if (timeInMs < 3_600_000) {\n return `${minutes} minute${minutes > 1 ? 's' : ''}`\n }\n\n const hours = Math.floor(minutes / 60)\n\n return `${hours}h${minutes % 60}m${seconds % 60}s`\n}\n","<script setup lang=\"ts\">\nimport type { UseQueryEntryPayload } from '@pinia/colada-devtools/shared'\nimport { computed, ref, watch } from 'vue'\nimport { useDuplexChannel, useQueryEntries } from '../../composables/duplex-channel'\nimport { formatDuration } from '../../utils/time'\nimport { useRoute } from 'vue-router'\nimport type { DataStateStatus } from '@pinia/colada'\n\nimport IWrench from '~icons/lucide/wrench'\nimport IInfoCircle from '~icons/lucide/info'\nimport IFileText from '~icons/lucide/file-text'\nimport ICircleX from '~icons/lucide/circle-x'\nimport IBraces from '~icons/lucide/braces'\nimport IHistory from '~icons/lucide/history'\nimport ISigmaSquare from '~icons/lucide/sigma-square'\nimport { useTimeAgo, formatTimeAgo } from '@vueuse/core'\nimport type { FormatTimeAgoOptions } from '@vueuse/core'\n\nconst route = useRoute('/queries/[queryId]')\nconst queries = useQueryEntries()\n\nconst selectedQuery = computed<UseQueryEntryPayload \| null>(() => {\n return queries.value.find((entry) => entry.keyHash === route.params.queryId) ?? null\n})\n\nconst TIME_AGO_OPTIONS: FormatTimeAgoOptions = {\n showSecond: true,\n rounding: 'floor',\n max: 1000 * 60 * 5, // 5 minutes\n}\n\nconst lastUpdate = useTimeAgo(() => selectedQuery.value?.devtools.updatedAt ?? 0, {\n ...TIME_AGO_OPTIONS,\n updateInterval: 3_000,\n})\n\n// TODO: we should be able to highlight components using this query\n// const el = useTemplateRef('me')\n// TODO: add ref=\"me\" to the div\n// watch(\n// // also trigger if the selectedQuery changes\n// () => [el.value, selectedQuery.value?.id] as const,\n// ([el]) => {\n// if (!el \|\| !selectedQuery.value) return\n//\n// const observingComponents = findVueComponents(\n// el,\n// selectedQuery.value.deps.filter((c) => c.type === 'component').map((c) => c.uid) ?? [],\n// )\n//\n// console.log('elements', observingComponents)\n// },\n// )\n\nconst channel = useDuplexChannel()\n\nconst isDataOpen = ref(false)\nlet wasDataOpen = isDataOpen.value\nlet lastStatus: DataStateStatus \| null = null\nconst isErrorOpen = ref(false)\nwatch(\n () => selectedQuery.value?.state,\n (state) => {\n if (!state \|\| lastStatus === state.status) return\n lastStatus = state.status\n if (state.status === 'error') {\n isErrorOpen.value = true\n // preserve it for later\n wasDataOpen = isDataOpen.value\n isDataOpen.value = false\n } else if (state.status === 'success') {\n isDataOpen.value = wasDataOpen\n isErrorOpen.value = false\n }\n },\n)\n</script>\n\n<template>\n <div class=\"flex flex-col divide-y dark:divide-(--ui-border) divide-(--ui-border-accented)\">\n <template v-if=\"selectedQuery\">\n <UCollapse title=\"Details\" :icon=\"IInfoCircle\">\n <div class=\"py-1 text-sm\">\n <p class=\"grid grid-cols-[auto_1fr] gap-1\">\n <span>key:</span>\n <span>\n <code class=\"rounded bg-neutral-500/20 p-0.5\">{{ selectedQuery.key }}</code>\n </span>\n </p>\n\n <p\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"When was the query entry last updated\"\n >\n <span>Last update:</span>\n <span class=\"font-bold\">{{ lastUpdate }}</span>\n </p>\n\n <p\n v-if=\"selectedQuery.devtools.history.at(0)?.fetchTime\"\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"When was the last time the query was fetched\"\n >\n <span>Last fetch:</span>\n <span class=\"font-bold\">{{\n formatTimeAgo(new Date(selectedQuery.devtools.history.at(0)!.fetchTime!.start), {\n ...TIME_AGO_OPTIONS,\n max: undefined,\n })\n }}</span>\n </p>\n\n <p\n v-if=\"selectedQuery.devtools.history.at(0)?.fetchTime?.end\"\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"How long did the last query take to fetch\"\n >\n <span>Fetch duration:</span>\n <span class=\"font-bold\">{{\n formatDuration(\n selectedQuery.devtools.history.at(0)!.fetchTime!.end!\n - selectedQuery.devtools.history.at(0)!.fetchTime!.start,\n )\n }}</span>\n </p>\n\n <p\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"How many components and effects are using this query\"\n >\n <span>Observers: <span class=\"font-bold\">{{ selectedQuery.deps.length }}</span></span>\n </p>\n\n <p\n v-if=\"!selectedQuery.active && selectedQuery.options\"\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"When is this query entry garbace collected\"\n >\n <template\n v-if=\"\n typeof selectedQuery.options.gcTime === 'number'\n && Number.isFinite(selectedQuery.options.gcTime)\n \"\n >\n <span>Will be <i>gced</i></span>\n <span class=\"font-bold\">{{\n formatTimeAgo(\n new Date(selectedQuery.devtools.inactiveAt + selectedQuery.options.gcTime),\n {\n ...TIME_AGO_OPTIONS,\n max: undefined,\n },\n )\n }}</span>\n </template>\n </p>\n </div>\n </UCollapse>\n\n <UCollapse title=\"Actions\" :icon=\"IWrench\">\n <div class=\"py-2 gap-2 flex flex-wrap items-center justify-items-start\">\n <UButton\n class=\"theme-info\"\n size=\"sm\"\n title=\"Refetch this query\"\n :disabled=\"selectedQuery.options?.enabled === false\"\n @click=\"channel.emit('queries:refetch', selectedQuery.key)\"\n >\n <i-lucide-refresh-cw class=\"size-3.5\" /> Refetch\n </UButton>\n\n <UButton\n class=\"theme-neutral\"\n size=\"sm\"\n title=\"Invalidate this query\"\n @click=\"channel.emit('queries:invalidate', selectedQuery.key)\"\n >\n <i-lucide-timer-reset /> Invalidate\n </UButton>\n\n <UButton\n v-if=\"selectedQuery.devtools.simulate !== 'loading'\"\n class=\"theme-purple\"\n size=\"sm\"\n title=\"Restore the previous state\"\n @click=\"channel.emit('queries:simulate:loading', selectedQuery.key)\"\n >\n <i-lucide-loader />\n Simulate loading\n </UButton>\n <UButton\n v-else\n class=\"theme-purple\"\n size=\"sm\"\n title=\"Simulate a loading state\"\n @click=\"channel.emit('queries:simulate:loading:stop', selectedQuery.key)\"\n >\n <i-lucide-loader class=\"animate-spin\" />\n Stop loading\n </UButton>\n\n <UButton\n v-if=\"selectedQuery.devtools.simulate !== 'error'\"\n class=\"theme-error\"\n size=\"sm\"\n title=\"Simulate an Error state\"\n @click=\"channel.emit('queries:simulate:error', selectedQuery.key)\"\n >\n <i-lucide-x-octagon /> Simulate error\n </UButton>\n <UButton\n v-else\n class=\"theme-error\"\n size=\"sm\"\n title=\"Restore the previous state\"\n @click=\"channel.emit('queries:simulate:error:stop', selectedQuery.key)\"\n >\n <i-lucide-rotate-ccw /> Remove error\n </UButton>\n\n <UButton\n class=\"theme-warning\"\n size=\"sm\"\n title=\"Reset this query to its initial (pending) state\"\n @click=\"channel.emit('queries:reset', selectedQuery.key)\"\n >\n <i-lucide-trash /> Reset\n </UButton>\n </div>\n </UCollapse>\n\n <UCollapse v-model:open=\"isDataOpen\" title=\"Data\" :icon=\"IFileText\">\n <div class=\"py-1\">\n <pre\n v-if=\"selectedQuery.state.data !== undefined\"\n class=\"rounded p-1 overflow-auto max-h-[1200px]\"\n >{{ selectedQuery.state.data }}</pre>\n <p v-else class=\"text-neutral-500/50\">\n No data\n </p>\n </div>\n </UCollapse>\n\n <UCollapse\n v-model:open=\"isErrorOpen\"\n :title=\"`Error${selectedQuery.state.status === 'error' ? ' (!)' : ''}`\"\n :icon=\"ICircleX\"\n >\n <div class=\"py-1\">\n <pre v-if=\"selectedQuery.state.error\" class=\"rounded p-1 overflow-auto max-h-[1200px]\">{{\n selectedQuery.state.error\n }}</pre>\n <p v-else class=\"text-neutral-500/50\">\n No error\n </p>\n </div>\n </UCollapse>\n\n <UCollapse title=\"Call count\" :icon=\"ISigmaSquare\" :open=\"false\">\n <div class=\"py-1\">\n <p class=\"grid grid-cols-[auto_1fr] gap-1\">\n <span>Calls:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.total }}</code>\n </span>\n <span>Success:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.succeed }}</code>\n </span>\n <span>Errors:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.errored }}</code>\n </span>\n <span>Cancelled:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.cancelled }}</code>\n </span>\n </p>\n </div>\n </UCollapse>\n\n <UCollapse\n :title=\"`History (${selectedQuery.devtools.history.length})`\"\n :icon=\"IHistory\"\n :open=\"false\"\n >\n <div class=\"py-1\">\n <UCollapse\n v-for=\"entry of selectedQuery.devtools.history\"\n :key=\"entry.updatedAt\"\n :title=\"`Entry nº${entry.id} (${formatTimeAgo(new Date(entry.updatedAt), TIME_AGO_OPTIONS)})`\"\n :open=\"false\"\n >\n <pre class=\"rounded p-1 overflow-auto max-h-[1200px]\">{{ entry }}</pre>\n </UCollapse>\n </div>\n </UCollapse>\n\n <UCollapse title=\"Options\" :open=\"false\" :icon=\"IBraces\">\n <div class=\"py-1\">\n <pre\n v-if=\"selectedQuery.options\"\n class=\"rounded bg-neutral-500/20 p-1 overflow-auto max-h-[1200px]\"\n >{{ selectedQuery.options }}</pre>\n <p v-else>\n This Query entry has no options. It might have been created from the server or manually\n set with\n <code>queryCache.setQueryData()</code> for prefetching.\n </p>\n </div>\n </UCollapse>\n </template>\n\n <template v-else>\n <div class=\"py-6 mx-auto\">\n <p class=\"flex flex-col text-center items-center gap-2 text-lg px-2\">\n Select a Query to inspect\n <i-lucide-mouse-pointer-click />\n </p>\n </div>\n </template>\n </div>\n</template>\n"],"names":["open","_useModel","__props","scrollIfNeeded","event","scrollOptions","formatDuration","timeInMs","seconds","minutes","route","useRoute","queries","useQueryEntries","selectedQuery","computed","entry","TIME_AGO_OPTIONS","lastUpdate","useTimeAgo","_a","channel","useDuplexChannel","isDataOpen","ref","wasDataOpen","lastStatus","isErrorOpen","watch","state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQM,UAAAA,IAAOC,EAAqBC,GAAA,MAEjC;AAED,aAASC,EAAeC,GAAwB;AAC1C,UAAAA,EAAM,kBAAkB,aAAa;AACvC,cAAMC,IAAuC;AAAA,UAC3C,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,UAAU;AAAA,QACZ;AACM,QAAAD,EAAA,OAAO,eAAeC,CAAa;AAAA,MAAA;AAAA,IAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpBK,SAASC,GAAeC,GAA0B;AACvD,MAAIA,IAAW;AACb,WAAO,GAAG,KAAK,MAAMA,CAAQ,CAAC;AAGhC,QAAMC,IAAUD,IAAW;AAC3B,MAAIA,IAAW;AACb,WAAO,GAAGC,EAAQ,QAAQ,CAAC,CAAC;AAG9B,MAAID,IAAW;AACb,WAAO,GAAG,KAAK,MAAMC,CAAO,CAAC;AAG/B,QAAMC,IAAU,KAAK,MAAMD,IAAU,EAAE;AAEvC,SAAID,IAAW,OACN,GAAGE,CAAO,UAAUA,IAAU,IAAI,MAAM,EAAE,KAK5C,GAFO,KAAK,MAAMA,IAAU,EAAE,CAEtB,IAAIA,IAAU,EAAE,IAAID,IAAU,EAAE;AACjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACLM,UAAAE,IAAQC,EAA6B,GACrCC,IAAUC,EAAgB,GAE1BC,IAAgBC,EAAsC,MACnDH,EAAQ,MAAM,KAAK,CAACI,MAAUA,EAAM,YAAYN,EAAM,OAAO,OAAO,KAAK,IACjF,GAEKO,IAAyC;AAAA,MAC7C,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,KAAK,MAAO,KAAK;AAAA;AAAA,IACnB,GAEMC,IAAaC,EAAW,MAAM;;AAAA,eAAAC,IAAAN,EAAc,UAAd,gBAAAM,EAAqB,SAAS,cAAa;AAAA,OAAG;AAAA,MAChF,GAAGH;AAAA,MACH,gBAAgB;AAAA,IAAA,CACjB,GAoBKI,IAAUC,EAAiB,GAE3BC,IAAaC,EAAI,EAAK;AAC5B,QAAIC,IAAcF,EAAW,OACzBG,IAAqC;AACnC,UAAAC,IAAcH,EAAI,EAAK;AAC7B,WAAAI;AAAA,MACE,MAAM;;AAAA,gBAAAR,IAAAN,EAAc,UAAd,gBAAAM,EAAqB;AAAA;AAAA,MAC3B,CAACS,MAAU;AACT,QAAI,CAACA,KAASH,MAAeG,EAAM,WACnCH,IAAaG,EAAM,QACfA,EAAM,WAAW,WACnBF,EAAY,QAAQ,IAEpBF,IAAcF,EAAW,OACzBA,EAAW,QAAQ,MACVM,EAAM,WAAW,cAC1BN,EAAW,QAAQE,GACnBE,EAAY,QAAQ;AAAA,MACtB;AAAA,IAEJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"_queryId_-C_7uiscL.js","sources":["../src/panel/components/UCollapse.ce.vue","../src/panel/utils/time.ts","../src/panel/pages/queries/[queryId].vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Component } from 'vue'\n\ndefineProps<{\n title?: string\n icon?: Component\n}>()\n\nconst open = defineModel<boolean>('open', {\n default: true,\n})\n\nfunction scrollIfNeeded(event: TransitionEvent) {\n if (event.target instanceof HTMLElement) {\n const scrollOptions: ScrollIntoViewOptions = {\n block: 'nearest',\n inline: 'nearest',\n behavior: 'smooth',\n }\n event.target.scrollIntoView(scrollOptions)\n }\n}\n</script>\n\n<template>\n <div class=\"collapse collapse-arrow\">\n <input v-model=\"open\" type=\"checkbox\">\n <div class=\"collapse-title px-2 py-0.5 bg-neutral-200 dark:bg-neutral-800 theme-neutral\">\n <slot name=\"title\" :open :title>\n <h3 class=\"font-semibold text-sm flex gap-x-1 items-center\">\n <slot name=\"icon\">\n <component :is=\"icon\" v-if=\"icon\" class=\"size-4\" />\n </slot>\n {{ title ?? 'Group' }}\n </h3>\n </slot>\n </div>\n <div class=\"collapse-content px-2 text-sm overflow-hidden\" @transitionend=\"scrollIfNeeded\">\n <slot :open />\n </div>\n </div>\n</template>\n\n<style scoped>\n.collapse:not(td, tr, colgroup) {\n visibility: visible;\n}\n\n.collapse {\n position: relative;\n display: grid;\n overflow: hidden;\n width: 100%;\n grid-template-rows: max-content 0fr;\n transition: grid-template-rows 0.2s;\n isolation: isolate;\n\n > input:is([type='checkbox'], [type='radio']) {\n grid-column-start: 1;\n grid-row-start: 1;\n appearance: none;\n opacity: 0;\n }\n\n &:is([open], :focus),\n &:has(> input:is([type='checkbox'], [type='radio']):checked) {\n grid-template-rows: max-content 1fr;\n }\n\n &:is([open], :focus) > .collapse-content,\n &:not(.collapse-close)\n > :where(input:is([type='checkbox'], [type='radio']):checked ~ .collapse-content) {\n visibility: visible;\n min-height: fit-content;\n }\n &:focus-visible,\n &:has(> input:is([type='checkbox'], [type='radio']):focus-visible) {\n outline-color: var(--ui-text);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n\n &:not(.collapse-close) {\n > input[type='checkbox'],\n > input[type='radio']:not(:checked),\n > .collapse-title {\n cursor: pointer;\n }\n }\n\n &:focus:not(.collapse-close, .collapse[open]) > .collapse-title {\n cursor: unset;\n }\n\n &:is([open]) {\n &.collapse-arrow {\n > .collapse-title:after {\n transform: translateY(-50%) rotate(225deg);\n }\n }\n }\n\n &.collapse-arrow:focus {\n > .collapse-title:after {\n transform: translateY(-50%) rotate(225deg);\n }\n }\n\n &.collapse-arrow {\n > input:is([type='checkbox'], [type='radio']):checked ~ .collapse-title:after {\n transform: translateY(-50%) rotate(225deg);\n }\n }\n\n > input:is([type='checkbox'], [type='radio']) {\n z-index: 1;\n width: 100%;\n }\n}\n\n.collapse-title,\n.collapse-content {\n grid-column-start: 1;\n grid-row-start: 1;\n}\n\n.collapse-content {\n visibility: hidden;\n grid-column-start: 1;\n grid-row-start: 2;\n min-height: 0;\n cursor: unset;\n transition: visibility 0.2s;\n}\n\n.collapse-arrow {\n > .collapse-title:after {\n position: absolute;\n display: block;\n height: 0.5rem;\n width: 0.5rem;\n transform: translateY(-100%) rotate(45deg);\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.2s;\n top: 50%;\n right: 0.8em;\n inset-inline-end: 0.75rem;\n content: '';\n transform-origin: 75% 75%;\n box-shadow: 2px 2px;\n pointer-events: none;\n }\n}\n\n.collapse-title {\n position: relative;\n width: 100%;\n transition: background-color 0.2s ease-out;\n}\n</style>\n","export function formatDuration(timeInMs: number): string {\n if (timeInMs < 1000) {\n return `${Math.round(timeInMs)} ms`\n }\n\n const seconds = timeInMs / 1000\n if (timeInMs < 10_000) {\n return `${seconds.toFixed(3)} seconds`\n }\n\n if (timeInMs < 60_000) {\n return `${Math.floor(seconds)} seconds`\n }\n\n const minutes = Math.floor(seconds / 60)\n\n if (timeInMs < 3_600_000) {\n return `${minutes} minute${minutes > 1 ? 's' : ''}`\n }\n\n const hours = Math.floor(minutes / 60)\n\n return `${hours}h${minutes % 60}m${seconds % 60}s`\n}\n","<script setup lang=\"ts\">\nimport type { UseQueryEntryPayload } from '@pinia/colada-devtools/shared'\nimport { computed, ref, watch } from 'vue'\nimport { useDuplexChannel, useQueryEntries } from '../../composables/duplex-channel'\nimport { formatDuration } from '../../utils/time'\nimport { useRoute } from 'vue-router'\nimport type { DataStateStatus } from '@pinia/colada'\n\nimport IWrench from '~icons/lucide/wrench'\nimport IInfoCircle from '~icons/lucide/info'\nimport IFileText from '~icons/lucide/file-text'\nimport ICircleX from '~icons/lucide/circle-x'\nimport IBraces from '~icons/lucide/braces'\nimport IHistory from '~icons/lucide/history'\nimport ISigmaSquare from '~icons/lucide/sigma-square'\nimport { useTimeAgo, formatTimeAgo } from '@vueuse/core'\nimport type { FormatTimeAgoOptions } from '@vueuse/core'\n\nconst route = useRoute('/queries/[queryId]')\nconst queries = useQueryEntries()\n\nconst selectedQuery = computed<UseQueryEntryPayload \| null>(() => {\n return queries.value.find((entry) => entry.keyHash === route.params.queryId) ?? null\n})\n\nconst TIME_AGO_OPTIONS: FormatTimeAgoOptions = {\n showSecond: true,\n rounding: 'floor',\n max: 1000 * 60 * 5, // 5 minutes\n}\n\nconst lastUpdate = useTimeAgo(() => selectedQuery.value?.devtools.updatedAt ?? 0, {\n ...TIME_AGO_OPTIONS,\n updateInterval: 3_000,\n})\n\n// TODO: we should be able to highlight components using this query\n// const el = useTemplateRef('me')\n// TODO: add ref=\"me\" to the div\n// watch(\n// // also trigger if the selectedQuery changes\n// () => [el.value, selectedQuery.value?.id] as const,\n// ([el]) => {\n// if (!el \|\| !selectedQuery.value) return\n//\n// const observingComponents = findVueComponents(\n// el,\n// selectedQuery.value.deps.filter((c) => c.type === 'component').map((c) => c.uid) ?? [],\n// )\n//\n// console.log('elements', observingComponents)\n// },\n// )\n\nconst channel = useDuplexChannel()\n\nconst isDataOpen = ref(false)\nlet wasDataOpen = isDataOpen.value\nlet lastStatus: DataStateStatus \| null = null\nconst isErrorOpen = ref(false)\nwatch(\n () => selectedQuery.value?.state,\n (state) => {\n if (!state \|\| lastStatus === state.status) return\n lastStatus = state.status\n if (state.status === 'error') {\n isErrorOpen.value = true\n // preserve it for later\n wasDataOpen = isDataOpen.value\n isDataOpen.value = false\n } else if (state.status === 'success') {\n isDataOpen.value = wasDataOpen\n isErrorOpen.value = false\n }\n },\n)\n</script>\n\n<template>\n <div class=\"flex flex-col divide-y dark:divide-(--ui-border) divide-(--ui-border-accented)\">\n <template v-if=\"selectedQuery\">\n <UCollapse title=\"Details\" :icon=\"IInfoCircle\">\n <div class=\"py-1 text-sm\">\n <p class=\"grid grid-cols-[auto_1fr] gap-1\">\n <span>key:</span>\n <span>\n <code class=\"rounded bg-neutral-500/20 p-0.5\">{{ selectedQuery.key }}</code>\n </span>\n </p>\n\n <p\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"When was the query entry last updated\"\n >\n <span>Last update:</span>\n <span class=\"font-bold\">{{ lastUpdate }}</span>\n </p>\n\n <p\n v-if=\"selectedQuery.devtools.history.at(0)?.fetchTime\"\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"When was the last time the query was fetched\"\n >\n <span>Last fetch:</span>\n <span class=\"font-bold\">{{\n formatTimeAgo(new Date(selectedQuery.devtools.history.at(0)!.fetchTime!.start), {\n ...TIME_AGO_OPTIONS,\n max: undefined,\n })\n }}</span>\n </p>\n\n <p\n v-if=\"selectedQuery.devtools.history.at(0)?.fetchTime?.end\"\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"How long did the last query take to fetch\"\n >\n <span>Fetch duration:</span>\n <span class=\"font-bold\">{{\n formatDuration(\n selectedQuery.devtools.history.at(0)!.fetchTime!.end!\n - selectedQuery.devtools.history.at(0)!.fetchTime!.start,\n )\n }}</span>\n </p>\n\n <p\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"How many components and effects are using this query\"\n >\n <span>Observers: <span class=\"font-bold\">{{ selectedQuery.deps.length }}</span></span>\n </p>\n\n <p\n v-if=\"!selectedQuery.active && selectedQuery.options\"\n class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n title=\"When is this query entry garbace collected\"\n >\n <template\n v-if=\"\n typeof selectedQuery.options.gcTime === 'number'\n && Number.isFinite(selectedQuery.options.gcTime)\n \"\n >\n <span>Will be <i>gced</i></span>\n <span class=\"font-bold\">{{\n formatTimeAgo(\n new Date(selectedQuery.devtools.inactiveAt + selectedQuery.options.gcTime),\n {\n ...TIME_AGO_OPTIONS,\n max: undefined,\n },\n )\n }}</span>\n </template>\n </p>\n </div>\n </UCollapse>\n\n <UCollapse title=\"Actions\" :icon=\"IWrench\">\n <div class=\"py-2 gap-2 flex flex-wrap items-center justify-items-start\">\n <UButton\n class=\"theme-info\"\n size=\"sm\"\n title=\"Refetch this query\"\n :disabled=\"selectedQuery.options?.enabled === false\"\n @click=\"channel.emit('queries:refetch', selectedQuery.key)\"\n >\n <i-lucide-refresh-cw class=\"size-3.5\" /> Refetch\n </UButton>\n\n <UButton\n class=\"theme-neutral\"\n size=\"sm\"\n title=\"Invalidate this query\"\n @click=\"channel.emit('queries:invalidate', selectedQuery.key)\"\n >\n <i-lucide-timer-reset /> Invalidate\n </UButton>\n\n <UButton\n v-if=\"selectedQuery.devtools.simulate !== 'loading'\"\n class=\"theme-purple\"\n size=\"sm\"\n title=\"Restore the previous state\"\n @click=\"channel.emit('queries:simulate:loading', selectedQuery.key)\"\n >\n <i-lucide-loader />\n Simulate loading\n </UButton>\n <UButton\n v-else\n class=\"theme-purple\"\n size=\"sm\"\n title=\"Simulate a loading state\"\n @click=\"channel.emit('queries:simulate:loading:stop', selectedQuery.key)\"\n >\n <i-lucide-loader class=\"animate-spin\" />\n Stop loading\n </UButton>\n\n <UButton\n v-if=\"selectedQuery.devtools.simulate !== 'error'\"\n class=\"theme-error\"\n size=\"sm\"\n title=\"Simulate an Error state\"\n @click=\"channel.emit('queries:simulate:error', selectedQuery.key)\"\n >\n <i-lucide-x-octagon /> Simulate error\n </UButton>\n <UButton\n v-else\n class=\"theme-error\"\n size=\"sm\"\n title=\"Restore the previous state\"\n @click=\"channel.emit('queries:simulate:error:stop', selectedQuery.key)\"\n >\n <i-lucide-rotate-ccw /> Remove error\n </UButton>\n\n <UButton\n class=\"theme-warning\"\n size=\"sm\"\n title=\"Reset this query to its initial (pending) state\"\n @click=\"channel.emit('queries:reset', selectedQuery.key)\"\n >\n <i-lucide-trash /> Reset\n </UButton>\n </div>\n </UCollapse>\n\n <UCollapse v-model:open=\"isDataOpen\" title=\"Data\" :icon=\"IFileText\">\n <div class=\"py-1\">\n <pre\n v-if=\"selectedQuery.state.data !== undefined\"\n class=\"rounded p-1 overflow-auto max-h-[1200px]\"\n >{{ selectedQuery.state.data }}</pre>\n <p v-else class=\"text-neutral-500/50\">\n No data\n </p>\n </div>\n </UCollapse>\n\n <UCollapse\n v-model:open=\"isErrorOpen\"\n :title=\"`Error${selectedQuery.state.status === 'error' ? ' (!)' : ''}`\"\n :icon=\"ICircleX\"\n >\n <div class=\"py-1\">\n <pre v-if=\"selectedQuery.state.error\" class=\"rounded p-1 overflow-auto max-h-[1200px]\">{{\n selectedQuery.state.error\n }}</pre>\n <p v-else class=\"text-neutral-500/50\">\n No error\n </p>\n </div>\n </UCollapse>\n\n <UCollapse title=\"Call count\" :icon=\"ISigmaSquare\" :open=\"false\">\n <div class=\"py-1\">\n <p class=\"grid grid-cols-[auto_1fr] gap-1\">\n <span>Calls:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.total }}</code>\n </span>\n <span>Success:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.succeed }}</code>\n </span>\n <span>Errors:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.errored }}</code>\n </span>\n <span>Cancelled:</span>\n <span>\n <code class=\"font-bold\">{{ selectedQuery.devtools.count.cancelled }}</code>\n </span>\n </p>\n </div>\n </UCollapse>\n\n <UCollapse\n :title=\"`History (${selectedQuery.devtools.history.length})`\"\n :icon=\"IHistory\"\n :open=\"false\"\n >\n <div class=\"py-1\">\n <UCollapse\n v-for=\"entry of selectedQuery.devtools.history\"\n :key=\"entry.updatedAt\"\n :title=\"`Entry nº${entry.id} (${formatTimeAgo(new Date(entry.updatedAt), TIME_AGO_OPTIONS)})`\"\n :open=\"false\"\n >\n <pre class=\"rounded p-1 overflow-auto max-h-[1200px]\">{{ entry }}</pre>\n </UCollapse>\n </div>\n </UCollapse>\n\n <UCollapse title=\"Options\" :open=\"false\" :icon=\"IBraces\">\n <div class=\"py-1\">\n <pre\n v-if=\"selectedQuery.options\"\n class=\"rounded bg-neutral-500/20 p-1 overflow-auto max-h-[1200px]\"\n >{{ selectedQuery.options }}</pre>\n <p v-else>\n This Query entry has no options. It might have been created from the server or manually\n set with\n <code>queryCache.setQueryData()</code> for prefetching.\n </p>\n </div>\n </UCollapse>\n </template>\n\n <template v-else>\n <div class=\"py-6 mx-auto\">\n <p class=\"flex flex-col text-center items-center gap-2 text-lg px-2\">\n Select a Query to inspect\n <i-lucide-mouse-pointer-click />\n </p>\n </div>\n </template>\n </div>\n</template>\n"],"names":["open","_useModel","__props","scrollIfNeeded","event","scrollOptions","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","$event","_hoisted_2","_renderSlot","_ctx","title","_hoisted_3","icon","_createBlock","_resolveDynamicComponent","_createTextVNode","formatDuration","timeInMs","seconds","minutes","route","useRoute","queries","useQueryEntries","selectedQuery","computed","entry","TIME_AGO_OPTIONS","lastUpdate","useTimeAgo","_a","channel","useDuplexChannel","isDataOpen","ref","wasDataOpen","lastStatus","isErrorOpen","watch","state","_Fragment","_createVNode","_component_UCollapse","_unref","IInfoCircle","_cache","_hoisted_4","_toDisplayString","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","formatTimeAgo","_c","_b","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","IWrench","_hoisted_15","_component_UButton","_component_i_lucide_refresh_cw","_component_i_lucide_timer_reset","_component_i_lucide_loader","_component_i_lucide_x_octagon","_component_i_lucide_rotate_ccw","_component_i_lucide_trash","IFileText","_hoisted_16","_hoisted_17","_hoisted_18","ICircleX","_hoisted_19","_hoisted_20","_hoisted_21","ISigmaSquare","_hoisted_22","_hoisted_23","_hoisted_24","_hoisted_25","_hoisted_26","_hoisted_27","IHistory","_hoisted_28","_hoisted_29","IBraces","_hoisted_30","_hoisted_31","_hoisted_32","_hoisted_33","_hoisted_34","_component_i_lucide_mouse_pointer_click"],"mappings":"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"}