diff --git a/packages/codemirror-lang-graphql/src/index.js b/packages/codemirror-lang-graphql/src/index.js
index f889a9b67..49af63dfc 100644
--- a/packages/codemirror-lang-graphql/src/index.js
+++ b/packages/codemirror-lang-graphql/src/index.js
@@ -1,18 +1,26 @@
 import {parser} from "./syntax.grammar"
-import {LRLanguage, LanguageSupport, indentNodeProp, foldNodeProp, foldInside, delimitedIndent} from "@codemirror/language"
+import {LRLanguage, LanguageSupport, indentNodeProp, foldNodeProp, foldInside,  delimitedIndent} from "@codemirror/language"
 import {styleTags, tags as t} from "@codemirror/highlight"
 
 export const GQLLanguage = LRLanguage.define({
   parser: parser.configure({
     props: [
       indentNodeProp.add({
-        Application: delimitedIndent({closing: ")", align: false})
+        "SelectionSet FieldsDefinition ObjectValue SchemaDefinition RootTypeDef": delimitedIndent({ closing: "}", align: true }),
       }),
       foldNodeProp.add({
-        Application: foldInside
+        Application: foldInside,
+        "SelectionSet FieldsDefinition ObjectValue RootOperationTypeDefinition RootTypeDef": (node) => {
+          return {
+            from: node.from,
+            to: node.to
+          }
+
+        }
       }),
       styleTags({
-        Name: t.propertyName,
+        Name: t.definition(t.variableName),
+        "OperationDefinition/Name": t.definition(t.function(t.variableName)),
         OperationType: t.keyword,
         BooleanValue: t.bool,
         StringValue: t.string,
diff --git a/packages/codemirror-lang-graphql/src/syntax.grammar b/packages/codemirror-lang-graphql/src/syntax.grammar
index 6417271f0..dd3f27346 100644
--- a/packages/codemirror-lang-graphql/src/syntax.grammar
+++ b/packages/codemirror-lang-graphql/src/syntax.grammar
@@ -34,11 +34,15 @@ TypeSystemExtension {
 }
 
 SchemaDefinition {
-  Description? @specialize<Name, "schema"> Directives? "{" RootOperationTypeDefinition+ "}"
+  Description? @specialize<Name, "schema"> Directives? RootTypeDef
+}
+
+RootTypeDef {
+  "{" RootOperationTypeDefinition+ "}"
 }
 
 SchemaExtension {
-  @specialize<Name, "extend"> @specialize<Name, "schema"> Directives? "{" RootOperationTypeDefinition "}"
+  @specialize<Name, "extend"> @specialize<Name, "schema"> Directives? RootTypeDef
 }
 
 TypeExtension {
@@ -172,7 +176,7 @@ VariableDefinition {
 }
 
 SelectionSet {
-  "{" Selection+ "}"
+  "{" Selection* "}"
 }
 
 Selection {
diff --git a/packages/hoppscotch-app/helpers/editor/codemirror.ts b/packages/hoppscotch-app/helpers/editor/codemirror.ts
index 9804f2b69..000d107af 100644
--- a/packages/hoppscotch-app/helpers/editor/codemirror.ts
+++ b/packages/hoppscotch-app/helpers/editor/codemirror.ts
@@ -48,10 +48,19 @@ const hoppCompleterExt = (completer: Completer): Extension => {
         // Expensive operation! Disable on bigger files ?
         const text = context.state.doc.toJSON().join(context.state.lineBreak)
 
-        const line = context.state.doc.lineAt(context.pos).from
-        const ch = context.pos - line
+        const line = context.state.doc.lineAt(context.pos)
+        const lineStart = line.from
+        const lineNo = line.number - 1
+        const ch = context.pos - lineStart
 
-        const result = await completer(text, { line, ch })
+        // Only do trigger on type when typing a word token, else stop (unless explicit)
+        if (!context.matchBefore(/\w+/) && !context.explicit)
+          return {
+            from: context.pos,
+            options: [],
+          }
+
+        const result = await completer(text, { line: lineNo, ch })
 
         // Use more completion features ?
         const completions =