Skip to content

Commit fb70409

Browse files
anyulledanyulled
committed
feat: include search params in tickets url link
1 parent d590a1e commit fb70409

File tree

3 files changed

+99
-119
lines changed

3 files changed

+99
-119
lines changed

‎src/2023/Home/components/ActionButtons/ActionButtons.tsx

+24-31
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import Button from "../../../../components/UI/Button";
44
import styled from "styled-components";
55
import { BIG_BREAKPOINT } from "../../../../constants/BreakPoints";
66
import { gaEventTracker } from "../../../../components/analytics/Analytics";
7+
import { useDateInterval } from "../../../../hooks/useDateInterval";
78

89
const StyledActionDiv = styled.div`
910
display: flex;
@@ -16,16 +17,8 @@ const StyledActionDiv = styled.div`
1617
`;
1718

1819
const ActionButtons: FC<React.PropsWithChildren<unknown>> = () => {
19-
const ticketStartDay = new Date(data.tickets.startDay);
20-
const ticketEndDay = new Date(data.tickets.endDay);
21-
const CFPStartDay = new Date(data.cfp.startDay);
22-
const CFPEndDay = new Date(data.cfp.endDay);
23-
const sponsorshipStartDay = new Date(data.tickets.startDay);
24-
const sponsorshipEndDay = new Date(data.tickets.endDay);
25-
const today = new Date();
26-
27-
const isBetween = (startDay: Date, endDay: Date): boolean =>
28-
startDay < new Date() && endDay > today;
20+
const { isTicketsDisabled, isSponsorDisabled, isCfpDisabled } =
21+
useDateInterval(new Date(), data);
2922

3023
const trackSponsorshipInfo = useCallback(() => {
3124
gaEventTracker("sponsorship", "sponsorship");
@@ -41,27 +34,27 @@ const ActionButtons: FC<React.PropsWithChildren<unknown>> = () => {
4134

4235
return (
4336
<StyledActionDiv>
44-
{isBetween(ticketStartDay, ticketEndDay) && (
45-
<Button
46-
onClick={trackTickets}
47-
text="🎟️ Buy Tickets"
48-
link="https://tickets.devbcn.com/event/devbcn-2023"
49-
/>
50-
)}
51-
{isBetween(CFPStartDay, CFPEndDay) && (
52-
<Button
53-
onClick={trackCFP}
54-
text="📢 Call For Papers"
55-
link={data.cfp.link}
56-
/>
57-
)}
58-
{isBetween(sponsorshipStartDay, sponsorshipEndDay) && (
59-
<Button
60-
onClick={trackSponsorshipInfo}
61-
text="🤝 Sponsorship"
62-
link="mailto:[email protected]?subject=devBcn sponsorship"
63-
/>
64-
)}
37+
<Button
38+
onClick={trackTickets}
39+
text="🎟️ Buy Tickets"
40+
link={
41+
"https://tickets.devbcn.com/event/devbcn-2023" +
42+
window.location.search
43+
}
44+
disabled={isTicketsDisabled}
45+
/>
46+
<Button
47+
onClick={trackCFP}
48+
text="📢 Call For Papers"
49+
link={data.cfp.link}
50+
disabled={isCfpDisabled}
51+
/>
52+
<Button
53+
onClick={trackSponsorshipInfo}
54+
text="🤝 Sponsorship"
55+
link="mailto:[email protected]?subject=devBcn sponsorship"
56+
disabled={isSponsorDisabled}
57+
/>
6558
</StyledActionDiv>
6659
);
6760
};

‎src/2024/Home/components/ActionButtons.tsx

+50-56
Original file line numberDiff line numberDiff line change
@@ -1,67 +1,61 @@
1-
import {FC, useCallback} from "react";
1+
import { FC, useCallback } from "react";
22
import data from "../../../data/2024.json";
33
import styled from "styled-components";
4-
import {BIG_BREAKPOINT} from "../../../constants/BreakPoints";
5-
import {gaEventTracker} from "../../../components/analytics/Analytics";
4+
import { BIG_BREAKPOINT } from "../../../constants/BreakPoints";
5+
import { gaEventTracker } from "../../../components/analytics/Analytics";
66
import Button from "../../../components/UI/Button";
7+
import { useDateInterval } from "../../../hooks/useDateInterval";
78

89
const StyledActionDiv = styled.div`
9-
display: flex;
10-
text-align: center;
10+
display: flex;
11+
text-align: center;
1112
12-
@media (max-width: ${BIG_BREAKPOINT}px) {
13-
flex-direction: column;
14-
width: 75%;
15-
}
13+
@media (max-width: ${BIG_BREAKPOINT}px) {
14+
flex-direction: column;
15+
width: 75%;
16+
}
1617
`;
1718

1819
const ActionButtons: FC<React.PropsWithChildren<unknown>> = () => {
19-
const ticketStartDay = new Date(data.tickets.startDay);
20-
const ticketEndDay = new Date(data.tickets.endDay);
21-
const CFPStartDay = new Date(data.cfp.startDay);
22-
const CFPEndDay = new Date(data.cfp.endDay);
23-
const sponsorshipStartDay = new Date(data.sponsors.startDate);
24-
const sponsorshipEndDay = new Date(data.sponsors.endDate);
25-
const today = new Date();
26-
27-
const isBetween = (startDay: Date, endDay: Date): boolean =>
28-
startDay < new Date() && endDay > today;
29-
30-
const trackSponsorshipInfo = useCallback(() => {
31-
gaEventTracker("sponsorship", "sponsorship");
32-
}, []);
33-
34-
const trackTickets = useCallback(() => {
35-
gaEventTracker("ticket", "tickets");
36-
}, []);
37-
38-
const trackCFP = useCallback(() => {
39-
gaEventTracker("CFP", "CFP");
40-
}, []);
41-
42-
return (
43-
<StyledActionDiv>
44-
<Button
45-
onClick={trackTickets}
46-
text="🎟️ Buy Tickets"
47-
link="https://tickets.devbcn.com/event/devbcn-2024"
48-
disabled={!isBetween(ticketStartDay, ticketEndDay)}
49-
/>
50-
{isBetween(CFPStartDay, CFPEndDay) && (
51-
<Button
52-
onClick={trackCFP}
53-
text="📢 Call For Papers"
54-
link={data.cfp.link}
55-
/>
56-
)}
57-
{isBetween(sponsorshipStartDay, sponsorshipEndDay) && (
58-
<Button
59-
onClick={trackSponsorshipInfo}
60-
text="🤝 Sponsorship"
61-
link="https://www.devbcn.com/sponsorship"
62-
/>
63-
)}
64-
</StyledActionDiv>
65-
);
20+
const { isSponsorDisabled, isCfpDisabled, isTicketsDisabled } =
21+
useDateInterval(new Date(), data);
22+
23+
const trackSponsorshipInfo = useCallback(() => {
24+
gaEventTracker("sponsorship", "sponsorship");
25+
}, []);
26+
27+
const trackTickets = useCallback(() => {
28+
gaEventTracker("ticket", "tickets");
29+
}, []);
30+
31+
const trackCFP = useCallback(() => {
32+
gaEventTracker("CFP", "CFP");
33+
}, []);
34+
35+
return (
36+
<StyledActionDiv>
37+
<Button
38+
onClick={trackTickets}
39+
text="🎟️ Buy Tickets"
40+
link={
41+
"https://tickets.devbcn.com/event/devbcn-2024" +
42+
window.location.search
43+
}
44+
disabled={isTicketsDisabled}
45+
/>
46+
<Button
47+
onClick={trackCFP}
48+
text="📢 Call For Papers"
49+
link={data.cfp.link}
50+
disabled={isCfpDisabled}
51+
/>
52+
<Button
53+
onClick={trackSponsorshipInfo}
54+
text="🤝 Sponsorship"
55+
link="https://www.devbcn.com/sponsorship"
56+
disabled={isSponsorDisabled}
57+
/>
58+
</StyledActionDiv>
59+
);
6660
};
6761
export default ActionButtons;

‎src/views/Home/components/ActionButtons/ActionButtons.tsx

+25-32
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import {FC, useCallback} from "react";
1+
import { FC, useCallback } from "react";
22
import data from "../../../../data/2025.json";
33
import Button from "../../../../components/UI/Button";
44
import styled from "styled-components";
5-
import {isWithinInterval} from "date-fns";
6-
import {BIG_BREAKPOINT} from "../../../../constants/BreakPoints";
7-
import {gaEventTracker} from "../../../../components/analytics/Analytics";
5+
import { BIG_BREAKPOINT } from "../../../../constants/BreakPoints";
6+
import { gaEventTracker } from "../../../../components/analytics/Analytics";
7+
import { useDateInterval } from "../../../../hooks/useDateInterval";
88

99
const StyledActionDiv = styled.div`
1010
display: flex;
@@ -17,17 +17,8 @@ const StyledActionDiv = styled.div`
1717
`;
1818

