From 5a22be5efa28b3f152b9e06ab3786ee8557dc971 Mon Sep 17 00:00:00 2001
From: Mike Cao <mike@mikecao.com>
Date: Thu, 10 Sep 2020 23:55:29 -0700
Subject: [PATCH] Allow admins to view account websites.

---
 assets/list-ul.svg                             |  1 +
 components/WebsiteDetails.js                   |  1 +
 components/WebsiteList.js                      |  4 ++--
 components/metrics/BarChart.js                 |  6 ------
 components/settings/AccountSettings.js         | 17 ++++++++++++++---
 lang/de-DE.json                                |  3 +++
 lang/en.json                                   |  6 ++++++
 lang/nl-NL.json                                |  3 +++
 lang/ru-RU.json                                |  3 +++
 lang/tr-TR.json                                |  3 +++
 lang/zh-CN.json                                |  3 +++
 package.json                                   |  2 +-
 pages/404.js                                   |  5 ++++-
 pages/account.js                               | 18 ------------------
 pages/api/{account.js => account/index.js}     |  0
 pages/api/website/{[id]/index.js => [id].js}   |  0
 pages/api/{website.js => website/index.js}     |  0
 pages/api/websites.js                          | 11 ++++++++---
 pages/{dashboard.js => dashboard/[[...id]].js} |  6 +++++-
 19 files changed, 57 insertions(+), 35 deletions(-)
 create mode 100644 assets/list-ul.svg
 delete mode 100644 pages/account.js
 rename pages/api/{account.js => account/index.js} (100%)
 rename pages/api/website/{[id]/index.js => [id].js} (100%)
 rename pages/api/{website.js => website/index.js} (100%)
 rename pages/{dashboard.js => dashboard/[[...id]].js} (67%)

