1
0
mirror of https://github.com/netbox-community/netbox.git synced 2024-05-10 07:54:54 +00:00

Merge pull request #6847 from netbox-community/6834-graphiql-ui

Closes #6834: Customize GraphiQL view
This commit is contained in:
Jeremy Stretch
2021-07-30 15:23:59 -04:00
committed by GitHub
6 changed files with 72 additions and 4 deletions

View File

@@ -12,6 +12,8 @@ class GraphQLView(GraphQLView_):
"""
Extends graphene_django's GraphQLView to support DRF's token-based authentication.
"""
graphiql_template = 'graphiql.html'
def dispatch(self, request, *args, **kwargs):
# Enforce GRAPHQL_ENABLED

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 878 B

View File

@@ -106,7 +106,6 @@
{# Docs & Community Links #}
<div class="col-sm-12 col-md-auto">
<nav class="nav justify-content-center justify-content-lg-start">
{# Documentation #}
<a type="button" class="nav-link" href="{% static 'docs/' %}" target="_blank">
<i title="Docs" class="mdi mdi-book-open-variant text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
@@ -114,7 +113,7 @@
{# REST API #}
<a type="button" class="nav-link" href="{% url 'api-root' %}" target="_blank">
<i title="REST API" class="mdi mdi-code-braces text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
<i title="REST API" class="mdi mdi-cloud-braces text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
</a>
{# API docs #}

View File

@@ -0,0 +1,59 @@
{% comment %}
This template derives from the graphene-django project:
https://github.com/graphql-python/graphene-django/blob/main/graphene_django/templates/graphene/graphiql.html
{% endcomment %}
<!--
The request to this GraphQL server provided the header "Accept: text/html"
and as a result has been presented GraphiQL - an in-browser IDE for
exploring GraphQL.
If you wish to receive JSON, provide the header "Accept: application/json" or
add "&raw" to the end of the URL within a browser.
-->
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<style>
html, body, #editor {
height: 100%;
margin: 0;
overflow: hidden;
width: 100%;
}
</style>
<link href="https://cdn.jsdelivr.net/npm/graphiql@{{graphiql_version}}/graphiql.min.css"
integrity="{{graphiql_css_sri}}"
rel="stylesheet"
crossorigin="anonymous" />
<script src="https://cdn.jsdelivr.net/npm/whatwg-fetch@{{whatwg_fetch_version}}/dist/fetch.umd.js"
integrity="{{whatwg_fetch_sri}}"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/react@{{react_version}}/umd/react.production.min.js"
integrity="{{react_sri}}"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/react-dom@{{react_version}}/umd/react-dom.production.min.js"
integrity="{{react_dom_sri}}"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/graphiql@{{graphiql_version}}/graphiql.min.js"
integrity="{{graphiql_sri}}"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/subscriptions-transport-ws@{{subscriptions_transport_ws_version}}/browser/client.js"
integrity="{{subscriptions_transport_ws_sri}}"
crossorigin="anonymous"></script>
<link rel="icon" type="image/png" href="{% static 'graphql.ico' %}" />
<title>GraphiQL | NetBox</title>
</head>
<body>
<div id="editor"></div>
{% csrf_token %}
<script type="application/javascript">
window.GRAPHENE_SETTINGS = {
{% if subscription_path %}
subscriptionPath: "{{subscription_path}}",
{% endif %}
graphiqlHeaderEditorEnabled: {{ graphiql_header_editor_enabled|yesno:"true,false" }},
};
</script>
<script src="{% static 'graphene_django/graphiql.js' %}"></script>
</body>
</html>

View File

@@ -1,5 +1,13 @@
{% extends 'rest_framework/base.html' %}
{% load static %}
{% block head %}
{{ block.super }}
<link rel="icon" type="image/png" href="{% static 'rest-api.ico' %}" />
{% endblock head %}
{% block title %}{% if name %}{{ name }} | {% endif %}NetBox REST API{% endblock %}
{% block branding %}
<a class="navbar-brand" href="/{{ settings.BASE_PATH }}">NetBox</a>
{% endblock %}
<a class="navbar-brand" href="/{{ settings.BASE_PATH }}">NetBox</a>
{% endblock branding %}