From 39c8c20569eb078097fdd38cecd3b73748421176 Mon Sep 17 00:00:00 2001
From: Judicael <46365844+judicaelandria@users.noreply.github.com>
Date: Thu, 14 Sep 2023 12:42:25 +0300
Subject: [PATCH 1/5] feat(devtools): fix restore/trigger loading cond

---
 packages/query-devtools/src/Devtools.tsx | 56 ++++++++++++------------
 1 file changed, 28 insertions(+), 28 deletions(-)

diff --git a/packages/query-devtools/src/Devtools.tsx b/packages/query-devtools/src/Devtools.tsx
index f27f3ddbdc..7f43792724 100644
--- a/packages/query-devtools/src/Devtools.tsx
+++ b/packages/query-devtools/src/Devtools.tsx
@@ -1,3 +1,11 @@
+import { css, cx } from '@emotion/css'
+import { Key } from '@solid-primitives/keyed'
+import { createResizeObserver } from '@solid-primitives/resize-observer'
+import type { StorageObject, StorageSetter } from '@solid-primitives/storage'
+import { createLocalStorage } from '@solid-primitives/storage'
+import { rankItem } from '@tanstack/match-sorter-utils'
+import type { Query, QueryCache, QueryState } from '@tanstack/query-core'
+import type { Accessor, Component, JSX, Setter } from 'solid-js'
 import {
   For,
   Show,
@@ -8,22 +16,16 @@ import {
   onCleanup,
   onMount,
 } from 'solid-js'
-import { rankItem } from '@tanstack/match-sorter-utils'
-import { css, cx } from '@emotion/css'
 import { TransitionGroup } from 'solid-transition-group'
-import { Key } from '@solid-primitives/keyed'
-import { createLocalStorage } from '@solid-primitives/storage'
-import { createResizeObserver } from '@solid-primitives/resize-observer'
-import { tokens } from './theme'
-import {
-  convertRemToPixels,
-  displayValue,
-  getQueryStatusColor,
-  getQueryStatusColorByLabel,
-  getQueryStatusLabel,
-  getSidedProp,
-  sortFns,
-} from './utils'
+import type {
+  DevToolsErrorType,
+  DevtoolsButtonPosition,
+  DevtoolsPosition,
+  QueryDevtoolsProps,
+} from './Context'
+import { QueryDevtoolsContext, useQueryDevtoolsContext } from './Context'
+import Explorer from './Explorer'
+import { loadFonts } from './fonts'
 import {
   ArrowDown,
   ArrowUp,
@@ -34,18 +36,16 @@ import {
   TanstackLogo,
   Wifi,
 } from './icons'
-import Explorer from './Explorer'
-import { QueryDevtoolsContext, useQueryDevtoolsContext } from './Context'
-import { loadFonts } from './fonts'
-import type {
-  DevToolsErrorType,
-  DevtoolsButtonPosition,
-  DevtoolsPosition,
-  QueryDevtoolsProps,
-} from './Context'
-import type { Query, QueryCache, QueryState } from '@tanstack/query-core'
-import type { StorageObject, StorageSetter } from '@solid-primitives/storage'
-import type { Accessor, Component, JSX, Setter } from 'solid-js'
+import { tokens } from './theme'
+import {
+  convertRemToPixels,
+  displayValue,
+  getQueryStatusColor,
+  getQueryStatusColorByLabel,
+  getQueryStatusLabel,
+  getSidedProp,
+  sortFns,
+} from './utils'
 
 interface DevtoolsPanelProps {
   localStore: StorageObject<string>
@@ -1034,7 +1034,7 @@ const QueryDetails = () => {
                 background-color: ${tokens.colors.cyan[400]};
               `}
             ></span>
-            {statusLabel() === 'fetching' ? 'Restore' : 'Trigger'} Loading
+            {restoringLoading() ? 'Restore' : 'Trigger'} Loading
           </button>
           <Show when={errorTypes().length === 0 || queryStatus() === 'error'}>
             <button

From 9d40f83d1699f21cadc5443bd08e3fc24fa73567 Mon Sep 17 00:00:00 2001
From: Judicael <46365844+judicaelandria@users.noreply.github.com>
Date: Thu, 14 Sep 2023 12:51:47 +0300
Subject: [PATCH 2/5] fix eslint

---
 packages/query-devtools/src/Devtools.tsx | 54 ++++++++++++------------
 1 file changed, 27 insertions(+), 27 deletions(-)

diff --git a/packages/query-devtools/src/Devtools.tsx b/packages/query-devtools/src/Devtools.tsx
index 7f43792724..2c92b78f43 100644
--- a/packages/query-devtools/src/Devtools.tsx
+++ b/packages/query-devtools/src/Devtools.tsx
@@ -1,11 +1,3 @@
-import { css, cx } from '@emotion/css'
-import { Key } from '@solid-primitives/keyed'
-import { createResizeObserver } from '@solid-primitives/resize-observer'
-import type { StorageObject, StorageSetter } from '@solid-primitives/storage'
-import { createLocalStorage } from '@solid-primitives/storage'
-import { rankItem } from '@tanstack/match-sorter-utils'
-import type { Query, QueryCache, QueryState } from '@tanstack/query-core'
-import type { Accessor, Component, JSX, Setter } from 'solid-js'
 import {
   For,
   Show,
@@ -16,26 +8,12 @@ import {
   onCleanup,
   onMount,
 } from 'solid-js'
+import { rankItem } from '@tanstack/match-sorter-utils'
+import { css, cx } from '@emotion/css'
 import { TransitionGroup } from 'solid-transition-group'
-import type {
-  DevToolsErrorType,
-  DevtoolsButtonPosition,
-  DevtoolsPosition,
-  QueryDevtoolsProps,
-} from './Context'
-import { QueryDevtoolsContext, useQueryDevtoolsContext } from './Context'
-import Explorer from './Explorer'
-import { loadFonts } from './fonts'
-import {
-  ArrowDown,
-  ArrowUp,
-  ChevronDown,
-  Offline,
-  Search,
-  Settings,
-  TanstackLogo,
-  Wifi,
-} from './icons'
+import { Key } from '@solid-primitives/keyed'
+import { createLocalStorage } from '@solid-primitives/storage'
+import { createResizeObserver } from '@solid-primitives/resize-observer'
 import { tokens } from './theme'
 import {
   convertRemToPixels,
@@ -46,6 +24,28 @@ import {
   getSidedProp,
   sortFns,
 } from './utils'
+import {
+  ArrowDown,
+  ArrowUp,
+  ChevronDown,
+  Offline,
+  Search,
+  Settings,
+  TanstackLogo,
+  Wifi,
+} from './icons'
+import Explorer from './Explorer'
+import { QueryDevtoolsContext, useQueryDevtoolsContext } from './Context'
+import { loadFonts } from './fonts'
+import type {
+  DevToolsErrorType,
+  DevtoolsButtonPosition,
+  DevtoolsPosition,
+  QueryDevtoolsProps,
+} from './Context'
+import type { Query, QueryCache, QueryState } from '@tanstack/query-core'
+import type { StorageObject, StorageSetter } from '@solid-primitives/storage'
+import type { Accessor, Component, JSX, Setter } from 'solid-js'
 
 interface DevtoolsPanelProps {
   localStore: StorageObject<string>

From 195e189e18539b69d0359e70f13fe8f6aae2a36c Mon Sep 17 00:00:00 2001
From: Judicael <46365844+judicaelandria@users.noreply.github.com>
Date: Sun, 17 Sep 2023 19:58:22 +0300
Subject: [PATCH 3/5] use queryStatus for the trigger loading state

---
 packages/query-devtools/src/Devtools.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/query-devtools/src/Devtools.tsx b/packages/query-devtools/src/Devtools.tsx
index 2c92b78f43..5b5f8fcb80 100644
--- a/packages/query-devtools/src/Devtools.tsx
+++ b/packages/query-devtools/src/Devtools.tsx
@@ -1034,7 +1034,7 @@ const QueryDetails = () => {
                 background-color: ${tokens.colors.cyan[400]};
               `}
             ></span>
-            {restoringLoading() ? 'Restore' : 'Trigger'} Loading
+            {queryStatus() === 'pending' ? 'Restore' : 'Trigger'} Loading
           </button>
           <Show when={errorTypes().length === 0 || queryStatus() === 'error'}>
             <button

From 46ac2d87d19e4378d889cd9d3704eb6e6d161054 Mon Sep 17 00:00:00 2001
From: Judicael <46365844+judicaelandria@users.noreply.github.com>
Date: Mon, 18 Sep 2023 09:43:01 +0300
Subject: [PATCH 4/5] disable trigger error while state loading

---
 packages/query-devtools/src/Devtools.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/query-devtools/src/Devtools.tsx b/packages/query-devtools/src/Devtools.tsx
index 5b5f8fcb80..3a1c9376d2 100644
--- a/packages/query-devtools/src/Devtools.tsx
+++ b/packages/query-devtools/src/Devtools.tsx
@@ -1048,6 +1048,7 @@ const QueryDetails = () => {
                   queryClient.resetQueries(activeQuery())
                 }
               }}
+              disabled={queryStatus() === 'pending'}
             >
               <span
                 class={css`

From 1403984243c44549241e00b69650dc9c78887e9a Mon Sep 17 00:00:00 2001
From: Judicael <46365844+judicaelandria@users.noreply.github.com>
Date: Mon, 18 Sep 2023 19:41:25 +0300
Subject: [PATCH 5/5] disable invalidate and reset on status pending

---
 packages/query-devtools/src/Devtools.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/query-devtools/src/Devtools.tsx b/packages/query-devtools/src/Devtools.tsx
index 3a1c9376d2..3297dfaf6b 100644
--- a/packages/query-devtools/src/Devtools.tsx
+++ b/packages/query-devtools/src/Devtools.tsx
@@ -973,6 +973,7 @@ const QueryDetails = () => {
               color: ${tokens.colors.yellow[400]};
             `}
             onClick={() => queryClient.invalidateQueries(activeQuery())}
+            disabled={queryStatus() === 'pending'}
           >
             <span
               class={css`
@@ -986,6 +987,7 @@ const QueryDetails = () => {
               color: ${tokens.colors.gray[300]};
             `}
             onClick={() => queryClient.resetQueries(activeQuery())}
+            disabled={queryStatus() === 'pending'}
           >
             <span
               class={css`