replaced window.location with NEXT_PUBLIC_APP_URL (#769)

* replaced window.location with process.env.NEXT_PUBLIC_APP_URL, removed empty classNames

* wip

components/Tooltip.tsx

@@ -9,12 +9,11 @@ export function Tooltip({
   onOpenChange,
   ...props
 }: {
-  [x: string]: any;
   children: React.ReactNode;
   content: React.ReactNode;
-  open: boolean;
-  defaultOpen: boolean;
-  onOpenChange: (open: boolean) => void;
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (open: boolean) => void;
 }) {
   return (
     <TooltipPrimitive.Root

components/team/EditTeam.tsx

@@ -135,7 +135,7 @@ export default function EditTeam(props: { team: Team | undefined | null; onClose
             Back
           </Button>
         </div>
-        <div className="">
+        <div>
           <div className="pb-5 pr-4 sm:pb-6">
             <h3 className="text-lg font-bold leading-6 text-gray-900">{props.team?.name}</h3>
             <div className="max-w-xl mt-2 text-sm text-gray-500">

components/team/TeamListItem.tsx

@@ -59,19 +59,20 @@ export default function TeamListItem(props: {
         <div className="flex justify-between my-4">
           <div className="flex">
             <Avatar
+              size={9}
               imageSrc={
                 props.team.logo
                   ? props.team.logo
                   : "https://eu.ui-avatars.com/api/?background=fff&color=039be5&name=" +
                     encodeURIComponent(props.team.name || "")
               }
-              displayName="Team Logo"
+              alt="Team Logo"
               className="rounded-full w-9 h-9"
             />
             <div className="inline-block ml-3">
               <span className="text-sm font-bold text-neutral-700">{props.team.name}</span>
               <span className="block -mt-1 text-xs text-gray-400">
-                {window.location.hostname}/{props.team.slug}
+                {process.env.NEXT_PUBLIC_APP_URL}/{props.team.slug}
               </span>
             </div>
           </div>
@@ -100,7 +101,9 @@ export default function TeamListItem(props: {
               <Tooltip content="Copy link">
                 <Button
                   onClick={() => {
-                    navigator.clipboard.writeText(window.location.hostname + "/team/" + props.team.slug);
+                    navigator.clipboard.writeText(
+                      process.env.NEXT_PUBLIC_APP_URL + "/team/" + props.team.slug
+                    );
                     showToast("Link copied!", "success");
                   }}
                   color="minimal"
@@ -124,8 +127,8 @@ export default function TeamListItem(props: {
                       Edit team
                     </Button>
                   </DropdownMenuItem>
-                  <DropdownMenuItem className="">
-                    <Link href={`/team/${props.team.slug}`} passHref={true}>
+                  <DropdownMenuItem>
+                    <Link href={`${process.env.NEXT_PUBLIC_APP_URL}/team/${props.team.slug}`} passHref={true}>
                       <a target="_blank">
                         <Button type="button" color="minimal" className="w-full" StartIcon={ExternalLinkIcon}>
                           {" "}

components/ui/Schedule/Schedule.tsx

@@ -243,7 +243,7 @@ const SchedulerForm = ({ schedule = DEFAULT_SCHEDULE, onSubmit }: Props) => {
               {timeOptions("end")}
             </select>
           </div>
-          <div className="">
+          <div>
             <DeleteAction range={range} />
           </div>
         </div>

components/ui/Scheduler.tsx

@@ -101,7 +101,7 @@ export const Scheduler = ({
     <div>
       <div className="flex">
         <div className="w-full">
-          <div className="">
+          <div>
             <label htmlFor="timeZone" className="block text-sm font-medium text-gray-700">
               Timezone
             </label>

components/ui/UsernameInput.tsx

@@ -8,7 +8,7 @@ const UsernameInput = React.forwardRef((props, ref) => (
     </label>
     <div className="flex mt-1 rounded-md shadow-sm">
       <span className="inline-flex items-center px-3 text-gray-500 border border-r-0 border-gray-300 rounded-l-sm bg-gray-50 sm:text-sm">
-        {typeof window !== "undefined" && window.location.hostname}/{props.label && "team/"}
+        {process.env.NEXT_PUBLIC_APP_URL}/{props.label && "team/"}
       </span>
       <input
         ref={ref}

pages/bookings/index.tsx

@@ -224,7 +224,11 @@ export default function Bookings({ bookings }) {
                                               <Menu.Item>
                                                 {({ active }) => (
                                                   <a
-                                                    href={window.location.href + "/../cancel/" + booking.uid}
+                                                    href={
+                                                      process.env.NEXT_PUBLIC_APP_URL +
+                                                      "/../cancel/" +
+                                                      booking.uid
+                                                    }
                                                     className={classNames(
                                                       active
                                                         ? "bg-neutral-100 text-neutral-900"
@@ -243,7 +247,9 @@ export default function Bookings({ bookings }) {
                                                 {({ active }) => (
                                                   <a
                                                     href={
-                                                      window.location.href + "/../reschedule/" + booking.uid
+                                                      process.env.NEXT_PUBLIC_APP_URL +
+                                                      "/../reschedule/" +
+                                                      booking.uid
                                                     }
                                                     className={classNames(
                                                       active

pages/event-types/index.tsx

@@ -114,8 +114,11 @@ const EventTypesPage = (props: PageProps) => {
           </span>
         )}
         {profile?.slug && (
-          <Link href={`/${profile.slug}`}>
-            <a className="block text-xs text-neutral-500">{`cal.com/${profile.slug}`}</a>
+          <Link href={`${process.env.NEXT_PUBLIC_APP_URL}/${profile.slug}`}>
+            <a className="block text-xs text-neutral-500">{`${process.env.NEXT_PUBLIC_APP_URL?.replace(
+              "https://",
+              ""
+            )}/${profile.slug}`}</a>
           </Link>
         )}
       </div>

pages/getting-started.tsx

@@ -566,7 +566,7 @@ export default function Onboarding(props: OnboardingProps) {
       <div className="mx-auto py-24 px-4">
         <article className="relative">
           <section className="sm:mx-auto sm:w-full sm:max-w-md space-y-4">
-            <header className="">
+            <header>
               <Text className="text-white" variant="largetitle">
                 {steps[currentStep].title}
               </Text>