Thread: Proposing Side Workspace in pgAdmin 4 for Query Tool, PSQL and Schema Diff

Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216
Attachment
Hi

To add to this, there are a couple of main reasons we're experimenting with this:

1) Query Tools, psql, and the Schema diff are disconnected and independent from the treeview once launched (in fact, that's always the case for schema diff). Moving those tools out into separate workspaces de-clutters the UI, reducing the number of tabs visible when browsing the schema, and allowing more space and a more focussed look and feel for the tools themselves which have little reason to be shown alongside the main browser treeview control.

2) In the future this will potentially allow us to offer different user "roles" when running in server mode. For example, some users might only be given access to browse the schema and manage objects, or others might only be given access to query tools and not be able to schema browse.

On Tue, 13 Aug 2024 at 08:58, Akshay Joshi <akshay.joshi@enterprisedb.com> wrote:
Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216


--
Dave Page
PostgreSQL: https://www.postgresql.org

PGDay UK 2024, 11th September, London: https://2024.pgday.uk/

Attachment
Hello Akshay,

Nice to hear about the new enhancement. I’m curious about why we need a new workspace approach and how it benefits the end user.

Will we be able to restrict access to different users in different workspaces? If so, how can we configure this?"


Regards,

Zaid


On Tue, Aug 13, 2024 at 12:58 PM Akshay Joshi <akshay.joshi@enterprisedb.com> wrote:
Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216
Attachment
Hi Zaid

On Tue, Aug 13, 2024 at 3:37 PM Zaid Shabbir <zaidshabbir@gmail.com> wrote:
Hello Akshay,

Nice to hear about the new enhancement. I’m curious about why we need a new workspace approach and how it benefits the end user.

Will we be able to restrict access to different users in different workspaces? If so, how can we configure this?"


    I guess Dave has already answered if you can refer to his reply on this email thread.


Regards,

Zaid


On Tue, Aug 13, 2024 at 12:58 PM Akshay Joshi <akshay.joshi@enterprisedb.com> wrote:
Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216
Attachment
Hi Akshay/Dave,

We could make the Object Explorer appear on all the workspaces. If space is a concern then let's make the object explorer collapsible. Even VS-Code allows it.
That way, dragging the objects will not be a problem.

Below is what I propose:
workspace-aditya.png


On Tue, Aug 13, 2024 at 1:28 PM Akshay Joshi <akshay.joshi@enterprisedb.com> wrote:
Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216


--
Thanks,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Architect | enterprisedb.com
"Don't Complain about Heat, Plant a TREE"
Attachment


On Wed, 14 Aug 2024 at 11:20, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Akshay/Dave,

We could make the Object Explorer appear on all the workspaces.

To what end? Part of the reason for not doing that is that tools like the query tool or psql are not connected to, related to, or contextually linked to the treeview at all once they've been instantiated - therefore, why show them together?

 
If space is a concern then let's make the object explorer collapsible. Even VS-Code allows it.
That way, dragging the objects will not be a problem.

Below is what I propose:
workspace-aditya.png


On Tue, Aug 13, 2024 at 1:28 PM Akshay Joshi <akshay.joshi@enterprisedb.com> wrote:
Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216


--
Thanks,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Architect | enterprisedb.com
"Don't Complain about Heat, Plant a TREE"


--
Dave Page
PostgreSQL: https://www.postgresql.org

PGDay UK 2024, 11th September, London: https://2024.pgday.uk/

Attachment
Hi Dave,


On Wed, Aug 14, 2024 at 4:17 PM Dave Page <dpage@pgadmin.org> wrote:


On Wed, 14 Aug 2024 at 11:20, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Akshay/Dave,

We could make the Object Explorer appear on all the workspaces.

To what end? Part of the reason for not doing that is that tools like the query tool or psql are not connected to, related to, or contextually linked to the treeview at all once they've been instantiated - therefore, why show them together?
For drag-drop, refer to the objects or open a new query tool directly from the tree like now.
Or, we can change object explorer content relevant to the workspace selected.

 
If space is a concern then let's make the object explorer collapsible. Even VS-Code allows it.
That way, dragging the objects will not be a problem.

Below is what I propose:
workspace-aditya.png