1919
const ActionButtons: FC<React.PropsWithChildren<unknown>> = () => {
20-
const ticketStartDay = new Date(data.tickets.startDay);
21-
const ticketEndDay = new Date(data.tickets.endDay);
22-
const CFPStartDay = new Date(data.cfp.startDay);
23-
const CFPEndDay = new Date(data.cfp.endDay);
24-
const sponsorshipStartDay = new Date(data.sponsors.startDate);
25-
const sponsorshipEndDay = new Date(data.sponsors.endDate);
26-
const today = new Date();
27-
28-
29-
const isBetween = (startDay: Date, endDay: Date): boolean =>
30-
isWithinInterval(today, {start: startDay, end:endDay});
20+
const { isTicketsDisabled, isSponsorDisabled, isCfpDisabled } =
21+
useDateInterval(new Date(), data);
3122

3223
const trackSponsorshipInfo = useCallback(() => {
3324
gaEventTracker("sponsorship", "sponsorship");
@@ -41,30 +32,32 @@ const ActionButtons: FC<React.PropsWithChildren<unknown>> = () => {
4132
gaEventTracker("CFP", "CFP");
4233
}, []);
4334

44-
4535
return (
4636
<StyledActionDiv>
4737
<Button
4838
onClick={trackTickets}
4939
text="🎟️ Buy Tickets"
5040
subtext="February 1st, 2025"
51-
link="https://tickets.devbcn.com/event/devbcn-2025"
52-
disabled={!isBetween(ticketStartDay, ticketEndDay)}
41+
link={
42+
"https://tickets.devbcn.com/event/devbcn-2025" +
43+
window.location.search
44+
}
45+
disabled={isTicketsDisabled}
46+
/>
47+
<Button
48+
onClick={trackCFP}
49+
text="📢 Call For Papers"
50+
subtext="January 1st, 2025"
51+
link={data.cfp.link}
52+
disabled={isCfpDisabled}
53+
/>
54+
<Button
55+
onClick={trackSponsorshipInfo}
56+
text="🤝 Sponsorship"
57+
target="_self"
58+
link="/sponsorship"
59+
disabled={isSponsorDisabled}
5360
/>
54-
<Button
55-
onClick={trackCFP}
56-
text="📢 Call For Papers"
57-
subtext="January 1st, 2025"
58-
link={data.cfp.link}
59-
disabled={!isBetween(CFPStartDay, CFPEndDay)}
60-
/>
61-
<Button
62-
onClick={trackSponsorshipInfo}
63-
text="🤝 Sponsorship"
64-
target="_self"
65-
link="/sponsorship"
66-
disabled={!isBetween(sponsorshipStartDay, sponsorshipEndDay)}
67-
/>
6861
</StyledActionDiv>
6962
);
7063
};

0 commit comments

Comments
 (0)