Add percentages to top pages, entry pages, and exit pages reports

Author: sanne-san

assets/js/dashboard/stats/pages/index.js

@@ -37,7 +37,10 @@ function EntryPages({ afterFetchData }) {
         width: 'w-36',
         meta: { plot: true }
       }),
-      hasConversionGoalFilter(query) && metrics.createConversionRate()
+      !hasConversionGoalFilter(query) &&
+        metrics.createPercentage({ meta: { showOnHover: true } }),
+      hasConversionGoalFilter(query) &&
+        metrics.createConversionRate({ meta: { showOnHover: true } })
     ].filter((metric) => !!metric)
   }
 
@@ -83,7 +86,10 @@ function ExitPages({ afterFetchData }) {
         width: 'w-36',
         meta: { plot: true }
       }),
-      hasConversionGoalFilter(query) && metrics.createConversionRate()
+      !hasConversionGoalFilter(query) &&
+        metrics.createPercentage({ meta: { showOnHover: true } }),
+      hasConversionGoalFilter(query) &&
+        metrics.createConversionRate({ meta: { showOnHover: true } })
     ].filter((metric) => !!metric)
   }
 
@@ -125,7 +131,10 @@ function TopPages({ afterFetchData }) {
   function chooseMetrics() {
     return [
       metrics.createVisitors({ meta: { plot: true } }),
-      hasConversionGoalFilter(query) && metrics.createConversionRate()
+      !hasConversionGoalFilter(query) &&
+        metrics.createPercentage({ meta: { showOnHover: true } }),
+      hasConversionGoalFilter(query) &&
+        metrics.createConversionRate({ meta: { showOnHover: true } })
     ].filter((metric) => !!metric)
   }
 
@@ -187,7 +196,7 @@ export default function Pages() {
   }
 
   return (
-    <div>
+    <div className="group/report overflow-x-hidden">
       {/* Header Container */}
       <div className="w-full flex justify-between">
         <div className="flex gap-x-1">

lib/plausible_web/controllers/api/stats_controller.ex

@@ -908,9 +908,9 @@ defmodule PlausibleWeb.Api.StatsController do
 
     extra_metrics =
       if params["detailed"] do
-        [:pageviews, :bounce_rate, :time_on_page, :scroll_depth]
+        [:percentage, :pageviews, :bounce_rate, :time_on_page, :scroll_depth]
       else
-        []
+        [:percentage]
       end
 
     metrics =
@@ -953,7 +953,7 @@ defmodule PlausibleWeb.Api.StatsController do
 
     metrics =
       breakdown_metrics(query,
-        extra_metrics: [:visits, :visit_duration, :bounce_rate],
+        extra_metrics: [:percentage, :visits, :visit_duration, :bounce_rate],
         include_revenue?: !!params["detailed"]
       )
 
@@ -996,9 +996,9 @@ defmodule PlausibleWeb.Api.StatsController do
 
     extra_metrics =
       if TableDecider.sessions_join_events?(query) do
-        [:visits]
+        [:percentage, :visits]
       else
-        [:visits, :exit_rate]
+        [:percentage, :visits, :exit_rate]
       end
 
     metrics =