Skip to content

Commit

Permalink
feat(editor-preview-asyncapi): allow passing additional config (#5007)
Browse files Browse the repository at this point in the history
Refs #5006
  • Loading branch information
char0n authored May 6, 2024
1 parent 070b860 commit e2c96df
Show file tree
Hide file tree
Showing 3 changed files with 14 additions and 7 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import React from 'react';

const AsyncAPIReactComponent = React.lazy(
() => import('@asyncapi/react-component/lib/esm/without-parser.js')
);

export default AsyncAPIReactComponent;
Original file line number Diff line number Diff line change
@@ -1,10 +1,6 @@
import React, { Suspense, useEffect } from 'react';
import React, { Suspense, useMemo, useEffect } from 'react';
import PropTypes from 'prop-types';

const AsyncApiReactComponent = React.lazy(
() => import('@asyncapi/react-component/lib/esm/without-parser.js')
);

const Loading = () => <div>Loading...</div>;
const Parsing = () => <div>Parsing...</div>;

Expand All @@ -14,12 +10,14 @@ const EditorPreviewAsyncAPI = ({
editorPreviewAsyncAPISelectors,
}) => {
const ParseErrors = getComponent('EditorPreviewAsyncAPIParseErrors');
const AsyncAPIReactComponent = getComponent('EditorPreviewAsyncAPIReactComponent');

const isParseInProgress = editorPreviewAsyncAPISelectors.selectIsParseInProgress();
const isParseSuccess = editorPreviewAsyncAPISelectors.selectIsParseSuccess();
const isParseFailure = editorPreviewAsyncAPISelectors.selectIsParseFailure();
const parseResult = editorPreviewAsyncAPISelectors.selectParseResult();
const parseErrors = editorPreviewAsyncAPISelectors.selectParseErrors();
const config = { show: { errors: true } };
const config = useMemo(() => ({ show: { errors: true } }), []);

useEffect(() => {
return () => {
Expand All @@ -31,7 +29,7 @@ const EditorPreviewAsyncAPI = ({
<div className="swagger-editor__editor-preview-asyncapi">
<Suspense fallback={<Loading />}>
{isParseInProgress && <Parsing />}
{isParseSuccess && <AsyncApiReactComponent schema={parseResult} config={config} />}
{isParseSuccess && <AsyncAPIReactComponent schema={parseResult} config={config} />}
{isParseFailure && <ParseErrors errors={parseErrors} />}
</Suspense>
</div>
Expand Down
2 changes: 2 additions & 0 deletions src/plugins/editor-preview-asyncapi/index.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import EditorPreviewAsyncAPI from './components/EditorPreviewAsyncAPI/EditorPreviewAsyncAPI.jsx';
import AsyncAPIReactComponent from './components/AsyncAPIReactComponent.jsx';
import ParseErrors from './components/ParseErrors/ParseErrors.jsx';
import EditorPreviewWrapper from './wrap-components/EditorPreviewWrapper.jsx';
import { previewUnmounted, parse, parseStarted, parseSuccess, parseFailure } from './actions.js';
Expand All @@ -20,6 +21,7 @@ const EditorPreviewAsyncAPIPlugin = () => ({
components: {
EditorPreviewAsyncAPI,
EditorPreviewAsyncAPIParseErrors: ParseErrors,
EditorPreviewAsyncAPIReactComponent: AsyncAPIReactComponent,
},
wrapComponents: {
EditorPreview: EditorPreviewWrapper,
Expand Down

0 comments on commit e2c96df

Please sign in to comment.