Skip to content

Commit

Permalink
Merge pull request #21 from Bandwidth/badges
Browse files Browse the repository at this point in the history 
SWI-2779 Add Support for Custom Badges
  • Loading branch information
@ckoegel
ckoegel authored Jun 7, 2023
2 parents 50edf9f + 1ebdfe9 commit 05a8571
Show file tree
Hide file tree
Showing 8 changed files with 286 additions and 2 deletions.
14 changes: 14 additions & 0 deletions demo/openapi.yaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,9 @@ paths:
summary: Add a new pet to the store
description: Add new pet to the store inventory.
operationId: addPet
x-badges:
- name: Global
type: global
responses:
'405':
description: Invalid input
Expand Down Expand Up @@ -156,6 +159,9 @@ paths:
summary: Update an existing pet
description: ''
operationId: updatePet
x-badges:
- name: US Only
type: usonly
responses:
'400':
description: Invalid ID supplied
Expand Down Expand Up @@ -186,6 +192,9 @@ paths:
get:
description: Retrieve the history information associated with an order.
operationId: GetOrderHistory
x-badges:
- name: Success
type: success
parameters:
- description: ''
in: path
Expand Down Expand Up @@ -244,6 +253,11 @@ paths:
date range or specific query parameter (marked by <b>*</b> below) is
provided, the order results will be limited to the last two years.
operationId: GetTnOptionOrders
x-badges:
- name: 1st Badge
type: warning
- name: 2nd Badge
type: experimental
parameters:
- description: The status of the TN Option order being searched for.
example: PROCESSING
Expand Down
20 changes: 19 additions & 1 deletion src/components/Operation/Operation.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,15 @@ export interface OperationProps {
}

export const Operation = observer(({ operation }: OperationProps): JSX.Element => {
const { name: summary, description, deprecated, externalDocs, isWebhook, httpVerb } = operation;
const {
name: summary,
description,
deprecated,
badges,
externalDocs,
isWebhook,
httpVerb,
} = operation;
const hasDescription = !!(description || externalDocs);
const { showWebhookVerb } = React.useContext(OptionsContext);
return (
Expand All @@ -45,6 +53,16 @@ export const Operation = observer(({ operation }: OperationProps): JSX.Element =
Webhook {showWebhookVerb && httpVerb && '| ' + httpVerb.toUpperCase()}
</Badge>
)}
{badges.map(badge => {
return (
badge && (
<Badge type={badge.type} key={badge.name}>
{' '}
{badge.name}{' '}
</Badge>
)
);
})}
</H2>
{options.pathInMiddlePanel && !isWebhook && (
<Endpoint operation={operation} inverted={true} />
Expand Down
180 changes: 180 additions & 0 deletions src/components/__tests__/__snapshots__/DiscriminatorDropdown.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -134,6 +134,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -188,6 +200,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -405,6 +423,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -459,6 +489,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -663,6 +699,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -717,6 +765,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -983,6 +1037,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -1037,6 +1103,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -1266,6 +1338,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -1320,6 +1404,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -1520,6 +1610,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -1574,6 +1676,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -1799,6 +1907,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -1853,6 +1973,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -2108,6 +2234,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -2162,6 +2300,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -2379,6 +2523,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -2433,6 +2589,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down Expand Up @@ -2637,6 +2799,18 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"light": "#eb6d6b",
"main": "#d41f1c",
},
"experimental": Object {
"contrastText": "#fff",
"dark": "#540297",
"light": "#ba68fd",
"main": "#8c03fc",
},
"global": Object {
"contrastText": "#fff",
"dark": "#4d02b0",
"light": "#b681fd",
"main": "#7c1cfc",
},
"gray": Object {
"100": "#F5F5F5",
"50": "#FAFAFA",
Expand Down Expand Up @@ -2691,6 +2865,12 @@ exports[`Components SchemaView discriminator should correctly render SchemaView
"secondary": "#666",
},
"tonalOffset": 0.2,
"usonly": Object {
"contrastText": "#fff",
"dark": "#045b8b",
"light": "#61c4fa",
"main": "#079cee",
},
"warning": Object {
"contrastText": "#ffffff",
"dark": "#996300",
Expand Down
Loading

0 comments on commit 05a8571

Please sign in to comment.