Change dashboard copy from title case to sentence case

sanne-san · sanne-san · commit e892bea34347 · 2025-12-03T11:32:47.000+01:00
diff --git a/assets/js/dashboard/stats/behaviours/index.js b/assets/js/dashboard/stats/behaviours/index.js
@@ -31,8 +31,8 @@ export const PROPS = 'props'
 export const FUNNELS = 'funnels'
 
 export const sectionTitles = {
-  [CONVERSIONS]: 'Goal Conversions',
-  [PROPS]: 'Custom Properties',
+  [CONVERSIONS]: 'Goal conversions',
+  [PROPS]: 'Custom properties',
   [FUNNELS]: 'Funnels'
 }
 
diff --git a/assets/js/dashboard/stats/graph/graph-util.js b/assets/js/dashboard/stats/graph/graph-util.js
@@ -1,17 +1,17 @@
 export const METRIC_LABELS = {
   visitors: 'Visitors',
   pageviews: 'Pageviews',
-  events: 'Total Conversions',
-  views_per_visit: 'Views per Visit',
+  events: 'Total conversions',
+  views_per_visit: 'Views per visit',
   visits: 'Visits',
-  bounce_rate: 'Bounce Rate',
-  visit_duration: 'Visit Duration',
-  conversions: 'Converted Visitors',
-  conversion_rate: 'Conversion Rate',
-  average_revenue: 'Average Revenue',
-  total_revenue: 'Total Revenue',
-  scroll_depth: 'Scroll Depth',
-  time_on_page: 'Time on Page'
+  bounce_rate: 'Bounce rate',
+  visit_duration: 'Visit duration',
+  conversions: 'Converted visitors',
+  conversion_rate: 'Conversion rate',
+  average_revenue: 'Average revenue',
+  total_revenue: 'Total revenue',
+  scroll_depth: 'Scroll depth',
+  time_on_page: 'Time on page'
 }
 
 function plottable(dataArray) {
diff --git a/assets/js/dashboard/stats/modals/breakdown-table.tsx b/assets/js/dashboard/stats/modals/breakdown-table.tsx
@@ -54,7 +54,7 @@ export const BreakdownTable = <TListItem extends { name: string }>({
           />
         )}
       </div>
-      <div className="my-4 border-b border-gray-300 dark:border-gray-700"></div>
+      <div className="my-4 border-b border-gray-250 dark:border-gray-700"></div>
       <div style={{ minHeight: `${MIN_HEIGHT_PX}px` }}>
         {displayError && status === 'error' && <ErrorMessage error={error} />}
         {isPending && <InitialLoadingSpinner />}
diff --git a/assets/js/dashboard/stats/modals/conversions.js b/assets/js/dashboard/stats/modals/conversions.js
@@ -13,7 +13,7 @@ function ConversionsModal() {
   const site = useSiteContext()
 
   const reportInfo = {
-    title: 'Goal Conversions',
+    title: 'Goal conversions',
     dimension: 'goal',
     endpoint: url.apiPath(site, '/conversions'),
     dimensionLabel: 'Goal'
diff --git a/assets/js/dashboard/stats/modals/entry-pages.js b/assets/js/dashboard/stats/modals/entry-pages.js
@@ -20,7 +20,7 @@ function EntryPagesModal() {
   const showRevenueMetrics = BUILD_EXTRA && revenueAvailable(query, site)
 
   const reportInfo = {
-    title: 'Entry Pages',
+    title: 'Entry pages',
     dimension: 'entry_page',
     endpoint: url.apiPath(site, '/entry-pages'),
     dimensionLabel: 'Entry page',
diff --git a/assets/js/dashboard/stats/modals/exit-pages.js b/assets/js/dashboard/stats/modals/exit-pages.js
@@ -17,7 +17,7 @@ function ExitPagesModal() {
   const showRevenueMetrics = BUILD_EXTRA && revenueAvailable(query, site)
 
   const reportInfo = {
-    title: 'Exit Pages',
+    title: 'Exit pages',
     dimension: 'exit_page',
     endpoint: url.apiPath(site, '/exit-pages'),
     dimensionLabel: 'Page url',
diff --git a/assets/js/dashboard/stats/modals/pages.js b/assets/js/dashboard/stats/modals/pages.js
@@ -20,7 +20,7 @@ function PagesModal() {
   const showRevenueMetrics = BUILD_EXTRA && revenueAvailable(query, site)
 
   const reportInfo = {
-    title: 'Top Pages',
+    title: 'Top pages',
     dimension: 'page',
     endpoint: url.apiPath(site, '/pages'),
     dimensionLabel: 'Page url',
diff --git a/assets/js/dashboard/stats/modals/props.js b/assets/js/dashboard/stats/modals/props.js
@@ -21,7 +21,7 @@ function PropsModal() {
   const showRevenueMetrics = BUILD_EXTRA && revenueAvailable(query, site)
 
   const reportInfo = {
-    title: specialTitleWhenGoalFilter(query, 'Custom Property Breakdown'),
+    title: specialTitleWhenGoalFilter(query, 'Custom property breakdown'),
     dimension: propKey,
     endpoint: url.apiPath(
       site,
diff --git a/assets/js/dashboard/stats/modals/sources.js b/assets/js/dashboard/stats/modals/sources.js
@@ -16,7 +16,7 @@ import { SourceFavicon } from '../sources/source-favicon'
 const VIEWS = {
   sources: {
     info: {
-      title: 'Top Sources',
+      title: 'Top sources',
       dimension: 'source',
       endpoint: '/sources',
       dimensionLabel: 'Source',
@@ -33,7 +33,7 @@ const VIEWS = {
   },
   channels: {
     info: {
-      title: 'Top Acquisition Channels',
+      title: 'Top acquisition channels',
       dimension: 'channel',
       endpoint: '/channels',
       dimensionLabel: 'Channel',
@@ -42,46 +42,46 @@ const VIEWS = {
   },
   utm_mediums: {
     info: {
-      title: 'Top UTM Mediums',
+      title: 'Top UTM mediums',
       dimension: 'utm_medium',
       endpoint: '/utm_mediums',
-      dimensionLabel: 'UTM Medium',
+      dimensionLabel: 'UTM medium',
       defaultOrder: ['visitors', SortDirection.desc]
     }
   },
   utm_sources: {
     info: {
-      title: 'Top UTM Sources',
+      title: 'Top UTM sources',
       dimension: 'utm_source',
       endpoint: '/utm_sources',
-      dimensionLabel: 'UTM Source',
+      dimensionLabel: 'UTM source',
       defaultOrder: ['visitors', SortDirection.desc]
     }
   },
   utm_campaigns: {
     info: {
-      title: 'Top UTM Campaigns',
+      title: 'Top UTM campaigns',
       dimension: 'utm_campaign',
       endpoint: '/utm_campaigns',
-      dimensionLabel: 'UTM Campaign',
+      dimensionLabel: 'UTM campaign',
       defaultOrder: ['visitors', SortDirection.desc]
     }
   },
   utm_contents: {
     info: {
-      title: 'Top UTM Contents',
+      title: 'Top UTM contents',
       dimension: 'utm_content',
       endpoint: '/utm_contents',
-      dimensionLabel: 'UTM Content',
+      dimensionLabel: 'UTM content',
       defaultOrder: ['visitors', SortDirection.desc]
     }
   },
   utm_terms: {
     info: {
-      title: 'Top UTM Terms',
+      title: 'Top UTM terms',
       dimension: 'utm_term',
       endpoint: '/utm_terms',
-      dimensionLabel: 'UTM Term',
+      dimensionLabel: 'UTM term',
       defaultOrder: ['visitors', SortDirection.desc]
     }
   }
diff --git a/assets/js/dashboard/stats/pages/index.js b/assets/js/dashboard/stats/pages/index.js
@@ -33,7 +33,7 @@ function EntryPages({ afterFetchData }) {
   function chooseMetrics() {
     return [
       metrics.createVisitors({
-        defaultLabel: 'Unique Entrances',
+        defaultLabel: 'Unique entrances',
         width: 'w-36',
         meta: { plot: true }
       }),
@@ -82,7 +82,7 @@ function ExitPages({ afterFetchData }) {
   function chooseMetrics() {
     return [
       metrics.createVisitors({
-        defaultLabel: 'Unique Exits',
+        defaultLabel: 'Unique exits',
         width: 'w-36',
         meta: { plot: true }
       }),
@@ -156,9 +156,9 @@ function TopPages({ afterFetchData }) {
 }
 
 const labelFor = {
-  pages: 'Top Pages',
-  'entry-pages': 'Entry Pages',
-  'exit-pages': 'Exit Pages'
+  pages: 'Top pages',
+  'entry-pages': 'Entry pages',
+  'exit-pages': 'Exit pages'
 }
 
 export default function Pages() {
@@ -210,9 +210,9 @@ export default function Pages() {
         </div>
         <TabWrapper>
           {[
-            { label: 'Top Pages', value: 'pages' },
-            { label: 'Entry Pages', value: 'entry-pages' },
-            { label: 'Exit Pages', value: 'exit-pages' }
+            { label: 'Top pages', value: 'pages' },
+            { label: 'Entry pages', value: 'entry-pages' },
+            { label: 'Exit pages', value: 'exit-pages' }
           ].map(({ value, label }) => (
             <TabButton
               active={mode === value}
diff --git a/assets/js/dashboard/stats/reports/change-arrow.test.tsx b/assets/js/dashboard/stats/reports/change-arrow.test.tsx
@@ -34,7 +34,7 @@ it('renders tilde for no change', () => {
 
   const arrowElement = screen.getByTestId('change-arrow')
 
-  expect(arrowElement).toHaveTextContent('〰 0%')
+  expect(arrowElement).toHaveTextContent('0%')
 })
 
 it('inverts colors for positive bounce_rate change', () => {
diff --git a/assets/js/dashboard/stats/reports/metrics.js b/assets/js/dashboard/stats/reports/metrics.js
@@ -147,7 +147,7 @@ export const createAverageRevenue = (props) => {
 }
 
 export const createTotalVisitors = (props) => {
-  const renderLabel = (_query) => 'Total Visitors'
+  const renderLabel = (_query) => 'Total visitors'
   return new Metric({
     width: 'w-28',
     ...props,
@@ -162,7 +162,7 @@ export const createVisits = (props) => {
 }
 
 export const createVisitDuration = (props) => {
-  const renderLabel = (_query) => 'Visit Duration'
+  const renderLabel = (_query) => 'Visit duration'
   return new Metric({
     width: 'w-36',
     ...props,
@@ -173,7 +173,7 @@ export const createVisitDuration = (props) => {
 }
 
 export const createBounceRate = (props) => {
-  const renderLabel = (_query) => 'Bounce Rate'
+  const renderLabel = (_query) => 'Bounce rate'
   return new Metric({
     width: 'w-28',
     ...props,
@@ -195,7 +195,7 @@ export const createPageviews = (props) => {
 }
 
 export const createTimeOnPage = (props) => {
-  const renderLabel = (_query) => 'Time on Page'
+  const renderLabel = (_query) => 'Time on page'
   return new Metric({
     width: 'w-32',
     ...props,
@@ -206,7 +206,7 @@ export const createTimeOnPage = (props) => {
 }
 
 export const createExitRate = (props) => {
-  const renderLabel = (_query) => 'Exit Rate'
+  const renderLabel = (_query) => 'Exit rate'
   return new Metric({
     width: 'w-28',
     ...props,
@@ -217,7 +217,7 @@ export const createExitRate = (props) => {
 }
 
 export const createScrollDepth = (props) => {
-  const renderLabel = (_query) => 'Scroll Depth'
+  const renderLabel = (_query) => 'Scroll depth'
   return new Metric({
     width: 'w-28',
     ...props,
diff --git a/assets/js/dashboard/stats/sources/source-list.js b/assets/js/dashboard/stats/sources/source-list.js
@@ -27,26 +27,26 @@ import { DropdownTabButton, TabButton, TabWrapper } from '../../components/tabs'
 
 const UTM_TAGS = {
   utm_medium: {
-    title: 'UTM Mediums',
+    title: 'UTM mediums',
     label: 'Medium',
     endpoint: '/utm_mediums'
   },
   utm_source: {
-    title: 'UTM Sources',
+    title: 'UTM sources',
     label: 'Source',
     endpoint: '/utm_sources'
   },
   utm_campaign: {
-    title: 'UTM Campaigns',
+    title: 'UTM campaigns',
     label: 'Campaign',
     endpoint: '/utm_campaigns'
   },
   utm_content: {
-    title: 'UTM Contents',
+    title: 'UTM contents',
     label: 'Content',
     endpoint: '/utm_contents'
   },
-  utm_term: { title: 'UTM Terms', label: 'Term', endpoint: '/utm_terms' }
+  utm_term: { title: 'UTM terms', label: 'Term', endpoint: '/utm_terms' }
 }
 
 function AllSources({ afterFetchData }) {
@@ -181,8 +181,8 @@ function UTMSources({ tab, afterFetchData }) {
 }
 
 const labelFor = {
-  channels: 'Top Channels',
-  all: 'Top Sources'
+  channels: 'Top channels',
+  all: 'Top sources'
 }
 
 for (const [key, utm_tag] of Object.entries(UTM_TAGS)) {
diff --git a/assets/js/dashboard/util/filters.js b/assets/js/dashboard/util/filters.js
@@ -291,23 +291,23 @@ export const formattedFilters = {
   prop_value: 'Value',
   source: 'Source',
   channel: 'Channel',
-  utm_medium: 'UTM Medium',
-  utm_source: 'UTM Source',
-  utm_campaign: 'UTM Campaign',
-  utm_content: 'UTM Content',
-  utm_term: 'UTM Term',
+  utm_medium: 'UTM medium',
+  utm_source: 'UTM source',
+  utm_campaign: 'UTM campaign',
+  utm_content: 'UTM content',
+  utm_term: 'UTM term',
   referrer: 'Referrer URL',
   screen: 'Screen size',
   browser: 'Browser',
-  browser_version: 'Browser Version',
-  os: 'Operating System',
-  os_version: 'Operating System Version',
+  browser_version: 'Browser version',
+  os: 'Operating system',
+  os_version: 'Operating system version',
   country: 'Country',
   region: 'Region',
   city: 'City',
   page: 'Page',
   hostname: 'Hostname',
-  entry_page: 'Entry Page',
-  exit_page: 'Exit Page',
+  entry_page: 'Entry page',
+  exit_page: 'Exit page',
   segment: 'Segment'
 }
diff --git a/assets/js/dashboard/util/tooltip.tsx b/assets/js/dashboard/util/tooltip.tsx
@@ -91,7 +91,7 @@ function TooltipMessage({
       ref={setPopperElement}
       style={popperStyle}
       {...popperAttributes}
-      className="z-50 px-2 py-1 rounded-sm text-sm text-gray-100 font-medium bg-gray-800 dark:bg-gray-700"
+      className="z-[999] px-2 py-1 rounded-sm text-sm text-gray-100 font-medium bg-gray-800 dark:bg-gray-700"
       role="tooltip"
     >
       {children}

Original file line number	Diff line number	Diff line change
`@@ -31,8 +31,8 @@ export const PROPS = 'props'`
`31`	`31`	`export const FUNNELS = 'funnels'`
`32`	`32`
`33`	`33`	`export const sectionTitles = {`
`34`		`- [CONVERSIONS]: 'Goal Conversions',`
`35`		`- [PROPS]: 'Custom Properties',`
	`34`	`+ [CONVERSIONS]: 'Goal conversions',`
	`35`	`+ [PROPS]: 'Custom properties',`
`36`	`36`	`[FUNNELS]: 'Funnels'`
`37`	`37`	`}`
`38`	`38`