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:
@@ -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
|
||||
|
BIN
netbox/project-static/img/graphql.ico
Normal file
BIN
netbox/project-static/img/graphql.ico
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.2 KiB |
BIN
netbox/project-static/img/rest-api.ico
Normal file
BIN
netbox/project-static/img/rest-api.ico
Normal file
Binary file not shown.
After Width: | Height: | Size: 878 B |
@@ -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 #}
|
||||
|
59
netbox/templates/graphiql.html
Normal file
59
netbox/templates/graphiql.html
Normal 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>
|
@@ -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 %}
|
||||
|
Reference in New Issue
Block a user