feat(swagger-ui-react): add support of filter prop (#7547)

Co-authored-by: Mahtis Michel <[email protected]> Co-authored-by: Vladimir Gorej <[email protected]> Closes #7546
swagger-api · Nov 8, 2021 · b71446c · b71446c
1 parent 9d2b35a
commit b71446c
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/flavors/swagger-ui-react/README.md b/flavors/swagger-ui-react/README.md
@@ -125,6 +125,10 @@ Controls whether the "Try it out" section should start enabled. The default is f
 
 ⚠️ This prop is currently only applied once, on mount. Changes to this prop's value will not be propagated to the underlying Swagger UI instance. A future version of this module will remove this limitation, and the change will not be considered a breaking change.
 
+#### `filter`: PropTypes.oneOfType([PropTypes.string, PropTypes.bool])
+
+If set, enables filtering. The top bar will show an edit box that you can use to filter the tagged operations that are shown. Can be Boolean to enable or disable, or a string, in which case filtering will be enabled using that string as the filter expression. Filtering is case sensitive matching the filter expression anywhere inside the tag. See Swagger UI's [Plug Points](https://github.com/swagger-api/swagger-ui/blob/master/docs/customization/plug-points.md#fnopsfilter) to customize the filtering behavior.
+
 #### `requestSnippetsEnabled`: PropTypes.bool,
 
 Enables the request snippet section. When disabled, the legacy curl snippet will be used. The default is false.

diff --git a/flavors/swagger-ui-react/index.jsx b/flavors/swagger-ui-react/index.jsx
@@ -29,6 +29,7 @@ export default class SwaggerUI extends React.Component {
       showMutatedRequest: typeof this.props.showMutatedRequest === "boolean" ? this.props.showMutatedRequest : true,
       deepLinking: typeof this.props.deepLinking === "boolean" ? this.props.deepLinking : false,
       showExtensions: this.props.showExtensions,
+      filter: ["boolean", "string"].includes(typeof this.props.filter) ? this.props.filter : false,      
     })
 
     this.system = ui
@@ -97,7 +98,7 @@ SwaggerUI.propTypes = {
   docExpansion: PropTypes.oneOf(["list", "full", "none"]),
   supportedSubmitMethods: PropTypes.arrayOf(
     PropTypes.oneOf(["get", "put", "post", "delete", "options", "head", "patch", "trace"])
-    ),
+  ),
   plugins: PropTypes.arrayOf(PropTypes.object),
   displayOperationId: PropTypes.bool,
   showMutatedRequest: PropTypes.bool,
@@ -106,6 +107,10 @@ SwaggerUI.propTypes = {
   presets: PropTypes.arrayOf(PropTypes.func),
   deepLinking: PropTypes.bool,
   showExtensions: PropTypes.bool,
+  filter: PropTypes.oneOfType([
+    PropTypes.string,
+    PropTypes.bool,
+  ]),
   requestSnippetsEnabled: PropTypes.bool,
   requestSnippets: PropTypes.object,
   tryItOutEnabled: PropTypes.bool,
@@ -119,6 +124,7 @@ SwaggerUI.defaultProps = {
   presets: [],
   deepLinking: false,
   showExtensions: false,
+  filter: false,
   requestSnippetsEnabled: false,
   requestSnippets: {
     generators: {