Merge branch 'master' into samz/v3-examples

.github/workflows/automerge.yml

@@ -45,7 +45,7 @@ jobs:
         env:
           GITHUB_TOKEN: "${{ secrets.GH_TOKEN }}"
           GITHUB_LOGIN: asyncapi-bot
-          MERGE_LABELS: ""
+          MERGE_LABELS: "!do-not-merge"
           MERGE_METHOD: "squash"
           MERGE_COMMIT_MESSAGE: "{pullRequest.title} (#{pullRequest.number})"
           MERGE_RETRIES: "20"

apps/studio/src/examples/tutorials/invalid.yml

@@ -1,22 +1,26 @@
 # This invalid file exists solely for educational purposes, and if you come across it, here is the tutorial: https://www.asyncapi.com/docs/tutorials/studio-document-validation
 
-asyncapi: '1.0.0'
+asyncapi: 3.0.0
 info:
   title: Streetlights API
   version: '1.0.0'
+  description: |
+    The Smartylighting Streetlights API allows you
+    to remotely manage the city lights.
   license:
     name: Apache 2.0
     url: 'https://www.apache.org/licenses/LICENSE-2.0'
+
 servers:
   mosquitto:
-    url: mqtt://test.mosquitto.org
+    url: test.mosquitto.org
     protocol: mqtt
+
 channels:
-  light/measured:
-    publish:
-      summary: Inform about environmental lighting conditions for a particular streetlight.
-      operationId: onLightMeasured
-      message:
+  lightMeasured:
+    address: 'light/measured'
+    messages:
+      lightMeasuredMessage:
         name: LightMeasured
         payload:
           type: object
@@ -30,6 +34,13 @@ channels:
               minimum: 0
               description: Light intensity measured in lumens.
             sentAt:
-              type: integer
+              type: string
               format: date-time
               description: Date and time when the message was sent.
+
+operations:
+  onLightMeasured:
+    action: 'receive'
+    summary: Inform about environmental lighting conditions for a particular streetlight.
+    channel:
+      $ref: '#/channels/lightMeasured'

apps/studio/src/services/app.service.ts

@@ -11,18 +11,23 @@ export class ApplicationService extends AbstractService {
     // subscribe to state to hide preloader
     this.hidePreloader();
 
-    const { readOnly, url, base64 } = this.svcs.navigationSvc.getUrlParameters();
+    const { readOnly, url, base64 } =
+      this.svcs.navigationSvc.getUrlParameters();
     // readOnly state should be only set to true when someone pass also url or base64 parameter
     const isStrictReadonly = Boolean(readOnly && (url || base64));
 
-    let error: any; 
+    let error: any;
     try {
       await this.fetchResource(url, base64);
     } catch (err) {
       error = err;
       console.error(err);
     }
 
+    if (error) {
+      appState.setState({ initErrors: [error] });
+    }
+
     if (isStrictReadonly && !error) {
       appState.setState({
         readOnly,
@@ -32,7 +37,8 @@ export class ApplicationService extends AbstractService {
   }
 
   public async afterAppInit() {
-    const { readOnly, url, base64, redirectedFrom } = this.svcs.navigationSvc.getUrlParameters();
+    const { readOnly, url, base64, redirectedFrom } =
+      this.svcs.navigationSvc.getUrlParameters();
     const isStrictReadonly = Boolean(readOnly && (url || base64));
 
     // show RedirectedModal modal if the redirectedFrom is set (only when readOnly state is set to false)
@@ -45,11 +51,11 @@ export class ApplicationService extends AbstractService {
     if (!url && !base64) {
       return;
     }
-    
+
     const { updateFile } = filesState.getState();
     let content = '';
     if (url) {
-      content = await fetch(url).then(res => res.text());
+      content = await fetch(url).then((res) => res.text());
     } else if (base64) {
       content = this.svcs.formatSvc.decodeBase64(base64);
     }
@@ -79,4 +85,4 @@ export class ApplicationService extends AbstractService {
       }
     });
   }
-}
+}

apps/studio/src/state/app.state.ts

@@ -4,12 +4,14 @@ export type AppState = {
   initialized: boolean;
   readOnly: boolean;
   liveServer: boolean;
+  initErrors: any[],
 }
 
 export const appState = create<AppState>(() => ({
   initialized: false,
   readOnly: false,
   liveServer: false,
+  initErrors: [],
 }));
 
 export const useAppState = appState;

apps/studio/src/studio.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import { Toaster } from 'react-hot-toast';
+import toast, { Toaster } from 'react-hot-toast';
 
 import { Content, Sidebar, Template, Toolbar } from './components';
 
@@ -8,7 +8,9 @@ import { appState } from './state';
 
 export interface AsyncAPIStudioProps {}
 
-export const AsyncAPIStudio: React.FunctionComponent<AsyncAPIStudioProps> = () => {
+export const AsyncAPIStudio: React.FunctionComponent<
+  AsyncAPIStudioProps
+> = () => {
   const services = useServices();
 
   useEffect(() => {
@@ -24,6 +26,13 @@ export const AsyncAPIStudio: React.FunctionComponent<AsyncAPIStudioProps> = () =
       </div>
     );
   }
+  const unsubscribe = appState.subscribe((state) => {
+    state.initErrors.forEach((e) => {
+      toast.error(e.message);
+    });
+    unsubscribe();
+    appState.setState({ initErrors: [] });
+  });
 
   return (
     <div className="flex flex-col h-full w-full h-screen">