diff --git a/assets/list-ul.svg b/assets/list-ul.svg
new file mode 100644
index 00000000..5e632126
--- /dev/null
+++ b/assets/list-ul.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M48 368a48 48 0 1 0 48 48 48 48 0 0 0-48-48zm0-160a48 48 0 1 0 48 48 48 48 0 0 0-48-48zm0-160a48 48 0 1 0 48 48 48 48 0 0 0-48-48zm448 24H176a16 16 0 0 0-16 16v16a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16V88a16 16 0 0 0-16-16zm0 160H176a16 16 0 0 0-16 16v16a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-16a16 16 0 0 0-16-16zm0 160H176a16 16 0 0 0-16 16v16a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-16a16 16 0 0 0-16-16z"/></svg>
\ No newline at end of file
diff --git a/components/WebsiteDetails.js b/components/WebsiteDetails.js
index 91217d78..3ff87de9 100644
--- a/components/WebsiteDetails.js
+++ b/components/WebsiteDetails.js
@@ -28,6 +28,7 @@ export default function WebsiteDetails({ websiteId }) {
 
   const BackButton = () => (
     <Button
+      key="back-button"
       className={styles.backButton}
       icon={<Arrow />}
       size="xsmall"
diff --git a/components/WebsiteList.js b/components/WebsiteList.js
index f2a8c3db..051d523a 100644
--- a/components/WebsiteList.js
+++ b/components/WebsiteList.js
@@ -9,9 +9,9 @@ import useFetch from 'hooks/useFetch';
 import Arrow from 'assets/arrow-right.svg';
 import styles from './WebsiteList.module.css';
 
-export default function WebsiteList() {
+export default function WebsiteList({ userId }) {
   const router = useRouter();
-  const { data } = useFetch('/api/websites');
+  const { data } = useFetch('/api/websites', { userId });
 
   if (!data) {
     return null;
diff --git a/components/metrics/BarChart.js b/components/metrics/BarChart.js
index ccbd23af..96eeaf37 100644
--- a/components/metrics/BarChart.js
+++ b/components/metrics/BarChart.js
@@ -64,12 +64,6 @@ export default function BarChart({
     } else {
       const [label, value] = body[0].lines[0].split(':');
 
-      console.log(
-        +title[0],
-        new Date(+title[0]),
-        dateFormat(new Date(+title[0]), 'EEE MMMM d yyyy', locale),
-      );
-
       setTooltip({
         title: dateFormat(new Date(+title[0]), 'EEE MMMM d yyyy', locale),
         value,
diff --git a/components/settings/AccountSettings.js b/components/settings/AccountSettings.js
index 355348ca..21ca04f5 100644
--- a/components/settings/AccountSettings.js
+++ b/components/settings/AccountSettings.js
@@ -1,10 +1,13 @@
 import React, { useState } from 'react';
+import { FormattedMessage } from 'react-intl';
+import { useRouter } from 'next/router';
 import classNames from 'classnames';
 import PageHeader from 'components/layout/PageHeader';
 import Button from 'components/common/Button';
 import Icon from 'components/common/Icon';
 import Table from 'components/common/Table';
 import Modal from 'components/common/Modal';
+import Toast from 'components/common/Toast';
 import AccountEditForm from 'components/forms/AccountEditForm';
 import ButtonLayout from 'components/layout/ButtonLayout';
 import DeleteForm from 'components/forms/DeleteForm';
@@ -13,11 +16,11 @@ import Pen from 'assets/pen.svg';
 import Plus from 'assets/plus.svg';
 import Trash from 'assets/trash.svg';
 import Check from 'assets/check.svg';
+import List from 'assets/list-ul.svg';
 import styles from './AccountSettings.module.css';
-import Toast from '../common/Toast';
-import { FormattedMessage } from 'react-intl';
 
 export default function AccountSettings() {
+  const router = useRouter();
   const [addAccount, setAddAccount] = useState();
   const [editAccount, setEditAccount] = useState();
   const [deleteAccount, setDeleteAccount] = useState();
@@ -30,6 +33,13 @@ export default function AccountSettings() {
   const Buttons = row =>
     row.username !== 'admin' ? (
       <ButtonLayout>
+        <Button
+          icon={<List />}
+          size="small"
+          tooltip={<FormattedMessage id="button.websites" defaultMessage="Websites" />}
+          tooltipId={`button-websites-${row.username}`}
+          onClick={() => router.push(`/dashboard/${row.user_id}/${row.username}`)}
+        />
         <Button icon={<Pen />} size="small" onClick={() => setEditAccount(row)}>
           <div>
             <FormattedMessage id="button.edit" defaultMessage="Edit" />
@@ -51,11 +61,12 @@ export default function AccountSettings() {
     },
     {
       key: 'is_admin',
-      label: <FormattedMessage id="label.adminsitrator" defaultMessage="Administrator" />,
+      label: <FormattedMessage id="label.administrator" defaultMessage="Administrator" />,
       className: 'col-6 col-md-4',
       render: Checkmark,
     },
     {
+      key: 'actions',
       className: classNames(styles.buttons, 'col-12 col-md-4 pt-2 pt-md-0'),
       render: Buttons,
     },
diff --git a/lang/de-DE.json b/lang/de-DE.json
index e0186442..cf801de0 100644
--- a/lang/de-DE.json
+++ b/lang/de-DE.json
@@ -38,6 +38,9 @@
   "button.view-details": {
     "defaultMessage": "Details anzeigen"
   },
+  "button.websites": {
+    "defaultMessage": "Webseiten"
+  },
   "footer.powered-by": {
     "defaultMessage": "Powered by"
   },
diff --git a/lang/en.json b/lang/en.json
index bcc7bcb4..8c4f31cb 100644
--- a/lang/en.json
+++ b/lang/en.json
@@ -38,6 +38,9 @@
   "button.view-details": {
     "defaultMessage": "View details"
   },
+  "button.websites": {
+    "defaultMessage": "Websites"
+  },
   "footer.powered-by": {
     "defaultMessage": "Powered by"
   },
@@ -128,6 +131,9 @@
   "message.no-data-available": {
     "defaultMessage": "No data available."
   },
+  "message.page-not-found": {
+    "defaultMessage": "Page not found"
+  },
   "message.save-success": {
     "defaultMessage": "Saved successfully."
   },
diff --git a/lang/nl-NL.json b/lang/nl-NL.json
index 8353e938..9f7e1914 100644
--- a/lang/nl-NL.json
+++ b/lang/nl-NL.json
@@ -38,6 +38,9 @@
   "button.view-details": {
     "defaultMessage": "Meer details"
   },
+  "button.websites": {
+    "defaultMessage": "Websites"
+  },
   "footer.powered-by": {
     "defaultMessage": "mogelijk gemaakt door"
   },
diff --git a/lang/ru-RU.json b/lang/ru-RU.json
index 6b5cb77a..6d59098f 100644
--- a/lang/ru-RU.json
+++ b/lang/ru-RU.json
@@ -38,6 +38,9 @@
   "button.view-details": {
     "defaultMessage": "Посмотреть детали"
   },
+  "button.websites": {
+    "defaultMessage": "Сайты"
+  },
   "footer.powered-by": {
     "defaultMessage": "на движке"
   },
diff --git a/lang/tr-TR.json b/lang/tr-TR.json
index cdeed558..25e39cf7 100644
--- a/lang/tr-TR.json
+++ b/lang/tr-TR.json
@@ -38,6 +38,9 @@
   "button.view-details": {
     "defaultMessage": "Detayı incele"
   },
+  "button.websites": {
+    "defaultMessage": "Web siteleri"
+  },
   "footer.powered-by": {
     "defaultMessage": "Sağlayıcı:"
   },
diff --git a/lang/zh-CN.json b/lang/zh-CN.json
index 7bea19ca..275df77c 100644
--- a/lang/zh-CN.json
+++ b/lang/zh-CN.json
@@ -38,6 +38,9 @@
   "button.view-details": {
     "defaultMessage": "查看更多"
   },
+  "button.websites": {
+    "defaultMessage": "网站"
+  },
   "footer.powered-by": {
     "defaultMessage": "运行"
   },
diff --git a/package.json b/package.json
index eb83f1c2..4565859e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "umami",
-  "version": "0.28.0",
+  "version": "0.29.0",
   "description": "A simple, fast, website analytics alternative to Google Analytics. ",
   "author": "Mike Cao <mike@mikecao.com>",
   "license": "MIT",
diff --git a/pages/404.js b/pages/404.js
index 9cc200b5..4c85b10a 100644
--- a/pages/404.js
+++ b/pages/404.js
@@ -1,11 +1,14 @@
 import React from 'react';
 import Layout from 'components/layout/Layout';
+import { FormattedMessage } from 'react-intl';
 
 export default function Custom404() {
   return (
     <Layout>
       <div className="row justify-content-center">
-        <h1>oops! page not found</h1>
+        <h1>
+          <FormattedMessage id="message.page-not-found" defaultMessage="Page not found" />
+        </h1>
       </div>
     </Layout>
   );
diff --git a/pages/account.js b/pages/account.js
deleted file mode 100644
index a7ed6862..00000000
--- a/pages/account.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import React from 'react';
-import Layout from 'components/layout/Layout';
-import AccountSettings from 'components/settings/AccountSettings';
-import useRequireLogin from 'hooks/useRequireLogin';
-
-export default function AccountPage() {
-  const { loading } = useRequireLogin();
-
-  if (loading) {
-    return null;
-  }
-
-  return (
-    <Layout>
-      <AccountSettings />
-    </Layout>
-  );
-}
diff --git a/pages/api/account.js b/pages/api/account/index.js
similarity index 100%
rename from pages/api/account.js
rename to pages/api/account/index.js
diff --git a/pages/api/website/[id]/index.js b/pages/api/website/[id].js
similarity index 100%
rename from pages/api/website/[id]/index.js
rename to pages/api/website/[id].js
diff --git a/pages/api/website.js b/pages/api/website/index.js
similarity index 100%
rename from pages/api/website.js
rename to pages/api/website/index.js
diff --git a/pages/api/websites.js b/pages/api/websites.js
index af83c13e..b4633950 100644
--- a/pages/api/websites.js
+++ b/pages/api/websites.js
@@ -1,14 +1,19 @@
 import { getUserWebsites } from 'lib/queries';
 import { useAuth } from 'lib/middleware';
-import { ok, methodNotAllowed } from 'lib/response';
+import { ok, methodNotAllowed, unauthorized } from 'lib/response';
 
 export default async (req, res) => {
   await useAuth(req, res);
 
-  const { user_id } = req.auth;
+  const { user_id, is_admin } = req.auth;
+  const { userId } = req.query;
 
   if (req.method === 'GET') {
-    const websites = await getUserWebsites(user_id);
+    if (userId && !is_admin) {
+      return unauthorized(res);
+    }
+
+    const websites = await getUserWebsites(+userId || user_id);
 
     return ok(res, websites);
   }
diff --git a/pages/dashboard.js b/pages/dashboard/[[...id]].js
similarity index 67%
rename from pages/dashboard.js
rename to pages/dashboard/[[...id]].js
index aeb9d772..90f08492 100644
--- a/pages/dashboard.js
+++ b/pages/dashboard/[[...id]].js
@@ -1,10 +1,14 @@
 import React from 'react';
+import { useRouter } from 'next/router';
 import Layout from 'components/layout/Layout';
 import WebsiteList from 'components/WebsiteList';
 import useRequireLogin from 'hooks/useRequireLogin';
 
 export default function DashboardPage() {
   const { loading } = useRequireLogin();
+  const router = useRouter();
+  const { id } = router.query;
+  const userId = id?.[0];
 
   if (loading) {
     return null;
@@ -12,7 +16,7 @@ export default function DashboardPage() {
 
   return (
     <Layout>
-      <WebsiteList />
+      <WebsiteList userId={userId} />
     </Layout>
   );
 }