orders: clean code

src/components/Icons/ReOrderIcon.tsx

@@ -23,14 +23,14 @@ const ReOrderIcon = ({ className, onClick }: ReOrderIconType) => {
         fill="#CC9300"
       />
       <path
-        fill-rule="evenodd"
-        clip-rule="evenodd"
+        fillRule="evenodd"
+        clipRule="evenodd"
         d="M11.8294 2.12514C11.8228 2.20598 11.7923 2.28303 11.7419 2.34657C11.6915 2.41011 11.6234 2.45727 11.5462 2.48209C11.469 2.50691 11.3862 2.50827 11.3082 2.48601C11.2302 2.46375 11.1606 2.41885 11.1081 2.35701C11.0556 2.29517 11.0227 2.21915 11.0134 2.13858C11.0042 2.05801 11.019 1.9765 11.0561 1.90437C11.0931 1.83223 11.1508 1.77271 11.2217 1.73334C11.2926 1.69396 11.3736 1.67649 11.4544 1.68315C11.5627 1.69206 11.6631 1.74363 11.7334 1.82651C11.8037 1.9094 11.8382 2.01681 11.8294 2.12514Z"
         fill="#CC9300"
       />
       <path
-        fill-rule="evenodd"
-        clip-rule="evenodd"
+        fillRule="evenodd"
+        clipRule="evenodd"
         d="M10.3182 1.27114C10.3116 1.35197 10.2811 1.42903 10.2307 1.49257C10.1803 1.55611 10.1122 1.60327 10.035 1.62809C9.95778 1.65291 9.87495 1.65427 9.79696 1.63201C9.71897 1.60974 9.64934 1.56485 9.59687 1.50301C9.54441 1.44117 9.51146 1.36515 9.50219 1.28458C9.49293 1.20401 9.50777 1.1225 9.54484 1.05037C9.58191 0.978232 9.63954 0.918712 9.71044 0.879333C9.78134 0.839955 9.86233 0.822487 9.94315 0.829141C10.0515 0.838059 10.1518 0.889628 10.2222 0.972511C10.2925 1.05539 10.327 1.16281 10.3182 1.27114Z"
         fill="#CC9300"
       />

src/pages/orders/orders.module.css

@@ -54,14 +54,30 @@
   border-radius: 30px !important;
 }
 
-.rateIcon{
+.rateIcon {
   position: relative;
   top: 2px;
-  margin:0 5px;
+  margin: 0 5px;
 }
 
-.reorderIcon{
+.reorderIcon {
   position: relative;
   top: 2px;
-  margin:0 5px;
-}
+  margin: 0 5px;
+}
+
+.row {
+  width: 100%;
+  padding: 16px 16px 0;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  background-color: var(--secondary-background);
+}
+
+.button {
+  width: 100%;
+  height: 48px;
+  margin-bottom: 16px;
+  box-shadow: none;
+}

src/pages/orders/page.tsx

@@ -2,38 +2,21 @@ import { Button, Row } from "antd";
 import ProHeader from "components/ProHeader/ProHeader";
 import { useTranslation } from "react-i18next";
 import { Link, useParams } from "react-router-dom";
-import { useAppSelector } from "redux/hooks";
-import { ProBlack2 } from "ThemeConstants";
+import styles from "./orders.module.css";
 import OrdersList from "./OrdersList";
 
 export default function OrdersPage() {
   const { t } = useTranslation();
   const { id } = useParams();
-  const { themeName } = useAppSelector((state) => state.theme);
 
   return (
     <>
       <ProHeader>{t("orders.title")}</ProHeader>
       <OrdersList />
-      <Row
-        style={{
-          width: "100%",
-          padding: "16px 16px 0",
-          position: "fixed",
-          bottom: 0,
-          left: 0,
-          boxShadow: "0px -1px 3px rgba(0, 0, 0, 0.1)",
-          backgroundColor: themeName === "light" ? "white" : ProBlack2,
-
-        }}
-      >
+      <Row className={styles.row}>
         <Link to={`/${id}/menu`} style={{ width: "100%" }}>
-          <Button
-            type="primary"
-            shape="round"
-            style={{ width: "100%", height: 48, marginBottom: 16 }}
-          >
-            {t('orders.browseMenu')}
+          <Button type="primary" shape="round" className={styles.button}>
+            {t("orders.browseMenu")}
           </Button>
         </Link>
       </Row>

src/pages/product/page.tsx

@@ -18,7 +18,7 @@ import ProductFooter from "./components/ProductFooter";
 import Variants from "./components/Variants";
 import styles from "./product.module.css";
 
-export default function ProductDetailPage({ onClose }: { onClose: () => void }) {
+export default function ProductDetailPage({ onClose }: { onClose?: () => void }) {
   const { isRTL } = useAppSelector((state) => state.locale);
   const { isDesktop } = useBreakPoint();
   const [quantity, setQuantity] = useState(1);