diff --git a/src/core/components/layouts/base.jsx b/src/core/components/layouts/base.jsx
index 3e6c7139..f502b88f 100644
--- a/src/core/components/layouts/base.jsx
+++ b/src/core/components/layouts/base.jsx
@@ -13,8 +13,13 @@ export default class BaseLayout extends React.Component {
getComponent: PropTypes.func.isRequired
}
+ onFilterChange =(e) => {
+ let {target: {value}} = e
+ this.props.layoutActions.updateFilter(value)
+ }
+
render() {
- let { specSelectors, specActions, getComponent } = this.props
+ let { specSelectors, specActions, getComponent, layoutSelectors } = this.props
let info = specSelectors.info()
let url = specSelectors.url()
@@ -31,6 +36,15 @@ export default class BaseLayout extends React.Component {
let Row = getComponent("Row")
let Col = getComponent("Col")
let Errors = getComponent("errors", true)
+
+ let isLoading = specSelectors.loadingStatus() === "loading"
+ let isFailed = specSelectors.loadingStatus() === "failed"
+ let filter = layoutSelectors.currentFilter()
+
+ let inputStyle = {}
+ if(isFailed) inputStyle.color = "red"
+ if(isLoading) inputStyle.color = "#aaa"
+
const Schemes = getComponent("schemes")
const isSpecEmpty = !specSelectors.specStr()
@@ -57,6 +71,7 @@ export default class BaseLayout extends React.Component {
{ schemes && schemes.size ? (
) : null }
+
{ securityDefinitions ? (
) : null }
@@ -64,6 +79,15 @@ export default class BaseLayout extends React.Component {
) : null }
+ {
+ filter === null || filter === false ? null :
+
+
+
+
+
+ }
+
diff --git a/src/plugins/topbar/topbar.jsx b/src/plugins/topbar/topbar.jsx
index 314e1d4e..fd3654bb 100644
--- a/src/plugins/topbar/topbar.jsx
+++ b/src/plugins/topbar/topbar.jsx
@@ -7,7 +7,6 @@ import Logo from "./logo_small.png"
export default class Topbar extends React.Component {
static propTypes = {
- layoutSelectors: PropTypes.object.isRequired,
layoutActions: PropTypes.object.isRequired
}
@@ -91,13 +90,12 @@ export default class Topbar extends React.Component {
}
render() {
- let { getComponent, specSelectors, getConfigs, layoutSelectors } = this.props
+ let { getComponent, specSelectors, getConfigs } = this.props
const Button = getComponent("Button")
const Link = getComponent("Link")
let isLoading = specSelectors.loadingStatus() === "loading"
let isFailed = specSelectors.loadingStatus() === "failed"
- let filter = layoutSelectors.currentFilter()
let inputStyle = {}
if(isFailed) inputStyle.color = "red"
@@ -135,10 +133,6 @@ export default class Topbar extends React.Component {
swagger
- {
- filter === null || filter === false ? null :
-
- }
diff --git a/src/style/_layout.scss b/src/style/_layout.scss
index dab425d9..3b797e1b 100644
--- a/src/style/_layout.scss
+++ b/src/style/_layout.scss
@@ -327,6 +327,18 @@ body
}
}
+.filter
+{
+ .operation-filter-input
+ {
+ width: 100%;
+ margin: 20px 0;
+ padding: 10px 10px;
+
+ border: 2px solid #d8dde7;
+ }
+}
+
.tab
{
diff --git a/src/style/_topbar.scss b/src/style/_topbar.scss
index b1427c78..d3b76aa6 100644
--- a/src/style/_topbar.scss
+++ b/src/style/_topbar.scss
@@ -29,12 +29,6 @@
padding: 0 10px;
}
}
- .operation-filter-input
- {
- border: 2px solid #547f00;
- border-right: none;
- border-radius: 4px 0 0 4px;
- }
.download-url-wrapper
{
@@ -49,7 +43,6 @@
margin: 0;
border: 2px solid #547f00;
- border-radius: 0 0 0 0;
outline: none;
}