import React, { useEffect, useState } from "react";
import Divider from "@material-ui/core/Divider";
import NestedList from "./NestedMenu";
import SettingMenu from "./SettingMenu";
import rxSubscribe from "@/utils/database/rxSubscribe";
import { Collection } from "@/core/menu/collections";
import { ENV } from "@/utils/config";
const LeftMenu = ({ data: propsData, offLeftSetting }) => {
    const [data, setData] = useState(propsData || []);
    useEffect(() => {
        if (propsData)
            return;
        (async () => {
            await rxSubscribe({
                collection: Collection.name,
                sort: { rank: "desc" },
                callback: data => {
                    setData(data);
                }
            });
        })();
    }, [propsData]);
    return (<>
      <NestedList data={propsData || data}/>
      <Divider />
      {!offLeftSetting && ENV.ON_SETTING && <SettingMenu />}
    </>);
};
export default LeftMenu;