@calcom/atoms 2.8.0 → 2.8.2

package/src/hooks/use-event-types-list.tsx

@@ -1,39 +0,0 @@
-import { useQuery } from "@tanstack/react-query";
-
-import { SUCCESS_STATUS } from "../constants";
-import type { ApiResponse, ApiSuccessResponse } from "../contracts";
-
-import http from "../lib/http";
-import { useAtomsContext } from "./use-atoms-context";
-
-type EventTypeWithTeam = {
-  id: number;
-  team: { id: number; name: string } | null;
-  title: string;
-  slug: string;
-  length: number;
-  username: string | null;
-};
-
-type ListWithTeamData = EventTypeWithTeam[];
-
-export const QUERY_KEY = "get-event-types-list-with-team";
-export const useEventTypesList = (props: { enabled?: boolean }) => {
-  const { isInit } = useAtomsContext();
-
-  const eventTypes = useQuery({
-    queryKey: [QUERY_KEY],
-    queryFn: () => {
-      return http.get<ApiResponse<ListWithTeamData>>("/atoms/event-types/list-with-team").then((res) => {
-        if (res.data.status === SUCCESS_STATUS) {
-          return (res.data as ApiSuccessResponse<ListWithTeamData>)?.data;
-        }
-        throw new Error(res.data.error.message);
-      });
-    },
-    enabled: props?.enabled !== undefined ? props.enabled && isInit : isInit,
-    staleTime: 5000,
-  });
-
-  return eventTypes;
-};

package/src/hooks/use-get-city-timezones.ts

@@ -1,27 +0,0 @@
-import { useQuery } from "@tanstack/react-query";
-
-import { SUCCESS_STATUS } from "../constants";
-import type { ApiResponse } from "../contracts";
-
-import http from "../lib/http";
-
-type Timezones = { city: string; timezone: string }[];
-const useGetCityTimezones = () => {
-  const pathname = `/timezones`;
-
-  const { isLoading, data } = useQuery<Timezones>({
-    queryKey: ["city-timezones"],
-    queryFn: () => {
-      return http?.get<ApiResponse<Timezones>>(pathname).then((res) => {
-        if (res.data.status === SUCCESS_STATUS) {
-          return res.data.data;
-        }
-        throw new Error(res.data.error.message);
-      });
-    },
-  });
-
-  return { isLoading, data };
-};
-
-export default useGetCityTimezones;

package/src/hooks/use-is-platform-booker-embed.ts

@@ -1,6 +0,0 @@
-import { useAtomsContext } from "./use-atoms-context";
-
-export const useIsPlatformBookerEmbed = () => {
-  const context = useAtomsContext();
-  return Boolean(context?.clientId && context?.isEmbed);
-};

package/src/hooks/use-is-platform.ts

@@ -1,6 +0,0 @@
-import { useAtomsContext } from "./use-atoms-context";
-
-export const useIsPlatform = () => {
-  const context = useAtomsContext();
-  return Boolean(context?.clientId);
-};

package/src/hooks/use-me.ts

@@ -1,30 +0,0 @@
-import { useQuery } from "@tanstack/react-query";
-
-import { SUCCESS_STATUS, V2_ENDPOINTS } from "../constants";
-import type { ApiResponse, UserResponse } from "../contracts";
-
-import http from "../lib/http";
-
-export const QUERY_KEY = "get-me";
-/**
- * Custom hook to fetch the current user's information.
- * Access Token must be provided to CalProvider in order to use this hook
- * @returns The result of the query containing the user's profile.
- */
-export const useMe = (isEmbed = false) => {
-  const pathname = `/${V2_ENDPOINTS.me}`;
-  const me = useQuery({
-    queryKey: [QUERY_KEY],
-    queryFn: () => {
-      return http?.get<ApiResponse<UserResponse>>(pathname).then((res) => {
-        if (res.data.status === SUCCESS_STATUS) {
-          return res.data;
-        }
-        throw new Error(res.data.error.message);
-      });
-    },
-    enabled: Boolean(http.getAuthorizationHeader()) && !isEmbed,
-  });
-
-  return me;
-};

