diff --git a/apps/studio/src/components/Editor/EditorSidebar.tsx b/apps/studio/src/components/Editor/EditorSidebar.tsx index b854db5c2..c8e304796 100644 --- a/apps/studio/src/components/Editor/EditorSidebar.tsx +++ b/apps/studio/src/components/Editor/EditorSidebar.tsx @@ -3,11 +3,14 @@ import React from 'react'; import { EditorDropdown } from './EditorDropdown'; import { useFilesState } from '../../state'; +import { ShareButton } from './ShareButton'; interface EditorSidebarProps {} -export const EditorSidebar: React.FunctionComponent = () => { - const { source, from } = useFilesState(state => state.files['asyncapi']); +export const EditorSidebar: React.FunctionComponent< + EditorSidebarProps +> = () => { + const { source, from } = useFilesState((state) => state.files['asyncapi']); let documentFromText = ''; if (from === 'storage') { @@ -23,7 +26,10 @@ export const EditorSidebar: React.FunctionComponent = () => className="flex flex-row items justify-between bg-gray-800 border-b border-gray-700 text-sm" style={{ height: '30px', lineHeight: '30px' }} > -
+
{documentFromText}
= () => >
    +
  • + +
  • diff --git a/apps/studio/src/components/Editor/ShareButton.tsx b/apps/studio/src/components/Editor/ShareButton.tsx new file mode 100644 index 000000000..96f4b9481 --- /dev/null +++ b/apps/studio/src/components/Editor/ShareButton.tsx @@ -0,0 +1,36 @@ +import React from 'react'; +import { FaShareAlt } from 'react-icons/fa'; +import { useServices } from '../../services'; +import { toast } from 'react-hot-toast'; +import { Tooltip } from '../common'; + +interface ShareButtonProps {} + +export const ShareButton: React.FunctionComponent = () => { + const { editorSvc } = useServices(); + + const handleShare = () => { + toast.promise( + (async function () { + const base64 = await editorSvc.exportAsBase64(); + const url = `${window.location.origin}/?base64=${encodeURIComponent( + base64 + )}`; + await navigator.clipboard.writeText(url); + }()), + { + loading: 'Copying URL to clipboard...', + success: 'URL copied to clipboard!', + error: 'Failed to copy URL to clipboard.', + } + ); + }; + + return ( + + + + ); +}; diff --git a/apps/studio/src/services/editor.service.tsx b/apps/studio/src/services/editor.service.tsx index 7b98a809a..630ef33bf 100644 --- a/apps/studio/src/services/editor.service.tsx +++ b/apps/studio/src/services/editor.service.tsx @@ -166,6 +166,16 @@ export class EditorService extends AbstractService { } } + async exportAsBase64() { + try { + const file = filesState.getState().files['asyncapi']; + return this.svcs.formatSvc.encodeBase64(file.content); + } catch (err) { + console.error(err); + throw err; + } + } + async convertToYaml() { try { const yamlContent = this.svcs.formatSvc.convertToYaml(this.value); diff --git a/apps/studio/src/services/parser.service.ts b/apps/studio/src/services/parser.service.ts index a1138238c..1ce683004 100644 --- a/apps/studio/src/services/parser.service.ts +++ b/apps/studio/src/services/parser.service.ts @@ -10,6 +10,7 @@ import { filesState, documentsState, settingsState } from '../state'; import type { Diagnostic, ParseOptions } from '@asyncapi/parser/cjs'; import type { DocumentDiagnostics } from '../state/documents.state'; +import { SchemaParser } from '@asyncapi/parser'; export class ParserService extends AbstractService { private parser!: Parser; @@ -17,8 +18,9 @@ export class ParserService extends AbstractService { override async onInit() { this.parser = new Parser({ schemaParsers: [ - OpenAPISchemaParser() as any, - AvroSchemaParser() as any, + // Temporary fix for TS error + OpenAPISchemaParser() as SchemaParser, + AvroSchemaParser() as SchemaParser, ], __unstable: { resolver: {