Fixed an issue where the connection wasn't being closed when the user switched

to a new connection and closed the query tool. Fixes #7461

Fixed the 'Show activity?' issue which was missed during Dashboard porting.

docs/en_US/release_notes_6_11.rst

@@ -33,4 +33,5 @@ Bug fixes
   | `Issue #7443 <https://redmine.postgresql.org/issues/7443>`_ -  Fixed and issue where 'Use spaces' not working in the query tool.
   | `Issue #7453 <https://redmine.postgresql.org/issues/7453>`_ -  Fixed an issue where the Database restriction is not working.
   | `Issue #7460 <https://redmine.postgresql.org/issues/7460>`_ -  Fixed an issue where pgAdmin stuck while creating a new index.
+  | `Issue #7461 <https://redmine.postgresql.org/issues/7461>`_ -  Fixed an issue where the connection wasn't being closed when the user switched to a new connection and closed the query tool.
   | `Issue #7468 <https://redmine.postgresql.org/issues/7468>`_ -  Skip the history records if the JSON info can't be parsed instead of showing 'No history'.

web/pgadmin/dashboard/static/js/Dashboard.jsx

@@ -800,56 +800,58 @@ export default function Dashboard({
                 pageVisible={true}
               ></Graphs>
             )}
-            <Box className={classes.panelContent}>
+            {!_.isUndefined(preferences) && preferences.show_activity && (
-              <Box
+              <Box className={classes.panelContent}>
-                className={classes.cardHeader}
+                <Box
-                title={props.dbConnected ?  gettext('Database activity') : gettext('Server activity')}
+                  className={classes.cardHeader}
-              >
+                  title={props.dbConnected ?  gettext('Database activity') : gettext('Server activity')}
-                {props.dbConnected ?  gettext('Database activity') : gettext('Server activity')}{' '}
+                >
-              </Box>
+                  {props.dbConnected ?  gettext('Database activity') : gettext('Server activity')}{' '}
-              <Box height="100%" display="flex" flexDirection="column">
+                </Box>
-                <Box>
+                <Box height="100%" display="flex" flexDirection="column">
-                  <Tabs
+                  <Box>
-                    value={tabVal}
+                    <Tabs
-                    onChange={tabChanged}
+                      value={tabVal}
-                  >
+                      onChange={tabChanged}
-                    {tabs.map((tabValue, i) => {
+                    >
-                      return <Tab key={i} label={tabValue} />;
+                      {tabs.map((tabValue, i) => {
-                    })}
+                        return <Tab key={i} label={tabValue} />;
-                    <RefreshButton/>
+                      })}
-                  </Tabs>
+                      <RefreshButton/>
+                    </Tabs>
+                  </Box>
+                  <TabPanel value={tabVal} index={0} classNameRoot={classes.tabPanel}>
+                    <PgTable
+                      caveTable={false}
+                      columns={activityColumns}
+                      data={dashData}
+                      schema={schemaDict}
+                    ></PgTable>
+                  </TabPanel>
+                  <TabPanel value={tabVal} index={1} classNameRoot={classes.tabPanel}>
+                    <PgTable
+                      caveTable={false}
+                      columns={databaseLocksColumns}
+                      data={dashData}
+                    ></PgTable>
+                  </TabPanel>
+                  <TabPanel value={tabVal} index={2} classNameRoot={classes.tabPanel}>
+                    <PgTable
+                      caveTable={false}
+                      columns={databasePreparedColumns}
+                      data={dashData}
+                    ></PgTable>
+                  </TabPanel>
+                  <TabPanel value={tabVal} index={3} classNameRoot={classes.tabPanel}>
+                    <PgTable
+                      caveTable={false}
+                      columns={serverConfigColumns}
+                      data={dashData}
+                    ></PgTable>
+                  </TabPanel>
                 </Box>
-                <TabPanel value={tabVal} index={0} classNameRoot={classes.tabPanel}>
-                  <PgTable
-                    caveTable={false}
-                    columns={activityColumns}
-                    data={dashData}
-                    schema={schemaDict}
-                  ></PgTable>
-                </TabPanel>
-                <TabPanel value={tabVal} index={1} classNameRoot={classes.tabPanel}>
-                  <PgTable
-                    caveTable={false}
-                    columns={databaseLocksColumns}
-                    data={dashData}
-                  ></PgTable>
-                </TabPanel>
-                <TabPanel value={tabVal} index={2} classNameRoot={classes.tabPanel}>
-                  <PgTable
-                    caveTable={false}
-                    columns={databasePreparedColumns}
-                    data={dashData}
-                  ></PgTable>
-                </TabPanel>
-                <TabPanel value={tabVal} index={3} classNameRoot={classes.tabPanel}>
-                  <PgTable
-                    caveTable={false}
-                    columns={serverConfigColumns}
-                    data={dashData}
-                  ></PgTable>
-                </TabPanel>
               </Box>
-            </Box>
+            )}
           </Box>
         </Box>
       ) : sid && !props.serverConnected ? (

web/pgadmin/tools/sqleditor/static/js/SQLEditorModule.js

@@ -288,16 +288,6 @@ export default class SQLEditor {
     panelTitleFunc.setQueryToolDockerTitle(queryToolPanel, is_query_tool, _.unescape(panel_title));
     queryToolPanel.focus();
 
-    // Listen on the panel closed event.
-    if (queryToolPanel.isVisible()) {
-      queryToolPanel.on(wcDocker.EVENT.CLOSED, function() {
-        $.ajax({
-          url: closeUrl,
-          method: 'DELETE',
-        });
-      });
-    }
-
     queryToolPanel.on(wcDocker.EVENT.VISIBILITY_CHANGED, function() {
       queryToolPanel.trigger(wcDocker.EVENT.RESIZED);
     });

web/pgadmin/tools/sqleditor/static/js/components/QueryToolComponent.jsx

@@ -346,6 +346,15 @@ export default function QueryToolComponent({params, pgWindow, pgAdmin, selectedN
   }, []);
 
   useEffect(()=>{
+    const closeConn = ()=>{
+      api.delete(
+        url_for('sqleditor.close', {
+          'trans_id': qtState.params.trans_id,
+        })
+      );
+    };
+    window.addEventListener('unload', closeConn);
+
     const pushHistory = (h)=>{
       api.post(
         url_for('sqleditor.add_query_history', {
@@ -355,7 +364,10 @@ export default function QueryToolComponent({params, pgWindow, pgAdmin, selectedN
       ).catch((error)=>{console.error(error);});
     };
     eventBus.current.registerListener(QUERY_TOOL_EVENTS.PUSH_HISTORY, pushHistory);
-    return ()=>{eventBus.current.deregisterListener(QUERY_TOOL_EVENTS.PUSH_HISTORY, pushHistory);};
+    return ()=>{
+      eventBus.current.deregisterListener(QUERY_TOOL_EVENTS.PUSH_HISTORY, pushHistory);
+      window.removeEventListener('unload', closeConn);
+    };
   }, [qtState.params.trans_id]);
 
 

web/pgadmin/tools/sqleditor/templates/sqleditor/index.html

@@ -42,21 +42,6 @@
                 window.pgAdmin.Tools.SQLEditor.loadComponent(
                     document.getElementById('sqleditor-container'), {{ params|safe }});
 
-                if(window.opener) {
-                    $(window).on('unload', function(ev) {
-                        $.ajax({
-                            method: 'DELETE',
-                            url: '{{close_url}}'
-                        });
-                    });
-                } else {
-                    $(window).on('beforeunload', function(ev) {
-                        $.ajax({
-                            method: 'DELETE',
-                            url: '{{close_url}}'
-                        });
-                    });
-                }
             }, function() {
                 console.log(arguments);
             });