My home

src/app/my/canvassassignments/[canvassAssId]/page.tsx → src/app/canvass/[canvassAssId]/page.tsx

@@ -24,6 +24,6 @@ export default async function Page({ params }: PageProps) {
 
     return <MyCanvassAssignmentPage canvassAssId={canvassAssId} />;
   } catch (err) {
-    return redirect(`/login?redirect=/my/canvassassignments/${canvassAssId}`);
+    return redirect(`/login?redirect=/canvass/${canvassAssId}`);
   }
 }

src/app/my/feed/page.tsx

@@ -0,0 +1,5 @@
+import AllEventsPage from 'features/home/pages/AllEventsPage';
+
+export default async function Page() {
+  return <AllEventsPage />;
+}

src/app/my/home/page.tsx

@@ -0,0 +1,5 @@
+import HomePage from 'features/home/pages/HomePage';
+
+export default async function Page() {
+  return <HomePage />;
+}

src/app/my/layout.tsx

@@ -0,0 +1,13 @@
+import { FC, ReactNode } from 'react';
+
+import HomeLayout from 'features/home/layouts/HomeLayout';
+
+type Props = {
+  children: ReactNode;
+};
+
+const MyHomeLayout: FC<Props> = ({ children }) => {
+  return <HomeLayout>{children}</HomeLayout>;
+};
+
+export default MyHomeLayout;

src/core/Providers.tsx

@@ -15,10 +15,10 @@ import { EventPopperProvider } from 'features/events/components/EventPopper/Even
 import { MessageList } from 'utils/locale';
 import { Store } from './store';
 import { themeWithLocale } from '../theme';
-import { UserContext } from 'utils/hooks/useFocusDate';
 import { ZetkinUser } from 'utils/types/zetkin';
 import { ZUIConfirmDialogProvider } from 'zui/ZUIConfirmDialogProvider';
 import { ZUISnackbarProvider } from 'zui/ZUISnackbarContext';
