From f24fb20e6b371ecb5abed2f6975a3ebb3b932e60 Mon Sep 17 00:00:00 2001 From: Rohit Yadav Date: Mon, 22 Jul 2024 10:46:40 +0530 Subject: [PATCH] ui: add new API docs tab (#9409) * ui: add new API docs tab This introduces a new API docs table which is enabled by default but the admin can disable it via config.json. This uses the discovered APIs for logged in user/account to show them the APIs accessible to them and generates dynamic API docs based on them which are searchable. Also introduces some common auto-completed API groups that are available to most roles. Signed-off-by: Rohit Yadav * Update ui/src/views/plugins/ApiDocsPlugin.vue * Update ui/src/views/plugins/ApiDocsPlugin.vue * Update ui/src/views/plugins/ApiDocsPlugin.vue * Update ui/src/views/plugins/ApiDocsPlugin.vue * Update ui/src/views/plugins/ApiDocsPlugin.vue * fix performance issues Signed-off-by: Rohit Yadav * Update ui/src/views/plugins/ApiDocsPlugin.vue Co-authored-by: Suresh Kumar Anaparti * Update ui/public/locales/en.json Co-authored-by: Suresh Kumar Anaparti * address Suresh's feedback Signed-off-by: Rohit Yadav * filter example/options as we type Signed-off-by: Rohit Yadav * Address Joao's comments Signed-off-by: Rohit Yadav --------- Signed-off-by: Rohit Yadav Co-authored-by: Suresh Kumar Anaparti --- ui/public/config.json | 1 + ui/public/locales/en.json | 4 + ui/src/config/router.js | 11 ++ ui/src/core/lazy_lib/components_use.js | 2 + ui/src/store/modules/user.js | 5 +- ui/src/style/vars.less | 4 + ui/src/views/plugins/ApiDocsPlugin.vue | 222 +++++++++++++++++++++++++ 7 files changed, 248 insertions(+), 1 deletion(-) create mode 100644 ui/src/views/plugins/ApiDocsPlugin.vue diff --git a/ui/public/config.json b/ui/public/config.json index 639ed4f97f1..774e414af0a 100644 --- a/ui/public/config.json +++ b/ui/public/config.json @@ -92,6 +92,7 @@ ] }, "plugins": [], + "apidocs": true, "basicZoneEnabled": true, "multipleServer": false, "allowSettingTheme": true, diff --git a/ui/public/locales/en.json b/ui/public/locales/en.json index cec0b641ebe..253f20294f5 100644 --- a/ui/public/locales/en.json +++ b/ui/public/locales/en.json @@ -348,6 +348,9 @@ "label.annotation.everyone": "Visible to everyone", "label.anti.affinity": "Anti-affinity", "label.anti.affinity.group": "Anti-affinity group", +"label.api.docs": "API Docs", +"label.api.docs.description": "For information about how the APIs work, and tips on how to use them, click here to see the Developer's Guide.", +"label.api.docs.count": "APIs available for your account", "label.api.version": "API version", "label.apikey": "API key", "label.app.cookie": "AppCookie", @@ -1796,6 +1799,7 @@ "label.replace.acl": "Replace ACL", "label.replace.acl.list": "Replace ACL list", "label.report.bug": "Ask a question or Report an issue", +"label.request": "Request", "label.required": "Required", "label.requireshvm": "HVM", "label.requiresupgrade": "Requires upgrade", diff --git a/ui/src/config/router.js b/ui/src/config/router.js index c358d215577..9d9cd0d4491 100644 --- a/ui/src/config/router.js +++ b/ui/src/config/router.js @@ -19,6 +19,7 @@ import { UserLayout, BasicLayout, RouteView } from '@/layouts' import AutogenView from '@/views/AutogenView.vue' import IFramePlugin from '@/views/plugins/IFramePlugin.vue' +import ApiDocsPlugin from '@/views/plugins/ApiDocsPlugin.vue' import { shallowRef } from 'vue' import { vueProps } from '@/vue-app' @@ -275,6 +276,16 @@ export function asyncRouterMap () { }) } + const apidocs = vueProps.$config.apidocs + if (apidocs !== false) { + routerMap[0].children.push({ + path: '/apidocs/', + name: 'apidocs', + component: shallowRef(ApiDocsPlugin), + meta: { title: 'label.api.docs', icon: 'read-outlined' } + }) + } + return routerMap } diff --git a/ui/src/core/lazy_lib/components_use.js b/ui/src/core/lazy_lib/components_use.js index 98fc9e0c816..3ee5d07a49d 100644 --- a/ui/src/core/lazy_lib/components_use.js +++ b/ui/src/core/lazy_lib/components_use.js @@ -61,6 +61,7 @@ import { Tree, Calendar, Slider, + Result, AutoComplete, Collapse, Space, @@ -133,5 +134,6 @@ export default { app.use(Descriptions) app.use(Space) app.use(Statistic) + app.use(Result) } } diff --git a/ui/src/store/modules/user.js b/ui/src/store/modules/user.js index fb5b6ff5e0b..24302a94033 100644 --- a/ui/src/store/modules/user.js +++ b/ui/src/store/modules/user.js @@ -314,7 +314,10 @@ const user = { const apiName = api.name apis[apiName] = { params: api.params, - response: api.response + response: api.response, + isasync: api.isasync, + since: api.since, + description: api.description } } commit('SET_APIS', apis) diff --git a/ui/src/style/vars.less b/ui/src/style/vars.less index fc6fdf75170..de2d494c878 100644 --- a/ui/src/style/vars.less +++ b/ui/src/style/vars.less @@ -471,6 +471,10 @@ a { width: auto; } +.ant-list-item.selected-item { + background-color: @primary-color-light; +} + .ant-select-arrow .anticon { vertical-align: top; } diff --git a/ui/src/views/plugins/ApiDocsPlugin.vue b/ui/src/views/plugins/ApiDocsPlugin.vue new file mode 100644 index 00000000000..ba7f547572b --- /dev/null +++ b/ui/src/views/plugins/ApiDocsPlugin.vue @@ -0,0 +1,222 @@ +// Licensed to the Apache Software Foundation (ASF) under one +// or more contributor license agreements. See the NOTICE file +// distributed with this work for additional information +// regarding copyright ownership. The ASF licenses this file +// to you under the Apache License, Version 2.0 (the +// "License"); you may not use this file except in compliance +// with the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, +// software distributed under the License is distributed on an +// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +// KIND, either express or implied. See the License for the +// specific language governing permissions and limitations +// under the License. + + + +