3pp-mirror/rallly
1
0
Fork 0
mirror of https://github.com/lukevella/rallly.git synced 2025-05-24 22:36:22 +02:00
Code Issues Projects Releases Packages Wiki Activity

Revert "🐛 Fix time zone reset when replacing all options (#1221)" (#1227)

Browse source
This commit is contained in:
Luke Vella 2024-07-29 14:07:45 +01:00 • committed by GitHub
parent 737d6e73ed
commit 5a785a5317
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 47 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

4
apps/web/src/app/[locale]/poll/[urlId]/edit-options/page.tsx
View file

@ -79,8 +79,7 @@ const Page = () => {
date: start.format("YYYY-MM-DD"), date: start.format("YYYY-MM-DD"),
}; };
}), }),
timeZone: poll.timeZone || undefined, timeZone: poll.timeZone ?? "",
autoTimeZone: !!poll.timeZone,
duration: poll.options[0]?.duration || 60, duration: poll.options[0]?.duration || 60,
}, },
}); });
@ -107,6 +106,7 @@ const Page = () => {
updatePollMutation( updatePollMutation(
{ {
urlId: poll.adminUrlId, urlId: poll.adminUrlId,
timeZone: data.timeZone,
optionsToDelete: optionsToDelete.map(({ id }) => id), optionsToDelete: optionsToDelete.map(({ id }) => id),
optionsToAdd, optionsToAdd,
}, },

7
apps/web/src/components/create-poll.tsx
View file

@ -18,7 +18,6 @@ import { PollSettingsForm } from "@/components/forms/poll-settings";
import { Trans } from "@/components/trans"; import { Trans } from "@/components/trans";
import { useUser } from "@/components/user-provider"; import { useUser } from "@/components/user-provider";
import { setCookie } from "@/utils/cookies"; import { setCookie } from "@/utils/cookies";
import { getBrowserTimeZone } from "@/utils/date-time-utils";
import { usePostHog } from "@/utils/posthog"; import { usePostHog } from "@/utils/posthog";
import { trpc } from "@/utils/trpc/client"; import { trpc } from "@/utils/trpc/client";
@ -48,8 +47,6 @@ export const CreatePoll: React.FunctionComponent = () => {
description: "", description: "",
location: "", location: "",
view: "month", view: "month",
autoTimeZone: true,
timeZone: user.timeZone || getBrowserTimeZone(),
options: [], options: [],
hideScores: false, hideScores: false,
hideParticipants: false, hideParticipants: false,
@ -79,13 +76,13 @@ export const CreatePoll: React.FunctionComponent = () => {
<form <form
onSubmit={form.handleSubmit(async (formData) => { onSubmit={form.handleSubmit(async (formData) => {
const title = required(formData?.title); const title = required(formData?.title);
const isFullDay = formData?.options?.[0]?.type === "date";
await createPoll.mutateAsync( await createPoll.mutateAsync(
{ {
title: title, title: title,
location: formData?.location, location: formData?.location,
description: formData?.description, description: formData?.description,
timeZone: !isFullDay ? formData?.timeZone : undefined, timeZone: formData?.timeZone,
hideParticipants: formData?.hideParticipants, hideParticipants: formData?.hideParticipants,
disableComments: formData?.disableComments, disableComments: formData?.disableComments,
hideScores: formData?.hideScores, hideScores: formData?.hideScores,

7
apps/web/src/components/forms/poll-options-form/month-calendar/month-calendar.tsx
View file

@ -22,11 +22,14 @@ import {
} from "lucide-react"; } from "lucide-react";
import { useTranslation } from "next-i18next"; import { useTranslation } from "next-i18next";
import * as React from "react"; import * as React from "react";
import { useFormContext } from "react-hook-form";
import { NewEventData } from "@/components/forms";
import { Trans } from "@/components/trans"; import { Trans } from "@/components/trans";
import { import {
expectTimeOption, expectTimeOption,
getBrowserTimeZone,
getDateProps, getDateProps,
removeAllOptionsForDay, removeAllOptionsForDay,
} from "../../../../utils/date-time-utils"; } from "../../../../utils/date-time-utils";
@ -48,6 +51,8 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
const { t } = useTranslation(); const { t } = useTranslation();
const isTimedEvent = options.some((option) => option.type === "timeSlot"); const isTimedEvent = options.some((option) => option.type === "timeSlot");
const form = useFormContext<NewEventData>();
const optionsByDay = React.useMemo(() => { const optionsByDay = React.useMemo(() => {
const res: Record< const res: Record<
string, string,
@ -220,6 +225,7 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
checked={isTimedEvent} checked={isTimedEvent}
onCheckedChange={(checked) => { onCheckedChange={(checked) => {
if (checked) { if (checked) {
form.setValue("timeZone", getBrowserTimeZone());
// convert dates to time slots // convert dates to time slots
onChange( onChange(
options.map<DateTimeOption>((option) => { options.map<DateTimeOption>((option) => {
@ -241,6 +247,7 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
}), }),
); );
} else { } else {
form.setValue("timeZone", "");
onChange( onChange(
datepicker.selection.map((date) => ({ datepicker.selection.map((date) => ({
type: "date", type: "date",

73
apps/web/src/components/forms/poll-options-form/poll-options-form.tsx
View file

@ -22,6 +22,7 @@ import { useFormContext } from "react-hook-form";
import { TimeZoneCommand } from "@/components/time-zone-picker/time-zone-select"; import { TimeZoneCommand } from "@/components/time-zone-picker/time-zone-select";
import { getBrowserTimeZone } from "../../../utils/date-time-utils";
import { NewEventData } from "../types"; import { NewEventData } from "../types";
import MonthCalendar from "./month-calendar"; import MonthCalendar from "./month-calendar";
import { DateTimeOption } from "./types"; import { DateTimeOption } from "./types";
@ -31,7 +32,6 @@ export type PollOptionsData = {
navigationDate: string; // used to navigate to the right part of the calendar navigationDate: string; // used to navigate to the right part of the calendar
duration: number; // duration of the event in minutes duration: number; // duration of the event in minutes
timeZone: string; timeZone: string;
autoTimeZone: boolean;
view: string; view: string;
options: DateTimeOption[]; options: DateTimeOption[];
}; };
@ -73,6 +73,7 @@ const PollOptionsForm = ({
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
const watchOptions = watch("options", [])!; const watchOptions = watch("options", [])!;
const watchDuration = watch("duration"); const watchDuration = watch("duration");
const watchTimeZone = watch("timeZone");
const options = getValues("options"); const options = getValues("options");
const datesOnly = const datesOnly =
@ -148,6 +149,7 @@ const PollOptionsForm = ({
"options", "options",
watchOptions.filter((option) => option.type === "date"), watchOptions.filter((option) => option.type === "date"),
); );
setValue("timeZone", "");
dateOrTimeRangeDialog.dismiss(); dateOrTimeRangeDialog.dismiss();
}} }}
> >
@ -159,6 +161,9 @@ const PollOptionsForm = ({
"options", "options",
watchOptions.filter((option) => option.type === "timeSlot"), watchOptions.filter((option) => option.type === "timeSlot"),
); );
if (!watchTimeZone) {
setValue("timeZone", getBrowserTimeZone());
}
dateOrTimeRangeDialog.dismiss(); dateOrTimeRangeDialog.dismiss();
}} }}
variant="primary" variant="primary"
@ -210,7 +215,7 @@ const PollOptionsForm = ({
{!datesOnly ? ( {!datesOnly ? (
<FormField <FormField
control={form.control} control={form.control}
name="autoTimeZone" name="timeZone"
render={({ field }) => ( render={({ field }) => (
<div <div
className={cn( className={cn(
@ -219,24 +224,24 @@ const PollOptionsForm = ({
> >
<div className="flex h-9 items-center gap-x-2.5 p-2"> <div className="flex h-9 items-center gap-x-2.5 p-2">
<Switch <Switch
id="autoTimeZone" id="timeZone"
disabled={disableTimeZoneChange} disabled={disableTimeZoneChange}
checked={!!field.value} checked={!!field.value}
onCheckedChange={(checked) => { onCheckedChange={(checked) => {
if (checked) { if (checked) {
field.onChange(true); field.onChange(getBrowserTimeZone());
} else { } else {
field.onChange(false); field.onChange("");
} }
}} }}
/> />
<Label htmlFor="autoTimeZone"> <Label htmlFor="timeZone">
<Trans <Trans
i18nKey="autoTimeZone" i18nKey="autoTimeZone"
defaults="Automatic Time Zone Conversion" defaults="Automatic Time Zone Conversion"
/> />
</Label> </Label>
<Tooltip delayDuration={0}> <Tooltip>
<TooltipTrigger type="button"> <TooltipTrigger type="button">
<InfoIcon className="text-muted-foreground size-4" /> <InfoIcon className="text-muted-foreground size-4" />
</TooltipTrigger> </TooltipTrigger>
@ -249,36 +254,30 @@ const PollOptionsForm = ({
</Tooltip> </Tooltip>
</div> </div>
{field.value ? ( {field.value ? (
<FormField <div>
control={form.control} <Button
name="timeZone" disabled={disableTimeZoneChange}
render={({ field }) => ( onClick={() => {
<div> showTimeZoneCommandModal(true);
<Button }}
disabled={disableTimeZoneChange} variant="ghost"
onClick={() => { >
showTimeZoneCommandModal(true); <GlobeIcon className="text-muted-foreground size-4" />
}} {field.value}
variant="ghost" </Button>
> <CommandDialog
<GlobeIcon className="text-muted-foreground size-4" /> open={isTimeZoneCommandModalOpen}
{field.value} onOpenChange={showTimeZoneCommandModal}
</Button> >
<CommandDialog <TimeZoneCommand
open={isTimeZoneCommandModalOpen} value={field.value}
onOpenChange={showTimeZoneCommandModal} onSelect={(newValue) => {
> field.onChange(newValue);
<TimeZoneCommand showTimeZoneCommandModal(false);
value={field.value} }}
onSelect={(newValue) => { />
field.onChange(newValue); </CommandDialog>
showTimeZoneCommandModal(false); </div>
}}
/>
</CommandDialog>
</div>
)}
/>
) : null} ) : null}
</div> </div>
)} )}

3
apps/web/src/components/user-provider.tsx
View file

@ -78,9 +78,6 @@ export const UserProvider = (props: { children?: React.ReactNode }) => {
email: user.email || null, email: user.email || null,
isGuest: !user.email, isGuest: !user.email,
tier, tier,
timeFormat: user.timeFormat ?? null,
timeZone: user.timeZone ?? null,
weekStart: user.weekStart ?? null,
}, },
refresh: session.update, refresh: session.update,
ownsObject: ({ userId }) => { ownsObject: ({ userId }) => {