From 2eb580e8c24c088e8287af57bbf220d21a7c1694 Mon Sep 17 00:00:00 2001
From: TuvalSimha <tuval.simha@gmail.com>
Date: Tue, 22 Aug 2023 16:25:06 +0300
Subject: [PATCH 1/2] GraphiQL: `disableTabs` prop

---
 packages/graphiql/src/components/GraphiQL.tsx | 74 ++++++++++---------
 1 file changed, 39 insertions(+), 35 deletions(-)

diff --git a/packages/graphiql/src/components/GraphiQL.tsx b/packages/graphiql/src/components/GraphiQL.tsx
index 286c4a67962..fb2a44522ff 100644
--- a/packages/graphiql/src/components/GraphiQL.tsx
+++ b/packages/graphiql/src/components/GraphiQL.tsx
@@ -167,6 +167,7 @@ export function GraphiQL({
     >
       <GraphiQLInterface
         showPersistHeadersSettings={shouldPersistHeaders !== false}
+        disableTabs={props.disableTabs ?? false}
         {...props}
       />
     </GraphiQLProvider>
@@ -214,6 +215,7 @@ export type GraphiQLInterfaceProps = WriteableEditorProps &
      * settings modal.
      */
     showPersistHeadersSettings?: boolean;
+    disableTabs?: boolean;
   };
 
 export function GraphiQLInterface(props: GraphiQLInterfaceProps) {
@@ -518,43 +520,45 @@ export function GraphiQLInterface(props: GraphiQLInterfaceProps) {
           )}
           <div ref={pluginResize.secondRef} className="graphiql-sessions">
             <div className="graphiql-session-header">
-              <Tabs
-                values={editorContext.tabs}
-                onReorder={handleReorder}
-                aria-label="Select active operation"
-              >
-                {editorContext.tabs.length > 1 && (
-                  <>
-                    {editorContext.tabs.map((tab, index) => (
-                      <Tab
-                        key={tab.id}
-                        value={tab}
-                        isActive={index === editorContext.activeTabIndex}
-                      >
-                        <Tab.Button
-                          aria-controls="graphiql-session"
-                          id={`graphiql-session-tab-${index}`}
-                          onClick={() => {
-                            executionContext.stop();
-                            editorContext.changeTab(index);
-                          }}
+              {props.disableTabs ? null : (
+                <Tabs
+                  values={editorContext.tabs}
+                  onReorder={handleReorder}
+                  aria-label="Select active operation"
+                >
+                  {editorContext.tabs.length > 1 && (
+                    <>
+                      {editorContext.tabs.map((tab, index) => (
+                        <Tab
+                          key={tab.id}
+                          value={tab}
+                          isActive={index === editorContext.activeTabIndex}
                         >
-                          {tab.title}
-                        </Tab.Button>
-                        <Tab.Close
-                          onClick={() => {
-                            if (editorContext.activeTabIndex === index) {
+                          <Tab.Button
+                            aria-controls="graphiql-session"
+                            id={`graphiql-session-tab-${index}`}
+                            onClick={() => {
                               executionContext.stop();
-                            }
-                            editorContext.closeTab(index);
-                          }}
-                        />
-                      </Tab>
-                    ))}
-                    {addTab}
-                  </>
-                )}
-              </Tabs>
+                              editorContext.changeTab(index);
+                            }}
+                          >
+                            {tab.title}
+                          </Tab.Button>
+                          <Tab.Close
+                            onClick={() => {
+                              if (editorContext.activeTabIndex === index) {
+                                executionContext.stop();
+                              }
+                              editorContext.closeTab(index);
+                            }}
+                          />
+                        </Tab>
+                      ))}
+                      {addTab}
+                    </>
+                  )}
+                </Tabs>
+              )}
               <div className="graphiql-session-header-right">
                 {editorContext.tabs.length === 1 && addTab}
                 {logo}

From 4348fd77ac5a884641f79831b31d6aa8ad837df5 Mon Sep 17 00:00:00 2001
From: TuvalSimha <tuval.simha@gmail.com>
Date: Tue, 22 Aug 2023 16:29:22 +0300
Subject: [PATCH 2/2] changeset

---
 .changeset/curvy-balloons-allow.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/curvy-balloons-allow.md

diff --git a/.changeset/curvy-balloons-allow.md b/.changeset/curvy-balloons-allow.md
new file mode 100644
index 00000000000..3a095e0a948
--- /dev/null
+++ b/.changeset/curvy-balloons-allow.md
@@ -0,0 +1,5 @@
+---
+'graphiql': minor
+---
+
+Allow disabling tabs and added new prop `disableTabs`