Rename ref to prevent collision with react elements

It seems that, at least in dev mode, 'ref' may incorrectly refer to
react elements.

Signed-off-by: Kevin Decherf <kevin@kdecherf.com>

components/metrics/ReferrersTable.js

@@ -19,7 +19,7 @@ export default function ReferrersTable({ websiteId, websiteDomain, showFilters,
   const [filter, setFilter] = useState(FILTER_COMBINED);
   const {
     resolve,
-    query: { ref: currentRef },
+    query: { referrer: currentRef },
   } = usePageQuery();
 
   const buttons = [
@@ -37,7 +37,7 @@ export default function ReferrersTable({ websiteId, websiteDomain, showFilters,
   const renderLink = ({ w: link, x: label }) => {
     return (
       <div className={styles.row}>
-        <Link href={resolve({ ref: label })} replace={true}>
+        <Link href={resolve({ referrer: label })} replace={true}>
           <a
             className={classNames(styles.label, {
               [styles.inactive]: currentRef && label !== currentRef,

components/metrics/WebsiteChart.js

@@ -33,7 +33,7 @@ export default function WebsiteChart({
   const {
     router,
     resolve,
-    query: { url, ref },
+    query: { url, referrer },
   } = usePageQuery();
   const { get } = useApi();
 
@@ -46,12 +46,12 @@ export default function WebsiteChart({
         unit,
         tz: timezone,
         url,
-        ref,
+        referrer,
       },
       onDataLoad,
       headers: { [TOKEN_HEADER]: shareToken?.token },
     },
-    [modified, url, ref],
+    [modified, url, referrer],
   );
 
   const chartData = useMemo(() => {
@@ -88,7 +88,7 @@ export default function WebsiteChart({
           stickyClassName={styles.sticky}
           enabled={stickyHeader}
         >
-          <FilterTags params={{ url, ref }} onClick={handleCloseFilter} />
+          <FilterTags params={{ url, referrer }} onClick={handleCloseFilter} />
           <div className="col-12 col-lg-9">
             <MetricsBar websiteId={websiteId} />
           </div>