Fixed font.

components/metrics/PagesTable.js

@@ -3,6 +3,7 @@ import FilterButtons from 'components/common/FilterButtons';
 import MetricsTable from './MetricsTable';
 import useMessages from 'hooks/useMessages';
 import usePageQuery from 'hooks/usePageQuery';
+import { emptyFilter } from '../../lib/filters';
 
 export default function PagesTable({ websiteId, showFilters, ...props }) {
   const {
@@ -28,7 +29,7 @@ export default function PagesTable({ websiteId, showFilters, ...props }) {
   ];
 
   const renderLink = ({ x }) => {
-    return <FilterLink id={view} value={x || formatMessage(labels.none)} />;
+    return <FilterLink id={view} value={x} label={!x && formatMessage(labels.none)} />;
   };
 
   return (
@@ -40,6 +41,7 @@ export default function PagesTable({ websiteId, showFilters, ...props }) {
         type={view}
         metric={formatMessage(labels.views)}
         websiteId={websiteId}
+        dataFilter={emptyFilter}
         renderLabel={renderLink}
       />
     </>

components/metrics/QueryParametersTable.js

@@ -1,14 +1,14 @@
 import { useState } from 'react';
 import { safeDecodeURI } from 'next-basics';
 import FilterButtons from 'components/common/FilterButtons';
-import { paramFilter } from 'lib/filters';
+import { emptyFilter, paramFilter } from 'lib/filters';
 import { FILTER_RAW, FILTER_COMBINED } from 'lib/constants';
 import MetricsTable from './MetricsTable';
 import useMessages from 'hooks/useMessages';
 import styles from './QueryParametersTable.module.css';
 
 const filters = {
-  [FILTER_RAW]: null,
+  [FILTER_RAW]: emptyFilter,
   [FILTER_COMBINED]: paramFilter,
 };
 

components/metrics/QueryParametersTable.module.css

@@ -1,7 +1,7 @@
 .item {
   display: inline-flex;
   align-items: center;
-  margin-bottom: 1px;
+  line-height: 26px;
 }
 
 .param {

lib/filters.js

@@ -42,6 +42,10 @@ export const refFilter = data => {
   return Object.keys(map).map(key => ({ x: key, y: map[key], w: links[key] }));
 };
 
+export const emptyFilter = data => {
+  return data.map(item => (item.x ? item : null)).filter(n => n);
+};
+
 export const percentFilter = data => {
   const total = data.reduce((n, { y }) => n + y, 0);
   return data.map(({ x, y, ...props }) => ({ x, y, z: total ? (y / total) * 100 : 0, ...props }));

pages/_app.js

@@ -53,10 +53,13 @@ export default function App({ Component, pageProps }) {
           <meta name="theme-color" content="#fafafa" media="(prefers-color-scheme: light)" />
           <meta name="theme-color" content="#2f2f2f" media="(prefers-color-scheme: dark)" />
           <meta name="viewport" content="width=device-width, initial-scale=1" />
+          <style>{`
+            html {
+              font-family: ${inter.style.fontFamily};
+            }
+          `}</style>
         </Head>
-        <div className={inter.className}>
-          <Component {...pageProps} />
-        </div>
+        <Component {...pageProps} />
         {!pathname.includes('/share/') && <Script src={`${basePath}/telemetry.js`} />}
       </IntlProvider>
     </QueryClientProvider>

queries/analytics/pageview/getPageviewMetrics.ts

@@ -1,7 +1,7 @@
 import prisma from 'lib/prisma';
 import clickhouse from 'lib/clickhouse';
 import { runQuery, CLICKHOUSE, PRISMA } from 'lib/db';
-import { EVENT_TYPE, FILTER_COLUMNS } from 'lib/constants';
+import { EVENT_TYPE } from 'lib/constants';
 import { loadWebsite } from 'lib/query';
 
 export async function getPageviewMetrics(
@@ -42,10 +42,10 @@ async function relationalQuery(
     column === 'event_name' ? EVENT_TYPE.customEvent : EVENT_TYPE.pageView,
   ];
 
-  let domainFilter = '';
+  let excludeDomain = '';
 
   if (column === 'referrer_domain') {
-    domainFilter = 'and website_event.referrer_domain != $6';
+    excludeDomain = 'and website_event.referrer_domain != $6';
     params.push(website.domain);
   }
 
@@ -59,7 +59,7 @@ async function relationalQuery(
       and website_event.created_at >= $2
       and website_event.created_at between $3 and $4
       and event_type = $5
-      ${domainFilter}
+      ${excludeDomain}
       ${filterQuery}
     group by 1
     order by 2 desc