package/src/hooks/use-o-auth-client.ts

@@ -1,72 +0,0 @@
-import type { AxiosError } from "axios";
-import { useEffect, useState } from "react";
-import { usePrevious } from "react-use";
-
-import { SUCCESS_STATUS } from "../constants";
-import type { ApiResponse } from "../contracts";
-
-import http from "../lib/http";
-
-interface OAuthClientData {
-  clientId: string;
-  organizationId: number | null;
-}
-
-export interface useOAuthClientProps {
-  isEmbed?: boolean;
-  clientId: string;
-  apiUrl?: string;
-  refreshUrl?: string;
-  onError: (error: string) => void;
-  onSuccess: (data: OAuthClientData) => void;
-  isOAuth2?: boolean;
-}
-export const useOAuthClient = ({
-  isEmbed,
-  clientId,
-  apiUrl,
-  refreshUrl,
-  onError,
-  onSuccess,
-  isOAuth2 = false,
-}: useOAuthClientProps) => {
-  const prevClientId = usePrevious(clientId);
-  const [isInit, setIsInit] = useState<boolean>(false);
-
-  useEffect(() => {
-    if (apiUrl) {
-      http.setUrl(apiUrl);
-      setIsInit(true);
-    }
-    if (refreshUrl) {
-      http.setRefreshUrl(refreshUrl);
-    }
-  }, [apiUrl, refreshUrl]);
-
-  useEffect(() => {
-    if (!isEmbed && clientId && http.getUrl() && prevClientId !== clientId) {
-      try {
-        const fetchUrl = isOAuth2 ? `/atoms/auth/oauth2/clients/${clientId}` : `/provider/${clientId}`;
-        http
-          .get<ApiResponse<OAuthClientData>>(fetchUrl)
-          .then((response) => {
-            if (response.data.status === SUCCESS_STATUS) {
-              onSuccess(response.data.data);
-            }
-            if (!isOAuth2) {
-              http.setClientIdHeader(clientId);
-            }
-          })
-          .catch((err: AxiosError) => {
-            if (err.response?.status === 401) {
-              onError("Invalid oAuth Client.");
-            }
-          });
-      } catch (err) {
-        console.error(err);
-      }
-    }
-  }, [isEmbed, clientId, onError, prevClientId, onSuccess, http.getUrl()]);
-
-  return { isInit };
-};

package/src/hooks/use-o-auth-flow.ts

