feat: actions for votes (#525)

Author: swouf

src/config/appActionsTypes.ts

@@ -4,7 +4,7 @@ import { AppAction, AppData, LocalContext } from '@graasp/sdk';
 import { ActivityStep } from '@/interfaces/interactionProcess';
 import { Prompt } from '@/interfaces/prompt';
 import { ResponseData } from '@/interfaces/response';
-import { CurrentStateData, ResponseAppData } from './appDataTypes';
+import { CurrentStateData, ResponseAppData, VoteAppData } from './appDataTypes';
 
 export enum AppActionTypes {
   SubmitNewResponse = 'submit-new-response',
@@ -19,6 +19,8 @@ export enum AppActionTypes {
   PlayActivity = 'play-activity',
   PauseActivity = 'pause-activity',
   RequestPrompt = 'request-prompt',
+  VoteFor = 'vote-for',
+  RemoveVote = 'remove-vote',
 }
 
 type AppDataRef<T extends Data> = Pick<AppData<T>, 'id' | 'type' | 'data'> &
@@ -76,3 +78,13 @@ export type RequestPromptAction = Pick<AppAction, 'type' | 'data'> & {
   type: AppActionTypes.RequestPrompt;
   data: { prompt: Prompt; promptRequestNumber: number };
 };
+
+export type VoteForAction = Pick<AppAction, 'type' | 'data'> & {
+  type: AppActionTypes.VoteFor;
+  data: AppDataRef<VoteAppData['data']>;
+};
+
+export type RemoveVoteAction = Pick<AppAction, 'type' | 'data'> & {
+  type: AppActionTypes.RemoveVote;
+  data: AppDataRef<VoteAppData['data']>;
+};

src/hooks/useActions.ts

@@ -11,10 +11,16 @@ import {
   PauseActivityAction,
   PlayActivityAction,
   PreviousStepAction,
+  RemoveVoteAction,
   RequestPromptAction,
   SubmitNewResponseAction,
+  VoteForAction,
 } from '@/config/appActionsTypes';
-import { CurrentStateData, ResponseAppData } from '@/config/appDataTypes';
+import {
+  CurrentStateData,
+  ResponseAppData,
+  VoteAppData,
+} from '@/config/appDataTypes';
 import { mutations } from '@/config/queryClient';
 import { ActivityStep } from '@/interfaces/interactionProcess';
 import { LocalContext } from '@graasp/sdk';
@@ -33,6 +39,8 @@ interface UseActionsValues {
   postPlayActivityAction: (data?: Data) => void;
   postPauseActivityAction: (data?: Data) => void;
   postRequestPromptAction: (data: RequestPromptAction['data']) => void;
+  postVoteForAction: (data: VoteAppData) => void;
+  postRemoveVoteAction: (data: VoteAppData) => void;
 }
 
 const useActions = (): UseActionsValues => {
@@ -103,6 +111,35 @@ const useActions = (): UseActionsValues => {
   //   [postAppAction],
   // );
 
+  const postVoteForAction = useCallback(
+    (data: VoteAppData): void => {
+      const action: VoteForAction = {
+        type: AppActionTypes.VoteFor,
+        data: {
+          id: data.id,
+          type: data.type,
+          data: data.data,
+        },
+      };
+      postAppAction(action);
+    },
+    [postAppAction],
+  );
+  const postRemoveVoteAction = useCallback(
+    (data: VoteAppData): void => {
+      const action: RemoveVoteAction = {
+        type: AppActionTypes.RemoveVote,
+        data: {
+          id: data.id,
+          type: data.type,
+          data: data.data,
+        },
+      };
+      postAppAction(action);
+    },
+    [postAppAction],
+  );
+
   const postNextStepAction = useCallback(
     (step: ActivityStep, stepIndex: number) => {
       const action: NextStepAction = {
@@ -175,6 +212,8 @@ const useActions = (): UseActionsValues => {
     postPlayActivityAction,
     postPauseActivityAction,
     postRequestPromptAction,
+    postVoteForAction,
+    postRemoveVoteAction,
   };
 };
 

src/modules/context/VoteContext.tsx

@@ -4,6 +4,7 @@ import { EvaluationParameters } from '@/interfaces/evaluation';
 import { AppDataTypes, VoteAppData } from '@/config/appDataTypes';
 import { useLocalContext } from '@graasp/apps-query-client';
 import { AppDataVisibility } from '@graasp/sdk';
+import useActions from '@/hooks/useActions';
 import { useAppDataContext } from './AppDataContext';
 
 type VoteContextType = {
@@ -41,7 +42,8 @@ export const VoteProvider: FC<VoteContextProps> = ({
     [evaluationParameters],
   );
 
-  const { appData, postAppData, deleteAppData } = useAppDataContext();
+  const { appData, postAppDataAsync, deleteAppDataAsync } = useAppDataContext();
+  const { postVoteForAction, postRemoveVoteAction } = useActions();
 
   const allVotes = useMemo(
     () =>
@@ -72,10 +74,14 @@ export const VoteProvider: FC<VoteContextProps> = ({
             responseRef: responseId,
           },
         };
-        postAppData(newAppData);
+        postAppDataAsync(newAppData).then((recordedAppData) => {
+          if (recordedAppData) {
+            postVoteForAction(recordedAppData as VoteAppData);
+          }
+        });
       }
     },
-    [availableVotes, postAppData],
+    [availableVotes, postAppDataAsync, postVoteForAction],
   );
 
   const findVoteFor = useCallback(
@@ -88,12 +94,14 @@ export const VoteProvider: FC<VoteContextProps> = ({
     async (responseId: string): Promise<void> => {
       const voteToRemove = findVoteFor(responseId);
       if (voteToRemove) {
-        deleteAppData({ id: voteToRemove?.id });
+        deleteAppDataAsync({ id: voteToRemove?.id }).then(() => {
+          postRemoveVoteAction(voteToRemove);
+        });
       } else {
         throw Error(`Response with id ${responseId} not found.`);
       }
     },
-    [deleteAppData, findVoteFor],
+    [deleteAppDataAsync, findVoteFor, postRemoveVoteAction],
   );
 
   const checkIfHasVote = useCallback(