Re: [pgAdmin4][RM#4199] ENTER in Data Filter runs query

Akshay Joshi <[email protected]> Tue, 17 Sep 2019 18:52:40 +0530

Newsgroups	gmane.comp.db.postgresql.pgadmin.devel
Message-ID	<CANxoLDeyigXkmTxsDrFe_otbje8e_jKBaEnwC38n5Tn1z4EZsQ@mail.gmail.com>

Attached is the modified patch to lighten the text of the place holder
string.

On Tue, Sep 17, 2019 at 6:29 PM Akshay Joshi <[email protected]>
wrote:

> Hi Hackers,
>
> Attached is the patch to fix RM 4199 "ENTER in Data Filter runs query". To
> solve this problem I have remove the key mapping of the "OK" button, which
> is mapped to ENTER key and provided the alternative key combination that is
> "*SHIFT + ENTER*".
>
> I have added Placeholder message for that in code mirror.
> Refer Data_Filter.png.
> Please review it.
>
> --
> *Thanks & Regards*
> *Akshay Joshi*
>
> *Sr. Software Architect*
> *EnterpriseDB Software India Private Limited*
> *Mobile: +91 976-788-8246*
>

-- 
*Thanks & Regards*
*Akshay Joshi*

*Sr. Software Architect*
*EnterpriseDB Software India Private Limited*
*Mobile: +91 976-788-8246*

RM_4199_v2.patch (application/octet-stream, 2.6 KB)

diff --git a/web/pgadmin/static/bundle/codemirror.js b/web/pgadmin/static/bundle/codemirror.js
index b77c259e..972e6c22 100644
--- a/web/pgadmin/static/bundle/codemirror.js
+++ b/web/pgadmin/static/bundle/codemirror.js
@@ -25,5 +25,6 @@ import 'codemirror/addon/edit/closebrackets';
 import 'codemirror/addon/comment/comment';
 import 'sources/codemirror/addon/fold/pgadmin-sqlfoldcode';
 import 'sources/codemirror/extension/centre_on_line';
+import 'codemirror/addon/display/placeholder.js';
 
 export default CodeMirror;
diff --git a/web/pgadmin/static/scss/_codemirror.overrides.scss b/web/pgadmin/static/scss/_codemirror.overrides.scss
index a6775246..1c8c779d 100644
--- a/web/pgadmin/static/scss/_codemirror.overrides.scss
+++ b/web/pgadmin/static/scss/_codemirror.overrides.scss
@@ -160,3 +160,7 @@
 .CodeMirror-activeline-background {
   background: $color-danger-lighter !important;
 }
+
+.CodeMirror pre.CodeMirror-placeholder {
+  color: $text-muted;
+}
diff --git a/web/pgadmin/tools/datagrid/static/js/show_data.js b/web/pgadmin/tools/datagrid/static/js/show_data.js
index c2fbc7be..85333672 100644
--- a/web/pgadmin/tools/datagrid/static/js/show_data.js
+++ b/web/pgadmin/tools/datagrid/static/js/show_data.js
@@ -128,7 +128,7 @@ function initFilterDialog(alertify, pgBrowser) {
               className: 'btn btn-secondary fa fa-times pg-alertify-button',
             },{
               text: gettext('OK'),
-              key: 13,
+              key: null,
               className: 'btn btn-primary fa fa-check pg-alertify-button',
             }],
             options: {
@@ -141,7 +141,16 @@ function initFilterDialog(alertify, pgBrowser) {
           };
         },
         build: function() {
-          alertify.pgDialogBuild.apply(this);
+          var that = this;
+          alertify.pgDialogBuild.apply(that);
+
+          // For sort/filter dialog we capture the keypress event
+          // and on "shift + enter" we clicked on "OK" button.
+          $(that.elements.body).on('keypress', function(evt) {
+            if (evt.shiftKey && evt.keyCode == 13) {
+              that.__internal.buttons[1].element.click();
+            }
+          });
         },
         prepare:function() {
           var that = this,
@@ -168,6 +177,7 @@ function initFilterDialog(alertify, pgBrowser) {
             lineWrapping: that.preferences.wrap_code,
             autoCloseBrackets: that.preferences.insert_pair_brackets,
             matchBrackets: that.preferences.brace_matching,
+            placeholder: gettext('Use SHIFT + ENTER to apply filter...'),
           });
 
           let sql_font_size = SqlEditorUtils.calcFontSize(that.preferences.sql_font_size);