From 7f5ac19b592c2a63e52a5e5319e9e8eb687c7410 Mon Sep 17 00:00:00 2001
From: Ildar Kamalov <i.kamalov@adguard.com>
Date: Mon, 3 Jun 2019 16:33:15 +0300
Subject: [PATCH] * client: use JSON for filtering/remove_url

---
 client/src/__locales/en.json           |  1 +
 client/src/api/Api.js                  | 21 ++++++++++-----------
 client/src/components/Filters/index.js |  9 ++++++++-
 3 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json
index 697dbbcd..d5526750 100644
--- a/client/src/__locales/en.json
+++ b/client/src/__locales/en.json
@@ -297,6 +297,7 @@
     "table_statistics": "Requests count (last 24 hours)",
     "clients_not_found": "No clients found",
     "client_confirm_delete": "Are you sure you want to delete client \"{{key}}\"?",
+    "filter_confirm_delete": "Are you sure you want to delete filter?",
     "auto_clients_title": "Clients (runtime)",
     "auto_clients_desc": "Data on the clients that use AdGuard Home, but not stored in the configuration"
 }
\ No newline at end of file
diff --git a/client/src/api/Api.js b/client/src/api/Api.js
index 81bce7cf..d07772a7 100644
--- a/client/src/api/Api.js
+++ b/client/src/api/Api.js
@@ -188,15 +188,14 @@ export default class Api {
         return this.makeRequest(path, method, config);
     }
 
-    removeFilter(url) {
+    removeFilter(config) {
         const { path, method } = this.FILTERING_REMOVE_FILTER;
-        const parameter = 'url';
-        const requestBody = `${parameter}=${url}`;
-        const config = {
-            data: requestBody,
-            header: { 'Content-Type': 'text/plain' },
+        const parameters = {
+            data: config,
+            headers: { 'Content-Type': 'application/json' },
         };
-        return this.makeRequest(path, method, config);
+
+        return this.makeRequest(path, method, parameters);
     }
 
     setRules(rules) {
@@ -424,10 +423,10 @@ export default class Api {
     }
 
     // Per-client settings
-    GET_CLIENTS = { path: 'clients', method: 'GET' }
-    ADD_CLIENT = { path: 'clients/add', method: 'POST' }
-    DELETE_CLIENT = { path: 'clients/delete', method: 'POST' }
-    UPDATE_CLIENT = { path: 'clients/update', method: 'POST' }
+    GET_CLIENTS = { path: 'clients', method: 'GET' };
+    ADD_CLIENT = { path: 'clients/add', method: 'POST' };
+    DELETE_CLIENT = { path: 'clients/delete', method: 'POST' };
+    UPDATE_CLIENT = { path: 'clients/update', method: 'POST' };
 
     getClients() {
         const { path, method } = this.GET_CLIENTS;
diff --git a/client/src/components/Filters/index.js b/client/src/components/Filters/index.js
index 624c9f2f..efa67e59 100644
--- a/client/src/components/Filters/index.js
+++ b/client/src/components/Filters/index.js
@@ -32,6 +32,13 @@ class Filters extends Component {
         );
     };
 
+    handleDelete = (url) => {
+        // eslint-disable-next-line no-alert
+        if (window.confirm(this.props.t('filter_confirm_delete'))) {
+            this.props.removeFilter({ url });
+        }
+    }
+
     columns = [{
         Header: <Trans>enabled_table_header</Trans>,
         accessor: 'enabled',
@@ -62,7 +69,7 @@ class Filters extends Component {
             <button
                 type="button"
                 className="btn btn-icon btn-outline-secondary btn-sm"
-                onClick={() => this.props.removeFilter(value)}
+                onClick={() => this.handleDelete(value)}
                 title={this.props.t('delete_table_action')}
             >
                 <svg className="icons">