Implement profile back button (#3165)
* Implement profile backbutton * update slug to use username * Back Button Improvments Co-authored-by: Peer Richelsen <peeroke@gmail.com>pull/3138/head^2
parent
b546d9e33e
commit
eec2d8ceed
|
@ -16,6 +16,7 @@ import { EventType } from "@prisma/client";
|
||||||
import * as Collapsible from "@radix-ui/react-collapsible";
|
import * as Collapsible from "@radix-ui/react-collapsible";
|
||||||
import { useContracts } from "contexts/contractsContext";
|
import { useContracts } from "contexts/contractsContext";
|
||||||
import { TFunction } from "next-i18next";
|
import { TFunction } from "next-i18next";
|
||||||
|
import Link from "next/link";
|
||||||
import { useRouter } from "next/router";
|
import { useRouter } from "next/router";
|
||||||
import { useEffect, useMemo, useState } from "react";
|
import { useEffect, useMemo, useState } from "react";
|
||||||
import { FormattedNumber, IntlProvider } from "react-intl";
|
import { FormattedNumber, IntlProvider } from "react-intl";
|
||||||
|
@ -30,7 +31,7 @@ import {
|
||||||
useIsEmbed,
|
useIsEmbed,
|
||||||
} from "@calcom/embed-core/embed-iframe";
|
} from "@calcom/embed-core/embed-iframe";
|
||||||
import classNames from "@calcom/lib/classNames";
|
import classNames from "@calcom/lib/classNames";
|
||||||
import { CAL_URL, WEBAPP_URL } from "@calcom/lib/constants";
|
import { CAL_URL, WEBSITE_URL } from "@calcom/lib/constants";
|
||||||
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
||||||
import { getRecurringFreq } from "@calcom/lib/recurringStrings";
|
import { getRecurringFreq } from "@calcom/lib/recurringStrings";
|
||||||
import { localStorage } from "@calcom/lib/webstorage";
|
import { localStorage } from "@calcom/lib/webstorage";
|
||||||
|
@ -87,23 +88,15 @@ export const locationKeyToString = (location: LocationObject, t: TFunction) => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const GoBackToPreviousPage = ({ slug }: { slug: string }) => {
|
const GoBackToPreviousPage = ({ slug, t }: { slug: string; t: TFunction }) => {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const [previousPage, setPreviousPage] = useState<string>();
|
return (
|
||||||
useEffect(() => {
|
|
||||||
setPreviousPage(document.referrer);
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
return previousPage === `${WEBAPP_URL}/${slug}` ? (
|
|
||||||
<div className="flex h-full flex-col justify-end">
|
<div className="flex h-full flex-col justify-end">
|
||||||
<ArrowLeftIcon
|
<button title={t("profile")} onClick={() => router.replace(`${WEBSITE_URL}/${slug}`)}>
|
||||||
className="h-4 w-4 text-black transition-opacity hover:cursor-pointer dark:text-white"
|
<ArrowLeftIcon className="h-4 w-4 text-black transition-opacity hover:cursor-pointer dark:text-white" />
|
||||||
onClick={() => router.back()}
|
|
||||||
/>
|
|
||||||
<p className="sr-only">Go Back</p>
|
<p className="sr-only">Go Back</p>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
|
||||||
<></>
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -655,7 +648,7 @@ const AvailabilityPage = ({ profile, eventType }: Props) => {
|
||||||
{timezoneDropdown}
|
{timezoneDropdown}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<GoBackToPreviousPage slug={profile.slug || ""} />
|
<GoBackToPreviousPage slug={profile.name ?? ""} t={t} />
|
||||||
|
|
||||||
{/* Temporarily disabled - booking?.startTime && rescheduleUid && (
|
{/* Temporarily disabled - booking?.startTime && rescheduleUid && (
|
||||||
<div>
|
<div>
|
||||||
|
|
Loading…
Reference in New Issue