Client:Profile: change submenu to tabs
This commit is contained in:
parent
df5884429c
commit
11f650da7c
@ -32,7 +32,7 @@ import { inject, observer } from "mobx-react";
|
|||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
|
|
||||||
import { ProfileViewLoader } from "@docspace/shared/skeletons/profile";
|
import { ProfileViewLoader } from "@docspace/shared/skeletons/profile";
|
||||||
import { Submenu } from "@docspace/shared/components/submenu";
|
import { Tabs } from "@docspace/shared/components/tabs";
|
||||||
|
|
||||||
import MainProfile from "./sub-components/main-profile";
|
import MainProfile from "./sub-components/main-profile";
|
||||||
import LoginContent from "./sub-components/LoginContent";
|
import LoginContent from "./sub-components/LoginContent";
|
||||||
@ -54,7 +54,7 @@ const Wrapper = styled.div`
|
|||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const StyledSubMenu = styled(Submenu)`
|
const StyledTabs = styled(Tabs)`
|
||||||
> .sticky {
|
> .sticky {
|
||||||
z-index: 201;
|
z-index: 201;
|
||||||
margin-inline-end: -17px;
|
margin-inline-end: -17px;
|
||||||
@ -91,13 +91,13 @@ const SectionBodyContent = (props) => {
|
|||||||
content: <FileManagement />,
|
content: <FileManagement />,
|
||||||
});
|
});
|
||||||
|
|
||||||
const getCurrentTab = () => {
|
const getCurrentTabId = () => {
|
||||||
const path = location.pathname;
|
const path = location.pathname;
|
||||||
const currentTab = data.findIndex((item) => path.includes(item.id));
|
const currentTab = data.find((item) => path.includes(item.id));
|
||||||
return currentTab !== -1 ? currentTab : 0;
|
return currentTab !== -1 ? currentTab.id : data[0].id;
|
||||||
};
|
};
|
||||||
|
|
||||||
const currentTab = getCurrentTab();
|
const currentTabId = getCurrentTabId();
|
||||||
|
|
||||||
const onSelect = (e) => {
|
const onSelect = (e) => {
|
||||||
const arrayPaths = location.pathname.split("/");
|
const arrayPaths = location.pathname.split("/");
|
||||||
@ -110,11 +110,11 @@ const SectionBodyContent = (props) => {
|
|||||||
return (
|
return (
|
||||||
<Wrapper>
|
<Wrapper>
|
||||||
<MainProfile />
|
<MainProfile />
|
||||||
<StyledSubMenu
|
<StyledTabs
|
||||||
data={data}
|
items={data}
|
||||||
startSelect={currentTab}
|
selectedItemId={currentTabId}
|
||||||
onSelect={onSelect}
|
onSelect={onSelect}
|
||||||
topProps={SECTION_HEADER_HEIGHT[currentDeviceType]}
|
stickyTop={SECTION_HEADER_HEIGHT[currentDeviceType]}
|
||||||
/>
|
/>
|
||||||
</Wrapper>
|
</Wrapper>
|
||||||
);
|
);
|
||||||
|
Loading…
Reference in New Issue
Block a user