From dd9056cb476d630be446278fd721ff643347f98f Mon Sep 17 00:00:00 2001
From: SemenStruchev <semen.struchev@devico.io>
Date: Tue, 24 Sep 2024 00:13:38 +0300
Subject: [PATCH] resolve feedback

---
 src/components/DatePicker/Day.jsx | 16 ++++++++++++----
 src/components/Dot/Dot.jsx        |  2 +-
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/components/DatePicker/Day.jsx b/src/components/DatePicker/Day.jsx
index 30d176dab..28015bf38 100644
--- a/src/components/DatePicker/Day.jsx
+++ b/src/components/DatePicker/Day.jsx
@@ -7,6 +7,18 @@ import { Dot } from "../Dot/Dot";
 export const Day = ({ selectedDate, date, getContent, currentMonth, isLoading = true, disabled = false }) => {
     const isSameMonth = dayjs(currentMonth).isSame(date, "month");
 
+    if (getContent && isSameMonth) {
+        if (isLoading) {
+            return (
+                <div class="mr-2 flex animate-pulse items-center justify-center">
+                    <Dot className="ui-day-content pointer-events-none !cursor-not-allowed" color="secondary" />
+                </div>
+            );
+        }
+
+        return <DayContent selectedDate={selectedDate} date={date} getContent={getContent} />;
+    }
+
     if (isLoading) {
         return (
             <div class="mr-2 flex animate-pulse items-center justify-center">
@@ -15,10 +27,6 @@ export const Day = ({ selectedDate, date, getContent, currentMonth, isLoading =
         );
     }
 
-    if (getContent && isSameMonth) {
-        return <DayContent selectedDate={selectedDate} date={date} getContent={getContent} />;
-    }
-
     const isSameDay = selectedDate && dayjs(selectedDate).isSame(date, "day");
 
     return (
diff --git a/src/components/Dot/Dot.jsx b/src/components/Dot/Dot.jsx
index b991efd13..ad43710c4 100644
--- a/src/components/Dot/Dot.jsx
+++ b/src/components/Dot/Dot.jsx
@@ -15,7 +15,7 @@ const sizes = {
     small: "h-1 w-1",
     medium: "h-1.5 w-1.5",
     large: "h-2 w-2",
-    ["extra-large"]: "h-6 w-6",
+    ["extra-large"]: "h-8 w-8",
 };
 
 export const Dot = ({ color = "primary", size = "medium", className, ...rest }) => {