From faa420753f0d16c8d2e45d7457503d0ab6fb7cbc Mon Sep 17 00:00:00 2001
From: Andrew Bastin <andrewbastin.k@gmail.com>
Date: Thu, 9 Jan 2020 13:31:30 -0500
Subject: [PATCH] Added argument and typelink components for GraphQL

---
 components/graphql/argument.vue | 44 +++++++++++++++++++++++++++++++++
 components/graphql/typelink.vue | 33 +++++++++++++++++++++++++
 2 files changed, 77 insertions(+)
 create mode 100644 components/graphql/argument.vue
 create mode 100644 components/graphql/typelink.vue

diff --git a/components/graphql/argument.vue b/components/graphql/argument.vue
new file mode 100644
index 000000000..335381a41
--- /dev/null
+++ b/components/graphql/argument.vue
@@ -0,0 +1,44 @@
+<template>
+  <span>
+    <span class="argumentName">
+      {{ argName }}
+    </span>
+    :
+    <typelink 
+      :type="argType"
+      :jumpTypeCallback="jumpCallback"
+    />
+  </span>
+</template>
+
+<style>
+</style>
+
+<script>
+import typelink from './typelink';
+
+export default {
+  components: {
+    typelink: typelink
+  },
+
+  props: {
+    gqlArg: Object
+  },
+
+  computed: {
+    argName() {
+      return this.gqlArg.name;
+    },
+    argType() {
+      return this.gqlArg.type;
+    }
+  },
+
+  methods: {
+    jumpCallback(typeName) {
+
+    }
+  }
+}
+</script>
diff --git a/components/graphql/typelink.vue b/components/graphql/typelink.vue
new file mode 100644
index 000000000..b451d7f93
--- /dev/null
+++ b/components/graphql/typelink.vue
@@ -0,0 +1,33 @@
+<template>
+  <span class="typelink" @click="jumpToType">{{ typeString }}</span>
+</template>
+
+<style>
+  .typelink {
+    color: red
+  }
+</style>
+
+<script>
+export default {
+  props: {
+    gqlType: null,
+
+    // (typeName: string) => void
+    jumpTypeCallback: Function
+  },
+
+  computed: {
+    typeString() {
+      return this.gqlType.toString();
+    }
+  },
+
+  methods: {
+    jumpToType() {
+      this.jumpTypeCallback(this.gqlType);
+    }
+  }
+}
+</script>
+