Subject: PATCH: Adding more confirmations in query tool (pgAdmin4)

From: Murtuza Zabuawala <[email-masked]>
Date: Wed, 7 Sep 2016 15:08:33 +0530

Hi,

PFA patch to add more confirmations in query tool before taking any actions
which might cause lose changes,
- Clearing editor
- Clearing history
- Load file data
 RM#1666

Please review.

--
Regards,
Murtuza Zabuawala
EnterpriseDB: http://www.enterprisedb.com
The Enterprise PostgreSQL Company
diff --git a/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js b/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js
index ebc7077..d48f4b9 100644
--- a/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js
+++ b/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js
@@ -279,17 +279,17 @@ define(
                if(_.size(data_store.added) ||
                    _.size(data_store.updated)) {
                  msg = '{{ _('The data has been modified, but not saved. Are you sure you wish to discard the changes?') }}';
-                 notify = true; 
+                 notify = true;
                }
              } else if(self.handler.is_query_tool) {
                // We will check for modified sql content
                var sql = self.handler.gridView.query_tool_obj.getValue();
-               sql = sql.replace(/\s+/g, ''); 
+               sql = sql.replace(/\s+/g, '');
                // If it is an empty query, do nothing.
                if (sql.length > 0) {
                  msg = '{{ _('The query has been modified, but not saved. Are you sure you wish to discard the changes?') }}';
-                 notify = true; 
-               } 
+                 notify = true;
+               }
              }
              if(notify) {return self.user_confirmation(p, msg);}
              return true;
