tables: update data source

src/pages/cart/components/TableNumberCard.tsx

@@ -5,28 +5,21 @@ import {
   selectCart,
   updateTables,
 } from "features/order/orderSlice.ts";
-import i18n from "i18n/i18n.ts";
 import styles from "pages/cart/cart.module.css";
 import { useTranslation } from "react-i18next";
-import { useAppSelector } from "redux/hooks.ts";
-
-// Function to get translated table names
-export const getTableOptions = () => [
-  { value: "1", label: `${i18n.t("checkout.table")} 1` },
-  { value: "2", label: `${i18n.t("checkout.table")} 2` },
-  { value: "3", label: `${i18n.t("checkout.table")} 3` },
-  { value: "4", label: `${i18n.t("checkout.table")} 4` },
-  { value: "5", label: `${i18n.t("checkout.table")} 5` },
-  { value: "6", label: `${i18n.t("checkout.table")} 6` },
-  { value: "7", label: `${i18n.t("checkout.table")} 7` },
-  { value: "8", label: `${i18n.t("checkout.table")} 8` },
-  { value: "9", label: `${i18n.t("checkout.table")} 9` },
-  { value: "10", label: `${i18n.t("checkout.table")} 10` },
-];
+import { useGetTablesQuery } from "redux/api/others";
+import { useAppDispatch, useAppSelector } from "redux/hooks.ts";
 
 export default function TableNumberCard() {
   const { t } = useTranslation();
   const { tables } = useAppSelector(selectCart);
+  const dispatch = useAppDispatch();
+  const { data: tableList } = useGetTablesQuery({
+    restaurantID: localStorage.getItem("restaurantID") || "",
+    tableType: "1",
+  }, {
+    skip: !localStorage.getItem("restaurantID"),
+  });
 
   return (
     <>
@@ -45,17 +38,18 @@ export default function TableNumberCard() {
             mode="multiple"
             placeholder={t("cart.tableNumber")}
             size="large"
-            options={getTableOptions()}
+            options={tableList}
             style={{
               width: "100%",
               height: 50,
               fontSize: 12,
             }}
             onChange={(value) => {
-              updateTables(value);
+              console.log(value);
+              dispatch(updateTables(value));
             }}
             onClear={() => {
-              removeTable();
+              dispatch(removeTable());
             }}
             allowClear
           />