Co-authored-by: Emmad Usmani <emmadusmani@berkeley.edu>
Co-authored-by: Adam James <adam.vermeer2@gmail.com>
Co-authored-by: Mark Bastian <markbastian@gmail.com>
Co-authored-by: Jesse Devaney <22608765+JesseSDevaney@users.noreply.github.com>
Co-authored-by: Anton Kulyk <kuliks.anton@gmail.com>

* Update Trend chart copy for special cases (on frontend) (#35184)

* add computeTrend

* fix unit test

* fix e2e test

* explicitly fallback to day unit if backend doesn’t provide one

* fix empty data cases

* rename function parameters

* correct and simplify computeChange function

- when prevVal < 0 and nextVal < 0, it would return the wrong percentChange. (nextVal - prevVal) / Math.abs(prevVal) fixes this issue.
  - i.e. prevVal = -5, nextVal = -10 -> computeChange(-5, -10) -> computeChange(--10, --5) -> -50% but we should it expect to be -100% since it dropped by a factor of Math.abs(prevVal)

* refactor PREVIOUS_VALUE options

* correct and simplify computeChange further

(-) -> (0) should be + increase (our end case already accounts for this behavior)

* update unit tests to reflect correctness changes to computeChange

* refactor for readability

* refactor to use isEmpty instead of ==/!= null

* refactor variable names for readability

* refactor nested ternaries into function

* refactor for readability

* refactor variable names

* re-use end of array index variable

* re-word comments

* refactor consumers based on return variable re-naming

* add missing test cases

* nit refactor

* re-arrange functions for readability

* truncate prevDate based on nextDate

- if prevDate is same day as nextDate, remove the day, month, and year from the comparisonPeriodStr
- if prevDate is same year as nextDate, remove the year from the comparisonPeriodStr

* fix comment

* fix test

* instead of ↓ and ↑ symbols, use icon names

* fix night mode hack

* refactor formatDateTimeRangeWithUnit behavior

- refactor how options.removeDay and options.removeYear work
- reorganize the layout to make the conditional branches easier to see

* fix tooltip styles

* Add tests to cover new options

- options.removeDay
- options.removeYear

* add option descriptors to test string

---------

Co-authored-by: Jesse Devaney <22608765+JesseSDevaney@users.noreply.github.com>

* Trend Charts: Support arbitrary date comparison (#36666)

* add computeTrend

* fix unit test

* fix e2e test

* explicitly fallback to day unit if backend doesn’t provide one

* fix empty data cases

* rename function parameters

* correct and simplify computeChange function

- when prevVal < 0 and nextVal < 0, it would return the wrong percentChange. (nextVal - prevVal) / Math.abs(prevVal) fixes this issue.
  - i.e. prevVal = -5, nextVal = -10 -> computeChange(-5, -10) -> computeChange(--10, --5) -> -50% but we should it expect to be -100% since it dropped by a factor of Math.abs(prevVal)

* refactor PREVIOUS_VALUE options

* correct and simplify computeChange further

(-) -> (0) should be + increase (our end case already accounts for this behavior)

* update unit tests to reflect correctness changes to computeChange

* refactor for readability

* refactor to use isEmpty instead of ==/!= null

* refactor variable names for readability

* refactor nested ternaries into function

* refactor for readability

* refactor variable names

* re-use end of array index variable

* re-word comments

* refactor consumers based on return variable re-naming

* add missing test cases

* nit refactor

* re-arrange functions for readability

* truncate prevDate based on nextDate

- if prevDate is same day as nextDate, remove the day, month, and year from the comparisonPeriodStr
- if prevDate is same year as nextDate, remove the year from the comparisonPeriodStr

* fix comment

* fix test

* instead of ↓ and ↑ symbols, use icon names

* fix night mode hack

* refactor formatDateTimeRangeWithUnit behavior

- refactor how options.removeDay and options.removeYear work
- reorganize the layout to make the conditional branches easier to see

* fix tooltip styles

* Add tests to cover new options

- options.removeDay
- options.removeYear

* add option descriptors to test string

* add support for different trend comparisons

- compare to previous value
- compare to previous period (minute, hour, day, ...)
- compare to X previous periods ago (30 minutes, 6 hours, 3 days, ...)

* refactor + add comments

* only show periodsAgo comparison option if # of selectable periods ago is >= 2

* auto select all text on click in periodsAgo field input

* fix bug caused by upstream date change

- this caused the parser to try to parse an already existing date object when it expected a string timestamp

* prevent accidental button click

-  Since the input field is small, when mouseDown in child and dragged across (to highlight the input text) and outside the input field, it accidentally mouseUps on the button. This causes the button to be considered clicked since the child element is within the parent element.

* fix searching outside of array bounds

* validate scalar.comparisons setting after any query changes

* add ttag for new copy

* clamp search to start of array incase rows contain missing periods

* rename styled components

* fix SmartScalarSettingsWidgets type errors

* change default comparison to previous period (if dateUnit is supplied)

- default to "compare to previous" if no dateUnit is supplied

* leave "X periods ago" setting even if filtered data reduces date range of dataset

* change copy for no comparable value using `compare to previous` comparison

* rename comparison `compare to previous` to `previous value`

* fix type errors

* fix bug if dateUnit is null

* fix bug and move option down

* fix type error

* remove comment

* refactor names

* fix wrong date display

* add tests

* add tests for "compare to previous"

* fix "previous period" tests

* rename COMPARE_TO_PREVIOUS to PREVIOUS_VALUE

- because copy changed, lets change this const name to match it

* default return null if no comparison selected

* remove unused export

* remove unused export on types

* do not hide primary number selector

* fix dateUnit null

* refactor computeTrend

* fix test b/c of refactor

* update computeChange unit tests

* refactor

* improve tests

* refactor tests based on functionality

* fix timezones bug

* reformat tests

* add test cases for invalid settings

* handle invalid comparison types

* fix type errors and rename variables

* hit "Enter" to submit periodsAgo comparison value

* fix timezone bug when comparisons dates are in different time-zones

- different time-zones in this case in daylight savings time
- this was causing two dates to not be the same ONLY b/c there timezone offset was different

* refactor tests

* reorganize SmartScalar file

* rename comparison option name

* fix type

* add unit tests for comparison option functions and comparison validation

* add component tests for SmartScalar

* re-organize tests

* add E2E tests

* use more direct variable

* refactor variable names

* fix translations error

* fix type errors

* update translation strings

* fix dateTime diffing

- see comment in function and tests for more info

* refactor test assertions

* move comparison types to metabase-types/api/visualization-settings

* drop any type

* update native_form type

* remove todo comment

* remove optionality on types

* remove console.error mock

- used for creating tests to sift out repetitive test errors. forgot to remove

* refactor icon check

* Remove CSS class targeting

* relocate props type object

* Remove CSS class targeting

* group smartscalar settings components into their own directory

* refactor component

* refactor tests to use it.each

* use createMockSingleSeries

* use createMockVisualizationSettings

* use createMockColumn

* reorganize code and files

* fix type

* fix i18n translations

* update periods ago value on blur if selected

* fix type error

* Trend Charts: Address Milestone 2 Feedback (#37062)

* add computeTrend

* fix unit test

* fix e2e test

* explicitly fallback to day unit if backend doesn’t provide one

* fix empty data cases

* rename function parameters

* correct and simplify computeChange function

- when prevVal < 0 and nextVal < 0, it would return the wrong percentChange. (nextVal - prevVal) / Math.abs(prevVal) fixes this issue.
  - i.e. prevVal = -5, nextVal = -10 -> computeChange(-5, -10) -> computeChange(--10, --5) -> -50% but we should it expect to be -100% since it dropped by a factor of Math.abs(prevVal)

* refactor PREVIOUS_VALUE options

* correct and simplify computeChange further

(-) -> (0) should be + increase (our end case already accounts for this behavior)

* update unit tests to reflect correctness changes to computeChange

* refactor for readability

* refactor to use isEmpty instead of ==/!= null

* refactor variable names for readability

* refactor nested ternaries into function

* refactor for readability

* refactor variable names

* re-use end of array index variable

* re-word comments

* refactor consumers based on return variable re-naming

* add missing test cases

* nit refactor

* re-arrange functions for readability

* truncate prevDate based on nextDate

- if prevDate is same day as nextDate, remove the day, month, and year from the comparisonPeriodStr
- if prevDate is same year as nextDate, remove the year from the comparisonPeriodStr

* fix comment

* fix test

* instead of ↓ and ↑ symbols, use icon names

* fix night mode hack

* refactor formatDateTimeRangeWithUnit behavior

- refactor how options.removeDay and options.removeYear work
- reorganize the layout to make the conditional branches easier to see

* fix tooltip styles

* Add tests to cover new options

- options.removeDay
- options.removeYear

* add option descriptors to test string

* add support for different trend comparisons

- compare to previous value
- compare to previous period (minute, hour, day, ...)
- compare to X previous periods ago (30 minutes, 6 hours, 3 days, ...)

* refactor + add comments

* only show periodsAgo comparison option if # of selectable periods ago is >= 2

* auto select all text on click in periodsAgo field input

* fix bug caused by upstream date change

- this caused the parser to try to parse an already existing date object when it expected a string timestamp

* prevent accidental button click

-  Since the input field is small, when mouseDown in child and dragged across (to highlight the input text) and outside the input field, it accidentally mouseUps on the button. This causes the button to be considered clicked since the child element is within the parent element.

* fix searching outside of array bounds

* validate scalar.comparisons setting after any query changes

* add ttag for new copy

* clamp search to start of array incase rows contain missing periods

* rename styled components

* fix SmartScalarSettingsWidgets type errors

* change default comparison to previous period (if dateUnit is supplied)

- default to "compare to previous" if no dateUnit is supplied

* leave "X periods ago" setting even if filtered data reduces date range of dataset

* change copy for no comparable value using `compare to previous` comparison

* rename comparison `compare to previous` to `previous value`

* fix type errors

* fix bug if dateUnit is null

* fix bug and move option down

* fix type error

* remove comment

* refactor names

* fix wrong date display

* add tests

* add tests for "compare to previous"

* fix "previous period" tests

* rename COMPARE_TO_PREVIOUS to PREVIOUS_VALUE

- because copy changed, lets change this const name to match it

* default return null if no comparison selected

* remove unused export

* remove unused export on types

* do not hide primary number selector

* fix dateUnit null

* refactor computeTrend

* fix test b/c of refactor

* update computeChange unit tests

* refactor

* improve tests

* refactor tests based on functionality

* fix timezones bug

* reformat tests

* add test cases for invalid settings

* handle invalid comparison types

* fix type errors and rename variables

* hit "Enter" to submit periodsAgo comparison value

* fix timezone bug when comparisons dates are in different time-zones

- different time-zones in this case in daylight savings time
- this was causing two dates to not be the same ONLY b/c there timezone offset was different

* refactor tests

* reorganize SmartScalar file

* rename comparison option name

* fix type

* add unit tests for comparison option functions and comparison validation

* add component tests for SmartScalar

* re-organize tests

* add E2E tests

* use more direct variable

* refactor variable names

* fix translations error

* fix type errors

* update translation strings

* fix dateTime diffing

- see comment in function and tests for more info

* refactor test assertions

* move comparison types to metabase-types/api/visualization-settings

* drop any type

* update native_form type

* remove todo comment

* remove optionality on types

* remove console.error mock

- used for creating tests to sift out repetitive test errors. forgot to remove

* refactor icon check

* Remove CSS class targeting

* relocate props type object

* Remove CSS class targeting

* group smartscalar settings components into their own directory

* refactor component

* refactor tests to use it.each

* use createMockSingleSeries

* use createMockVisualizationSettings

* use createMockColumn

* reorganize code and files

* fix type

* fix i18n translations

* update periods ago value on blur if selected

* fix type error

* rename types

* improve types

* rename function

* improve button styles

* rename component

* remove comments

* use rightIcon prop

* rename style

* refactor click hacks for periodsAgo menu component

* refactor menu change handling

- if menu is closed, submit onChange with the latest edited value.
- if item is simple, submit value itself
- it item is complex, set edited value state as input changes and submit value when committed

* disable invalid typescript error

- error is coming from using typescript 4.7.2 when .findLast was first introduced in 5.0.0
- code functions properly. IDE recognizes correct type

* if selectedValue and editedValue are equal, we do not need to submit a new value

* update file names to reflect component name changes

* refactor type export

* remove prop type covered by other type

* remove unused file

* remove unnecessary {}

* fix broken test b/c of functionality changes

* remove typescript ignore and replace with type safe function

* rename handleChange to onChange

* rename input validation function

* Trend Charts — Add static number comparison (#36951)

* Fix `MenuItemStyled` props type

* Implement static number comparison

* Fix `utils` unit tests

* Add unit tests for `getTrend`

* Add e2e test coverage

* Fix type

* Fix `compute` tests

* Rename `SmartScalarComparisonStaticNumber` type

* Replace `Flex` with `Stack`

* Fix `StaticNumberForm's` `value` type

* Fix options calc

* Simplify block

* Validate static number comparison

* Remove test

* Replace `Flex` with `Group`

* Minor `DoneButton` tweak

* Minor fix

* Fix value state

* Trend charts — Compact formatting viz setting (#36992)

* Refactor `compactifyValue`

* Add setting to `VisualizationSettings` type

* Respect `compact` option in `compactifyValue`

* Add viz setting

* Add e2e coverage

* Fix `onChange` for `StaticNumberForm`

* Move compact setting to `computeTrend`

* Add `formatOptions` tests for `computeTrend`

* Extend e2e tests

* Test formatting done by `computeTrend`

* Trend charts — Compare to another column (#37087)

* Add viz setting type

* Implement comparison

* Extract `renderMenuDropdownContent`

* Align `Select` label style with other inputs

* Use `column.name`

* Show opt only if there're cols to choose from

* Extend comparison validation check

* Handle missing column

* Fix type error

* Add tests for `getComparisonOptions`

* Extract test `describe` group

* Add tests for `isComparisonValid`

* Add tests for `computeTrend`

* Add basic e2e test

* Ensure comparison column exists in query results

* Fix onChange callback

* Trend charts — multiple comparisons (#37176)

* Turn `scalar.comparisons` into an array

* Implement adding new comparisons

* Implement removing comparison

* Use HTML list for comparisons

* Add `id` to comparison objects

* Implement sorting

* Extract `ComparisonPicker` component

* Trend charts — Misc fixes and polish (#37269)

* Use vertical layout for `StaticNumberForm`

* Update comparison picker display name

* Make smart scalar utils easier to use in static viz

* Fix height

* Fix `Icon` import

* Fix deprecated color reference

* Fix deprecated color reference

* Static viz path for the updated trend chart (#37418)

* Returning map-based response from js-svg/isomorphic.

* add common static viz code path which will be used for the trend chart

* review feedback

* update formatter type

* Fixed detect-pulse-chart-type test response to `:javascript_visualization` for `:smartscalar` case.

* Fixed TODO WRT keywordizing type value of `javascript-visualization` result.

* Better clj formatting

---------

Co-authored-by: Mark Bastian <markbastian@gmail.com>

* Fix merge conflict

* Trend charts — Static viz (#37602)

* Make `computeTrend` independent of "lib/formatting"

* Refactor `getArrowColor`

* Make `computeTrend` independent of "lib/colors"

* Make `computeTrend` independent `formatChange`

* Add `SmartScalar` placeholder

* Add basic static `SmartScalar` viz

* Fix `findLast` not available for static viz

* Clean up `SmartScalar`

* Enable PNG export

* static trend settings computation

* Fix `getDefaultComparison` return type

* Add `VIZ_SETTINGS_DEFAULTS` const for trend charts

* Add `getDefaultColumn` helper for `scalar.field`

* Fix `getDefaultComparison` tests

* Revert "Make `computeTrend` independent `formatChange`"

This reverts commit 9ab1db5a84cbcb58ec2d044f4d6cf7ffb341f62b.

* Fix `formatChange`

* Remove custom `formatChange`

* Add `scalar.comparisons` to `computeSmartScalarSettings`

* Fix `measureText` type

* Fix bad default value for `scalar.field`

* Use `getColor` instead of `color`

* Add stories

* Visual tweaks

* Add `getValue` for `scalar.comparisons`

* Extend e2e test

---------

Co-authored-by: Aleksandr Lesnenko <alxnddr@gmail.com>

* Fix flaky test

* Hide drag handle when there's only one comparison

* Update the "periods ago" control

* Inform people when "periodsAgo" value is clamped

---------

Co-authored-by: shaun <shaun@metabase.com>
Co-authored-by: Jesse Devaney <22608765+JesseSDevaney@users.noreply.github.com>
Co-authored-by: Aleksandr Lesnenko <alxnddr@users.noreply.github.com>
Co-authored-by: Mark Bastian <markbastian@gmail.com>
Co-authored-by: Aleksandr Lesnenko <alxnddr@gmail.com>

* Match static combo chart colors with app viz colors

* Match colors when individual series color is set

* Remove tests that test colors

Since colors is now determined in FE

* Fix static viz Series type

* Match static progress bar colors with app viz colors

* Simplify Clojure code, makes it more idiomatic

* Fix certain combo charts don't respect whitelabel colors

* Make Clojure code more idiomatic

* Fix Series type

* Add colors back to static internal page

* Simplify type predicate

* fix colors matching for multiple series with mulitple metrics or dimensions

* Handle legends not formatted in static viz in some cases

* Fix failed BE tests after BE API changed

* Fix failed BE tests after BE API changed

* Add multiple series dashcard test to `getSeriesWithColors` test

* Add `getSeriesWithLegends` tests

* Fix URL `/_internal/static-viz` not loading due to API change

* Correctly render legend when having dashcard title set

* Simplify combo-chart API

don't really need `settings-seqs` yet

* Make static combo chart component type easier to understand

* Address review: refactor `render-multiple-lab-chart`

* Make variable names easier to understand

* Simplify color API

* Address review on `body.clj`

* Address review, make parameter name more consistent

* Fix multiple scalars not rendering

* Remove unused imports

* fix showing placeholder series

* row chart polish

* wip

* don't use nice x ticks for stacked expand chart

* make grouped row not clickable

* update specs

* update specs

* static pie labels

* visual tests

* Quick fix to prevent non-temporal labels from datetime formatting

* show values pie BE

* Text fix 

* add specs

* renamt show_labels to show_values

* Test fix 



* update spec

Co-authored-by: Adam James <adam.vermeer2@gmail.com>
Co-authored-by: Tim Macdonald <tim@tsmacdonald.com>

* support static row chart on the backend

* update and add types

* update types

* add chart columns helper, dataset grouping

* add viz settings helpers

* fix text measuring

* add generic row chart component for static and dynamic rendering

* update deps

* fix jest config for d3

* allow importing cljs in static viz

* add a hook for getting chart columns and series

* add a static row chart

* build cljs before static viz

* specs

* add stories, moved isomorphic row chart component to the shared folder

* update import

* fix backend merge

* remove an extra line

* one more extra line

* exclude unused props from the row chart

* cleanup

* review

* fix types

* fix log scale

* add visual spec, fix goal label truncate

* review

* fix mock path

* fix specs

* Basic static gauge chart

* Add gauge segment min max labels

* Add gauge segment label

* Cleanup code

* Fix React list key error

* Remove hard-coded colors

* Make the everything calculates at the gauge center

* Make gauge segment data easier to understand

* Example scaling chart to avoid label overflow

* Avoid long labels overflow by scaling the gauge chart down

* Match gauge needle color with the design

* Fix hard coded gauge segment label anchor calculation

* Fix static gauge chart not rotate gauge needle correctly

* Add E2E for static gauge chart

* Fix `transform-origin: center` not working with BE static chart

* Truncate long segment label so charts can never be too small

* Fix gauge segment not connected to each other

* Static chart refactor part 1

* Final static gauge chart refactoring

* Simplify clojure chart render function

* Fix relative imports

* Make overlapping gauge labels more legible

* Make GaugeLabelData property orders consistent

* Make a function easier to read

* Make the calculation more correct

though the behavior would still be the same

* Separate presentational component out of the Gauge component

* Remove unused tap>

* Fix gauge chart not working on chart tester in internal static viz page

* Fix gauge chart not rendered with Lato font

* Improve internal page static chart tester option clarity

* Support column settings in gauge charts

* Add unit tests for static gauge chart utils

* Address review

* Fix unittest failure

* Refactor static waterfall chart to use a single entrypoint

* Consolidate static watetrfall chart

* Update waterfall chart text size to match combo-chart

* Move `<Values />` from XYChart/ to be under components/

Since it'll be used by waterfall chart

* Fix `<Values />` key error (forgot to add key attribute)

* Show data point values on waterfall chart

* Fix failed BE tests

* Fix test -> wrong `waterfall-type` used. And test both types

The waterfall component was changed to take a type argument, instead of having 2 functions for nearly identical
output. The failing test just passed the wrong string to the key argument.

* Change waterfall keys from strings to Clojure keys

* Remove redundant test. Categorical also handled in `waterfall-test`

* Fix clj-kondo lint error

* Cleanup conditional statements

* Miscellaneous code cleanup

* Update waterfall test to render data point values

* Fix waterfall chart data point values not center in the bar

* Make some API for static waterfall chart with total saner

Co-authored-by: Adam James <adam.vermeer2@gmail.com>

* remove unused static chart types

* add visual tests for single series charts

* fix static viz waterfall colors

* tests

* Pass colors into StaticChart as third argument

This might not be the best design, so changes are welcome, but I added this to properly consider the case where the
application-colors are different, but the chart has no viz-settings: application-colors were being ignored (as they
were passed into options, but not pulled out of options into the colors arg).

* review

Co-authored-by: Adam James <adam.vermeer2@gmail.com>

* accessors constants created

* accessors dependencies removed from all charts

* Removed accessors dependencies from BE JS for static viz

* Removed accessors references in chart editor

* accessors added to defaultProps

* Remove accessors in tests

* defaultProps removed form static viz components

Static visualizations for area charts. Pursuant to #18676

Combo type and multiple cards for static viz BE. These go into one FE endpoint but are two really separate things in BE. This one conforms to the FE type but the price is that the previous more-dynamic BE types needed to be changed to conform: this will require a refactoring to whack the js-viz types that already exist, when the FE is refactored also.

Static viz for funnel plots. Pursuant to #18676.

BE for progress bar for static viz, sasha put in the FE bits a bit ago

Static viz waterfall needs BE bits. Here are the BE bits. Color and total summation coming...

* Static viz: respect custom X and Y axis labels

* Static viz: allow rendering non-timeseries line charts

* Test fixes 

* Pass along date formatting

* extract and rename some things

* Number formatting

* Update tests

* Improve test validation of svg labels

* Clean up tests

* Move static-viz interface file to custom file

* Avoid using `undefined` array when column formatters not specified

This led to `TypeError: Cannot read property "forEach" from undefined`
errors when no formatters were specified.

* Improve logging of unexpected errors during format compilation

* Log unsupported formatting operators and return a dummy operator fn

* Linting fixes

* Manually ES5-ify code that is to be executed by the Nashorn engine

Nashorn in JDK 8 only supports ES5.1.

* Update Rebuilt shared JS from `yarn build-shared`

* Move formatting foctory fns into an operator-indexed object

* Linter appeasement

* Test that all defined operators are supported in table formatting

* Flow annotations

* Return `null` in stead of `undefined`

Formatting/style changes snuck in.

* `yarn build-shared`

* Use operators from table formatting and not column filters

This creates a new shared javascript file in
`resources/frontend_shared` that will be used by the frontend and the
backend to drive the background color of cells using conditional
formatting features the frontend has.

This uses the JDK 8 included Nashorn javascript engine to eval and
invoke the functions in that shared file.