Merge branch 'main' into react-compiler2

graphql · Dec 25, 2024 · fd8411b · fd8411b
2 parents bdd41ba + 614ff8b
commit fd8411b
Show file tree

Hide file tree

Showing 9 changed files with 53 additions and 14 deletions.
diff --git a/examples/graphiql-webpack/package.json b/examples/graphiql-webpack/package.json
@@ -10,10 +10,10 @@
   },
   "dependencies": {
     "@graphiql/plugin-code-exporter": "^3.1.4",
-    "@graphiql/plugin-explorer": "^3.2.4",
+    "@graphiql/plugin-explorer": "^3.2.5",
     "@graphiql/toolkit": "^0.11.1",
-    "@graphiql/react": "^0.28.0",
-    "graphiql": "^3.8.1",
+    "@graphiql/react": "^0.28.2",
+    "graphiql": "^3.8.3",
     "graphql": "^16.9.0",
     "graphql-ws": "^5.5.5",
     "react": "^18.2.0",

diff --git a/packages/graphiql-plugin-explorer/CHANGELOG.md b/packages/graphiql-plugin-explorer/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @graphiql/plugin-explorer
 
+## 3.2.5
+
+### Patch Changes
+
+- [#3837](https://github.com/graphql/graphiql/pull/3837) [`5e76a4f`](https://github.com/graphql/graphiql/commit/5e76a4f3c8b089a1de0c92c9b9c1edc2ae3f49d4) Thanks [@dimaMachina](https://github.com/dimaMachina)! - fix query builder updated only first selected field in query editor due recent enabled react-compiler
+
 ## 3.2.4
 
 ### Patch Changes

diff --git a/packages/graphiql-plugin-explorer/package.json b/packages/graphiql-plugin-explorer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@graphiql/plugin-explorer",
-  "version": "3.2.4",
+  "version": "3.2.5",
   "repository": {
     "type": "git",
     "url": "https://github.com/graphql/graphiql",
@@ -38,7 +38,7 @@
     "react-dom": "^16.8.0 || ^17 || ^18"
   },
   "devDependencies": {
-    "@graphiql/react": "^0.28.0",
+    "@graphiql/react": "^0.28.1",
     "@vitejs/plugin-react": "^4.3.1",
     "graphql": "^16.9.0",
     "react": "^18.2.0",

diff --git a/packages/graphiql-react/CHANGELOG.md b/packages/graphiql-react/CHANGELOG.md
@@ -1,5 +1,17 @@
 # @graphiql/react
 
+## 0.28.2
+
+### Patch Changes
+
+- [#3843](https://github.com/graphql/graphiql/pull/3843) [`16b5698`](https://github.com/graphql/graphiql/commit/16b56982ce4de62c850380fe25698c3893551c5a) Thanks [@dimaMachina](https://github.com/dimaMachina)! - fix regression in documentation explorer search when clicking on results in dropdown
+
+## 0.28.1
+
+### Patch Changes
+
+- [#3837](https://github.com/graphql/graphiql/pull/3837) [`5e76a4f`](https://github.com/graphql/graphiql/commit/5e76a4f3c8b089a1de0c92c9b9c1edc2ae3f49d4) Thanks [@dimaMachina](https://github.com/dimaMachina)! - fix query builder updated only first selected field in query editor due recent enabled react-compiler
+
 ## 0.28.0
 
 ### Minor Changes

diff --git a/packages/graphiql-react/package.json b/packages/graphiql-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@graphiql/react",
-  "version": "0.28.0",
+  "version": "0.28.2",
   "repository": {
     "type": "git",
     "url": "https://github.com/graphql/graphiql",

diff --git a/packages/graphiql-react/src/editor/hooks.ts b/packages/graphiql-react/src/editor/hooks.ts
@@ -3,7 +3,8 @@ import type { EditorChange, EditorConfiguration } from 'codemirror';
 import type { SchemaReference } from 'codemirror-graphql/utils/SchemaReference';
 import copyToClipboard from 'copy-to-clipboard';
 import { parse, print } from 'graphql';
-import { useEffect, useRef, useState } from 'react';
+// eslint-disable-next-line @typescript-eslint/no-restricted-imports -- TODO: check why query builder update only 1st field https://github.com/graphql/graphiql/issues/3836
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import { useExplorerContext } from '../explorer';
 import { usePluginContext } from '../plugin';
@@ -344,9 +345,8 @@ export function useAutoCompleteLeafs({
 
 // https://react.dev/learn/you-might-not-need-an-effect
 
-export const useEditorState = (
-  editor: 'query' | 'variable' | 'header',
-): [string, (val: string) => void] => {
+export const useEditorState = (editor: 'query' | 'variable' | 'header') => {
+  'use no memo'; // eslint-disable-line react-compiler/react-compiler -- TODO: check why query builder update only 1st field https://github.com/graphql/graphiql/issues/3836
   const context = useEditorContext({
     nonNull: true,
   });
@@ -358,8 +358,14 @@ export const useEditorState = (
     valueString = editorValue;
   }
 
-  const handleEditorValue = (value: string) => editorInstance?.setValue(value);
-  return [valueString, handleEditorValue];
+  const handleEditorValue = useCallback(
+    (value: string) => editorInstance?.setValue(value),
+    [editorInstance],
+  );
+  return useMemo<[string, (val: string) => void]>(
+    () => [valueString, handleEditorValue],
+    [valueString, handleEditorValue],
+  );
 };
 
 /**

diff --git a/packages/graphiql-react/src/explorer/components/search.tsx b/packages/graphiql-react/src/explorer/components/search.tsx
@@ -61,7 +61,7 @@ export function Search() {
     // Fix https://github.com/graphql/graphiql/issues/3842
     setTimeout(() => {
       setIsFocused(e.type === 'focus');
-    }, 0)
+    }, 0);
   };
 
   const shouldSearchBoxAppear =

diff --git a/packages/graphiql/CHANGELOG.md b/packages/graphiql/CHANGELOG.md
@@ -1,5 +1,20 @@
 # Change Log
 
+## 3.8.3
+
+### Patch Changes
+
+- [#3843](https://github.com/graphql/graphiql/pull/3843) [`16b5698`](https://github.com/graphql/graphiql/commit/16b56982ce4de62c850380fe25698c3893551c5a) Thanks [@dimaMachina](https://github.com/dimaMachina)! - fix regression in documentation explorer search when clicking on results in dropdown
+
+- Updated dependencies [[`16b5698`](https://github.com/graphql/graphiql/commit/16b56982ce4de62c850380fe25698c3893551c5a)]:
+  - @graphiql/react@0.28.2
+
+## 3.8.2
+
+### Patch Changes
+
+- [#3840](https://github.com/graphql/graphiql/pull/3840) [`b529a6c`](https://github.com/graphql/graphiql/commit/b529a6c59b760f8bc54df0cd691b0704d94c022b) Thanks [@dimaMachina](https://github.com/dimaMachina)! - update `@graphiql/react` dependency range to `^0.28.1`
+
 ## 3.8.1
 
 ### Patch Changes

diff --git a/packages/graphiql/package.json b/packages/graphiql/package.json
@@ -1,6 +1,6 @@
 {
   "name": "graphiql",
-  "version": "3.8.1",
+  "version": "3.8.3",
   "description": "An graphical interactive in-browser GraphQL IDE.",
   "contributors": [
     "Hyohyeon Jeong <[email protected]>",