public inbox for [email protected]  

help / color / mirror / Atom feed

From: Aditya Toshniwal <[email protected]>
To: pgadmin-hackers <[email protected]>
Subject: [pgAdmin][RM7172] Validation error block user from entering input
Date: Fri, 4 Mar 2022 15:14:49 +0530
Message-ID: <CAM9w-_nu4SP_-HOKkzq3Njok2TWWQo9h5extj=7q4DFbGcHVvw@mail.gmail.com> (raw)

Hi Hackers,

Attached patch will add margin to form when a validation error occurs, so
that the user can scroll and enter input.
Please review.

-- 
Thanks,
Aditya Toshniwal
pgAdmin Hacker | Software Architect | *edbpostgres.com*
<http://edbpostgres.com;
"Don't Complain about Heat, Plant a TREE"


Attachments:

  [application/octet-stream] RM7172.patch (1.6K, 3-RM7172.patch)
  download | inline diff:
diff --git a/web/pgadmin/static/js/SchemaView/FormView.jsx b/web/pgadmin/static/js/SchemaView/FormView.jsx
index 8c8e5b9fb..684390d7f 100644
--- a/web/pgadmin/static/js/SchemaView/FormView.jsx
+++ b/web/pgadmin/static/js/SchemaView/FormView.jsx
@@ -39,6 +39,10 @@ const useStyles = makeStyles((theme)=>({
   nestedControl: {
     height: 'unset',
   },
+  errorMargin: {
+    /* Error footer margin */
+    marginBottom: '36px',
+  },
   sqlTabInput: {
     border: 0,
   }
@@ -368,7 +372,6 @@ export default function FormView({
               onChange={(event, selTabValue) => {
                 setTabValue(selTabValue);
               }}
-              // indicatorColor="primary"
               variant="scrollable"
               scrollButtons="auto"
               action={(ref)=>ref && ref.updateIndicator()}
@@ -379,9 +382,13 @@ export default function FormView({
             </Tabs>
           </Box>
           {Object.keys(finalTabs).map((tabName, i)=>{
+            let contentClassName = null;
+            if(fullTabs.indexOf(tabName) == -1) {
+              contentClassName = clsx(classes.nestedControl, stateUtils.formErr.message ? classes.errorMargin : null);
+            }
             return (
               <TabPanel key={tabName} value={tabValue} index={i} classNameRoot={clsx(tabsClassname[tabName], isNested ? classes.nestedTabPanel : null)}
-                className={fullTabs.indexOf(tabName) == -1 ? classes.nestedControl : null}>
+                className={contentClassName}>
                 {finalTabs[tabName]}
               </TabPanel>
             );

view thread (2+ messages)  latest in thread

reply

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Reply to all the recipients using the --to and --cc options:
  reply via email

  To: [email protected]
  Cc: [email protected]
  Subject: Re: [pgAdmin][RM7172] Validation error block user from entering input
  In-Reply-To: <CAM9w-_nu4SP_-HOKkzq3Njok2TWWQo9h5extj=7q4DFbGcHVvw@mail.gmail.com>

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox