]> git-server-git.apps.pok.os.sepia.ceph.com Git - ceph.git/commitdiff
mgr/dashboard: introduce seperate frontend component for API docs 44400/head
authorAashish Sharma <aashishsharma@localhost.localdomain>
Tue, 25 May 2021 08:40:50 +0000 (14:10 +0530)
committerAashish Sharma <aashishsharma@localhost.localdomain>
Fri, 24 Dec 2021 07:52:20 +0000 (13:22 +0530)
This PR intends to add a separate frontend component for the API docs that are currently being rendered from the python code.

Fixes: https://tracker.ceph.com/issues/50955
Signed-off-by: Aashish Sharma <aasharma@redhat.com>
(cherry picked from commit 2c396be7cc47762290199609b99fba09f3573899)

Conflicts:
src/pybind/mgr/dashboard/frontend/package-lock.json
src/pybind/mgr/dashboard/frontend/package.json (added new swagger packages)

src/pybind/mgr/dashboard/controllers/docs.py
src/pybind/mgr/dashboard/frontend/angular.json
src/pybind/mgr/dashboard/frontend/src/app/app-routing.module.ts
src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.html [new file with mode: 0644]
src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.scss [new file with mode: 0644]
src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.ts [new file with mode: 0644]
src/pybind/mgr/dashboard/frontend/src/app/core/navigation/dashboard-help/dashboard-help.component.html
src/pybind/mgr/dashboard/frontend/src/app/core/navigation/navigation.module.ts
src/pybind/mgr/dashboard/frontend/src/styles/bootstrap-extends.scss
src/pybind/mgr/dashboard/frontend/src/styles/ceph-custom/_basics.scss

index da040f86f89acbc34a977b20764635503a5e64b4..201cc20b34b3c4a526c8d19670be8fb3e58e8b9c 100644 (file)
@@ -393,75 +393,14 @@ class Docs(BaseController):
 
         return spec
 
-    @Endpoint(path="api.json", version=None)
-    def api_json(self):
+    @Endpoint(path="openapi.json", version=None)
+    def open_api_json(self):
         return self._gen_spec(False, "/")
 
     @Endpoint(path="api-all.json", version=None)
     def api_all_json(self):
         return self._gen_spec(True, "/")
 
-    def _swagger_ui_page(self, all_endpoints=False):
-        base = cherrypy.request.base
-        if all_endpoints:
-            spec_url = "{}/docs/api-all.json".format(base)
-        else:
-            spec_url = "{}/docs/api.json".format(base)
-
-        page = """
-        <!DOCTYPE html>
-        <html>
-        <head>
-            <meta charset="UTF-8">
-            <meta name="referrer" content="no-referrer" />
-            <link rel="stylesheet" type="text/css"
-                  href="/swagger-ui.css" >
-            <style>
-                html
-                {{
-                    box-sizing: border-box;
-                    overflow: -moz-scrollbars-vertical;
-                    overflow-y: scroll;
-                }}
-                *,
-                *:before,
-                *:after
-                {{
-                    box-sizing: inherit;
-                }}
-                body {{
-                    margin:0;
-                    background: #fafafa;
-                }}
-            </style>
-        </head>
-        <body>
-        <div id="swagger-ui"></div>
-        <script src="/swagger-ui-bundle.js">
-        </script>
-        <script>
-            window.onload = function() {{
-                const ui = SwaggerUIBundle({{
-                    url: '{}',
-                    dom_id: '#swagger-ui',
-                    presets: [
-                        SwaggerUIBundle.presets.apis
-                    ],
-                    layout: "BaseLayout"
-                }})
-                window.ui = ui
-            }}
-        </script>
-        </body>
-        </html>
-        """.format(spec_url)
-
-        return page
-
-    @Endpoint(json_response=False, version=None)
-    def __call__(self, all_endpoints=False):
-        return self._swagger_ui_page(all_endpoints)
-
 
 if __name__ == "__main__":
     import sys
index 3a3dac350acb197e4b81fe13733f027bd946f2fb..2d3f5240c945f389c776f55f7d4ea7da99d7ca6d 100644 (file)
@@ -56,6 +56,7 @@
               }
             ],
             "styles": [
+              "node_modules/swagger-ui/dist/swagger-ui.css",
               "node_modules/ngx-toastr/toastr.css",
               "src/styles.scss"
             ],
