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
sean-brydon 2022-07-04 15:26:22 +01:00 committed by GitHub
parent b546d9e33e
commit eec2d8ceed
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 16 deletions

View File

@ -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>
/> </button>
<p className="sr-only">Go Back</p>
</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>