renamae availability component file

packages/atoms/availabilitylist/AvailabilityList.tsx

@@ -3,8 +3,8 @@ import { NewScheduleButton } from "availabilitylist/NewScheduleButton";
 import type { HttpError } from "@calcom/lib/http-error";
 import { Clock } from "@calcom/ui/components/icon";
 
+import { Availability } from "./Availability";
 import { EmptyScreen } from "./EmptyScreen";
-import { Availability } from "./ScheduleListItem";
 
 export type Schedule = {
   isDefault: boolean;

packages/atoms/availabilitylist/ScheduleListItem.tsx

@@ -1,118 +0,0 @@
-import { Badge } from "@/components/ui/badge";
-import { Button } from "@/components/ui/button";
-import {
-  DropdownMenu,
-  DropdownMenuTrigger,
-  DropdownMenuContent,
-  DropdownMenuItem,
-} from "@/components/ui/dropdown-menu";
-import { Toaster } from "@/components/ui/toaster";
-import { useToast } from "@/components/ui/use-toast";
-import type { Schedule } from "availabilitylist/AvailabilityList";
-import { Globe, MoreHorizontal, Star, Copy, Trash } from "lucide-react";
-import { Fragment } from "react";
-
-import { availabilityAsString } from "@calcom/lib/availability";
-
-export function Availability({
-  schedule,
-  isDeletable,
-  displayOptions,
-  updateDefault,
-  duplicateFunction,
-  deleteFunction,
-}: {
-  schedule: Schedule;
-  isDeletable: boolean;
-  updateDefault: ({ scheduleId, isDefault }: { scheduleId: number; isDefault: boolean }) => void;
-  duplicateFunction: ({ scheduleId }: { scheduleId: number }) => void;
-  deleteFunction: ({ scheduleId }: { scheduleId: number }) => void;
-  displayOptions?: {
-    timeZone?: string;
-    hour12?: boolean;
-  };
-}) {
-  const { toast } = useToast();
-
-  return (
-    <li key={schedule.id}>
-      <div className="hover:bg-muted flex items-center justify-between py-5 ltr:pl-4 rtl:pr-4 sm:ltr:pl-0 sm:rtl:pr-0">
-        <div className="group flex w-full items-center justify-between sm:px-6">
-          <a className="flex-grow truncate text-sm" href={`/availability/${schedule.id}`}>
-            <h1>{schedule.name}</h1>
-            <div className="space-x-2 rtl:space-x-reverse">
-              {schedule.isDefault && <Badge className="bg-success text-success text-xs">Default</Badge>}
-            </div>
-            <p className="text-subtle mt-1">
-              {schedule.availability
-                .filter((availability) => !!availability.days.length)
-                .map((availability) => (
-                  <Fragment key={availability.id}>
-                    {availabilityAsString(availability, {
-                      hour12: displayOptions?.hour12,
-                    })}
-                    <br />
-                  </Fragment>
-                ))}
-              {(schedule.timeZone || displayOptions?.timeZone) && (
-                <p className="my-1 flex items-center first-letter:text-xs">
-                  <Globe className="h-3.5 w-3.5" />
-                  &nbsp;{schedule.timeZone ?? displayOptions?.timeZone}
-                </p>
-              )}
-            </p>
-          </a>
-        </div>
-        <DropdownMenu>
-          <DropdownMenuTrigger>
-            <Button type="button" className="mx-5" color="secondary">
-              <MoreHorizontal />
-            </Button>
-          </DropdownMenuTrigger>
-          <DropdownMenuContent>
-            {!schedule.isDefault && (
-              <DropdownMenuItem
-                onClick={() => {
-                  updateDefault({
-                    scheduleId: schedule.id,
-                    isDefault: true,
-                  });
-                }}
-                className="min-w-40 focus:ring-mute min-w-40 focus:ring-muted">
-                <Star />
-                Set as default
-              </DropdownMenuItem>
-            )}
-            <DropdownMenuItem
-              className="outline-none"
-              onClick={() => {
-                duplicateFunction({
-                  scheduleId: schedule.id,
-                });
-              }}>
-              <Copy />
-              Duplicate
-            </DropdownMenuItem>
-            <DropdownMenuItem
-              className="min-w-40 focus:ring-muted"
-              onClick={() => {
-                if (!isDeletable) {
-                  toast({
-                    description: "You are required to have at least one schedule",
-                  });
-                } else {
-                  deleteFunction({
-                    scheduleId: schedule.id,
-                  });
-                }
-              }}>
-              <Trash />
-              Delete
-            </DropdownMenuItem>
-          </DropdownMenuContent>
-        </DropdownMenu>
-        <Toaster />
-      </div>
-    </li>
-  );
-}

packages/atoms/availabilitylist/export.ts

@@ -1,3 +1,3 @@
 export { AvailabilityList } from "./AvailabilityList";
-export { Availability } from "./ScheduleListItem";
+export { Availability } from "./Availability";
 export * from "../types";

packages/atoms/index.ts

@@ -1,3 +1,3 @@
 export { Booker } from "./booker/Booker";
 export { AvailabilityList } from "./availabilitylist/AvailabilityList";
-export { Availability } from "./availabilitylist/ScheduleListItem";
+export { Availability } from "./availabilitylist/Availability";