1import {useMemo} from 'react';
  2import moment from 'moment';
  3import Cookies from 'cookies';
  4import {useRouter} from 'next/router';
  5import {getSession} from 'next-auth/react';
  6import {useTranslation} from 'next-i18next';
  7import LayoutDefault from '../layouts/Default';
  8import DashboardEvents from '../containers/DashboardEvents';
  9import DashboardEmpty from '../containers/DashboardEmpty';
 10import Loading from '../containers/Loading';
 11import Fab from '../containers/Fab';
 12import pageUtils from '../lib/pageUtils';
 13import useProfile from '../hooks/useProfile';
 14
 15interface PageProps {
 16  announcement?: string;
 17}
 18
 19const Dashboard = (props: PageProps) => {
 20  const {t} = useTranslation();
 21  const router = useRouter();
 22  const {profile, isReady} = useProfile();
 23  const events = useMemo(() => profile?.events?.data || [], [profile]);
 24
 25  const pastEvents = useMemo(
 26    () =>
 27      events
 28        ?.filter(
 29          ({attributes: {date}}) =>
 30            date && moment(date).isBefore(moment(), 'day')
 31        )
 32        .sort(sortDesc),
 33    [events]
 34  );
 35
 36  const futureEvents = useMemo(
 37    () =>
 38      events
 39        ?.filter(
 40          ({attributes: {date}}) =>
 41            date && moment(date).isSameOrAfter(moment(), 'day')
 42        )
 43        .sort(sortDesc),
 44    [events]
 45  );
 46
 47  const noDateEvents = useMemo(
 48    () => events?.filter(({attributes: {date}}) => !date),
 49    [events]
 50  );
 51
 52  const menuActions = [
 53    {
 54      label: t('menu.profile'),
 55      onClick: () => router.push('/profile'),
 56      id: 'ProfileTabs',
 57      icon: 'account_circle',
 58    },
 59    {
 60      label: t('menu.new_event'),
 61      onClick: () => router.push('/new'),
 62      id: 'AddEventTabs',
 63      icon: 'add',
 64    },
 65  ];
 66
 67  if (!events || !isReady)
 68    return (
 69      <LayoutDefault menuTitle={t('dashboard.title')} {...props}>
 70        <Loading />
 71      </LayoutDefault>
 72    );
 73
 74  return (
 75    <LayoutDefault
 76      menuActions={menuActions}
 77      menuTitle={t('dashboard.title')}
 78      {...props}
 79    >
 80      {events.length === 0 ? (
 81        <DashboardEmpty />
 82      ) : (
 83        <DashboardEvents
 84          pastEvents={pastEvents}
 85          futureEvents={futureEvents}
 86          noDateEvents={noDateEvents}
 87        />
 88      )}
 89      <Fab
 90        onClick={() => router.push('/new')}
 91        aria-label={t('dashboard.actions.add_event')}
 92        noDrawer
 93      >
 94        {t('dashboard.actions.add_event')}
 95      </Fab>
 96    </LayoutDefault>
 97  );
 98};
 99
100const sortDesc = ({attributes: {date: dateA}}, {attributes: {date: dateB}}) =>
101  dateB.localeCompare(dateA);
102
103export const getServerSideProps = async (context: any) => {
104  const session = await getSession(context);
105
106  if (!session)
107    return {
108      redirect: {
109        destination: '/',
110        permanent: false,
111      },
112    };
113
114  const hasAcceptedTos = !!session?.profile?.tosAcceptationDate;
115
116  if (!hasAcceptedTos)
117    return {
118      redirect: {
119        destination: '/auth/confirm',
120        permanent: false,
121      },
122    };
123
124  const cookies = new Cookies(context.req, context.res);
125  const redirectPath = cookies.get('redirectPath');
126  if (redirectPath) {
127    cookies.set('redirectPath'); // Delete cookie
128    return {
129      redirect: {
130        destination: redirectPath,
131        permanent: false,
132      },
133    };
134  }
135
136  return pageUtils.getServerSideProps()(context);
137};
138
139export default Dashboard;