feat(favorites): add favorites to account

jwplayer · Aug 2, 2021 · f42599e · f42599e
1 parent 33def81
commit f42599e
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 21 deletions.
diff --git a/src/stores/AccountStore.ts b/src/stores/AccountStore.ts
@@ -6,10 +6,10 @@ import * as subscriptionService from '../services/subscription.service';
 import type { AuthData, Capture, Customer, JwtDetails, CustomerConsent } from '../../types/account';
 import * as persist from '../utils/persist';
 import type { Subscription } from '../../types/subscription';
-import type { WatchHistoryItem } from '../../types/watchHistory';
 
 import { ConfigStore } from './ConfigStore';
 import { watchHistoryStore, restoreWatchHistory } from './WatchHistoryStore';
+import { favoritesStore, restoreFavorites } from './FavoritesStore';
 
 const PERSIST_KEY_ACCOUNT = 'auth';
 
@@ -62,6 +62,7 @@ export const initializeAccount = async () => {
       if (refreshedAuthData) {
         await afterLogin(config.cleengSandbox, refreshedAuthData);
         restoreWatchHistory();
+        restoreFavorites();
       }
     }
   } catch (error: unknown) {
@@ -134,6 +135,7 @@ export const login = async (email: string, password: string) => {
 
   await afterLogin(cleengSandbox, response.responseData);
 
+  restoreFavorites();
   restoreWatchHistory();
 };
 
@@ -144,15 +146,16 @@ export const logout = async () => {
     s.auth = null;
     s.user = null;
   });
+
+  restoreFavorites();
+  restoreWatchHistory();
 };
 
 export const register = async (email: string, password: string) => {
   const {
     config: { cleengId, cleengSandbox },
   } = ConfigStore.getRawState();
 
-  const { watchHistory } = watchHistoryStore.getRawState();
-
   if (!cleengId) throw new Error('cleengId is not configured');
 
   const localesResponse = await accountService.getLocales(cleengSandbox);
@@ -175,24 +178,25 @@ export const register = async (email: string, password: string) => {
 
   await afterLogin(cleengSandbox, responseRegister.responseData);
 
-  if (watchHistory) {
-    setWatchHistory(watchHistory);
-  }
+  updatePersonalShelf();
 };
 
-export const setWatchHistory = async (watchHistory: WatchHistoryItem[]) => {
+export const updatePersonalShelf = async () => {
   const { auth, user } = AccountStore.getRawState();
 
   if (!auth || !user) throw new Error('no auth');
 
-  if (!watchHistory.length) return;
+  const { watchHistory } = watchHistoryStore.getRawState();
+  const { favorites } = favoritesStore.getRawState();
+
+  if (!watchHistory && !favorites) return;
 
   const {
     config: { cleengSandbox },
   } = ConfigStore.getRawState();
 
-  const externalData = { history: watchHistory };
-  return await accountService.updateCustomer({ id: user.id.toString(), externalData }, cleengSandbox, auth?.jwt);
+  const personalShelfData = { history: watchHistory, favorites: favorites };
+  return await accountService.updateCustomer({ id: user.id.toString(), externalData: personalShelfData }, cleengSandbox, auth?.jwt);
 };
 
 export const updateConsents = async (customerConsents: CustomerConsent[]) => {

diff --git a/src/stores/FavoritesStore.ts b/src/stores/FavoritesStore.ts
@@ -6,6 +6,8 @@ import * as persist from '../utils/persist';
 import type { Favorite } from '../../types/favorite';
 import { getMediaByIds } from '../services/api.service';
 
+import { AccountStore, updatePersonalShelf } from './AccountStore';
+
 type FavoritesStore = {
   favorites: Favorite[];
 };
@@ -16,8 +18,9 @@ export const favoritesStore = new Store<FavoritesStore>({
   favorites: [],
 });
 
-export const initializeFavorites = async () => {
-  const savedItems: Favorite[] | null = persist.getItem(PERSIST_KEY_FAVORITES) as Favorite[] | null;
+export const restoreFavorites = async () => {
+  const { user } = AccountStore.getRawState();
+  const savedItems = user ? user.externalData?.favorites : persist.getItem<Favorite[]>(PERSIST_KEY_FAVORITES);
 
   if (savedItems) {
     const playlistItems = await getMediaByIds(savedItems.map(({ mediaid }) => mediaid));
@@ -27,15 +30,25 @@ export const initializeFavorites = async () => {
       state.favorites = favorites;
     });
   }
+};
+
+export const initializeFavorites = async () => {
+  restoreFavorites();
+
+  const updateFavorites = (favorites: Favorite[]) => {
+    const { user } = AccountStore.getRawState();
 
-  return favoritesStore.subscribe(
-    (state) => state.favorites,
-    (favorites) =>
-      persist.setItem(
+    if (user) {
+      return updatePersonalShelf();
+    } else {
+      return persist.setItem(
         PERSIST_KEY_FAVORITES,
         favorites.map(({ mediaid, title, tags, duration }) => ({ mediaid, title, tags, duration })),
-      ),
-  );
+      );
+    }
+  };
+
+  return favoritesStore.subscribe((state) => state.favorites, updateFavorites);
 };
 
 const createFavorite = (item: PlaylistItem): Favorite =>

diff --git a/src/stores/WatchHistoryStore.ts b/src/stores/WatchHistoryStore.ts
@@ -8,7 +8,7 @@ import { PersonalShelf } from '../enum/PersonalShelf';
 import { getMediaById } from '../services/api.service';
 import * as persist from '../utils/persist';
 
-import { AccountStore, setWatchHistory } from './AccountStore';
+import { AccountStore, updatePersonalShelf } from './AccountStore';
 
 type WatchHistoryStore = {
   watchHistory: WatchHistoryItem[];
@@ -51,7 +51,7 @@ export const initializeWatchHistory = () => {
     const { user } = AccountStore.getRawState();
 
     if (user) {
-      return setWatchHistory(watchHistory);
+      return updatePersonalShelf();
     } else {
       return persist.setItem(
         PERSIST_KEY_WATCH_HISTORY,

diff --git a/types/account.d.ts b/types/account.d.ts
@@ -156,7 +156,8 @@ export type UpdateCustomerPayload = {
 };
 
 export type ExternalData = {
-  history: WatchHistoryItem[];
+  history?: WatchHistoryItem[];
+  favorites?: Favorite[];
 };
 
 export type UpdateCustomerConsentsPayload = {