@tanstack/react-query-devtools 4.4.0 → 4.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/react-query-devtools",
-  "version": "4.4.0",
+  "version": "4.6.0",
   "description": "TODO",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -51,6 +51,6 @@
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
-    "@tanstack/react-query": "4.4.0"
+    "@tanstack/react-query": "4.6.0"
   }
 }

package/src/Explorer.tsx

@@ -67,7 +67,7 @@ type Entry = {
 }
 
 type RendererProps = {
-  HandleEntry: HandleEntryComponent
+  handleEntry: (entry: Entry) => JSX.Element
   label?: string
   value: unknown
   subEntries: Entry[]
@@ -101,7 +101,7 @@ export function chunkArray<T>(array: T[], size: number): T[][] {
 type Renderer = (props: RendererProps) => JSX.Element
 
 export const DefaultRenderer: Renderer = ({
-  HandleEntry,
+  handleEntry,
   label,
   value,
   subEntries = [],
@@ -126,11 +126,7 @@ export const DefaultRenderer: Renderer = ({
           </ExpandButton>
           {expanded ? (
             subEntryPages.length === 1 ? (
-              <SubEntries>
-                {subEntries.map((entry) => (
-                  <HandleEntry key={entry.label} entry={entry} />
-                ))}
-              </SubEntries>
+              <SubEntries>{subEntries.map(handleEntry)}</SubEntries>
             ) : (
               <SubEntries>
                 {subEntryPages.map((entries, index) => (
@@ -149,11 +145,7 @@ export const DefaultRenderer: Renderer = ({
                         {index * pageSize + pageSize - 1}]
                       </LabelButton>
                       {expandedPages.includes(index) ? (
-                        <SubEntries>
-                          {entries.map((entry) => (
-                            <HandleEntry key={entry.label} entry={entry} />
-                          ))}
-                        </SubEntries>
+                        <SubEntries>{entries.map(handleEntry)}</SubEntries>
                       ) : null}
                     </Entry>
                   </div>
@@ -171,8 +163,6 @@ export const DefaultRenderer: Renderer = ({
   )
 }
 
-type HandleEntryComponent = (props: { entry: Entry }) => JSX.Element
-
 type ExplorerProps = Partial<RendererProps> & {
   renderer?: Renderer
   defaultExpanded?: true | Record<string, boolean>
@@ -246,8 +236,14 @@ export default function Explorer({
   const subEntryPages = chunkArray(subEntries, pageSize)
 
   return renderer({
-    HandleEntry: ({ entry }) => (
-      <Explorer value={value} renderer={renderer} {...rest} {...entry} />
+    handleEntry: (entry) => (
+      <Explorer
+        key={entry.label}
+        value={value}
+        renderer={renderer}
+        {...rest}
+        {...entry}
+      />
     ),
     type,
     subEntries,

package/src/__tests__/Explorer.test.tsx

@@ -39,7 +39,7 @@ describe('Explorer', () => {
           pageSize={10}
           expanded={false}
           subEntryPages={[[{ label: 'A lovely label' }]]}
-          HandleEntry={() => <></>}
+          handleEntry={() => <></>}
           value={undefined}
           subEntries={[]}
           type="string"