This pull request enhances the navigation for comparisons by implementing the following changes:
* Hides the comparison input behind the period picker, making the top bar less busy.
* Adds a key binding for the comparison input (assigned to x) alongside arrow navigation.
* Persists the selected comparison mode in Local Storage by domain, resulting in its persistence between refreshes.
This pull request adds support for multiple comparison modes, changes the comparison checkbox to a combobox, and implements the year over year comparison mode. The feature is still behind a feature flag.
Co-authored-by: Uku Taht <uku.taht@gmail.com>
* globally rename 'pages_per_visit' to 'views_per_visit'
* change the order of top stats
* rename 'Visits' to 'Total visits' in the UI
* add views_per_visit to UI
* put the new metric under a feature flag
* add new metric to CSV export under feature flag
* mix format
* use only one feature flag
* Use user-agent instead of screen_width to get device type
Co-authored-by: eriknakata <erik.nakata5@gmail.com>
* Fix credo
* Log on unhandled UAInspector device type
* Make 'browser' the default tab in devices report
* Remove device tooltip
* Remove screen_width from ingestion completely
* Remove browserstack harness, run playwright directly
* Select meta key based on OS platform
* Run CI tests in parallel
* Improve device match readability
* Add changelog
---------
Co-authored-by: eriknakata <erik.nakata5@gmail.com>
* Add visits metric and make it graphable
* include visits metric in csv export (visitors.csv)
* put visits under a feature flag (CSV export)
* feature flag for displaying visits on the dashboard
* fix formatting
* add visits metric to top stats (fix)
* fix imported_test to expect visits metric included
* fix formatting
* Revert "Fix graph element z-index (#2698)"
This reverts commit 35ab26308d.
* Revert "Fix interval selector z-index (#2696)"
This reverts commit c307057386.
* Set graph z-index to zero
* Add as={Fragment} to Transition component
Previously, the graph element was overlapping with other UI elements
such as the period input. This commit fixes this issue by setting the
z-index of the graph element to 0, which moves it behind other elements
in the stacking order.
* Refactor graph dataset building function
This commit refactors the graph dataset building functions into three
separate functions, one for each plot: main plot, comparison plot, and
dashed plot.
* Merge default graph dataset options
This commit moves default options from graph building functions to the
main function.
* Remove truncateToPresentIndex function
* Include dashed part when comparing periods
This commit fixes a bug where some period + interval combinations were
not working properly with comparisons. This is because `present_index`
is not available in every period, e.g. Last Month.
* Use HeadlessUI for search select box
* Remove downshift from package.json
* More consistent API for Combobox component
* Combine toFilterType and valueWithoutPrefix into a single function
* Rename MyCombobox -> PlausibleCombobox
* Update webpack-cli
* Disable cache for build
* Revert "Disable cache for build"
This reverts commit aa130541f8.
* Disable cache for build
* Update webpack dependencies
* Remove glob from webpack config
* Webpack is required by package.json
* Require autoprefixer in postcss config
* Revert build changes
* Fix styling for dark mode
* Position the graph component relatively
* lose graph container height flicker (resized canvas)
* rename variable
* prevent flicker in the loading process
* remove unused import
* disable cursor-pointer class for minute interval
* change var names and loading state conditions
* refactor showLoader condition
* fix UI bug with interval change
set `graphData` to `null` so that the component would fade out when
loader becomes visible. Before, the spinner was just displayed on top of
the graph.
* Add year to X axis of multi-year graph
* Remove hardcoded condition for rendering year string, render if multiple years present in graph view
* Apply new argument contract to dateFormatter usage in graph-util.js
* Better defensive runtime type guard when deriving hasMultipleYears
* Remove console log
* Remove unrelated JSDoc change
---------
Co-authored-by: Vini Brasil <vini@hey.com>
This commit adds support for comparing the actual showed period on the main graph with the previous one. This is a first pass and it's hidden under a feature flag because it's not feature complete yet as we want to support other comparison modes.
* Make Device section components aware of (not set)
So that no extra sub-filters are possible when the unset
top item is selected.
* Support '(not set)' in breakdown/filters
* Update expectations for export tests
* Add extra tests for returning/filtering by '(not set)'
* Add changelog entry
* Remove ListReport conditional render
* Prevent redundant sub-filters
* Fix filter text rendering
---------
Co-authored-by: Uku Taht <uku.taht@gmail.com>
* Remove the ability to collpase the top graph
This commit removes the ability to collapse the top graph. The graph
collapsed whenever `metric` was falsy. I removed all related code to
that. Metric now defaults to visitors.
We want to add new items to top stats, and this commit will make it
easier to change it. Also, there's currently a bug where top stats is
randomly collapsing, which should be fixed by this commit.
* Refactor graph and top stats loading state
The graph loading state shows and hides the graph conditionally
depending on whether the data is loaded, loading or refreshing.
The current code is a bit difficult to read because its big
conditionals. This commit refactors the loading state making it easier
to read.
This commit also fixes a bug where the graph wasn't fading out when
changing metrics.
* extract maybeUpdateMetric function
* reset graph metric after fetching top stats
* fix bug
Also make sure we do not allow 'metric' to become undefined anymore
* keep graph hidden when empty metric saved
* reset metric in setState callback
* pass function not call
* extract blinkingDot function
* position pulsating-circle with tailwind instead
* remove unused function
* extract renderStatName function
* display seconds since last realtime update
Adds a 'Last updated X seconds ago' label to the Current Visitors tooltip.
* small refactor: avoid duplication of this.props and this.state
* show the 'last updated ...' tooltip in historical
* changelog update
* use className utility function
* add a new realtime-update-timer module
* hook to the new 'tick' event in ListReport for auto-updates
This commit fixes the bug where all reports using the `ListReport` component did not
auto-update in realtime mode. Those reports are:
- Pages (Top / Entry / Exit)
- Locations (Countries / Regions / Cities)
- Devices (Screen Sizes / Browsers + versions / OS-s + versions)
* fetch data for ListReports only when scrolled into view
* refactor fetching data in ListReport
* refer to one source of truth for utm tags
* make the 'All' tab in Sources auto-update
* make all UTM tabs in Sources auto-update
* fetch UTM data only when scrolled into view
* auto-update Referrers with the new timer
* auto-update google search terms
* auto-update Conversions
* make countries map auto-update
* auto-update visitor-graph and top stats with new timer
* use new tick event for current visitors (in Historical)
* remove the old timer class
* update changelog
* Visual improvements to automatic realtime updates (#2532)
* minor consistency fix for text color in dark mode
* use FlipMove in goal conversions report
* use FlipMove in ListReports
* set main graph and top stats loading state correctly
* refactor isIntervalValid function
* enforce intervals are valid when set and stored
* remove duplicate data fetching on interval change
Fetching new data is handled by the `fetchGraphData` callback in `updateInterval`
* refactor updateMetric function
* make it clearer why 'metric' can be a faulty value
* extract 'query' and 'site' variables from 'this.props'
* reset interval state only when period is changed
The 'maybeRollbackInterval' function was also used to fetch data. This commit replaces
all those function calls with 'fetchGraphData' which better describes the actual behavior.
We should only worry about rolling back the interval if 'query.period' has changed.
This commit also stops the graph from flickering when it is updated in realtime.
* update names of two variables
* remove unnecessary negation
* make collapsed graph state more explicit
* consider stored invalid intervals when graph mounts
* fix not showing loading spinner regression
* remove interval state from VisitorGraph (#2540)
* Realtime prop breakdown (#2535)
* disable load more in realtime mode
* extract doFetch function
* separate fetchPropBreakdown and fetchNextPage functions
* subscribe for auto-updates in realtime
* improve readability with function name changes
* Remove show_noref behaviour
Removes query param show_noref which was used from React to control
whether to show Direct / None traffic or not. The show_noref behaviour
was untested previously.
Closes#2523
* Add changelog entry
* Fix tests
* Removed files I did not mean to check in :)
This commit lints JavaScript files, removes commented-out code, and
moves 3 constants to `graph-util.js`. This is part of the Intervals
work, in order to make the original pull request smaller and release
this feature incrementally.
Related: #1574
Co-authored-by: Vignesh Joglekar <hey@vigneshjoglekar.com>
* Make TestUtils module available in all tests
* Add macros patching the application env in tests
Unfortunately a lot of existing functionality relies on
certain application env setup. This isn't ideal because
the app config is a shared state that prevents us from
running the tests in parallel.
Those macros encapsulate setting up new env for test purposes
and make sure the changes are reverted when the test finishes.
* Allow passing request opts to HTTPClient.post/4
We need this to swap custom request building in
Google Analytics import.
* Unify errors when listing sites
* React: propagate backend error messages if available
* React: catch API errors in Search Terms component
* Propagate google API errors on referrer drilldown
* Handle verified properties errors in SC settings
* Add missing tests for SC settings controller
* Unify errors for fetching search analytics queries (list stats)
* Unify errors refreshing Google Auth Token
* Test fetch_stats/3 errors and replace Double with Mox
* Fixup makrup
* s/class/className
* Simplify Search Terms display in case of errors
* Fix warnings
* Overrides content-type for SVG favicons
* Organize favicon rendering
Make sure the placeholder icon is always requested from
/favicon/sources/placeholder
* Run prettier on site-switcher.js
* Yak Shave: upgrade Heroicons to 2.0
* Use HeroIcons instead of custom svg
* Update lib/plausible_web/plugs/favicon.ex
Co-authored-by: Adam Rutkowski <hq@mtod.org>
Co-authored-by: Adam Rutkowski <hq@mtod.org>
* Replace current tooltip with Popper.js
* Merge tooltip and title for top stats
* Format bounce rate and visit duration numbers in tooltip
* Add 'width=manual' mode for embed
* Add changelog entry
* Use helper function canMetricBeGraphed
This commit fixes a commit when the 24-hour clock was displayed like
`09 Uhr:00` or `06 h:00` for some locales. It keeps appending the `:00`
string but removes any non-numeric characters first.
