From f7bbad25a2c6ac8948ff9a3ef114e1474adfb0ce Mon Sep 17 00:00:00 2001 From: mike-lvov Date: Mon, 18 Jan 2021 20:41:24 +0200 Subject: [PATCH] Changes profile loading logic --- src/hooks/useUser.ts | 13 ++++++- src/hooks/users.ts | 57 +++++++++++-------------------- src/index.tsx | 4 +-- src/pages/VenuePage/VenuePage.tsx | 35 ++++++++++++++----- src/types/Firestore.ts | 3 ++ src/utils/selectors.ts | 2 +- 6 files changed, 64 insertions(+), 50 deletions(-) diff --git a/src/hooks/useUser.ts b/src/hooks/useUser.ts index 1db052ed46..18f31df508 100644 --- a/src/hooks/useUser.ts +++ b/src/hooks/useUser.ts @@ -6,6 +6,7 @@ import { WithId } from "utils/id"; import { authSelector, profileSelector } from "utils/selectors"; import { useSelector } from "hooks/useSelector"; +import { useFirestoreConnect } from "hooks/useFirestoreConnect"; type UseUserResult = { user: FirebaseReducer.AuthState | undefined; @@ -17,9 +18,19 @@ export const useUser = (): UseUserResult => { const auth = useSelector(authSelector); const profile = useSelector(profileSelector); + useFirestoreConnect( + auth.uid + ? { + collection: "users", + doc: auth.uid, + storeAs: "profile", + } + : undefined + ); + return { user: !auth.isEmpty ? auth : undefined, - profile: !profile.isEmpty ? profile : undefined, + profile: profile && !profile.isEmpty ? profile : undefined, userWithId: auth && profile ? { ...profile, id: auth.uid } : undefined, }; }; diff --git a/src/hooks/users.ts b/src/hooks/users.ts index f37e5c80a7..0ddcb40a9c 100644 --- a/src/hooks/users.ts +++ b/src/hooks/users.ts @@ -5,50 +5,35 @@ import { WithId } from "utils/id"; import { useSelector } from "./useSelector"; import { useUserLastSeenThreshold } from "./useUserLastSeenThreshold"; -import { useConnectCurrentVenueNG } from "./useConnectCurrentVenueNG"; -import { useVenueId } from "./useVenueId"; import { useFirestoreConnect, isLoaded } from "./useFirestoreConnect"; import { User } from "types/User"; - -export const useConnectWorldUsers = () => { - const venueId = useVenueId(); - - const { isCurrentVenueLoaded, currentVenue } = useConnectCurrentVenueNG( - venueId! - ); - - // useFirestoreConnect(() => { - // if (!isCurrentVenueLoaded || !currentVenue) return []; - - // console.log(currentVenue.parentId, currentVenue.id); - - // return [ - // { - // collection: "users", - // where: ["enteredVenueIds", "array-contains", venueId], - // storeAs: "worldUsers", - // }, - // ]; - // }); - - useFirestoreConnect( - isCurrentVenueLoaded && currentVenue - ? { - collection: "users", - where: ["enteredVenueIds", "array-contains", venueId], - storeAs: "worldUsers", - } - : undefined - ); +import { Venue } from "types/Venue"; + +export const useConnectWorldUsers = (venue?: WithId) => { + useFirestoreConnect(() => { + const venueId = venue?.id; + + if (!venueId) return []; + + return [ + { + collection: "users", + where: [ + "enteredVenueIds", + "array-contains", + venue?.parentId || venueId, + ], + storeAs: "worldUsers", + }, + ]; + }); }; export const useWorldUsers = (): { worldUsers: readonly WithId[]; isWorldUsersLoaded: boolean; } => { - // useConnectWorldUsers(); - const selectedUniverseUsers = useSelector(worldUsersSelector); console.log("users", selectedUniverseUsers); @@ -82,8 +67,6 @@ export const useRecentWorldUsers = (): { }; export const useWorldUsersById = () => { - // useConnectWorldUsers(); - const worldUsersById = useSelector(usersByIdSelector); return useMemo(() => worldUsersById, [worldUsersById]); diff --git a/src/index.tsx b/src/index.tsx index a0b05fdc97..5fc511fa93 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -79,8 +79,8 @@ if (LOGROCKET_APP_ID) { const stripePromise = loadStripe(STRIPE_PUBLISHABLE_KEY ?? ""); const rrfConfig = { - userProfile: "users", - useFirestoreForProfile: true, + // userProfile: "user", + // useFirestoreForProfile: true, oneListenerPerPath: true, allowMultipleListeners: false, }; diff --git a/src/pages/VenuePage/VenuePage.tsx b/src/pages/VenuePage/VenuePage.tsx index 68a86b3d66..a4128027ec 100644 --- a/src/pages/VenuePage/VenuePage.tsx +++ b/src/pages/VenuePage/VenuePage.tsx @@ -27,6 +27,12 @@ import { useLocationUpdateEffect, } from "utils/useLocationUpdateEffect"; import { venueEntranceUrl } from "utils/url"; +import { isCompleteProfile, updateProfileEnteredVenueIds } from "utils/profile"; +import { isTruthy } from "utils/types"; +import { showZendeskWidget } from "utils/zendesk"; + +import { updateTheme } from "./helpers"; +import { updateUserProfile } from "pages/Account/helpers"; import { useConnectCurrentEvent } from "hooks/useConnectCurrentEvent"; import { useConnectUserPurchaseHistory } from "hooks/useConnectUserPurchaseHistory"; @@ -36,21 +42,32 @@ import { useSelector } from "hooks/useSelector"; import { useUser } from "hooks/useUser"; import { useVenueId } from "hooks/useVenueId"; import { useFirestoreConnect } from "hooks/useFirestoreConnect"; +import { useConnectWorldUsers, useWorldUsers } from "hooks/users"; +import { useConnectCurrentVenueNG } from "hooks/useConnectCurrentVenueNG"; +import useConnectCurrentVenue from "hooks/useConnectCurrentVenue"; -import { updateUserProfile } from "pages/Account/helpers"; +import Login from "pages/Account/Login"; import { CountDown } from "components/molecules/CountDown"; import { LoadingPage } from "components/molecules/LoadingPage/LoadingPage"; import TemplateWrapper from "./TemplateWrapper"; -import { updateTheme } from "./helpers"; - import "./VenuePage.scss"; -import useConnectCurrentVenue from "hooks/useConnectCurrentVenue"; -import { isCompleteProfile, updateProfileEnteredVenueIds } from "utils/profile"; -import { isTruthy } from "utils/types"; -import Login from "pages/Account/Login"; -import { showZendeskWidget } from "utils/zendesk"; + +const VenueDataWrapper = () => { + const venueId = useVenueId(); + const { currentVenue, isCurrentVenueLoaded } = useConnectCurrentVenueNG( + venueId! + ); + useConnectWorldUsers(currentVenue); + + const { isWorldUsersLoaded } = useWorldUsers(); + + if (!isCurrentVenueLoaded || !currentVenue || !isWorldUsersLoaded) + return ; + + return ; +}; const hasPaidEvents = (template: VenueTemplate) => { return template === VenueTemplate.jazzbar; @@ -296,4 +313,4 @@ const VenuePage: React.FC = () => { return ; }; -export default VenuePage; +export default VenueDataWrapper; diff --git a/src/types/Firestore.ts b/src/types/Firestore.ts index 87c1c44ca9..6d9de62b12 100644 --- a/src/types/Firestore.ts +++ b/src/types/Firestore.ts @@ -1,3 +1,5 @@ +import { FirebaseReducer } from "react-redux-firebase"; + import { AdminRole } from "hooks/roles"; import { PrivateChatMessage, RestrictedChatMessage } from "store/actions/Chat"; @@ -77,6 +79,7 @@ export interface FirestoreData { venueChats?: Record; venueEvents?: Record; venues?: Record; + profile: FirebaseReducer.Profile; } // note: these entries should be sorted alphabetically diff --git a/src/utils/selectors.ts b/src/utils/selectors.ts index c725f8c22a..53450797d4 100644 --- a/src/utils/selectors.ts +++ b/src/utils/selectors.ts @@ -33,7 +33,7 @@ export const authSelector: SparkleSelector = ( */ export const profileSelector: SparkleSelector> = ( state -) => state.firebase.profile; +) => state.firestore.data.profile; /** * Selector to retrieve currentVenue?.[0] from the Redux Firestore.