2020-03-08 22:45:07 +07:00
|
|
|
import React, { useState, useContext } from 'react';
|
2019-10-03 23:17:04 +07:00
|
|
|
|
|
|
|
import { DetailContext } from '../../pages/Version';
|
2019-10-31 14:12:18 +07:00
|
|
|
import Box from '../../muiComponents/Box';
|
2019-10-03 23:17:04 +07:00
|
|
|
|
|
|
|
import DetailContainerTabs from './DetailContainerTabs';
|
|
|
|
import DetailContainerContent from './DetailContainerContent';
|
|
|
|
import { TabPosition } from './tabs';
|
|
|
|
|
|
|
|
const DetailContainer: React.FC = () => {
|
2020-03-08 22:45:07 +07:00
|
|
|
const tabs = Object.values(TabPosition);
|
|
|
|
const [tabPosition, setTabPosition] = useState(0);
|
2019-10-03 23:17:04 +07:00
|
|
|
const detailContext = useContext(DetailContext);
|
|
|
|
const { readMe } = detailContext;
|
|
|
|
|
2020-03-08 22:45:07 +07:00
|
|
|
const handleChange = (event, newValue) => {
|
|
|
|
setTabPosition(newValue);
|
|
|
|
};
|
2019-10-03 23:17:04 +07:00
|
|
|
|
|
|
|
return (
|
|
|
|
<Box component="div" display="flex" flexDirection="column" padding={2}>
|
2020-03-08 22:45:07 +07:00
|
|
|
<DetailContainerTabs onChange={handleChange} tabPosition={tabPosition} />
|
|
|
|
<DetailContainerContent readDescription={readMe} tabPosition={tabs[tabPosition]} />
|
2019-10-03 23:17:04 +07:00
|
|
|
</Box>
|
|
|
|
);
|
|
|
|
};
|
2019-06-20 19:37:28 +07:00
|
|
|
|
|
|
|
export default DetailContainer;
|