1

@gabrieldutra @ranbena, in the React migration PRs, I noticed we migrated new object screens (like data source, alert destination or snippets) to Modal dialog. I was wondering about the reasoning for it?

2

My take:

  • Design - our forms are one column wide and look bad on full width pages. In modals they make better visual sense. Same goes for the “steps” feature.
  • UX - modals allow user to stay in context, otherwise jolted to another page.
  • UX - consistency. If an “add” ux is done with a modal, better do the likes the same way.
3

The context you’re in for the examples I mentioned is the list page, which isn’t really a context the user needs when creating the new object. It’s not the same as if they were creating this object for some other flow, to which they go back.

I agree that the form is narrow, but I’m not sure it’s such a big deal. On the other hand:

  1. Type selection feels very cramped in this dialog and so is the snippets dialog.
  2. Long forms in dialogs feel wrong.
4

The context you’re in for the examples I mentioned is the list page, which isn’t really a context the user needs when creating the new object. It’s not the same as if they were creating this object for some other flow, to which they go back.

Totally agree it’s not a must and irrelevant in this case.

I elaborated on the reasoning but I’m not saying this is the right approach for Redash.

I agree that the form is narrow, but I’m not sure it’s such a big deal

A modal is a solution to this problem but not the only one. We can work on the form to make it better fit a page format.

5

Good point to take a step back and discuss this. For small forms I think dialogs are a very good option, you have a good flow and they look nice (all reasons Ran mentioned), examples: User and Group creation. As for the others:
Data source & Alert Destination

  1. Type selection feels very cramped in this dialog.

To be honest I actually liked the Type Selection, as a dialog it approached a Select input in concept. If you know the Data Source you want you’ll probably search for it, if you want to explore options you can scroll through it.

  1. Long forms in dialogs feel wrong.

This one I strongly agree, I didn’t want to give up on using Dialogs there because I did enjoy the result with Type Selection. My current thought with it: If we have any UX issue with this Form as is, we should definitively rethink this as something else rather than a Dialog. I like the idea of having a modal because you have a good UX for Steps, but there’s no point to that if the Form becomes an issue…

Query snippets (current under development)

IMO this one is on the limit, it depends on snippet size as it has autosize now. I’ve chosen the Dialog option because it seemed more future-proof. Query Snippets as I understood should belong to a page (Query Page) rather than have it’s own page. In that case implementing it with a Dialog seemed as it could be used in the future since keeping context in there would matter.

1 Like
6

I too like the list item type selection, and I also have no problem with how long dialogs might become.
I would rather work on decreasing lengthier forms.

7

This is true, but –

  1. Switching from page to dialog is simple enough (just reuse the From component in a new place).
  2. We might opt-in to use a drawer there rather than dialog.

Anyway, let’s park this discussion for now and keep things as they are and revisit in the future.