fix: upgrade btn bug (#9104)
* fix: upgrade btn bug Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> * fix: use border-subtle Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> --------- Signed-off-by: Udit Takkar <udit.07814802719@cse.mait.ac.in> Co-authored-by: Peer Richelsen <peeroke@gmail.com>
This commit is contained in:
parent
711959048b
commit
efdca50ddc
|
@ -1,3 +1,4 @@
|
||||||
|
import { useRouter } from "next/navigation";
|
||||||
import { useState, Suspense } from "react";
|
import { useState, Suspense } from "react";
|
||||||
|
|
||||||
import dayjs from "@calcom/dayjs";
|
import dayjs from "@calcom/dayjs";
|
||||||
|
@ -8,14 +9,7 @@ import type { RecordingItemSchema } from "@calcom/prisma/zod-utils";
|
||||||
import type { RouterOutputs } from "@calcom/trpc/react";
|
import type { RouterOutputs } from "@calcom/trpc/react";
|
||||||
import { trpc } from "@calcom/trpc/react";
|
import { trpc } from "@calcom/trpc/react";
|
||||||
import type { PartialReference } from "@calcom/types/EventManager";
|
import type { PartialReference } from "@calcom/types/EventManager";
|
||||||
import {
|
import { Dialog, DialogClose, DialogContent, DialogFooter, DialogHeader } from "@calcom/ui";
|
||||||
Dialog,
|
|
||||||
DialogClose,
|
|
||||||
DialogContent,
|
|
||||||
DialogFooter,
|
|
||||||
DialogHeader,
|
|
||||||
UpgradeTeamsBadge,
|
|
||||||
} from "@calcom/ui";
|
|
||||||
import { Button } from "@calcom/ui";
|
import { Button } from "@calcom/ui";
|
||||||
import { Download } from "@calcom/ui/components/icon";
|
import { Download } from "@calcom/ui/components/icon";
|
||||||
|
|
||||||
|
@ -101,6 +95,7 @@ const useRecordingDownload = () => {
|
||||||
const ViewRecordingsList = ({ roomName, hasTeamPlan }: { roomName: string; hasTeamPlan: boolean }) => {
|
const ViewRecordingsList = ({ roomName, hasTeamPlan }: { roomName: string; hasTeamPlan: boolean }) => {
|
||||||
const { t } = useLocale();
|
const { t } = useLocale();
|
||||||
const { setRecordingId, isFetching, recordingId } = useRecordingDownload();
|
const { setRecordingId, isFetching, recordingId } = useRecordingDownload();
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
const { data: recordings } = trpc.viewer.getCalVideoRecordings.useQuery(
|
const { data: recordings } = trpc.viewer.getCalVideoRecordings.useQuery(
|
||||||
{ roomName },
|
{ roomName },
|
||||||
|
@ -121,7 +116,7 @@ const ViewRecordingsList = ({ roomName, hasTeamPlan }: { roomName: string; hasTe
|
||||||
{recordings.data.map((recording: RecordingItemSchema, index: number) => {
|
{recordings.data.map((recording: RecordingItemSchema, index: number) => {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="flex w-full items-center justify-between rounded-md border px-4 py-2"
|
className="border-subtle flex w-full items-center justify-between rounded-md border px-4 py-2"
|
||||||
key={recording.id}>
|
key={recording.id}>
|
||||||
<div className="flex flex-col">
|
<div className="flex flex-col">
|
||||||
<h1 className="text-sm font-semibold">
|
<h1 className="text-sm font-semibold">
|
||||||
|
@ -138,7 +133,12 @@ const ViewRecordingsList = ({ roomName, hasTeamPlan }: { roomName: string; hasTe
|
||||||
{t("download")}
|
{t("download")}
|
||||||
</Button>
|
</Button>
|
||||||
) : (
|
) : (
|
||||||
<UpgradeTeamsBadge />
|
<Button
|
||||||
|
tooltip={t("upgrade_to_access_recordings_description")}
|
||||||
|
className="ml-4 lg:ml-0"
|
||||||
|
onClick={() => router.push("/teams")}>
|
||||||
|
{t("upgrade")}
|
||||||
|
</Button>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -1,31 +0,0 @@
|
||||||
import { useRouter } from "next/router";
|
|
||||||
|
|
||||||
import { WEBAPP_URL } from "@calcom/lib/constants";
|
|
||||||
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
|
||||||
import { Button } from "@calcom/ui";
|
|
||||||
import { Users } from "@calcom/ui/components/icon";
|
|
||||||
|
|
||||||
export default function UpgradeRecordingBanner() {
|
|
||||||
const { t } = useLocale();
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="bg-subtle flex items-start gap-2 rounded-md p-4">
|
|
||||||
<Users className="dark:bg-gray-90 inline-block h-5 w-5" />
|
|
||||||
<div className="flex flex-col gap-4">
|
|
||||||
<div className="flex flex-col gap-2">
|
|
||||||
<h2 className="text-sm font-semibold">{t("upgrade_to_access_recordings_title")}</h2>
|
|
||||||
<p className="text-sm font-normal">{t("upgrade_to_access_recordings_description")}</p>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<Button
|
|
||||||
onClick={() => {
|
|
||||||
router.push(`${WEBAPP_URL}/teams`);
|
|
||||||
}}>
|
|
||||||
{t("upgrade_now")}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user