Skip to content

Commit d5e8fa7

Browse files
igachmovmelonsunny-viktoryiamike-lvov
authored
refactor Event Schedule UI for new design + add personal schedule (#1302)
Implements New Event Schedule Co-authored-by: Viktoryia <[email protected]> Co-authored-by: mike-lvov <[email protected]>
1 parent 09f84e0 commit d5e8fa7

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

55 files changed

+1251
-1000
lines changed

src/api/profile.ts

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
import Bugsnag from "@bugsnag/js";
22
import firebase from "firebase/app";
33

4+
import { VenueEvent } from "types/venues";
5+
6+
import { WithVenueId } from "utils/id";
7+
48
export interface MakeUpdateUserGridLocationProps {
59
venueId: string;
610
userUid: string;
@@ -48,3 +52,50 @@ export const makeUpdateUserGridLocation = ({
4852
firestore.doc(doc).set(newData);
4953
});
5054
};
55+
56+
export interface UpdatePersonalizedScheduleProps {
57+
event: WithVenueId<VenueEvent>;
58+
userId: string;
59+
removeMode?: boolean;
60+
}
61+
62+
export const addEventToPersonalizedSchedule = ({
63+
event,
64+
userId,
65+
}: Omit<UpdatePersonalizedScheduleProps, "removeMode">): Promise<void> =>
66+
updatePersonalizedSchedule({ event, userId });
67+
68+
export const removeEventFromPersonalizedSchedule = ({
69+
event,
70+
userId,
71+
}: Omit<UpdatePersonalizedScheduleProps, "removeMode">): Promise<void> =>
72+
updatePersonalizedSchedule({ event, userId, removeMode: true });
73+
74+
export const updatePersonalizedSchedule = async ({
75+
event,
76+
userId,
77+
removeMode = false,
78+
}: UpdatePersonalizedScheduleProps): Promise<void> => {
79+
const userProfileRef = firebase.firestore().collection("users").doc(userId);
80+
81+
const modify = removeMode
82+
? firebase.firestore.FieldValue.arrayRemove
83+
: firebase.firestore.FieldValue.arrayUnion;
84+
85+
const newSavedEvents = {
86+
[`myPersonalizedSchedule.${event.venueId}`]: modify(event.id),
87+
};
88+
89+
return userProfileRef.update(newSavedEvents).catch((err) => {
90+
Bugsnag.notify(err, (event) => {
91+
event.addMetadata("context", {
92+
location: "api/profile::saveEventToProfile",
93+
userId,
94+
event,
95+
removeMode,
96+
});
97+
98+
throw err;
99+
});
100+
});
101+
};

src/assets/icons/icon-loading.svg

Lines changed: 14 additions & 0 deletions
Loading

src/components/molecules/EventDisplay/EventDisplay.tsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,13 @@ export interface EventDisplayProps {
1616
venue?: WithId<AnyVenue>;
1717
}
1818

19+
/**
20+
* @dept the componnet is used in the OnlineStats and VenuePreview (Playa) which are to be removed as part of the Playa cleanup work.
21+
*
22+
* @see https://github.com/sparkletown/sparkle/pull/833
23+
*
24+
* @deprecated since https://github.com/sparkletown/sparkle/pull/1302 is merged; the component is replaced by ScheduleEvent
25+
*/
1926
export const EventDisplay: React.FC<EventDisplayProps> = ({ event, venue }) => {
2027
const eventRoomTitle = event.room;
2128

src/components/molecules/EventPaymentButton/EventPaymentButton.tsx

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,25 @@
11
import React from "react";
22
import "firebase/functions";
3+
import { Link } from "react-router-dom";
34

45
import { VenueEvent } from "types/venues";
56

6-
import "./EventPaymentButton.scss";
7-
import useConnectUserPurchaseHistory from "hooks/useConnectUserPurchaseHistory";
8-
import { Link } from "react-router-dom";
97
import { hasUserBoughtTicketForEvent } from "utils/hasUserBoughtTicket";
108
import { isUserAMember } from "utils/isUserAMember";
11-
import { canUserJoinTheEvent } from "utils/time";
12-
import { useUser } from "hooks/useUser";
13-
import { useSelector } from "hooks/useSelector";
9+
import { isEventStartingSoon } from "utils/event";
1410
import { WithId } from "utils/id";
1511
import { venueEntranceUrl } from "utils/url";
1612
import {
1713
currentVenueSelectorData,
1814
userPurchaseHistorySelector,
1915
} from "utils/selectors";
2016

17+
import { useUser } from "hooks/useUser";
18+
import { useSelector } from "hooks/useSelector";
19+
import useConnectUserPurchaseHistory from "hooks/useConnectUserPurchaseHistory";
20+
21+
import "./EventPaymentButton.scss";
22+
2123
interface PropsType {
2224
event: WithId<VenueEvent>;
2325
venueId: string;
@@ -57,7 +59,7 @@ const EventPaymentButton: React.FunctionComponent<PropsType> = ({
5759
<button
5860
role="link"
5961
className="btn btn-primary buy-tickets-button"
60-
disabled={!canUserJoinTheEvent(event)}
62+
disabled={isEventStartingSoon(event)}
6163
>
6264
Join the event
6365
</button>

src/components/molecules/LiveSchedule/LiveSchedule.scss

Lines changed: 0 additions & 51 deletions
This file was deleted.

src/components/molecules/LiveSchedule/LiveSchedule.tsx

Lines changed: 0 additions & 71 deletions
This file was deleted.

src/components/molecules/LiveSchedule/index.ts

Lines changed: 0 additions & 1 deletion
This file was deleted.
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
@keyframes loadingspin {
2+
from {
3+
transform: rotate(0deg);
4+
}
5+
to {
6+
transform: rotate(360deg);
7+
}
8+
}
9+
10+
$Loading__icon--size: 40px;
11+
$Loading__icon--margin-bottom: 1rem;
12+
$Loading__message--font-size: 0.9rem;
13+
$Loading__message--opacity: 0.6;
14+
15+
.Loading {
16+
display: flex;
17+
flex-direction: column;
18+
width: 100%;
19+
text-align: center;
20+
21+
&__icon {
22+
margin: 0 auto;
23+
width: $Loading__icon--size;
24+
height: $Loading__icon--size;
25+
margin-bottom: $Loading__icon--margin-bottom;
26+
animation: loadingspin 0.6s infinite linear;
27+
}
28+
29+
&__message {
30+
font-size: $Loading__message--font-size;
31+
opacity: $Loading__message--opacity;
32+
}
33+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React, { FC } from "react";
2+
3+
import LoadingIcon from "assets/icons/icon-loading.svg";
4+
5+
import "./Loading.scss";
6+
7+
export interface LoadingProps {
8+
message?: string;
9+
}
10+
11+
export const Loading: FC<LoadingProps> = ({ message }) => {
12+
return (
13+
<div className="Loading">
14+
<img className="Loading__icon" src={LoadingIcon} alt="loading" />
15+
<span className="Loading__message">{message}</span>
16+
</div>
17+
);
18+
};
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { Loading } from "./Loading";

0 commit comments

Comments
 (0)