v1.39.2 (#1599)

* Fixed issue with realtime page rendering.

* fix auth, add pg extension (#1596)

* Fixed change password issue. API refactoring. Closes #1592.

* Fixed account lookup.

* Fixed issue with accessing user dashboards. Closes #1590

* fix sort on dashboard (#1600)

Co-authored-by: Brian Cao <brian@umami.is>

components/pages/Dashboard.js

@@ -1,6 +1,5 @@
 import { useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import { useRouter } from 'next/router';
 import Page from 'components/layout/Page';
 import PageHeader from 'components/layout/PageHeader';
 import WebsiteList from 'components/pages/WebsiteList';
@@ -16,10 +15,7 @@ const messages = defineMessages({
   more: { id: 'label.more', defaultMessage: 'More' },
 });
 
-export default function Dashboard() {
-  const router = useRouter();
-  const { id } = router.query;
-  const userId = id?.[0];
+export default function Dashboard({ userId }) {
   const dashboard = useDashboard();
   const { showCharts, limit, editing } = dashboard;
   const [max, setMax] = useState(limit);

components/pages/DashboardEdit.js

@@ -24,7 +24,7 @@ export default function DashboardEdit({ websites }) {
   const ordered = useMemo(
     () =>
       websites
-        .map(website => ({ ...website, order: order.indexOf(website.websiteId) }))
+        .map(website => ({ ...website, order: order.indexOf(website.websiteUuid) }))
         .sort(firstBy('order')),
     [websites, order],
   );
@@ -36,7 +36,7 @@ export default function DashboardEdit({ websites }) {
     const [removed] = orderedWebsites.splice(source.index, 1);
     orderedWebsites.splice(destination.index, 0, removed);
 
-    setOrder(orderedWebsites.map(website => website?.websiteId || 0));
+    setOrder(orderedWebsites.map(website => website?.websiteUuid || 0));
   }
 
   function handleSave() {
@@ -76,8 +76,12 @@ export default function DashboardEdit({ websites }) {
                 ref={provided.innerRef}
                 style={{ marginBottom: snapshot.isDraggingOver ? 260 : null }}
               >
-                {ordered.map(({ websiteId, name, domain }, index) => (
-                  <Draggable key={websiteId} draggableId={`${dragId}-${websiteId}`} index={index}>
+                {ordered.map(({ websiteUuid, name, domain }, index) => (
+                  <Draggable
+                    key={websiteUuid}
+                    draggableId={`${dragId}-${websiteUuid}`}
+                    index={index}
+                  >
                     {(provided, snapshot) => (
                       <div
                         ref={provided.innerRef}

components/pages/RealtimeDashboard.js

@@ -32,7 +32,7 @@ export default function RealtimeDashboard() {
   const { locale } = useLocale();
   const countryNames = useCountryNames(locale);
   const [data, setData] = useState();
-  const [websiteId, setWebsiteId] = useState(0);
+  const [websiteUuid, setWebsiteUuid] = useState(null);
   const { data: init, loading } = useFetch('/realtime/init');
   const { data: updates } = useFetch('/realtime/update', {
     params: { start_at: data?.timestamp },
@@ -50,17 +50,18 @@ export default function RealtimeDashboard() {
     if (data) {
       const { pageviews, sessions, events } = data;
 
-      if (websiteId) {
+      if (websiteUuid) {
+        const { id } = init.websites.find(n => n.websiteUuid === websiteUuid);
         return {
-          pageviews: filterWebsite(pageviews, websiteId),
-          sessions: filterWebsite(sessions, websiteId),
-          events: filterWebsite(events, websiteId),
+          pageviews: filterWebsite(pageviews, id),
+          sessions: filterWebsite(sessions, id),
+          events: filterWebsite(events, id),
         };
       }
     }
 
     return data;
-  }, [data, websiteId]);
+  }, [data, websiteUuid]);
 
   const countries = useMemo(() => {
     if (realtimeData?.sessions) {
@@ -117,25 +118,20 @@ export default function RealtimeDashboard() {
     <Page>
       <RealtimeHeader
         websites={websites}
-        websiteId={websiteId}
+        websiteId={websiteUuid}
         data={{ ...realtimeData, countries }}
-        onSelect={setWebsiteId}
+        onSelect={setWebsiteUuid}
       />
       <div className={styles.chart}>
-        <RealtimeChart
-          websiteId={websiteId}
-          data={realtimeData}
-          unit="minute"
-          records={REALTIME_RANGE}
-        />
+        <RealtimeChart data={realtimeData} unit="minute" records={REALTIME_RANGE} />
       </div>
       <GridLayout>
         <GridRow>
           <GridColumn xs={12} lg={4}>
-            <RealtimeViews websiteId={websiteId} data={realtimeData} websites={websites} />
+            <RealtimeViews websiteId={websiteUuid} data={realtimeData} websites={websites} />
           </GridColumn>
           <GridColumn xs={12} lg={8}>
-            <RealtimeLog websiteId={websiteId} data={realtimeData} websites={websites} />
+            <RealtimeLog websiteId={websiteUuid} data={realtimeData} websites={websites} />
           </GridColumn>
         </GridRow>
         <GridRow>