import React, { useState, useEffect } from "react";
import { Box, Tabs, Tab, Typography } from "@mui/material";
import LogisticsTrackingTab from "./LogisticsTrackingTab";
import DewarStatusTab from "./DewarStatusTab"; // Adjust paths as necessary

const LogisticsView: React.FC = () => {
    const [currentTab, setCurrentTab] = useState(0);


    const handleTabChange = (event: React.SyntheticEvent, newValue: number) => {
        setCurrentTab(newValue);
    };

    return (
        <Box>
            <Typography variant="h4" gutterBottom>
                Logistics Management
            </Typography>
            <Tabs value={currentTab} onChange={handleTabChange}>
                <Tab label="Logistics Tracking" />
                <Tab label="Dewar Status Table" />
            </Tabs>
            <Box hidden={currentTab !== 0}>
                <LogisticsTrackingTab // Pass the warningMessage down
                />
            </Box>
            <Box hidden={currentTab !== 1}>
                <DewarStatusTab />
            </Box>
        </Box>
    );
};

export default LogisticsView;