2023-03-09 09:07:23 +00:00
|
|
|
import Link from "next/link";
|
|
|
|
|
|
|
|
import { CAL_URL } from "@calcom/lib/constants";
|
|
|
|
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
2023-04-12 15:26:31 +00:00
|
|
|
import { AlertCircle, ArrowRight, Check } from "@calcom/ui/components/icon";
|
2023-03-09 09:07:23 +00:00
|
|
|
|
|
|
|
const ExistingGoogleCal = ({ gCalInstalled, appName }: { gCalInstalled?: boolean; appName: string }) => {
|
|
|
|
const { t } = useLocale();
|
|
|
|
|
|
|
|
return gCalInstalled ? (
|
2023-04-05 18:14:46 +00:00
|
|
|
<div className="bg-subtle rounded-md py-3 px-4">
|
2023-03-09 09:07:23 +00:00
|
|
|
<div className="items-start space-x-2.5">
|
|
|
|
<div className="flex items-start">
|
|
|
|
<div>
|
2023-04-12 15:26:31 +00:00
|
|
|
<Check className="mt-1 mr-2 font-semibold" />
|
2023-03-09 09:07:23 +00:00
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<span className="font-semibold">{t("google_calendar_is_connected")}</span>
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
|
<span>{t("requires_google_calendar")}</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
) : (
|
2023-04-05 18:14:46 +00:00
|
|
|
<div className="bg-info text-info rounded-md py-3 px-4">
|
2023-03-09 09:07:23 +00:00
|
|
|
<div className="items-start space-x-2.5">
|
|
|
|
<div className="flex items-start">
|
|
|
|
<div>
|
2023-04-12 15:26:31 +00:00
|
|
|
<AlertCircle className="mt-1 mr-2 font-semibold" />
|
2023-03-09 09:07:23 +00:00
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<span className="font-semibold">{t("this_app_requires_google_calendar", { appName })}</span>
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
|
<>
|
|
|
|
<Link
|
|
|
|
href={`${CAL_URL}/apps/google-calendar`}
|
2023-04-05 18:14:46 +00:00
|
|
|
className="text-info flex items-center underline">
|
2023-03-09 09:07:23 +00:00
|
|
|
<span className="mr-1">{t("connect_google_calendar")}</span>
|
2023-04-12 15:26:31 +00:00
|
|
|
<ArrowRight />
|
2023-03-09 09:07:23 +00:00
|
|
|
</Link>
|
|
|
|
</>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default ExistingGoogleCal;
|