fixes

- change refresh icon & apply refreshing logic
- apply validation in action btn in menu
- preserve on customer info state upon refresh

src/components/CartActionsButtons/CartActionsButtons.module.css

@@ -83,7 +83,7 @@
   color: var(--secondary-background);
 }
 
-.minusIcon{
+.minusIcon {
   color: var(--secondary-foreground);
 }
 

src/components/CartActionsButtons/CartActionsButtons.tsx

@@ -134,9 +134,10 @@ export default function CartActionsButtons({ item }: { item: CartItem }) {
                 }),
               )
             }
+            disabled={item.quantity >= 99}
             className={styles.addButton}
             style={{
-              backgroundColor: colors.primary,
+              backgroundColor: "#FFC600",
               width: 28,
               height: 28,
               border: "none",

src/components/Icons/PlusIcon.tsx

@@ -2,9 +2,10 @@ interface PlusIconType {
   className?: string;
   onClick?: () => void;
   dimesion?: string
+  color?: string
 }
 
-const PlusIcon = ({ className, onClick, dimesion }: PlusIconType) => {
+const PlusIcon = ({ className, onClick, dimesion, color }: PlusIconType) => {
   return (
     <svg
       width={dimesion || "16"}
@@ -17,7 +18,7 @@ const PlusIcon = ({ className, onClick, dimesion }: PlusIconType) => {
     >
       <path
         d="M7.99992 3.3335V12.6668M3.33325 8.00016H12.6666"
-        stroke="#FFD633"
+        stroke={color || "#FFD633"}
         strokeWidth="1.5"
         strokeLinecap="round"
         strokeLinejoin="round"

src/components/Icons/RefershIcon.tsx

@@ -0,0 +1,29 @@
+interface RefershIconType {
+  className?: string;
+  onClick?: () => void;
+  dimension?: number;
+}
+
+const RefershIcon = ({ className, onClick, dimension }: RefershIconType) => {
+  return (
+    <svg
+      width={dimension || "18"}
+      height={dimension || "18"}
+      viewBox="0 0 18 18"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      onClick={onClick}
+    >
+      <path
+        d="M1.5 7.5C1.5 7.5 1.59099 6.86307 4.22703 4.22703C6.86307 1.59099 11.1369 1.59099 13.773 4.22703C14.7069 5.16099 15.31 6.30054 15.5821 7.5M1.5 7.5V3M1.5 7.5H6M16.5 10.5C16.5 10.5 16.409 11.1369 13.773 13.773C11.1369 16.409 6.86307 16.409 4.22703 13.773C3.29307 12.839 2.69002 11.6995 2.41787 10.5M16.5 10.5V15M16.5 10.5H12"
+        stroke="#5F6C7B"
+        stroke-width="1.5"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+    </svg>
+  );
+};
+
+export default RefershIcon;

src/components/LanguageSwitch/LanguageSwitch.module.css

@@ -3,16 +3,25 @@
   flex-direction: row;
   justify-content: end;
   padding: 0 16px;
-  gap: 10px;
+  gap: 8px;
   position: absolute;
   top: 50px;
   z-index: 1000;
+  right: 0;
 }
 
 :global(.ant-app-rtl) .languageSwitch {
   left: 0;
+  right: auto;
 }
 
-:global(.ant-app-ltr) .languageSwitch {
-  right: 0;
+.refreshIcon {
+  cursor: pointer;
+  position: relative;
+  top: 2px;
+  margin-right: 3px;
+}
+
+:global(.ant-app-rtl) .refreshIcon {
+  margin-left: 3px;
 }

src/components/LanguageSwitch/LanguageSwitch.tsx

@@ -6,6 +6,7 @@ import { useDispatch } from "react-redux";
 import { useAppSelector } from "redux/hooks";
 import ProText from "../ProText";
 import styles from "./LanguageSwitch.module.css";
+import RefershIcon from "components/Icons/RefershIcon";
 
 export function LanguageSwitch() {
   const dispatch = useDispatch();
@@ -23,11 +24,15 @@ export function LanguageSwitch() {
     });
   };
 
+  const refreshPage = () => {
+    window.location.reload();
+  };
+
   return (
     <div className={styles.languageSwitch}>
       <GlobalOutlined
         style={{
-          color: themeName === "dark" ? "#fff" : "#434E5C",
+          color: themeName === "dark" ? "#fff" : "#333333",
           fontSize: 15,
           marginRight: 3,
           cursor: isPending ? "wait" : "pointer",
@@ -37,23 +42,19 @@ export function LanguageSwitch() {
       />
       <ProText
         style={{
-          color: themeName === "dark" ? "#fff" : "#434E5C",
+          color: themeName === "dark" ? "#fff" : "#333333",
           fontSize: 14,
           marginRight: 3,
           opacity: isPending ? 0.7 : 1,
           [isRTL ? "marginLeft" : "marginRight"]: 3,
         }}
+        onClick={changeLanguage}
       >
         {isPending ? "..." : isRTL ? "English" : "Arabic"}
       </ProText>
-      <ShakeOutlined
-        style={{
-          color: themeName === "dark" ? "#fff" : "#434E5C",
-          fontSize: 15,
-          marginRight: 3,
-          [isRTL ? "marginLeft" : "marginRight"]: 3,
-        }}
-      />
+      <div onClick={refreshPage}>
+        <RefershIcon dimension={18} className={styles.refreshIcon} />
+      </div>
     </div>
   );
 }