Updated date range handling. Fixed share page.

components/input/DateFilter.js

@@ -18,7 +18,7 @@ function DateFilter({ websiteId, value, className }) {
   const [showPicker, setShowPicker] = useState(false);
 
   async function handleDateChange(value) {
-    if (value === 'all') {
+    if (value === 'all' && websiteId) {
       const data = await get(`/websites/${websiteId}`);
 
       if (data) {

components/input/RefreshButton.js

@@ -1,6 +1,6 @@
 import { useIntl } from 'react-intl';
 import { LoadingButton, Icon, Tooltip } from 'react-basics';
-import { setDateRange } from 'store/websites';
+import { setWebsiteDateRange } from 'store/websites';
 import useDateRange from 'hooks/useDateRange';
 import Icons from 'components/icons';
 import { labels } from 'components/messages';
@@ -12,9 +12,9 @@ function RefreshButton({ websiteId, isLoading }) {
   function handleClick() {
     if (!isLoading && dateRange) {
       if (/^\d+/.test(dateRange.value)) {
-        setDateRange(websiteId, dateRange.value);
+        setWebsiteDateRange(websiteId, dateRange.value);
       } else {
-        setDateRange(websiteId, dateRange);
+        setWebsiteDateRange(websiteId, dateRange);
       }
     }
   }

components/input/SettingsButton.js

@@ -18,7 +18,12 @@ export default function SettingsButton() {
           </Icon>
         </Button>
       </Tooltip>
-      <Popup className={styles.popup} position="bottom" alignment="end">
+      <Popup
+        className={styles.popup}
+        position="bottom"
+        alignment="end"
+        onClick={e => e.stopPropagation()}
+      >
         <Form>
           <FormRow label={formatMessage(labels.timezone)}>
             <TimezoneSetting />

components/input/UserButton.js

@@ -1,80 +0,0 @@
-import useConfig from 'hooks/useConfig';
-import useUser from 'hooks/useUser';
-import { AUTH_TOKEN } from 'lib/constants';
-import { removeItem } from 'next-basics';
-import { useRouter } from 'next/router';
-import { useRef, useState } from 'react';
-import { Button, Icon, Item, Menu, Popup, Text } from 'react-basics';
-import { FormattedMessage } from 'react-intl';
-import useDocumentClick from 'hooks/useDocumentClick';
-import Profile from 'assets/profile.svg';
-import styles from './UserButton.module.css';
-
-export default function UserButton() {
-  const [show, setShow] = useState(false);
-  const ref = useRef();
-  const { user } = useUser();
-  const router = useRouter();
-  const { adminDisabled } = useConfig();
-
-  const menuOptions = [
-    {
-      label: (
-        <FormattedMessage
-          id="label.logged-in-as"
-          defaultMessage="Logged in as {username}"
-          values={{ username: <b>{user.username}</b> }}
-        />
-      ),
-      value: 'username',
-      className: styles.username,
-    },
-    {
-      label: <FormattedMessage id="label.profile" defaultMessage="Profile" />,
-      value: 'profile',
-      hidden: adminDisabled,
-      divider: true,
-    },
-    { label: <FormattedMessage id="label.logout" defaultMessage="Logout" />, value: 'logout' },
-  ];
-
-  function handleClick() {
-    setShow(state => !state);
-  }
-
-  function handleSelect(value) {
-    if (value === 'logout') {
-      removeItem(AUTH_TOKEN);
-      router.push('/login');
-    } else if (value === 'profile') {
-      router.push('/profile');
-    }
-  }
-
-  useDocumentClick(e => {
-    if (!ref.current?.contains(e.target)) {
-      setShow(false);
-    }
-  });
-
-  return (
-    <div className={styles.button} ref={ref}>
-      <Button variant="light" onClick={handleClick}>
-        <Icon className={styles.icon} size="large">
-          <Profile />
-        </Icon>
-      </Button>
-      {show && (
-        <Popup className={styles.menu} position="bottom" gap={5}>
-          <Menu items={menuOptions} onSelect={handleSelect}>
-            {({ label, value }) => (
-              <Item key={value}>
-                <Text>{label}</Text>
-              </Item>
-            )}
-          </Menu>
-        </Popup>
-      )}
-    </div>
-  );
-}

components/input/UserButton.module.css

@@ -1,25 +0,0 @@
-.button {
-  position: relative;
-}
-
-.username {
-  border-bottom: 1px solid var(--base500);
-}
-
-.username:hover {
-  background: var(--base50);
-}
-
-.icon svg {
-  height: 16px;
-  width: 16px;
-}
-
-.menu {
-  left: -50%;
-  background: var(--base50);
-  border: 1px solid var(--base500);
-  border-radius: 4px;
-  overflow: hidden;
-  z-index: 100;
-}