On Tue, Aug 13, 2024 at 1:28 PM Akshay Joshi <akshay.joshi@enterprisedb.com> wrote:
Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216


--
Thanks,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Architect | enterprisedb.com
"Don't Complain about Heat, Plant a TREE"


--
Dave Page
PostgreSQL: https://www.postgresql.org

PGDay UK 2024, 11th September, London: https://2024.pgday.uk/



--
Thanks,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Architect | enterprisedb.com
"Don't Complain about Heat, Plant a TREE"
Attachment


On Wed, Aug 14, 2024 at 12:01 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Dave,


On Wed, Aug 14, 2024 at 4:17 PM Dave Page <dpage@pgadmin.org> wrote:


On Wed, 14 Aug 2024 at 11:20, Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Akshay/Dave,

We could make the Object Explorer appear on all the workspaces.

To what end? Part of the reason for not doing that is that tools like the query tool or psql are not connected to, related to, or contextually linked to the treeview at all once they've been instantiated - therefore, why show them together?
For drag-drop, refer to the objects or open a new query tool directly from the tree like now.
Or, we can change object explorer content relevant to the workspace selected.

You'll still be able to open a query tool from the tree. That won't change. For drag and drop, we're looking into doing something similar to how you can drag/drop into a folder that isn't initially shown in macOS Finder.

Keep in mind that we're also planning on keeping the current design as an option, plus you can also still open in new browser tabs or desktop windows.
 

 
If space is a concern then let's make the object explorer collapsible. Even VS-Code allows it.
That way, dragging the objects will not be a problem.

Below is what I propose:
workspace-aditya.png


On Tue, Aug 13, 2024 at 1:28 PM Akshay Joshi <akshay.joshi@enterprisedb.com> wrote:
Hi All,

I’m currently developing a proof of concept (POC) for integrating a side workspace (7708) into pgAdmin 4 similar to the workspaces found in VSCode and PyCharm. This workspace will be for Query Tool, PSQL, and Schema Diff Tool. I’ve completed the initial phase of this POC and would appreciate your feedback on the following points:
  1. Does this approach seem promising?
  2. We plan to make the interface configurable, allowing users to choose between "Classic UI" and "Workspace UI." We’ll also work on selecting appropriate labels for these options. 
How it works/behaves:
  • The first workspace is the general workspace, which includes the Object Explorer and other basic tabs (retaining the current look and feel).
  • The second workspace is dedicated solely to the Query Tool, where we’ll introduce a welcome page (the design is still in progress). Every Query Tool and View/Edit Data tab will open within this workspace.
  • The third workspace is reserved for PSQL, where all PSQL tabs will be opened.
  • The fourth workspace is specifically for Schema Diff, where all Schema Diff tabs will be opened.
Challenges:
  • Drag and Drop objects from the General workspace to the Query Tool workspace.
  • Changing the UI from "Classic" to "Workpsace" and vice versa based on preference setting.
I have created an installer for OSX and Windows if you would like to check the behavior you can download it from https://drive.google.com/drive/folders/18TO5ezO7PcgI0ArStPW0S2gBvqInvDkz?usp=drive_link

Few Screenshots: 
Screenshot 2024-08-13 at 1.00.19 PM.png.            Screenshot 2024-08-13 at 1.01.02 PM.png


Screenshot 2024-08-13 at 1.01.20 PM.png.            Screenshot 2024-08-13 at 1.01.35 PM.png


Akshay Joshi

Principle Software Architect

enterprisedb.com


  Blog: https://www.enterprisedb.com/akshay-joshi
  GitHub: https://github.com/akshay-joshi
  LinkedIn: https://www.linkedin.com/in/akshay-joshi-086497216


--
Thanks,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Architect | enterprisedb.com
"Don't Complain about Heat, Plant a TREE"


--
Dave Page
PostgreSQL: https://www.postgresql.org

PGDay UK 2024, 11th September, London: https://2024.pgday.uk/



--
Thanks,
Aditya Toshniwal
pgAdmin Hacker | Sr. Software Architect | enterprisedb.com
"Don't Complain about Heat, Plant a TREE"


--
Dave Page
VP, Chief Architect, Database Infrastructure
EDB: https://www.enterprisedb.com

Attachment