@@ -1,120 +0,0 @@
-import type { AxiosError, AxiosRequestConfig } from "axios";
-
-import { debounce } from "lodash";
-import { useEffect, useState } from "react";
-import usePrevious from "react-use/lib/usePrevious";
-
-import type { ApiResponse } from "../contracts";
-
-import http from "../lib/http";
-
-export interface useOAuthProps {
-  accessToken?: string;
-  refreshUrl?: string;
-  onError?: (error: string) => void;
-  onSuccess?: () => void;
-  onTokenRefreshStart?: () => void;
-  onTokenRefreshSuccess?: () => void;
-  onTokenRefreshError?: (error: string) => void;
-  clientId: string;
-}
-
-const debouncedRefresh = debounce(http.refreshTokens, 10000, { leading: true, trailing: false });
-export const useOAuthFlow = ({
-  accessToken,
-  refreshUrl,
-  clientId,
-  onError,
-  onSuccess,
-  onTokenRefreshStart,
-  onTokenRefreshSuccess,
-  onTokenRefreshError,
-}: useOAuthProps) => {
-  const [isRefreshing, setIsRefreshing] = useState<boolean>(false);
-  const [clientAccessToken, setClientAccessToken] = useState<string>("");
-  const prevAccessToken = usePrevious(accessToken);
-  useEffect(() => {
-    const interceptorId =
-      clientAccessToken && http.getAuthorizationHeader()
-        ? http.responseInterceptor.use(undefined, async (err: AxiosError) => {
-            const originalRequest = err.config as AxiosRequestConfig;
-            if (refreshUrl && err.response?.status === 498 && !isRefreshing) {
-              setIsRefreshing(true);
-              onTokenRefreshStart?.();
-              const refreshedToken = await debouncedRefresh(refreshUrl);
-              if (refreshedToken) {
-                setClientAccessToken(refreshedToken);
-                onSuccess?.();
-                onTokenRefreshSuccess?.();
-                return http.instance({
-                  ...originalRequest,
-                  headers: { ...originalRequest.headers, Authorization: `Bearer ${refreshedToken}` },
-                });
-              } else {
-                const errorMessage = "Invalid Refresh Token.";
-                onError?.(errorMessage);
-                onTokenRefreshError?.(errorMessage);
-              }
-
-              setIsRefreshing(false);
-            }
-            return Promise.reject(err);
-          })
-        : "";
-
-    return () => {
-      if (interceptorId) {
-        http.responseInterceptor.eject(interceptorId);
-      }
-    };
-  }, [
-    clientAccessToken,
-    isRefreshing,
-    refreshUrl,
-    onError,
-    onSuccess,
-    onTokenRefreshStart,
-    onTokenRefreshSuccess,
-    onTokenRefreshError,
-  ]);
-
-  useEffect(() => {
-    if (accessToken && http.getUrl() && prevAccessToken !== accessToken) {
-      http.setAuthorizationHeader(accessToken);
-      http
-        .get<ApiResponse>(`/provider/${clientId}/access-token`)
-        .catch(async (err: AxiosError) => {
-          if ((err.response?.status === 498 || err.response?.status === 401) && refreshUrl) {
-            setIsRefreshing(true);
-            onTokenRefreshStart?.();
-            const refreshedToken = await http.refreshTokens(refreshUrl);
-            if (refreshedToken) {
-              setClientAccessToken(refreshedToken);
-              onSuccess?.();
-              onTokenRefreshSuccess?.();
-            } else {
-              const errorMessage = "Invalid Refresh Token.";
-              onError?.(errorMessage);
-              onTokenRefreshError?.(errorMessage);
-            }
-            setIsRefreshing(false);
-          }
-        })
-        .finally(() => {
-          setClientAccessToken(accessToken);
-        });
-    }
-  }, [
-    accessToken,
-    clientId,
-    refreshUrl,
-    prevAccessToken,
-    onError,
-    onSuccess,
-    onTokenRefreshStart,
-    onTokenRefreshSuccess,
-    onTokenRefreshError,
-  ]);
-
-  return { isRefreshing, currentAccessToken: clientAccessToken };
-};

package/src/hooks/use-reserve-slot.ts

@@ -1,48 +0,0 @@
-import { useMutation } from "@tanstack/react-query";
-
-import { SUCCESS_STATUS } from "../constants";
-import type {
-  ApiErrorResponse,
-  ApiResponse,
-  ApiSuccessResponse,
-  ReserveSlotInput_2024_04_15,
-} from "../contracts";
-
-import http from "../lib/http";
-
-interface IUseReserveSlot {
-  onSuccess?: (res: ApiSuccessResponse<string>) => void;
-  onError?: (err: ApiErrorResponse) => void;
-}
-export const useReserveSlot = (
-  { onSuccess, onError }: IUseReserveSlot = {
-    onSuccess: () => {
-      return;
-    },
-    onError: () => {
-      return;
-    },
-  }
-) => {
-  const reserveSlot = useMutation<ApiResponse<string>, unknown, ReserveSlotInput_2024_04_15>({
-    mutationFn: (props: ReserveSlotInput_2024_04_15) => {
-      return http.post<ApiResponse<string>>("/slots/reserve", props).then((res) => {
-        if (res.data.status === SUCCESS_STATUS) {
-          return res.data;
-        }
-        throw new Error(res.data.error.message);
-      });
-    },
-    onSuccess: (data) => {
-      if (data.status === SUCCESS_STATUS) {
-        onSuccess?.(data);
-      } else {
-        onError?.(data);
-      }
-    },
-    onError: (err) => {
-      onError?.(err as ApiErrorResponse);
-    },
-  });
-  return reserveSlot;
-};