index afd0d0c01dc5fba269ce2058cb63998076d89e02..959cb376997029d950661a888af9c8ca039426fb 100644 (file)
@@ -35,6 +35,7 @@ import { ErrorComponent } from './core/error/error.component';
 import { BlankLayoutComponent } from './core/layouts/blank-layout/blank-layout.component';
 import { LoginLayoutComponent } from './core/layouts/login-layout/login-layout.component';
 import { WorkbenchLayoutComponent } from './core/layouts/workbench-layout/workbench-layout.component';
+import { ApiDocsComponent } from './core/navigation/api-docs/api-docs.component';
 import { ActionLabels, URLVerbs } from './shared/constants/app.constants';
 import { BreadcrumbsResolver, IBreadcrumb } from './shared/models/breadcrumbs';
 import { AuthGuardService } from './shared/services/auth-guard.service';
@@ -78,6 +79,7 @@ export class StartCaseBreadcrumbsResolver extends BreadcrumbsResolver {
 const routes: Routes = [
   // Dashboard
   { path: '', redirectTo: 'dashboard', pathMatch: 'full' },
+  { path: 'api-docs', component: ApiDocsComponent },
   {
     path: '',
     component: WorkbenchLayoutComponent,
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.html b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.html
new file mode 100644 (file)
index 0000000..2dd0ff4
--- /dev/null
@@ -0,0 +1,3 @@
+
+<div id="swagger-ui"
+     class="apiDocs"></div>
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.scss
new file mode 100644 (file)
index 0000000..8892864
--- /dev/null
@@ -0,0 +1,7 @@
+@use './src/styles/vendor/variables' as vv;
+
+.apiDocs {
+  background: vv.$gray-100;
+  font-size: 18px !important;
+  margin-top: -48px !important;
+}
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/navigation/api-docs/api-docs.component.ts
new file mode 100644 (file)
index 0000000..7d9ea86
--- /dev/null
@@ -0,0 +1,18 @@
+import { Component, OnInit } from '@angular/core';
+
+import SwaggerUI from 'swagger-ui';
+
+@Component({
+  selector: 'cd-api-docs',
+  templateUrl: './api-docs.component.html',
+  styleUrls: ['./api-docs.component.scss']
+})
+export class ApiDocsComponent implements OnInit {
+  ngOnInit(): void {
+    SwaggerUI({
+      url: window.location.origin + '/docs/openapi.json',
+      dom_id: '#swagger-ui',
+      layout: 'BaseLayout'
+    });
+  }
+}
index 766645fa7e72880ade27dd6261899c0649a04d28..274ec71df78b13619396d66bed0e186429008f4c 100644 (file)
@@ -15,7 +15,7 @@
        target="_blank"
        i18n>documentation</a>
     <a ngbDropdownItem
-       href="/docs"
+       routerLink="/api-docs"
        target="_blank"
        i18n>API</a>
     <button ngbDropdownItem
index f189ad41b857d42a91ad1de27af42dedbc6ff104..c8d2a9d9caba638c4ea13236efa326d53693c795 100644 (file)
@@ -10,6 +10,7 @@ import { SharedModule } from '~/app/shared/shared.module';
 import { AuthModule } from '../auth/auth.module';
 import { AboutComponent } from './about/about.component';
 import { AdministrationComponent } from './administration/administration.component';
+import { ApiDocsComponent } from './api-docs/api-docs.component';
 import { BreadcrumbsComponent } from './breadcrumbs/breadcrumbs.component';
 import { DashboardHelpComponent } from './dashboard-help/dashboard-help.component';
 import { IdentityComponent } from './identity/identity.component';
@@ -29,6 +30,7 @@ import { NotificationsComponent } from './notifications/notifications.component'
   ],
   declarations: [
     AboutComponent,
+    ApiDocsComponent,
     BreadcrumbsComponent,
     NavigationComponent,
     NotificationsComponent,
index 9a90a2dbfee7d3b5a7c8b3b15dec0c0443f1c6cb..be304c9e4e30779cdb58ac51f3c624488e255612 100644 (file)
@@ -122,7 +122,7 @@ legend {
   @extend .fa-fw;
 }
 
-pre {
+pre:not(cd-api-docs *) {
   @extend .card;
   @extend .bg-light;
   @extend .p-2;
index 04f365e6daacd253073bda62c1a687573e6eb4b6..aa48b6752a69c4058397176cbcd3b36ed52d7f83 100644 (file)
@@ -35,7 +35,7 @@ option {
   justify-content: center;
 }
 
-.loading {
+.loading:not(cd-api-docs *) {
   left: 50%;
   position: absolute;
   top: 50%;