diff --git a/apps/web/public/static/locales/en/common.json b/apps/web/public/static/locales/en/common.json index 992194227d..e8fbf8d97f 100644 --- a/apps/web/public/static/locales/en/common.json +++ b/apps/web/public/static/locales/en/common.json @@ -2507,6 +2507,15 @@ "event_expired": "This event is expired", "skip_contact_creation": "Skip creating contacts if they do not exist in {{appName}} ", "skip_writing_to_calendar_note": "If your ICS link is read-only (e.g., Proton Calendar), check the box above to avoid errors. You'll also need to manually update your calendar for changes.", + "apple_connect_atom_label": "Connect Apple Calendar", + "apple_connect_atom_already_connected_label": "Connected Apple Calendar", + "apple_connect_atom_loading_label": "Checking Apple Calendar", + "google_connect_atom_label": "Connect Google Calendar", + "google_connect_atom_already_connected_label": "Connected Google Calendar", + "google_connect_atom_loading_label": "Checking Google Calendar", + "outlook_connect_atom_label": "Connect Outlook Calendar", + "outlook_connect_atom_already_connected_label": "Connected Outlook Calendar", + "outlook_connect_atom_loading_label": "Checking Outlook Calendar", "booking_question_response_variables": "Booking question response variables", "ADD_NEW_STRINGS_ABOVE_THIS_LINE_TO_PREVENT_MERGE_CONFLICTS": "↑↑↑↑↑↑↑↑↑↑↑↑↑ Add your new strings above here ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑" } diff --git a/packages/platform/atoms/connect/apple/AppleConnect.tsx b/packages/platform/atoms/connect/apple/AppleConnect.tsx index a9842ba2c5..83e655f58a 100644 --- a/packages/platform/atoms/connect/apple/AppleConnect.tsx +++ b/packages/platform/atoms/connect/apple/AppleConnect.tsx @@ -10,6 +10,7 @@ import type { FC } from "react"; import { useState } from "react"; import { useForm } from "react-hook-form"; +import { useLocale } from "@calcom/lib/hooks/useLocale"; import { Button, Form, PasswordField, TextField } from "@calcom/ui"; import { SUCCESS_STATUS } from "../../../constants/api"; @@ -21,12 +22,13 @@ import { cn } from "../../src/lib/utils"; import type { OAuthConnectProps } from "../OAuthConnect"; export const AppleConnect: FC>> = ({ - label = "Connect Apple Calendar", - alreadyConnectedLabel = "Connected Apple Calendar", - loadingLabel = "Checking Apple Calendar", + label, + alreadyConnectedLabel, + loadingLabel, className, initialData, }) => { + const { t } = useLocale(); const form = useForm({ defaultValues: { username: "", @@ -40,7 +42,7 @@ export const AppleConnect: FC>> = ({ }); const [isDialogOpen, setIsDialogOpen] = useState(false); - let displayedLabel = label; + let displayedLabel = label || t("apple_connect_atom_label"); const { mutate: saveCredentials, isPending: isSaving } = useSaveCalendarCredentials({ onSuccess: (res) => { @@ -64,9 +66,9 @@ export const AppleConnect: FC>> = ({ const isDisabled = isChecking || !allowConnect; if (isChecking) { - displayedLabel = loadingLabel; + displayedLabel = loadingLabel || t("apple_connect_atom_loading_label"); } else if (!allowConnect) { - displayedLabel = alreadyConnectedLabel; + displayedLabel = alreadyConnectedLabel || t("apple_connect_atom_already_connected_label"); } return ( diff --git a/packages/platform/atoms/connect/google/GcalConnect.tsx b/packages/platform/atoms/connect/google/GcalConnect.tsx index 4812cc26cb..36ab718721 100644 --- a/packages/platform/atoms/connect/google/GcalConnect.tsx +++ b/packages/platform/atoms/connect/google/GcalConnect.tsx @@ -1,24 +1,26 @@ import type { FC } from "react"; +import { useLocale } from "@calcom/lib/hooks/useLocale"; import { GOOGLE_CALENDAR } from "@calcom/platform-constants"; import type { OAuthConnectProps } from "../OAuthConnect"; import { OAuthConnect } from "../OAuthConnect"; export const GcalConnect: FC> = ({ - label = "Connect Google Calendar", - alreadyConnectedLabel = "Connected Google Calendar", - loadingLabel = "Checking Google Calendar", + label, + alreadyConnectedLabel, + loadingLabel, className, onCheckError, redir, initialData, }) => { + const { t } = useLocale(); return ( > = ({ - label = "Connect Outlook Calendar", - alreadyConnectedLabel = "Connected Outlook Calendar", - loadingLabel = "Checking Outlook Calendar", + label, + alreadyConnectedLabel, + loadingLabel, className, onCheckError, redir, initialData, }) => { + const { t } = useLocale(); return (