btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

Moved Cocs section to right sidebar (will fix overflow issue later today) + Basic lint

Browse Source
This commit is contained in:
Liyas Thomas
2019-11-19 08:55:57 +05:30
parent 8e3542863a
commit eca1dc8e66
3 changed files with 128 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
components/graphql/field.vue
View File

@@ -36,12 +36,19 @@ export default {
computed: {
fieldString() {
const args = (this.gqlField.args || []).reduce((acc, arg, index) => {
return acc + `${arg.name}: ${arg.type.toString()}${(index !== this.gqlField.args.length - 1) ? ", " : ''}`;
}, '');
const argsString = (args.length > 0) ? `(${args})` : '';
return (
acc +
`${arg.name}: ${arg.type.toString()}${
index !== this.gqlField.args.length - 1 ? ", " : ""
}`
);
}, "");
const argsString = args.length > 0 ? `(${args})` : "";
return `${this.gqlField.name}${argsString}: ${this.gqlField.type.toString()}`;
}
return `${
this.gqlField.name
}${argsString}: ${this.gqlField.type.toString()}`;
}
}
};
</script>

2
components/graphql/type.vue
View File

@@ -43,5 +43,5 @@ export default {
props: {
gqlType: Object
}
}
};
</script>

70
pages/graphql.vue
View File

@@ -1,5 +1,7 @@
<template>
<div class="page">
<div class="content">
<div class="page-columns inner-left">
<pw-section class="blue" label="Endpoint" ref="endpoint">
<ul>
<li>
@@ -30,10 +32,17 @@
}"
/>
</pw-section>
</div>
<aside class="sticky-inner inner-right">
<pw-section class="purple" label="Docs" ref="docs">
<section>
<input v-if="queryFields.length > 0" id="queries-tab" type="radio" name="side" checked="checked" />
<input
v-if="queryFields.length > 0"
id="queries-tab"
type="radio"
name="side"
checked="checked"
/>
<label v-if="queryFields.length > 0" for="queries-tab">Queries</label>
<div v-if="queryFields.length > 0" class="tab">
<div v-for="field in queryFields" :key="field.name">
@@ -41,24 +50,45 @@
</div>
</div>
<input v-if="mutationFields.length > 0" id="mutations-tab" type="radio" name="side" checked="checked" />
<label v-if="mutationFields.length > 0" for="mutations-tab">Mutations</label>
<input
v-if="mutationFields.length > 0"
id="mutations-tab"
type="radio"
name="side"
checked="checked"
/>
<label v-if="mutationFields.length > 0" for="mutations-tab"
>Mutations</label
>
<div v-if="mutationFields.length > 0" class="tab">
<div v-for="field in mutationFields" :key="field.name">
<gql-field :gqlField="field" />
</div>
</div>
<input v-if="subscriptionFields.length > 0" id="subscriptions-tab" type="radio" name="side" checked="checked" />
<label v-if="subscriptionFields.length > 0" for="subscriptions-tab">Subscriptions</label>
<input
v-if="subscriptionFields.length > 0"
id="subscriptions-tab"
type="radio"
name="side"
checked="checked"
/>
<label v-if="subscriptionFields.length > 0" for="subscriptions-tab"
>Subscriptions</label
>
<div v-if="subscriptionFields.length > 0" class="tab">
<div v-for="field in subscriptionFields" :key="field.name">
<gql-field :gqlField="field" />
</div>
</div>
<input v-if="gqlTypes.length > 0" id="gqltypes-tab" type="radio" name="side" checked="checked" />
<input
v-if="gqlTypes.length > 0"
id="gqltypes-tab"
type="radio"
name="side"
checked="checked"
/>
<label v-if="gqlTypes.length > 0" for="gqltypes-tab">Types</label>
<div v-if="gqlTypes.length > 0" class="tab">
<div v-for="type in gqlTypes" :key="type.name">
@@ -67,6 +97,8 @@
</div>
</section>
</pw-section>
</aside>
</div>
</div>
</template>
@@ -144,12 +176,24 @@ export default {
const typeMap = schema.getTypeMap();
const types = [];
const queryTypeName = schema.getQueryType() ? schema.getQueryType().name : '';
const mutationTypeName = schema.getMutationType() ? schema.getMutationType().name : '';
const subscriptionTypeName = schema.getSubscriptionType() ? schema.getSubscriptionType().name : '';
const queryTypeName = schema.getQueryType()
? schema.getQueryType().name
: "";
const mutationTypeName = schema.getMutationType()
? schema.getMutationType().name
: "";
const subscriptionTypeName = schema.getSubscriptionType()
? schema.getSubscriptionType().name
: "";
for (const type in typeMap) {
if (!typeMap[type].name.startsWith("__") && !(([queryTypeName, mutationTypeName, subscriptionTypeName]).includes(typeMap[type].name)) && typeMap[type] instanceof gql.GraphQLObjectType) {
if (
!typeMap[type].name.startsWith("__") &&
![queryTypeName, mutationTypeName, subscriptionTypeName].includes(
typeMap[type].name
) &&
typeMap[type] instanceof gql.GraphQLObjectType
) {
types.push(typeMap[type]);
}
}
@@ -168,7 +212,7 @@ export default {
this.$toast.error(error + " (F12 for details)", {
icon: "error"
});
console.log('Error', error);
console.log("Error", error);
});
}
}