Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 | 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 18x 6x 18x 6x 18x 18x 18x 6x 18x | import { useMemo } from "react";
import { formatMapAddress, getDomainName } from "@sections/PayBuilder/utils";
import { usePayBuilderForm } from "@sections/PayBuilder/provider/PayBuilderFormProvider";
export function useEventDateLocationData() {
const paybuilderFormValues = usePayBuilderForm();
const { parsedValues, methods } = paybuilderFormValues;
const accentColor = parsedValues.accentColor;
// Watch specific fields instead of the entire DateLocation object
const startsAt = methods.watch("DateLocation.startsAt");
const endsAt = methods.watch("DateLocation.endsAt");
const includeTime = methods.watch("DateLocation.includeTime");
const startsAtTime = methods.watch("DateLocation.startsAtTime");
const endsAtTime = methods.watch("DateLocation.endsAtTime");
const locationURL = methods.watch("DateLocation.locationURL");
const locationPosition = methods.watch("DateLocation.locationPosition");
const isManualAddress = methods.watch("DateLocation.isManualAddress");
const locationAddress = methods.watch("DateLocation.locationAddress");
const locationShortAddress = methods.watch("DateLocation.locationShortAddress");
const dateData = useMemo(
() => ({
accentColor,
endDate: endsAt,
startDate: startsAt,
includeTime,
timers: {
startsAtTime,
endsAtTime,
},
}),
[accentColor, endsAt, startsAt, includeTime, startsAtTime, endsAtTime],
);
const locationData = useMemo(
() => ({
locationURL: getDomainName(locationURL ?? undefined),
locationPosition,
accentColor,
address: isManualAddress
? formatMapAddress(locationAddress)
: locationShortAddress,
}),
[locationURL, locationPosition, accentColor, isManualAddress, locationAddress, locationShortAddress],
);
const isOnSite = locationPosition === "onsite";
const isOnline = locationPosition === "online";
const eventDateLocationProps = useMemo(
() => ({
...dateData,
tabsDetails: {
locationPosition,
isManualAddress,
},
locationURL: getDomainName(locationURL ?? undefined),
locations: {
locationAddress,
locationShortAddress,
},
}),
[dateData, locationPosition, isManualAddress, locationURL, locationAddress, locationShortAddress],
);
return {
dateData,
locationData,
eventDateLocationProps,
isOnSite,
isOnline,
};
}
|