From b4603be1db8e18462bafb686dc9ac81fd27653a8 Mon Sep 17 00:00:00 2001
From: Georgios Lignos <glignos93@gmail.com>
Date: Wed, 21 Oct 2020 11:11:32 +0200
Subject: [PATCH] components: adds toggle filter component

---
 src/lib/components/Toggle/ToggleElement.js | 49 ++++++++++++++++++++++
 src/lib/components/Toggle/index.js         | 22 ++++++++++
 src/lib/components/index.js                |  1 +
 3 files changed, 72 insertions(+)
 create mode 100644 src/lib/components/Toggle/ToggleElement.js
 create mode 100644 src/lib/components/Toggle/index.js

diff --git a/src/lib/components/Toggle/ToggleElement.js b/src/lib/components/Toggle/ToggleElement.js
new file mode 100644
index 00000000..b12996d5
--- /dev/null
+++ b/src/lib/components/Toggle/ToggleElement.js
@@ -0,0 +1,49 @@
+/*
+ * This file is part of React-SearchKit.
+ * Copyright (C) 2020 CERN.
+ *
+ * React-SearchKit is free software; you can redistribute it and/or modify it
+ * under the terms of the MIT License; see LICENSE file for more details.
+ */
+
+import React, { Component } from 'react';
+import { Checkbox } from 'semantic-ui-react';
+import Overridable from 'react-overridable';
+import _get from 'lodash/get';
+import { Card } from 'semantic-ui-react';
+
+
+class ToggleComponent extends Component{
+    constructor(props) {
+        super(props);
+        this.title = props.title;
+        this.label = props.label;
+        this.filterValue = props.filterValue;
+        this.updateQueryFilters = props.updateQueryFilters;
+      }
+
+      onToggleClicked = () => {
+        this.updateQueryFilters(this.filterValue);
+      };
+      
+      render() {
+        return(
+        <Overridable id={'ToggleComponent'}>
+            <Card>
+                <Card.Content>
+                    <Card.Header>{this.title}</Card.Header>
+                </Card.Content>
+                <Card.Content>
+                    <Checkbox
+                        toggle
+                        label={this.label}
+                        onClick={this.onToggleClicked}
+                    />
+                </Card.Content>
+            </Card>
+        </Overridable>
+        )
+      }
+}
+
+export default Overridable.component('ToggleComponent', ToggleComponent);
diff --git a/src/lib/components/Toggle/index.js b/src/lib/components/Toggle/index.js
new file mode 100644
index 00000000..ba558212
--- /dev/null
+++ b/src/lib/components/Toggle/index.js
@@ -0,0 +1,22 @@
+/*
+ * This file is part of React-SearchKit.
+ * Copyright (C) 2020 CERN.
+ *
+ * React-SearchKit is free software; you can redistribute it and/or modify it
+ * under the terms of the MIT License; see LICENSE file for more details.
+ */
+
+import { connect } from '../../store';
+import { updateQueryFilters } from '../../state/actions';
+import ToggleComponent from './ToggleElement';
+
+const mapDispatchToProps = dispatch => ({
+  updateQueryFilters: filter => dispatch(updateQueryFilters(filter)),
+});
+
+export const Toggle = connect(
+  state => ({
+    userSelectionFilters: state.query.filters
+  }),
+  mapDispatchToProps,
+)(ToggleComponent);
diff --git a/src/lib/components/index.js b/src/lib/components/index.js
index a47e7683..3cfc4add 100644
--- a/src/lib/components/index.js
+++ b/src/lib/components/index.js
@@ -8,6 +8,7 @@
 
 export { ActiveFilters } from './ActiveFilters';
 export { BucketAggregation } from './BucketAggregation';
+export { Toggle } from './Toggle';
 export { AutocompleteSearchBar } from './AutocompleteSearchBar';
 export { Count } from './Count';
 export { EmptyResults } from './EmptyResults';