menu: UI enhancements in desktop sizes

- add product dialog
- enhance product page layout for desktop size

src/pages/product/components/Variants.tsx

@@ -1,6 +1,7 @@
 import { Divider } from "antd";
 import ProRatioGroups from "components/ProRatioGroups/ProRatioGroups";
 import ProText from "components/ProText";
+import useBreakPoint from "hooks/useBreakPoint";
 import { Dispatch, SetStateAction, useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { useAppSelector } from "redux/hooks";
@@ -18,6 +19,7 @@ export default function Variants({
 }) {
   const { isRTL } = useAppSelector((state) => state.locale);
   const { t } = useTranslation();
+  const { isDesktop } = useBreakPoint();
 
   // Determine variant levels based on options array length
   const variantLevels = useMemo(() => {
@@ -108,7 +110,7 @@ export default function Variants({
     <>
       {variantsList?.length > 0 && variantLevels.length > 0 && (
         <>
-          <Divider style={{ margin: "0" }} />
+          {!isDesktop && <Divider style={{ margin: "0" }} />}
           <div>
             <div
               style={{