Flutter-intellij: Banner notifications for source files containing runnable samples

[pq]

Sub-task of #2968.

Show a banner with a clickable link saying something like “Open sample project in a new window…” for source files that have an embedded sample (for example, Card). Clicking the link should create a new sample project.

(Note that we'll need we need to ensure that this works for both IntelliJ and Android Studio.)

Open questions:

1. should we pick a temporary location and project name, or
2. prompt for them (w/ a dialog), or
3. ~open the new project wizard, seeded w/ appropriate values~

I've included 3 for completeness but I think it would be cumbersome.

@InMatrix: thoughts on 1 vs. 2 (or some other variation?)

[InMatrix]

I think option 1 probably is sufficient, since those sample projects are likely to be thrown away after use.

[pq]

Great. Thanks @InMatrix!

@alexander-doroshko : is there a canonical location you'd suggest for temporary projects? Maybe just fall back to com.intellij.ide.impl.ProjectUtil.getBaseDir()?

[alexander-doroshko]

I don't know any entity close to 'temporary project' concept. Probably there aren't any.

The closest thing that comes to my mind is Scratch Files concept. They fit perfectly to try a toy single-file project. In some technologies (like Java) scratch files are runnable/debuggable. It should be technically possible to make Dart scratch files runnable/debuggable as well.

If it's possible to have just a single Dart scratch file to run a sample - then the concept is just great! Otherwise you may want to investigate how good scratch files are for multi-files toy projects, how to deal with auxiliary files like pubspec, .packages, etc.

[pq]

Playing around with some mocked content.

Word-smithing ideas welcome.

Also, it looks like some files host more than one sample. In that case, we'll need to do more than provide a "Open sample project in a new window…" action.

@InMatrix @gspencergoog: thoughts?

fyi @DanTup (in case you want to do something similar for VS Code).

[DanTup]

It might be more obvious what it does if it included the sample name in the text ("Open CustomScrollView project in a new window" for ex.), but otherwise looks good. We can't do banners like this in VS Code (we can do toast popups, but not close them automatically, so they'd build up). I did plan on adding clickable links to the tooltips, though I realise now they wouldn't work when looking at the source directly, so I'll have to try and come up with something else - maybe a CodeLens link (like the Run/Debug tests) would work.

[pq]

Playing around with inlined description text.

The combo accommodates the multiple samples in a file case and the description disambiguates.

Feedback welcome.

/cc @InMatrix

[gspencergoog]

That's pretty cool. I'd point out that some people generate a lot of description text, so you might want to limit the amount you display. Of course, if they do that it looks pretty bad on the web too, so there's some incentive to keep it succinct.

[pq]

Thanks @gspencergoog. Yeah, the long descriptions may be worth shortening. For example:

We should also probably strip newlines (I'm letting the textarea do wrapping) and remove the dartdoc brackets.

Maybe a simple heuristic of just showing the first sentence?

[gspencergoog]

Ideally the dartdoc references would be links...

[pq]

OK, a few ideas / proposals:

1. show just the first sentence of long descriptions (e.g., trim the Scaffold description shown above after "[FloatingActionButton].")
2. replace dartdoc links w/ styled bold text ("This sample shows creation of a [Card]" => "This sample shows creation of a Card")
3. in the future, add actionable links to references outside the file (or more specific within it) -- that is, linking to Card when we're in card.dart isn't useful but FloatingActionButton might be

@gspencergoog, @InMatrix, @DanTup: thoughts?

[DanTup]

All sound reasonable to me 👍

[InMatrix]

+1 to all three.

[pq]

Thanks all. Here's where we're at with those ideas implemented. (Note the line-wrapping.)

[InMatrix]

Could we move Go... next to the dropdown menu? Having it at the far right side of the bar makes it harder to mentally associate it to the "Open sample project" action.

[pq]

Without fiddling w/ padding, here's how that looks:

[Krysl]

How to close or disable this banner? I don't want this bar at all, I tried all the ways I could think of (without disabling the flutter plugin), but all failed. As an obsessive-compulsive disorder, I really can't stand such a banner blocking my view.
Please at least give me a close button. @pq

Version info:
Android Studio 3.4.2
FLutter plugin v37.1.1

[devoncarew]

Hi @Krysl, thanks for the feedback. Can you open a separate issue for the request? Comments on closed issues are easy to loose track of.