[MIG] base_rest: migrate swagger ui to owl

base_rest/static/src/js/components/swagger_ui.js

@@ -0,0 +1,68 @@
+/* global SwaggerUIBundle, SwaggerUIStandalonePreset, document, window */
+
+const {Component, mount, onMounted, whenReady, xml} = owl;
+
+class SwaggerUI extends Component {
+    static template = xml`
+        <t t-name="base_rest.swagger_ui">
+          <div id="swagger-ui"/>
+        </t>`;
+    static props = {
+        settings: {type: Object},
+    };
+
+    setup() {
+        onMounted(() => {
+            const settings = this._swagger_bundle_settings();
+            SwaggerUIBundle(settings);
+        });
+    }
+
+    _swagger_bundle_settings() {
+        const defaults = {
+            dom_id: "#swagger-ui",
+            deepLinking: true,
+            presets: [SwaggerUIBundle.presets.apis, SwaggerUIStandalonePreset],
+            plugins: [SwaggerUIBundle.plugins.DownloadUrl],
+            layout: "StandaloneLayout",
+            operationsSorter: (a, b) => {
+                const methodsOrder = [
+                    "get",
+                    "post",
+                    "put",
+                    "delete",
+                    "patch",
+                    "options",
+                    "trace",
+                ];
+                const order =
+                    methodsOrder.indexOf(a.get("method")) -
+                    methodsOrder.indexOf(b.get("method"));
+                return order === 0 ? a.get("path").localeCompare(b.get("path")) : order;
+            },
+            tagsSorter: "alpha",
+            onComplete: () => {
+                const hasOdoobtn = document.querySelector(".swg-odoo-web-btn");
+                if (!hasOdoobtn) {
+                    const odooBtn = document.createElement("a");
+                    odooBtn.className = "fa fa-th-large swg-odoo-web-btn";
+                    odooBtn.href = "/web";
+                    odooBtn.accessKey = "h";
+                    document.querySelector(".topbar")?.prepend(odooBtn);
+                }
+            },
+            oauth2RedirectUrl: `${window.location.origin}/base_rest/static/lib/swagger-ui-3.51.1/oauth2-redirect.html`,
+        };
+        return Object.assign({}, defaults, this.props.settings);
+    }
+}
+
+(function () {
+    "use strict";
+
+    whenReady(() => {
+        const swaggerUiEl = document.getElementById("swagger-ui");
+        const settings = JSON.parse(swaggerUiEl.getAttribute("data-settings") || "{}");
+        mount(SwaggerUI, swaggerUiEl, {props: {settings: settings}});
+    });
+})();

base_rest/views/openapi_template.xml

@@ -7,6 +7,16 @@
             <t t-set="head">
                 <meta name="generator" content="Odoo OpenAPI" />
                 <meta name="description" content="Odoo OpenAPI UI" />
+                <script src="/web/static/lib/owl/owl.js" />
+                <link
+                    href="/web/static/lib/bootstrap/dist/css/bootstrap.css"
+                    rel="stylesheet"
+                />
+                <link
+                    href="/web/static/src/libs/fontawesome/css/font-awesome.css"
+                    rel="stylesheet"
+                />
+
                 <link
                     rel="stylesheet"
                     href="/base_rest/static/lib/swagger-ui-3.51.1/swagger-ui.css"
@@ -22,14 +32,15 @@
                 <script type="text/javascript">
                     odoo.session_info = {
                     is_superuser:<t
-                        t-esc="json.dumps(request.env.user._is_superuser())"
-                    />,
+                    t-esc="json.dumps(request.env.user._is_superuser())"
+                />,
                     is_frontend: true,
                     };
                 </script>
 
                 <t t-call-assets="web.assets_common" t-js="false" />
-                <t t-call-assets="base_rest.assets_swagger" t-js="false" />
+                <t t-call-assets="web.assets_frontend" t-js="false" />
+
                 <link
                     href="https://fonts.googleapis.com/css?family=Open+Sans:400,700|Source+Code+Pro:300,600|Titillium+Web:400,600,700"
                     rel="stylesheet"
@@ -47,9 +58,10 @@
                     sizes="16x16"
                 />
 
-                <t t-call-assets="web.assets_common" t-css="false" />
-                <t t-call-assets="web.assets_frontend" t-css="false" />
-                <t t-call-assets="base_rest.assets_swagger" t-css="false" />
+                <script
+                    type="text/javascript"
+                    src="/base_rest/static/src/js/components/swagger_ui.js"
+                />
             </t>
             <t t-set="head" t-value="head" />
         </t>