package/src/hooks/use-schedule-by-event-slug.tsx

@@ -1,40 +0,0 @@
-import { useQuery } from "@tanstack/react-query";
-
-import { SUCCESS_STATUS } from "../constants";
-import type { ApiResponse, ApiSuccessResponse } from "../contracts";
-
-import http from "../lib/http";
-import { useAtomsContext } from "./use-atoms-context";
-
-type ScheduleByEventSlugData = {
-  id: number;
-  name: string;
-  availability: unknown[][];
-  dateOverrides: unknown[];
-  timeZone: string;
-  workingHours: unknown[];
-  isDefault: boolean;
-};
-
-export const QUERY_KEY = "get-schedule-by-event-slug";
-export const useScheduleByEventSlug = (props: { eventSlug?: string; enabled?: boolean }) => {
-  const { isInit } = useAtomsContext();
-
-  const schedule = useQuery({
-    queryKey: [QUERY_KEY, props.eventSlug],
-    queryFn: () => {
-      return http
-        .get<ApiResponse<ScheduleByEventSlugData>>(`/atoms/schedules/event-type/${props.eventSlug}`)
-        .then((res) => {
-          if (res.data.status === SUCCESS_STATUS) {
-            return (res.data as ApiSuccessResponse<ScheduleByEventSlugData>)?.data;
-          }
-          throw new Error(res.data.error.message);
-        });
-    },
-    enabled: !!props.eventSlug && (props?.enabled !== undefined ? props.enabled && isInit : isInit),
-    staleTime: 5000,
-  });
-
-  return schedule;
-};

package/src/hooks/use-slots.ts

