@@ -12,7 +12,8 @@ class SearchBar extends Form {
1212 showTopicListView : PropTypes . bool ,
1313 showSearch : PropTypes . bool ,
1414 showFilters : PropTypes . string ,
15- showKeepSearch : PropTypes . bool
15+ showKeepSearch : PropTypes . bool ,
16+ showGroupsListView : PropTypes . bool
1617 } ;
1718 state = {
1819 formData : { } ,
@@ -34,7 +35,16 @@ class SearchBar extends Form {
3435 _id : SETTINGS_VALUES . TOPIC . TOPIC_DEFAULT_VIEW . HIDE_STREAM ,
3536 name : 'Hide stream topics'
3637 }
37- ]
38+ ] ,
39+ groupsListViewOptions : [
40+ {
41+ _id : SETTINGS_VALUES . TOPIC . CONSUMER_GROUP_DEFAULT_VIEW . ALL ,
42+ name : "Show empty consumer groups"
43+ } ,
44+ {
45+ _id : SETTINGS_VALUES . TOPIC . CONSUMER_GROUP_DEFAULT_VIEW . HIDE_EMPTY ,
46+ name : "Hide empty consumer groups"
47+ } ]
3848 } ;
3949
4050 schema = { } ;
@@ -44,19 +54,16 @@ class SearchBar extends Form {
4454 }
4555
4656 componentDidUpdate ( prevProps ) {
47- const { search, topicListView, keepSearch } = this . props ;
57+ const { search, topicListView, keepSearch, groupsListView } = this . props ;
4858
49- if (
50- search !== prevProps . search ||
51- topicListView !== prevProps . topicListView ||
52- keepSearch !== prevProps . keepSearch
53- ) {
59+ if ( search !== prevProps . search || topicListView !== prevProps . topicListView
60+ || keepSearch !== prevProps . keepSearch || groupsListView !== prevProps . groupsListView ) {
5461 this . setupProps ( ) ;
5562 }
5663 }
5764
5865 setupProps ( ) {
59- const { showSearch, showTopicListView, showKeepSearch } = this . props ;
66+ const { showSearch, showTopicListView, showKeepSearch, showGroupsListView } = this . props ;
6067 const { formData } = this . state ;
6168 if ( showSearch ) {
6269 const { search } = this . props ;
@@ -72,6 +79,11 @@ class SearchBar extends Form {
7279 formData [ 'keepSearch' ] = this . props . keepSearch ;
7380 this . schema [ 'keepSearch' ] = Joi . boolean ( ) ;
7481 }
82+ if ( showGroupsListView ) {
83+ const { groupsListView } = this . props ;
84+ formData [ 'groupsListView' ] = groupsListView ;
85+ this . schema [ 'groupsListView' ] = Joi . string ( ) . required ( ) ;
86+ }
7587 return formData ;
7688 }
7789
@@ -88,14 +100,15 @@ class SearchBar extends Form {
88100 }
89101
90102 doSubmit = ( ) => {
91- const { pagination, search, topicListView, keepSearch } = this . state . formData ;
103+ const { pagination, search, topicListView, keepSearch, groupsListView } = this . state . formData ;
92104 const data = {
93105 pagination : pagination ,
94106 searchData : {
95107 search : search ,
96108 topicListView : topicListView
97109 } ,
98- keepSearch : keepSearch
110+ keepSearch : keepSearch ,
111+ groupsListView : groupsListView
99112 } ;
100113 this . props . doSubmit ( data ) ;
101114 } ;
@@ -109,8 +122,8 @@ class SearchBar extends Form {
109122 }
110123
111124 render ( ) {
112- const { showSearch, showTopicListView, showKeepSearch } = this . props ;
113- const { topicListViewOptions, showFilters, formData } = this . state ;
125+ const { showSearch, showTopicListView, showKeepSearch, showGroupsListView } = this . props ;
126+ const { topicListViewOptions, groupsListViewOptions , showFilters, formData } = this . state ;
114127
115128 return (
116129 < React . Fragment >
@@ -155,6 +168,22 @@ class SearchBar extends Form {
155168 'select-wrapper' ,
156169 false
157170 ) }
171+ { showGroupsListView && (
172+ this . renderSelect (
173+ 'groupsListView' ,
174+ '' ,
175+ groupsListViewOptions ,
176+ ( { currentTarget : input } ) => {
177+ let { formData } = this . state ;
178+ formData . groupsListView = input . value ;
179+ this . setState ( ) ;
180+ this . props . ongroupsListViewChange ( input . value ) ;
181+ } ,
182+ '' ,
183+ 'select-wrapper' ,
184+ false
185+ )
186+ ) }
158187 < button className = "btn btn-primary" type = "submit" >
159188 < FontAwesomeIcon icon = { faSearch } />
160189 < span className = "d-lg-none" > Search</ span >
0 commit comments