Morecast: Add validation feedback for empty but required fields

[conbrad]

Renders red border on cells when a value is required but is empty. For these cells, only when a user hovers them will it provide the prompt, "Enter a value" in a tooltip, so as not to overwhelm the datagrid.

Test Links:

Landing Page
MoreCast
Percentile Calculator
C-Haines
FireBat
FireBat bookmark
Auto Spatial Advisory (ASA)
HFI Calculator

[brettedw]

Not sure what is causing this, but sometimes locally I don't get a popup and the cursor flickers between pointer/text cursor, along with the mouse over row flickering as well. It seems to resolve when I move my cursor to the centre of the text field?

[conbrad]

Not sure what is causing this, but sometimes locally I don't get a popup and the cursor flickers between pointer/text cursor, along with the mouse over row flickering as well. It seems to resolve when I move my cursor to the centre of the text field?

Aah it's because forecast cell is rendered as part of a grid, I'm going to have to move the Tooltip to wrap the grid for ForecastCell

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 81.38%. Comparing base (6d12f7b) to head (c7eed2c).

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3936      +/-   ##
==========================================
+ Coverage   81.35%   81.38%   +0.02%     
==========================================
  Files         298      298              
  Lines       11421    11436      +15     
  Branches      546      552       +6     
==========================================
+ Hits         9292     9307      +15     
  Misses       2094     2094              
  Partials       35       35              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[dgboss]

I'm a little torn about always showing the red borders on cells that need data entry. A more typical pattern would be to validate once the submit/save button gets pressed and then display the border around cells that need it. It might be worth checking in with RP on this.

I'd also suggest updating the text in the warning toast message to say something about required fields being empty or something to that effect.

[conbrad]

I'm a little torn about always showing the red borders on cells that need data entry. A more typical pattern would be to validate once the submit/save button gets pressed and then display the border around cells that need it. It might be worth checking in with RP on this.

I'd also suggest updating the text in the warning toast message to say something about required fields being empty or something to that effect.

Perhaps the red border is a little aggressive for drawing attention to blank cells but I'd argue some sort of feedback before having the user attempt to submit is better than only seeing errors once you attempt to submit, to get the feedback as early as possible.

@rajpersram thoughts?

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[brettedw]

I'm a little torn about always showing the red borders on cells that need data entry. A more typical pattern would be to validate once the submit/save button gets pressed and then display the border around cells that need it. It might be worth checking in with RP on this.
I'd also suggest updating the text in the warning toast message to say something about required fields being empty or something to that effect.

Perhaps the red border is a little aggressive for drawing attention to blank cells but I'd argue some sort of feedback before having the user attempt to submit is better than only seeing errors once you attempt to submit, to get the feedback as early as possible.

@rajpersram thoughts?

Curious to hear @rajpersram thoughts. I'd say it's definitely an improvement over what we currently have but I also see Darren's point about a more typical pattern. I wonder if users might find the tooltips on every required input cell a little much, but maybe not because it sounds like they all just tab across inputs. Code looks good to me, curious what Raj has to say about UX

[rajpersram]

I agree with only showing the red outline and note after an action (of submitting) has occured, as opposed to always showing it as red until a value is entered.

[conbrad]

Closing to save dev resources while we hackathon