@@ -401,20 +401,20 @@ define(
 
       /* To prompt user for unsaved changes */
       user_confirmation: function(panel, msg) {
-        // If there is anything to save then prompt user 
-          alertify.confirm('{{ _('Unsaved changes') }}', msg, 
-            function() {
-              // Do nothing as user do not want to save, just continue
-              window.onbeforeunload = null;
-              panel.off(wcDocker.EVENT.CLOSING);
-              window.top.pgAdmin.Browser.docker.removePanel(panel);
-            },
-            function() {
-              // Stop, User wants to save
-              // false value will prevent from panel to close
-              return true;
-            }
-          ).set('labels', {ok:'Yes', cancel:'No'});
+        // If there is anything to save then prompt user
+        alertify.confirm('{{ _('Unsaved changes') }}', msg,
+          function() {
+            // Do nothing as user do not want to save, just continue
+            window.onbeforeunload = null;
+            panel.off(wcDocker.EVENT.CLOSING);
+            window.top.pgAdmin.Browser.docker.removePanel(panel);
+          },
+          function() {
+            // Stop, User wants to save
+            // false value will prevent from panel to close
+            return true;
+          }
+        ).set('labels', {ok:'Yes', cancel:'No'});
         return false;
       },
 
@@ -1149,21 +1149,49 @@ define(
 
       // Callback function for the clear button click.
       on_clear: function(ev) {
+        var self = this, sql;
         this._stopEventPropogation(ev);
         this._closeDropDown(ev);
 
-        this.query_tool_obj.setValue('');
+        // We will check for modified sql content
+        sql = self.query_tool_obj.getValue();
+        sql = sql.replace(/\s+/g, '');
+        // If there is nothing to save, clear it.
+        if (!sql.length) { self.query_tool_obj.setValue('');  return; }
+
+        alertify.confirm(
+          '{{ _('Clear Editor') }}',
+          '{{ _('Are you sure you wish to discard the current changes?') }}',
+          function() {
+            // Do nothing as user do not want to save, just continue
+            self.query_tool_obj.setValue('');
+          },
+          function() {
+            return true;
+          }
+        ).set('labels', {ok:'Yes', cancel:'No'});
       },
 
       // Callback function for the clear history button click.
       on_clear_history: function(ev) {
+        var self = this;
         this._stopEventPropogation(ev);
         this._closeDropDown(ev);
-
-        // Remove any existing grid first
-        if (this.history_grid) {
-            this.history_collection.reset();
-        }
+        // ask for confirmation only if anything to clear
+        if(!self.history_collection.length) { return; }
+
+        alertify.confirm('{{ _('Clear history') }}',
+          '{{ _('Are you sure you wish to clear all the history?') }}',
+          function() {
+            // Remove any existing grid first
+            if (self.history_grid) {
+              self.history_collection.reset();
+            }
+          },
+          function() {
+            return true;
+          }
+        ).set('labels', {ok:'Yes', cancel:'No'});
       },
 
       // Callback function for the auto commit button click.
@@ -2166,6 +2194,27 @@ define(
         // read file data and return as response
         _select_file_handler: function(e) {
           var self = this;
+          // We will check for modified sql content
+          sql = self.gridView.query_tool_obj.getValue()
+          sql = sql.replace(/\s+/g, '');
+          // If there is nothing to save, clear it.
+          if (!sql.length) { self._load_file_data(e); return;}
+
+          alertify.confirm('{{ _('Load file...') }}',
+            '{{ _('Are you sure you wish to discard the current changes?') }}',
+            function() {
+              // Do nothing as user do not want to save, just continue
+              self._load_file_data(e);
+            },
+            function() {
+              return true;
+            }
+          ).set('labels', {ok:'Yes', cancel:'No'});
+        },
+
+        // Make ajax for loading the data from file in sql editor
+        _load_file_data: function(e) {
+          var self = this;
 
           data = {
             'file_name': e

-- 
Sent via pgadmin-hackers mailing list ([email-masked])
To make changes to your subscription:
http://www.postgresql.org/mailpref/pgadmin-hackers

---

From: Dave Page <[email-masked]>
Date: Wed, 7 Sep 2016 14:00:26 +0100

Hi

> which might cause lose changes,

Can you tweak it so that the confirmation is requested as soon as the
open file button is clicked, rather than when a file is selected
please? I think that's a little more 'normal' :-).

Thanks!

-- 
Dave Page
Blog: http://pgsnake.blogspot.com
Twitter: @pgsnake

EnterpriseDB UK: http://www.enterprisedb.com
The Enterprise PostgreSQL Company

---

From: Murtuza Zabuawala <[email-masked]>
Date: Wed, 7 Sep 2016 18:34:47 +0530

Sure I'll do it, But I thought like let user traverse through file manager
(he may or may not select any file to load) and warn only if he/she try to
load file.

---

From: Dave Page <[email-masked]>
Date: Wed, 7 Sep 2016 15:00:38 +0100

I think it's better to warn them as early as possible, as we do in
pgAdmin 3 (actually, there we just prompt them to save the changes,
but I think either is fine).

---

From: Murtuza Zabuawala <[email-masked]>
Date: Thu, 8 Sep 2016 11:48:26 +0530

Hi Dave,

Please find updated patch.
Please review.

index 615255c..e18e268 100644
@@ -415,19 +415,19 @@ define(
         // If there is anything to save then prompt user
 
@@ -1162,21 +1162,49 @@ define(

+          '{{ _('Clear editor...') }}',
 
+        alertify.confirm('{{ _('Clear history...') }}',
 
       // Callback function for the auto commit button click.
@@ -2166,8 +2194,30 @@ define(
             }
           });
         },
+
         // load select file dialog
         _load_file: function() {
+          var self = this;
+          // We will check for modified sql content
+          sql = self.gridView.query_tool_obj.getValue()
+          sql = sql.replace(/\s+/g, '');
+          // If there is nothing to save, open file manager.
+          if (!sql.length) { self._open_select_file_manager(); return; }
+
+          alertify.confirm('{{ _('Load file...') }}',
+            '{{ _('If you load the file you will lose all the current changes, Are you sure you wish to continue?') }}',
+            function() {
+              // User do not want to save, just continue
+              self._open_select_file_manager();
+           },
+            function() {
+              return true;
+            }
+          ).set('labels', {ok:'Yes', cancel:'No'});
+        },
+
+        // Open FileManager
+        _open_select_file_manager: function() {
           var params = {
             'supported_types': ["sql"], // file types allowed
             'dialog_type': 'select_file' // open select file dialog

---

From: Dave Page <[email-masked]>
Date: Thu, 8 Sep 2016 09:13:01 +0100

Thanks, applied.