applications/drive/src/app/components/onboarding/useChecklist.ts

   1 import { useEffect, useState } from 'react';
   2
   3 import { differenceInDays, fromUnixTime } from 'date-fns';
   4
   5 import { useUser } from '@proton/account/user/hooks';
   6 import { useApi } from '@proton/components';
   7 import { useLoading } from '@proton/hooks';
   8 import { getDriveChecklist, seenCompletedDriveChecklist } from '@proton/shared/lib/api/checklist';
   9 import type { ChecklistApiResponse } from '@proton/shared/lib/interfaces';
  10
  11 export default function useChecklist() {
  12     const api = useApi();
  13     const [user] = useUser();
  14     const [isLoading, withLoading] = useLoading(false);
  15     const [checklist, setChecklist] = useState<ChecklistApiResponse>();
  16
  17     useEffect(() => {
  18         if (user.isPaid) {
  19             return;
  20         }
  21         withLoading(api<ChecklistApiResponse>(getDriveChecklist('get-started')).then(setChecklist)).catch(
  22             console.error
  23         );
  24     }, []);
  25
  26     const reload = () => {
  27         api<ChecklistApiResponse>(getDriveChecklist('get-started')).then(setChecklist).catch(console.error);
  28     };
  29
  30     const expiresInDays = checklist?.ExpiresAt ? differenceInDays(fromUnixTime(checklist.ExpiresAt), new Date()) : 0;
  31
  32     // If dismiss is set to true, then the checklist disappears completely.
  33     // If set to false, it just marks seen on backend but keeps it on web for the session.
  34     const markCompletedAsSeen = (dismiss: boolean = true) => {
  35         if (dismiss) {
  36             setChecklist(undefined);
  37         }
  38         void api<ChecklistApiResponse>(seenCompletedDriveChecklist('get-started'));
  39     };
  40
  41     return {
  42         isLoading,
  43         completedActions: checklist?.Items || [],
  44         isCompleted: checklist ? checklist.UserWasRewarded : true,
  45         isVisible: checklist?.Visible || false,
  46         expiresInDays,
  47         reload,
  48         markCompletedAsSeen,
  49     };
  50 }