1 files changed, 101 insertions, 0 deletions
diff --git a/server/sonar-web/src/main/js/components/select-list/main.js b/server/sonar-web/src/main/js/components/select-list/main.js
new file mode 100644
index 00000000000..e17fca31a0d
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/select-list/main.js
@@ -0,0 +1,101 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2016 SonarSource SA
+ * mailto:contact AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import React from 'react';
+import Controls from './controls';
+import List from './list';
+import Footer from './footer';
+
+export default React.createClass({
+  propTypes: {
+    loadItems: React.PropTypes.func.isRequired,
+    renderItem: React.PropTypes.func.isRequired,
+    getItemKey: React.PropTypes.func.isRequired,
+    selectItem: React.PropTypes.func.isRequired,
+    deselectItem: React.PropTypes.func.isRequired
+  },
+
+
+  getInitialState() {
+    return { items: [], total: 0, selection: 'selected', query: null };
+  },
+
+  componentDidMount() {
+    this.loadItems();
+  },
+
+  loadItems() {
+    let options = {
+      selection: this.state.selection,
+      query: this.state.query,
+      page: 1
+    };
+    this.props.loadItems(options, (items, paging) => {
+      this.setState({ items, total: paging.total, page: paging.pageIndex });
+    });
+  },
+
+  loadMoreItems() {
+    let options = {
+      selection: this.state.selection,
+      query: this.state.query,
+      page: this.state.page + 1
+    };
+    this.props.loadItems(options, (items, paging) => {
+      let newItems = [].concat(this.state.items, items);
+      this.setState({ items: newItems, total: paging.total, page: paging.pageIndex });
+    });
+  },
+
+  loadSelected() {
+    this.setState({ selection: 'selected', query: null }, this.loadItems);
+  },
+
+  loadDeselected() {
+    this.setState({ selection: 'deselected', query: null }, this.loadItems);
+  },
+
+  loadAll() {
+    this.setState({ selection: 'all', query: null }, this.loadItems);
+  },
+
+  search(query) {
+    this.setState({ query }, this.loadItems);
+  },
+
+  render() {
+    return (
+        <div className="select-list-container">
+          <Controls
+              selection={this.state.selection}
+              query={this.state.query}
+              loadSelected={this.loadSelected}
+              loadDeselected={this.loadDeselected}
+              loadAll={this.loadAll}
+              search={this.search}/>
+
+          <div className="select-list-wrapper">
+            <List {...this.props} items={this.state.items}/>
+          </div>
+
+          <Footer count={this.state.items.length} total={this.state.total} loadMore={this.loadMoreItems}/>
+        </div>
+    );
+  }
+});