@@ -1,115 +0,0 @@
-import { useEffect } from "react";
-import { shallow } from "zustand/shallow";
-import { useBookerStoreContext } from "../booker/booker-store-provider";
-import { useSlotReservationId } from "../booker/use-slot-reservation-id";
-import { MINUTES_TO_BOOK } from "../constants";
-import type {
-  ApiErrorResponse,
-  ApiSuccessResponse,
-  ApiSuccessResponseWithoutData,
-  BookerEvent,
-} from "../contracts";
-import dayjs from "../vendor/dayjs";
-
-import { useDeleteSelectedSlot } from "./use-delete-selected-slot";
-import { useReserveSlot } from "./use-reserve-slot";
-
-type UseSlotsCallbacks = {
-  onReserveSlotSuccess?: (data: ApiSuccessResponse<string>) => void;
-  onReserveSlotError?: (err: ApiErrorResponse) => void;
-  onDeleteSlotSuccess?: (data: ApiSuccessResponseWithoutData) => void;
-  onDeleteSlotError?: (err: ApiErrorResponse) => void;
-  handleSlotReservation?: (timeslot: string) => void;
-};
-
-export type UseSlotsReturnType = ReturnType<typeof useSlots>;
-
-export const useSlots = (
-  event: { data?: Pick<BookerEvent, "id" | "length"> | null },
-  {
-    onReserveSlotSuccess,
-    onReserveSlotError,
-    onDeleteSlotSuccess,
-    onDeleteSlotError,
-    isBookingDryRun,
-    handleSlotReservation,
-  }: UseSlotsCallbacks & { isBookingDryRun?: boolean } = {}
-) => {
-  const selectedDuration = useBookerStoreContext((state) => state.selectedDuration);
-  const [selectedTimeslot, setSelectedTimeslot] = useBookerStoreContext(
-    (state) => [state.selectedTimeslot, state.setSelectedTimeslot],
-    shallow
-  );
-
-  const [slotReservationId, setSlotReservationId] = useSlotReservationId();
-
-  const reserveSlotMutation = useReserveSlot({
-    onSuccess: (res) => {
-      setSlotReservationId(res.data);
-      onReserveSlotSuccess?.(res);
-    },
-    onError: onReserveSlotError,
-  });
-
-  const seatedEventData = useBookerStoreContext((state) => state.seatedEventData);
-
-  const removeSelectedSlot = useDeleteSelectedSlot({
-    onSuccess: onDeleteSlotSuccess,
-    onError: onDeleteSlotError,
-  });
-
-  const handleRemoveSlot = () => {
-    if (event?.data) {
-      removeSelectedSlot.mutate({ uid: slotReservationId ?? undefined });
-    }
-  };
-
-  const handleReserveSlot = () => {
-    if (event?.data?.id && selectedTimeslot && (selectedDuration || event?.data?.length)) {
-      if (handleSlotReservation) {
-        handleSlotReservation(selectedTimeslot);
-        return;
-      }
-
-      reserveSlotMutation.mutate({
-        slotUtcStartDate: dayjs(selectedTimeslot).utc().format(),
-        eventTypeId: event.data.id,
-        slotUtcEndDate: dayjs(selectedTimeslot)
-          .utc()
-          .add(selectedDuration || event.data.length, "minutes")
-          .format(),
-        _isDryRun: isBookingDryRun,
-        bookingUid: seatedEventData.bookingUid || undefined,
-      });
-    }
-  };
-
-  const timeslot = useBookerStoreContext((state) => state.selectedTimeslot);
-
-  useEffect(() => {
-    handleReserveSlot();
-
-    const interval = setInterval(
-      () => {
-        handleReserveSlot();
-      },
-      parseInt(MINUTES_TO_BOOK) * 60 * 1000 - 2000
-    );
-
-    return () => {
-      handleRemoveSlot();
-      clearInterval(interval);
-    };
-  }, [event?.data?.id, timeslot]);
-
-  return {
-    selectedTimeslot,
-    setSelectedTimeslot,
-    setSlotReservationId,
-    slotReservationId,
-    handleReserveSlot,
-    handleRemoveSlot,
-    // TODO: implement slot no longer available feature
-    allSelectedTimeslots: [],
-  };
-};

package/src/hooks/use-timezone.ts

@@ -1,19 +0,0 @@
-import { useEffect } from "react";
-
-import dayjs from "../vendor/dayjs";
-
-import { useMe } from "./use-me";
-
-export const useTimezone = (
-  onTimeZoneChange?: (currentTimezone: string) => void,
-  currentTimezone: string = dayjs.tz.guess()
-) => {
-  const { data: me, isLoading } = useMe();
-  const preferredTimezone = me?.data?.timeZone ?? currentTimezone;
-
-  useEffect(() => {
-    if (!isLoading && preferredTimezone && onTimeZoneChange && preferredTimezone !== currentTimezone) {
-      onTimeZoneChange(currentTimezone);
-    }
-  }, [currentTimezone, preferredTimezone, onTimeZoneChange, isLoading]);
-};

package/src/hooks/use-update-user-timezone.ts

@@ -1,28 +0,0 @@
-import { useMutation } from "@tanstack/react-query";
-import { SUCCESS_STATUS, V2_ENDPOINTS } from "../constants";
-import type { ApiResponse, UserResponse } from "../contracts";
-
-import http from "../lib/http";
-
-type updateTimezoneInput = {
-  timeZone: string;
-};
-
-export const useUpdateUserTimezone = () => {
-  const pathname = `/${V2_ENDPOINTS.me}`;
-
-  const mutation = useMutation<ApiResponse<UserResponse>, unknown, updateTimezoneInput>({
-    mutationFn: (data) => {
-      const { timeZone } = data;
-
-      return http?.patch(pathname, { timeZone }).then((res) => {
-        if (res.data.status === SUCCESS_STATUS) {
-          return res.data;
-        }
-        throw new Error(res.data.error.message);
-      });
-    },
-  });
-
-  return mutation;
-};

