add caller argument to editor hooks (#2538)

graphql · Aug 15, 2022 · a8eeecd · a8eeecd
1 parent 699fb8e
commit a8eeecd
Show file tree

Hide file tree

Showing 8 changed files with 54 additions and 42 deletions.
diff --git a/packages/graphiql-react/src/editor/components/header-editor.tsx b/packages/graphiql-react/src/editor/components/header-editor.tsx
@@ -14,7 +14,7 @@ export function HeaderEditor({ isHidden, ...hookArgs }: HeaderEditorProps) {
     nonNull: true,
     caller: HeaderEditor,
   });
-  const ref = useHeaderEditor(hookArgs);
+  const ref = useHeaderEditor(hookArgs, HeaderEditor);
 
   useEffect(() => {
     if (headerEditor && !isHidden) {

diff --git a/packages/graphiql-react/src/editor/components/query-editor.tsx b/packages/graphiql-react/src/editor/components/query-editor.tsx
@@ -10,6 +10,6 @@ import '../style/auto-insertion.css';
 import '../style/editor.css';
 
 export function QueryEditor(props: UseQueryEditorArgs) {
-  const ref = useQueryEditor(props);
+  const ref = useQueryEditor(props, QueryEditor);
   return <div className="graphiql-editor" ref={ref} />;
 }
diff --git a/packages/graphiql-react/src/editor/components/response-editor.tsx b/packages/graphiql-react/src/editor/components/response-editor.tsx
@@ -6,7 +6,7 @@ import '../style/info.css';
 import '../style/editor.css';
 
 export function ResponseEditor(props: UseResponseEditorArgs) {
-  const ref = useResponseEditor(props);
+  const ref = useResponseEditor(props, ResponseEditor);
   return (
     <section
       className="result-window"

diff --git a/packages/graphiql-react/src/editor/components/variable-editor.tsx b/packages/graphiql-react/src/editor/components/variable-editor.tsx
@@ -18,7 +18,7 @@ export function VariableEditor({ isHidden, ...hookArgs }: VariableEditorProps) {
     nonNull: true,
     caller: VariableEditor,
   });
-  const ref = useVariableEditor(hookArgs);
+  const ref = useVariableEditor(hookArgs, VariableEditor);
 
   useEffect(() => {
     if (variableEditor && !isHidden) {

diff --git a/packages/graphiql-react/src/editor/header-editor.tsx b/packages/graphiql-react/src/editor/header-editor.tsx
@@ -26,24 +26,27 @@ export type UseHeaderEditorArgs = {
   keyMap?: KeyMap;
 };
 
-export function useHeaderEditor({
-  editorTheme = DEFAULT_EDITOR_THEME,
-  keyMap = DEFAULT_KEY_MAP,
-  onEdit,
-  readOnly = false,
-}: UseHeaderEditorArgs = {}) {
+export function useHeaderEditor(
+  {
+    editorTheme = DEFAULT_EDITOR_THEME,
+    keyMap = DEFAULT_KEY_MAP,
+    onEdit,
+    readOnly = false,
+  }: UseHeaderEditorArgs = {},
+  caller?: Function,
+) {
   const {
     initialHeaders,
     headerEditor,
     setHeaderEditor,
     shouldPersistHeaders,
   } = useEditorContext({
     nonNull: true,
-    caller: useHeaderEditor,
+    caller: caller || useHeaderEditor,
   });
   const executionContext = useExecutionContext();
-  const merge = useMergeQuery({ caller: useHeaderEditor });
-  const prettify = usePrettifyEditors({ caller: useHeaderEditor });
+  const merge = useMergeQuery({ caller: caller || useHeaderEditor });
+  const prettify = usePrettifyEditors({ caller: caller || useHeaderEditor });
   const ref = useRef<HTMLDivElement>(null);
 
   useEffect(() => {

diff --git a/packages/graphiql-react/src/editor/query-editor.tsx b/packages/graphiql-react/src/editor/query-editor.tsx
@@ -54,17 +54,20 @@ export type UseQueryEditorArgs = {
   keyMap?: KeyMap;
 };
 
-export function useQueryEditor({
-  editorTheme = DEFAULT_EDITOR_THEME,
-  keyMap = DEFAULT_KEY_MAP,
-  onClickReference,
-  onCopyQuery,
-  onEdit,
-  readOnly = false,
-}: UseQueryEditorArgs = {}) {
+export function useQueryEditor(
+  {
+    editorTheme = DEFAULT_EDITOR_THEME,
+    keyMap = DEFAULT_KEY_MAP,
+    onClickReference,
+    onCopyQuery,
+    onEdit,
+    readOnly = false,
+  }: UseQueryEditorArgs = {},
+  caller?: Function,
+) {
   const { schema } = useSchemaContext({
     nonNull: true,
-    caller: useQueryEditor,
+    caller: caller || useQueryEditor,
   });
   const {
     externalFragments,
@@ -77,14 +80,14 @@ export function useQueryEditor({
     updateActiveTabValues,
   } = useEditorContext({
     nonNull: true,
-    caller: useQueryEditor,
+    caller: caller || useQueryEditor,
   });
   const executionContext = useExecutionContext();
   const storage = useStorageContext();
   const explorer = useExplorerContext();
-  const copy = useCopyQuery({ caller: useQueryEditor, onCopyQuery });
-  const merge = useMergeQuery({ caller: useQueryEditor });
-  const prettify = usePrettifyEditors({ caller: useQueryEditor });
+  const copy = useCopyQuery({ caller: caller || useQueryEditor, onCopyQuery });
+  const merge = useMergeQuery({ caller: caller || useQueryEditor });
+  const prettify = usePrettifyEditors({ caller: caller || useQueryEditor });
   const ref = useRef<HTMLDivElement>(null);
   const codeMirrorRef = useRef<CodeMirrorType>();
 

diff --git a/packages/graphiql-react/src/editor/response-editor.tsx b/packages/graphiql-react/src/editor/response-editor.tsx
@@ -23,19 +23,22 @@ export type UseResponseEditorArgs = {
   keyMap?: KeyMap;
 };
 
-export function useResponseEditor({
-  ResponseTooltip,
-  editorTheme = DEFAULT_EDITOR_THEME,
-  keyMap = DEFAULT_KEY_MAP,
-}: UseResponseEditorArgs = {}) {
+export function useResponseEditor(
+  {
+    ResponseTooltip,
+    editorTheme = DEFAULT_EDITOR_THEME,
+    keyMap = DEFAULT_KEY_MAP,
+  }: UseResponseEditorArgs = {},
+  caller?: Function,
+) {
   const { fetchError, validationErrors } = useSchemaContext({
     nonNull: true,
-    caller: useResponseEditor,
+    caller: caller || useResponseEditor,
   });
   const { initialResponse, responseEditor, setResponseEditor } =
     useEditorContext({
       nonNull: true,
-      caller: useResponseEditor,
+      caller: caller || useResponseEditor,
     });
   const ref = useRef<HTMLDivElement>(null);
 

diff --git a/packages/graphiql-react/src/editor/variable-editor.tsx b/packages/graphiql-react/src/editor/variable-editor.tsx
@@ -26,20 +26,23 @@ export type UseVariableEditorArgs = {
   keyMap?: KeyMap;
 };
 
-export function useVariableEditor({
-  editorTheme = DEFAULT_EDITOR_THEME,
-  keyMap = DEFAULT_KEY_MAP,
-  onEdit,
-  readOnly = false,
-}: UseVariableEditorArgs = {}) {
+export function useVariableEditor(
+  {
+    editorTheme = DEFAULT_EDITOR_THEME,
+    keyMap = DEFAULT_KEY_MAP,
+    onEdit,
+    readOnly = false,
+  }: UseVariableEditorArgs = {},
+  caller?: Function,
+) {
   const { initialVariables, variableEditor, setVariableEditor } =
     useEditorContext({
       nonNull: true,
-      caller: useVariableEditor,
+      caller: caller || useVariableEditor,
     });
   const executionContext = useExecutionContext();
-  const merge = useMergeQuery({ caller: useVariableEditor });
-  const prettify = usePrettifyEditors({ caller: useVariableEditor });
+  const merge = useMergeQuery({ caller: caller || useVariableEditor });
+  const prettify = usePrettifyEditors({ caller: caller || useVariableEditor });
   const ref = useRef<HTMLDivElement>(null);
   const codeMirrorRef = useRef<CodeMirrorType>();