+import { UserProvider } from './env/UserContext';
 
 type ProviderData = {
   env: Environment;
@@ -63,7 +63,7 @@ const Providers: FC<ProvidersProps> = ({
   return (
     <ReduxProvider store={store}>
       <EnvProvider env={env}>
-        <UserContext.Provider value={user}>
+        <UserProvider user={user}>
           <StyledEngineProvider injectFirst>
             <CacheProvider value={cache}>
               <ThemeProvider theme={themeWithLocale(lang)}>
@@ -87,7 +87,7 @@ const Providers: FC<ProvidersProps> = ({
               </ThemeProvider>
             </CacheProvider>
           </StyledEngineProvider>
-        </UserContext.Provider>
+        </UserProvider>
       </EnvProvider>
     </ReduxProvider>
   );

src/core/hooks/useRemoteList.ts

@@ -0,0 +1,47 @@
+import { PayloadAction } from '@reduxjs/toolkit';
+
+import shouldLoad from 'core/caching/shouldLoad';
+import { RemoteList } from 'utils/storeUtils';
+import { useAppDispatch } from '.';
+
+export default function useRemoteList<
+  DataType,
+  OnLoadPayload = void,
+  OnSuccessPayload = DataType[]
+>(
+  remoteList: RemoteList<DataType> | undefined,
+  hooks: {
+    actionOnError?: (err: unknown) => PayloadAction<unknown>;
+    actionOnLoad: () => PayloadAction<OnLoadPayload>;
+    actionOnSuccess: (items: DataType[]) => PayloadAction<OnSuccessPayload>;
+    isNecessary?: () => boolean;
+    loader: () => Promise<DataType[]>;
+  }
+): DataType[] {
+  const dispatch = useAppDispatch();
+  const loadIsNecessary = hooks.isNecessary?.() ?? shouldLoad(remoteList);
+
+  if (!remoteList || loadIsNecessary) {
+    const promise = hooks
+      .loader()
+      .then((val) => {
+        dispatch(hooks.actionOnSuccess(val));
+        return val;
+      })
+      .catch((err: unknown) => {
+        if (hooks.actionOnError) {
+          dispatch(hooks.actionOnError(err));
+          return null;
+        } else {
+          throw err;
+        }
+      });
+
+    throw promise;
+  }
+
+  return remoteList.items
+    .filter((item) => !item.deleted)
+    .map((item) => item.data)
+    .filter((data) => !!data) as DataType[];
+}

src/core/hooks/useUser.ts

@@ -0,0 +1,7 @@
+import { useContext } from 'react';
+
+import { UserContext } from 'core/env/UserContext';
+
+export default function useUser() {
+  return useContext(UserContext);
+}

src/core/rpc/index.ts

@@ -21,10 +21,12 @@ import { renderEmailDef } from 'features/emails/rpc/renderEmail/server';
 import { createCallAssignmentDef } from 'features/callAssignments/rpc/createCallAssignment';
 import { getJoinFormEmbedDataDef } from 'features/joinForms/rpc/getJoinFormEmbedData';
 import { createHouseholdsDef } from 'features/canvassAssignments/rpc/createHouseholds/server';
+import { getAllEventsDef } from 'features/events/rpc/getAllEvents';
 
 export function createRPCRouter() {
   const rpcRouter = new RPCRouter();
 
+  rpcRouter.register(getAllEventsDef);
   rpcRouter.register(deleteFolderRouteDef);
   rpcRouter.register(createNewViewRouteDef);
   rpcRouter.register(copyViewRouteDef);

src/features/callAssignments/hooks/useMyCallAssignments.ts

@@ -0,0 +1,18 @@
+import { useApiClient, useAppSelector } from 'core/hooks';
+import useRemoteList from 'core/hooks/useRemoteList';
+import { userAssignmentsLoad, userAssignmentsLoaded } from '../store';
+import { ZetkinCallAssignment } from 'utils/types/zetkin';
+
+export default function useMyCallAssignments() {
+  const apiClient = useApiClient();
+  const list = useAppSelector(
+    (state) => state.callAssignments.userAssignmentList
+  );
+
+  return useRemoteList(list, {
+    actionOnLoad: () => userAssignmentsLoad(),
+    actionOnSuccess: (data) => userAssignmentsLoaded(data),
+    loader: () =>
+      apiClient.get<ZetkinCallAssignment[]>(`/api/users/me/call_assignments`),
+  });
+}

src/features/callAssignments/store.ts

@@ -22,6 +22,7 @@ export interface CallAssignmentSlice {
   callersById: Record<number, RemoteList<CallAssignmentCaller>>;
   callList: RemoteList<Call>;
   statsById: Record<number, RemoteItem<CallAssignmentStats>>;
+  userAssignmentList: RemoteList<CallAssignmentData>;
 }
 
 const initialState: CallAssignmentSlice = {
@@ -30,6 +31,7 @@ const initialState: CallAssignmentSlice = {
   callList: remoteList(),
   callersById: {},
   statsById: {},
+  userAssignmentList: remoteList(),
 };
 
 const callAssignmentsSlice = createSlice({
@@ -291,6 +293,16 @@ const callAssignmentsSlice = createSlice({
         }
       );
     },
+    userAssignmentsLoad: (state) => {
+      state.userAssignmentList.isLoading = true;
+    },
+    userAssignmentsLoaded: (
+      state,
+      action: PayloadAction<CallAssignmentData[]>
+    ) => {
+      state.userAssignmentList = remoteList(action.payload);
+      state.userAssignmentList.loaded = new Date().toISOString();
+    },
   },
 });
 
@@ -319,4 +331,6 @@ export const {
   campaignCallAssignmentsLoaded,
   statsLoad,
   statsLoaded,
+  userAssignmentsLoad,
+  userAssignmentsLoaded,
 } = callAssignmentsSlice.actions;

src/features/canvassAssignments/components/CanvasserSidebar/index.tsx

@@ -108,7 +108,7 @@ const CanvasserSidebar: FC<Props> = ({ assignment }) => {
         </Box>
       </Box>
       <List>
-        <ListItemButton href="/my/canvassassignments" sx={{ px: 1 }}>
+        <ListItemButton href="/my/home" sx={{ px: 1 }}>
           <ListItemText primary="My assignments" />
         </ListItemButton>
         <ListItemButton href="/logout" sx={{ px: 1 }}>

src/features/canvassAssignments/components/MyCanvassAssignmentPage.tsx

@@ -125,7 +125,7 @@ type MyCanvassAssignmentPageProps = {
 const MyCanvassAssignmentPage: FC<MyCanvassAssignmentPageProps> = ({
   canvassAssId,
 }) => {
-  const myAssignments = useMyCanvassAssignments().data || [];
+  const myAssignments = useMyCanvassAssignments();
   const assignment = myAssignments.find(
     (assignment) => assignment.id == canvassAssId
   );

src/features/canvassAssignments/hooks/useMyCanvassAssignments.ts

@@ -1,16 +1,15 @@
-import { loadListIfNecessary } from 'core/caching/cacheUtils';
-import { useApiClient, useAppDispatch, useAppSelector } from 'core/hooks';
+import { useApiClient, useAppSelector } from 'core/hooks';
 import { myAssignmentsLoad, myAssignmentsLoaded } from '../store';
 import { AssignmentWithAreas } from '../types';
+import useRemoteList from 'core/hooks/useRemoteList';
 
 export default function useMyCanvassAssignments() {
   const apiClient = useApiClient();
-  const dispatch = useAppDispatch();
-  const mySessions = useAppSelector(
+  const assignments = useAppSelector(
     (state) => state.canvassAssignments.myAssignmentsWithAreasList
   );
 
-  return loadListIfNecessary(mySessions, dispatch, {
+  return useRemoteList(assignments, {
     actionOnLoad: () => myAssignmentsLoad(),
     actionOnSuccess: (data) => myAssignmentsLoaded(data),
     loader: () =>

src/features/emails/hooks/useSendTestEmail.ts

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 
-import { useUser } from 'utils/hooks/useFocusDate';
+import useUser from 'core/hooks/useUser';
 import { useApiClient, useNumericRouteParams } from 'core/hooks';
 
 export default function useSendTestEmail() {

src/features/events/hooks/useAllEvents.ts

@@ -0,0 +1,15 @@
+import { useApiClient, useAppSelector } from 'core/hooks';
+import useRemoteList from 'core/hooks/useRemoteList';
+import { allEventsLoad, allEventsLoaded } from '../store';
+import getAllEvents from '../rpc/getAllEvents';
+
+export default function useAllEvents() {
+  const apiClient = useApiClient();
+  const allEventsList = useAppSelector((state) => state.events.allEventsList);
+
+  return useRemoteList(allEventsList, {
+    actionOnLoad: () => allEventsLoad(),
+    actionOnSuccess: (data) => allEventsLoaded(data),
+    loader: () => apiClient.rpc(getAllEvents, {}),
+  });
+}

src/features/events/hooks/useMyEvents.ts

@@ -0,0 +1,15 @@
+import { useApiClient, useAppSelector } from 'core/hooks';
+import useRemoteList from 'core/hooks/useRemoteList';
+import { userEventsLoad, userEventsLoaded } from '../store';
+import { ZetkinEvent } from 'utils/types/zetkin';
+
+export default function useMyEvents() {
+  const apiClient = useApiClient();
+  const list = useAppSelector((state) => state.events.userEventList);
+
+  return useRemoteList(list, {
+    actionOnLoad: () => userEventsLoad(),
+    actionOnSuccess: (data) => userEventsLoaded(data),
+    loader: () => apiClient.get<ZetkinEvent[]>(`/api/users/me/actions`),
+  });
+}