Use an option usePathInSidebar

If this option is enabled, it displays a path in the sidebar instead of
summary.

Usage:

```js
                <RedocStandalone
                spec={props.spec}
                options={{
                    scrollYOffset:'.navbar',
                    nativeScrollbars: true,
                    usePathInSidebar:true
                }}
```
This commit is contained in:
Junghyun Colin Kim 2021-11-26 19:44:35 +09:00
parent b604bd8da8
commit e16fa80030
5 changed files with 14 additions and 3 deletions

View File

@ -45,8 +45,8 @@ export class MenuItem extends React.Component<MenuItemProps> {
<OperationMenuItemContent {...this.props} item={item as OperationModel} />
) : (
<MenuItemLabel depth={item.depth} active={item.active} type={item.type} ref={this.ref}>
<MenuItemTitle title={item.name}>
{item.name}
<MenuItemTitle title={item.sidebarName}>
{item.sidebarName}
{this.props.children}
</MenuItemTitle>
{(item.depth > 0 && item.items.length > 0 && (
@ -96,7 +96,7 @@ export class OperationMenuItemContent extends React.Component<OperationMenuItemC
<OperationBadge type={item.httpVerb}>{shortenHTTPVerb(item.httpVerb)}</OperationBadge>
)}
<MenuItemTitle width="calc(100% - 38px)">
{item.name}
{item.sidebarName}
{this.props.children}
</MenuItemTitle>
</MenuItemLabel>

View File

@ -16,6 +16,7 @@ export interface IMenuItem {
id: string;
absoluteIdx?: number;
name: string;
sidebarName: string;
description?: string;
depth: number;
active: boolean;

View File

@ -22,6 +22,7 @@ export interface RedocRawOptions {
disableSearch?: boolean | string;
onlyRequiredInSamples?: boolean | string;
showExtensions?: boolean | string | string[];
usePathInSidebar?: boolean;
hideSingleRequestSampleTab?: boolean | string;
menuToggle?: boolean | string;
jsonSampleExpandLevel?: number | string | 'all';
@ -189,6 +190,7 @@ export class RedocNormalizedOptions {
disableSearch: boolean;
onlyRequiredInSamples: boolean;
showExtensions: boolean | string[];
usePathInSidebar: boolean;
hideSingleRequestSampleTab: boolean;
menuToggle: boolean;
jsonSampleExpandLevel: number;
@ -247,6 +249,7 @@ export class RedocNormalizedOptions {
this.disableSearch = argValueToBoolean(raw.disableSearch);
this.onlyRequiredInSamples = argValueToBoolean(raw.onlyRequiredInSamples);
this.showExtensions = RedocNormalizedOptions.normalizeShowExtensions(raw.showExtensions);
this.usePathInSidebar = argValueToBoolean(raw.usePathInSidebar);
this.hideSingleRequestSampleTab = argValueToBoolean(raw.hideSingleRequestSampleTab);
this.menuToggle = argValueToBoolean(raw.menuToggle, true);
this.jsonSampleExpandLevel = RedocNormalizedOptions.normalizeJsonSampleExpandLevel(

View File

@ -14,6 +14,7 @@ export class GroupModel implements IMenuItem {
id: string;
absoluteIdx?: number;
name: string;
sidebarName: string;
description?: string;
type: MenuItemGroupType;
@ -43,6 +44,8 @@ export class GroupModel implements IMenuItem {
this.name = tagOrGroup['x-displayName'] || tagOrGroup.name;
this.level = (tagOrGroup as MarkdownHeading).level || 1;
this.sidebarName = this.name;
// remove sections from markdown, same as in ApiInfo
this.description = tagOrGroup.description || '';

View File

@ -49,6 +49,7 @@ export class OperationModel implements IMenuItem {
id: string;
absoluteIdx?: number;
name: string;
sidebarName: string;
description?: string;
type = 'operation' as const;
@ -104,6 +105,9 @@ export class OperationModel implements IMenuItem {
this.name = getOperationSummary(operationSpec);
this.sidebarName = this.name;
if (options.usePathInSidebar) this.sidebarName = this.path;
if (this.isCallback) {
// NOTE: Callbacks by default should not inherit the specification's global `security` definition.
// Can be defined individually per-callback in the specification. Defaults to none.