package/src/hooks/use-verify-code.ts

@@ -1,115 +0,0 @@
-import { useMutation } from "@tanstack/react-query";
-import { useState } from "react";
-
-import { SUCCESS_STATUS } from "../constants";
-import type { ApiErrorResponse, ApiResponse, ApiSuccessResponse } from "../contracts";
-
-import http from "../lib/http";
-
-export type UseVerifyCodeReturnType = ReturnType<typeof useVerifyCode>;
-
-type UseVerifyCodeProps = {
-  onSuccess: (isVerified: boolean) => void;
-};
-
-interface VerifyEmailInput {
-  email: string;
-  code: string;
-}
-
-interface VerifyEmailResponse {
-  verified: boolean;
-}
-
-export const useVerifyCode = ({ onSuccess }: UseVerifyCodeProps) => {
-  const [isPending, setIsPending] = useState(false);
-  const [error, setError] = useState("");
-  const [value, setValue] = useState("");
-  const [hasVerified, setHasVerified] = useState(false);
-
-  const verifyCodeWithSessionRequiredMutation = useMutation<
-    ApiSuccessResponse<VerifyEmailResponse>,
-    ApiErrorResponse,
-    VerifyEmailInput
-  >({
-    mutationFn: (props: VerifyEmailInput) => {
-      return http
-        .post<ApiResponse<{ verified: boolean }>>(
-          "/atoms/verification/email/verify-code-authenticated",
-          props
-        )
-        .then((res) => {
-          if (res.data.status === SUCCESS_STATUS) {
-            return res.data;
-          }
-          throw new Error(res.data.error?.message || "Invalid verification code");
-        });
-    },
-    onSuccess: (data) => {
-      setIsPending(false);
-      setHasVerified(data.data.verified);
-      onSuccess(data.data.verified);
-    },
-    onError: (err) => {
-      setIsPending(false);
-      setHasVerified(false);
-      if (err.error?.message?.includes("invalid") || err.error?.message?.includes("Invalid")) {
-        setError("Code provided is invalid");
-      } else {
-        setError(err.error?.message || "Verification failed");
-      }
-    },
-  });
-
-  const verifyCodeWithSessionNotRequiredMutation = useMutation<
-    ApiSuccessResponse<VerifyEmailResponse>,
-    ApiErrorResponse,
-    VerifyEmailInput
-  >({
-    mutationFn: (props: VerifyEmailInput) => {
-      return http
-        .post<ApiResponse<{ verified: boolean }>>("/atoms/verification/email/verify-code", props)
-        .then((res) => {
-          if (res.data.status === SUCCESS_STATUS) {
-            return res.data;
-          }
-          throw new Error(res.data.error?.message || "Invalid verification code");
-        });
-    },
-    onSuccess: (data) => {
-      setIsPending(false);
-      setHasVerified(data.data.verified);
-      onSuccess(data.data.verified);
-    },
-    onError: (err) => {
-      setIsPending(false);
-      setHasVerified(false);
-      if (err.error?.message?.includes("invalid") || err.error?.message?.includes("Invalid")) {
-        setError("Code provided is invalid");
-      } else {
-        setError(err.error?.message || "Verification failed");
-      }
-    },
-  });
-
-  const verifyCodeWithSessionRequired = (code: string, email: string) => {
-    verifyCodeWithSessionRequiredMutation.mutate({ code, email });
-  };
-
-  const verifyCodeWithSessionNotRequired = (code: string, email: string) => {
-    verifyCodeWithSessionNotRequiredMutation.mutate({ code, email });
-  };
-
-  return {
-    verifyCodeWithSessionRequired,
-    verifyCodeWithSessionNotRequired,
-    isPending,
-    setIsPending,
-    error,
-    value,
-    hasVerified,
-    setValue,
-    setHasVerified,
-    resetErrors: () => setError(""),
-  };
-};