feat: switch new OpenAPI docs to /api/v2 (#1411)

Author: B4nan

apify-api/scripts/script-requirements.txt

@@ -1698,6 +1698,7 @@ iframe[src*="youtube"] {
     justify-content: start;
 }
 
+.openapi-endpoint.api-method::before,
 .api-method > .menu__link::before,
 .schema > .menu__link::before {
     width: 55px;
@@ -1726,73 +1727,88 @@ iframe[src*="youtube"] {
 }
 
 .get > .menu__link::before,
+.openapi-endpoint.api-method.get::before,
 .theme-api-markdown .openapi__method-endpoint .badge--primary {
     background-color: var(--ifm-color-info-contrast-background);
     color: var(--ifm-color-info-contrast-foreground);
     border-color: var(--ifm-color-info-dark);
 }
 
+.openapi-endpoint.api-method.get::before,
 .get > .menu__link::before {
     content: 'get';
 }
 
+.openapi-endpoint.api-method.post::before,
 .post > .menu__link::before {
     content: 'post';
 }
 
 .post > .menu__link::before,
+.openapi-endpoint.api-method.post::before,
 .theme-api-markdown .openapi__method-endpoint .badge--success {
     background-color: var(--ifm-color-success-contrast-background);
     color: var(--ifm-color-success-contrast-foreground);
     border-color: var(--ifm-color-success-dark);
 }
 
+.openapi-endpoint.api-method.delete::before,
 .delete > .menu__link::before {
     content: 'del';
 }
 
 .delete > .menu__link::before,
+.openapi-endpoint.api-method.delete::before,
 .theme-api-markdown .openapi__method-endpoint .badge--danger {
     background-color: var(--ifm-color-danger-contrast-background);
     color: var(--ifm-color-danger-contrast-foreground);
     border-color: var(--ifm-color-danger-dark);
 }
 
+.openapi-endpoint.api-method.put::before,
 .put > .menu__link::before {
     content: 'put';
 }
 
 .put > .menu__link::before,
+.openapi-endpoint.api-method.put::before,
 .theme-api-markdown .openapi__method-endpoint .badge--info {
     background-color: var(--ifm-color-warning-contrast-background);
     color: var(--ifm-color-warning-contrast-foreground);
     border-color: var(--ifm-color-warning-dark);
 }
 
+.openapi-endpoint.api-method.patch::before,
 .patch > .menu__link::before {
     content: 'patch';
 }
 
 .patch > .menu__link::before,
+.openapi-endpoint.api-method.patch::before,
 .theme-api-markdown .openapi__method-endpoint .badge--warning {
     background-color: var(--ifm-color-success-contrast-background);
     color: var(--ifm-color-success-contrast-foreground);
     border-color: var(--ifm-color-success-dark);
 }
 
+.openapi-endpoint.api-method.head::before,
 .head > .menu__link::before {
     content: 'head';
 }
 
 .head > .menu__link::before,
+.openapi-endpoint.api-method.head::before,
 .event > .menu__link::before,
+.openapi-endpoint.api-method.event::before,
 .schema > .menu__link::before,
+.openapi-endpoint.api-method.schema::before,
 .theme-api-markdown .openapi__method-endpoint .badge--secondary {
     background-color: var(--ifm-color-secondary-contrast-background);
     color: var(--ifm-color-secondary-contrast-foreground);
     border-color: var(--ifm-color-secondary-dark);
 }
 
+.openapi-endpoint.api-method.event::before,
 .event > .menu__link::before {
     content: 'event';
 }

apify-docs-theme/src/theme/custom.css

@@ -78,8 +78,7 @@ function scrollOpenApiSidebarItemIntoView() {
 function redirectOpenApiDocs() {
     const { hash, pathname, origin } = new URL(window.location.href);
 
-    // TODO change to '/api/v2'
-    if (pathname.replace(/\/$/, '') !== '/api/v2-new') {
+    if (!pathname.startsWith('/api/v2') || pathname.startsWith('/api/v2-')) {
         return;
     }
 
@@ -129,5 +128,6 @@ window.addEventListener('load', () => {
 });
 
 window.addEventListener('popstate', () => {
+    setTimeout(() => redirectOpenApiDocs(), 50);
     setTimeout(() => scrollOpenApiSidebarItemIntoView(), 50);
 });

apify-docs-theme/static/js/custom.js

@@ -132,7 +132,7 @@ module.exports = {
                 specs: [
                     {
                         spec: './apify-api/openapi/openapi.yaml',
-                        route: '/api/v2/',
+                        route: '/api/v2-redoc/',
                     },
                 ],
                 theme: {
@@ -177,7 +177,7 @@ module.exports = {
             {
                 id: 'openapi',
                 path: './sources/api',
-                routeBasePath: 'api/v2-new', // TODO change to `api/v2` once we are ready
+                routeBasePath: 'api/v2',
                 rehypePlugins: [externalLinkProcessor],
                 showLastUpdateAuthor: false,
                 showLastUpdateTime: false,

docusaurus.config.js

@@ -35,7 +35,7 @@ function CardContainer({ href, children }) {
     );
 }
 
-function CardLayout({ href, icon, title, description }) {
+function CardLayout({ href, icon, title, description, className }) {
     if (href.startsWith('/api')) {
         description = '';
     }
@@ -45,7 +45,7 @@ function CardLayout({ href, icon, title, description }) {
             href={href}>
             <Heading
                 as="h2"
-                className={clsx('text--truncate', styles.cardTitle)}
+                className={clsx('text--truncate', styles.cardTitle, className)}
                 title={title}>
                 {icon} {title}
             </Heading>
@@ -78,8 +78,20 @@ function CardCategory({ item }) {
 }
 
 function CardLink({ item }) {
-    const icon = isInternalUrl(item.href) ? '📄️' : '🔗';
     const doc = useDocById(item.docId ?? undefined);
+
+    if (item.href.startsWith('/api/v2')) {
+        return (
+            <CardLayout
+                href={item.href}
+                title={item.label}
+                className={clsx('openapi-endpoint', item.className)}
+                description={item.description ?? doc?.description}
+            />
+        );
+    }
+
+    const icon = isInternalUrl(item.href) ? '📄️' : '🔗';
     return (
         <CardLayout
             href={item.href}

src/theme/DocCard/index.js

@@ -137,7 +137,7 @@ export default function DocSidebarItemCategory({ item, onItemClick, activePath,
         }
     }
 
-    console.log(item);
+    // console.log('sidebar category', item);
 
     return (
         <li

src/theme/DocSidebarItem/Category/index.js

@@ -1,4 +1,4 @@
 User-agent: *
 Sitemap: https://docs.apify.com/sitemap.xml
 Disallow: https://docs.apify.com/api/v2-old
-Disallow: https://docs.apify.com/api/v2-new
+Disallow: https://docs.apify.com/api/v2-redoc