Use and update following state on detailed event object

webkom · Feb 10, 2023 · f5605d6 · f5605d6
1 parent 61a1c03
commit f5605d6
Show file tree

Hide file tree

Showing 7 changed files with 40 additions and 21 deletions.
diff --git a/app/actions/EventActions.ts b/app/actions/EventActions.ts
@@ -389,6 +389,7 @@ export function unfollow(
         method: 'DELETE',
         meta: {
           id: followId,
+          eventId,
           errorMessage: 'Avregistering fra interesse feilet',
         },
       })

diff --git a/app/models.ts b/app/models.ts
@@ -232,6 +232,7 @@ export type Event = EventBase & {
   actionGrant: ActionGrant;
   activationTime: Dateish | null | undefined;
   isAdmitted: boolean | null | undefined;
+  following: false | ID;
   activeCapacity: number;
   eventType: EventType;
   eventStatusType: EventStatusType;

diff --git a/app/reducers/__tests__/events.spec.ts b/app/reducers/__tests__/events.spec.ts
@@ -459,8 +459,22 @@ describe('reducers', () => {
       const action = {
         type: Event.FOLLOW.SUCCESS,
         payload: {
-          target: 1,
-          id: 3,
+          entities: {
+            followerEvents: {
+              3: {
+                target: 1,
+                follower: 2,
+                id: 3,
+              },
+            },
+          },
+          result: 3,
+        },
+        meta: {
+          body: {
+            target: 1,
+            follower: 2,
+          },
         },
       };
       expect(events(prevState, action)).toEqual({
@@ -471,6 +485,7 @@ describe('reducers', () => {
         byId: {
           1: {
             id: 1,
+            following: 3,
             name: 'evt',
           },
         },
@@ -485,6 +500,7 @@ describe('reducers', () => {
         byId: {
           1: {
             id: 1,
+            following: 3,
             name: 'evt',
           },
         },
@@ -503,6 +519,7 @@ describe('reducers', () => {
         byId: {
           1: {
             id: 1,
+            following: false,
             name: 'evt',
           },
         },

diff --git a/app/reducers/events.ts b/app/reducers/events.ts
@@ -146,6 +146,19 @@ const mutateEvent = produce((newState: State, action: any): void => {
 
       break;
 
+    case Event.FOLLOW.SUCCESS:
+      if (newState.byId[action.meta.body.target]) {
+        newState.byId[action.meta.body.target].following =
+          action.payload.result;
+      }
+      break;
+
+    case Event.UNFOLLOW.SUCCESS:
+      if (newState.byId[action.meta.eventId]) {
+        newState.byId[action.meta.eventId].following = false;
+      }
+      break;
+
     default:
       break;
   }

diff --git a/app/routes/events/EventDetailRoute.ts b/app/routes/events/EventDetailRoute.ts
@@ -23,7 +23,6 @@ import {
   selectWaitingRegistrationsForEvent,
   selectRegistrationForEventByUserId,
 } from 'app/reducers/events';
-import { selectFollowersCurrentUser } from 'app/reducers/followers';
 import { selectPenaltyByUserId } from 'app/reducers/penalties';
 import { selectUserWithGroups } from 'app/reducers/users';
 import helmet from 'app/utils/helmet';
@@ -53,10 +52,6 @@ const mapStateToProps = (state, props) => {
         userId: user.id,
       })
     : [];
-  const currentUserFollowing = selectFollowersCurrentUser(state, {
-    target: eventId,
-    type: 'event',
-  });
 
   if (!hasFullAccess) {
     const normalPools = event.isMerged
@@ -81,7 +76,6 @@ const mapStateToProps = (state, props) => {
       eventId,
       pools,
       comments: [],
-      currentUserFollowing,
     };
   }
 
@@ -143,7 +137,6 @@ const mapStateToProps = (state, props) => {
     pendingRegistration,
     hasSimpleWaitingList,
     penalties,
-    currentUserFollowing,
   };
 };
 
@@ -211,11 +204,7 @@ const propertyGenerator = (props, config) => {
 export default compose(
   withPreparedDispatch(
     'fetchEventDetail',
-    (props, dispatch) =>
-      Promise.all([
-        dispatch(fetchEvent(props.match.params.eventId)),
-        props.loggedIn && dispatch(isUserFollowing(props.match.params.eventId)),
-      ]),
+    (props, dispatch) => dispatch(fetchEvent(props.match.params.eventId)),
     (props) => [props.match.params.eventId]
   ),
   connect(mapStateToProps, mapDispatchToProps),

diff --git a/app/routes/events/components/EventDetail/index.tsx b/app/routes/events/components/EventDetail/index.tsx
@@ -126,7 +126,6 @@ type Props = {
   ) => Promise<any>;
   deleteEvent: (eventId: ID) => Promise<any>;
   deleteComment: (id: ID, contentTarget: string) => Promise<any>;
-  currentUserFollowing: FollowerItem | null | undefined;
 };
 type State = {
   mapIsOpen: boolean;
@@ -200,7 +199,6 @@ export default class EventDetail extends Component<Props, State> {
       follow,
       unfollow,
       deleteComment,
-      currentUserFollowing,
     } = this.props;
 
     if (!event.id) {
@@ -213,8 +211,8 @@ export default class EventDetail extends Component<Props, State> {
 
     const color = colorForEvent(event.eventType);
 
-    const onRegisterClick = currentUserFollowing
-      ? () => unfollow(currentUserFollowing.id, event.id)
+    const onRegisterClick = event.following
+      ? () => unfollow(event.following, event.id)
       : () => follow(currentUser.id, event.id);
 
     const currentMoment = moment();
@@ -370,9 +368,7 @@ export default class EventDetail extends Component<Props, State> {
             className={styles.title}
             event={event}
           >
-            {loggedIn && (
-              <InterestedButton isInterested={!!currentUserFollowing} />
-            )}
+            {loggedIn && <InterestedButton isInterested={!!event.following} />}
             {event.title}
           </ContentHeader>
 

diff --git a/app/store/models/Event.d.ts b/app/store/models/Event.d.ts
@@ -72,6 +72,7 @@ interface Event {
   price: number;
   activationTime: Dateish;
   isAdmitted: boolean;
+  following: false | ID;
   spotsLeft: number;
   pendingRegistration: boolean;
   photoConsents: ID[];
@@ -174,6 +175,7 @@ export type UserDetailedEvent = Pick<
   | 'price'
   | 'activationTime'
   | 'isAdmitted'
+  | 'following'
   | 'spotsLeft'
   | 'pendingRegistration'
   | 'photoConsents'