2021-04-13 09:43:17 +00:00
|
|
|
import React from "react";
|
2019-09-12 12:15:22 +00:00
|
|
|
import PropTypes from "prop-types";
|
2022-03-16 12:22:48 +00:00
|
|
|
|
2022-01-31 13:40:43 +00:00
|
|
|
import {
|
|
|
|
desktop,
|
|
|
|
size,
|
|
|
|
tablet,
|
|
|
|
isMobile as isMobileUtils,
|
|
|
|
isTablet as isTabletUtils,
|
|
|
|
} from "@appserver/components/utils/device";
|
2021-02-24 17:11:23 +00:00
|
|
|
import { Provider } from "@appserver/components/utils/context";
|
2021-09-21 11:01:06 +00:00
|
|
|
import { isMobile, isFirefox, isMobileOnly } from "react-device-detect";
|
2022-03-16 12:22:48 +00:00
|
|
|
|
|
|
|
import SectionContainer from "./sub-components/section-container";
|
2020-08-11 12:34:00 +00:00
|
|
|
import SubSectionHeader from "./sub-components/section-header";
|
|
|
|
import SubSectionFilter from "./sub-components/section-filter";
|
|
|
|
import SubSectionBody from "./sub-components/section-body";
|
|
|
|
import SubSectionBodyContent from "./sub-components/section-body-content";
|
2021-12-16 13:04:23 +00:00
|
|
|
import SubSectionBar from "./sub-components/section-bar";
|
2020-08-11 12:34:00 +00:00
|
|
|
import SubSectionPaging from "./sub-components/section-paging";
|
2022-03-16 12:22:48 +00:00
|
|
|
|
2020-08-31 07:03:19 +00:00
|
|
|
import ReactResizeDetector from "react-resize-detector";
|
2020-11-17 11:22:36 +00:00
|
|
|
import FloatingButton from "../FloatingButton";
|
2021-02-03 12:42:47 +00:00
|
|
|
import { inject, observer } from "mobx-react";
|
2021-06-17 11:36:45 +00:00
|
|
|
import Selecto from "react-selecto";
|
2021-11-22 12:01:33 +00:00
|
|
|
import styled, { css } from "styled-components";
|
2022-02-01 07:59:42 +00:00
|
|
|
import { LayoutContextConsumer } from "studio/Layout/context";
|
|
|
|
import classnames from "classnames";
|
2021-04-13 09:43:17 +00:00
|
|
|
|
2021-06-18 14:17:59 +00:00
|
|
|
const StyledSelectoWrapper = styled.div`
|
|
|
|
.selecto-selection {
|
2021-05-14 08:21:59 +00:00
|
|
|
z-index: 200;
|
|
|
|
}
|
2021-04-13 09:43:17 +00:00
|
|
|
`;
|
2020-10-29 14:33:05 +00:00
|
|
|
|
2021-11-22 12:01:33 +00:00
|
|
|
const StyledMainBar = styled.div`
|
|
|
|
box-sizing: border-box;
|
2022-03-28 07:20:56 +00:00
|
|
|
|
2022-02-01 07:59:42 +00:00
|
|
|
@media ${desktop} {
|
|
|
|
margin-left: -24px;
|
2022-02-21 14:56:42 +00:00
|
|
|
width: 100% + 24px;
|
2022-02-01 07:59:42 +00:00
|
|
|
}
|
2021-11-22 12:01:33 +00:00
|
|
|
|
2022-03-28 07:20:56 +00:00
|
|
|
@media (max-width: 1180px) {
|
|
|
|
margin-left: -20px;
|
|
|
|
}
|
|
|
|
|
2022-02-01 07:59:42 +00:00
|
|
|
@media ${tablet} {
|
|
|
|
margin-left: -16px;
|
2022-02-21 14:56:42 +00:00
|
|
|
width: 100% + 16px;
|
2022-02-01 07:59:42 +00:00
|
|
|
}
|
|
|
|
${isMobile &&
|
|
|
|
css`
|
2022-03-16 12:01:26 +00:00
|
|
|
z-index: 150;
|
2022-02-01 07:59:42 +00:00
|
|
|
position: fixed;
|
|
|
|
top: 48px;
|
|
|
|
`};
|
2021-11-22 12:01:33 +00:00
|
|
|
`;
|
|
|
|
|
2020-08-11 12:34:00 +00:00
|
|
|
function SectionHeader() {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
SectionHeader.displayName = "SectionHeader";
|
|
|
|
|
2021-12-16 13:04:23 +00:00
|
|
|
function SectionBar() {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
|
|
|
SectionBar.displayName = "SectionBar";
|
|
|
|
|
2020-08-11 12:34:00 +00:00
|
|
|
function SectionFilter() {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
SectionFilter.displayName = "SectionFilter";
|
|
|
|
|
|
|
|
function SectionBody() {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
SectionBody.displayName = "SectionBody";
|
|
|
|
|
|
|
|
function SectionPaging() {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
SectionPaging.displayName = "SectionPaging";
|
|
|
|
|
2022-03-16 12:22:48 +00:00
|
|
|
class Section extends React.Component {
|
2020-08-11 12:34:00 +00:00
|
|
|
static SectionHeader = SectionHeader;
|
|
|
|
static SectionFilter = SectionFilter;
|
|
|
|
static SectionBody = SectionBody;
|
2021-12-16 13:04:23 +00:00
|
|
|
static SectionBar = SectionBar;
|
2020-08-11 12:34:00 +00:00
|
|
|
static SectionPaging = SectionPaging;
|
2019-07-11 11:43:07 +00:00
|
|
|
|
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
2020-08-11 12:34:00 +00:00
|
|
|
|
2020-12-04 11:21:51 +00:00
|
|
|
this.timeoutHandler = null;
|
|
|
|
this.intervalHandler = null;
|
2021-06-18 14:17:59 +00:00
|
|
|
|
|
|
|
this.scroll = null;
|
2019-09-10 07:03:36 +00:00
|
|
|
}
|
2019-07-15 10:35:10 +00:00
|
|
|
|
2020-09-24 12:06:37 +00:00
|
|
|
componentDidUpdate(prevProps) {
|
2021-06-18 14:17:59 +00:00
|
|
|
if (!this.scroll) {
|
|
|
|
this.scroll = document.getElementsByClassName("section-scroll")[0];
|
|
|
|
}
|
2020-09-24 12:06:37 +00:00
|
|
|
}
|
|
|
|
|
2022-03-16 12:22:48 +00:00
|
|
|
componentDidMount() {}
|
2020-02-07 16:49:31 +00:00
|
|
|
|
2020-02-11 08:11:34 +00:00
|
|
|
componentWillUnmount() {
|
2020-12-10 11:25:51 +00:00
|
|
|
if (this.intervalHandler) clearInterval(this.intervalHandler);
|
|
|
|
if (this.timeoutHandler) clearTimeout(this.timeoutHandler);
|
2020-02-07 16:49:31 +00:00
|
|
|
}
|
|
|
|
|
2021-06-17 15:46:22 +00:00
|
|
|
onSelect = (e) => {
|
2021-06-22 06:56:48 +00:00
|
|
|
if (this.props.dragging) return;
|
2021-06-17 15:46:22 +00:00
|
|
|
const items = e.selected;
|
2021-04-13 06:35:07 +00:00
|
|
|
this.props.setSelections(items);
|
|
|
|
};
|
|
|
|
|
2021-06-18 10:53:32 +00:00
|
|
|
dragCondition = (e) => {
|
|
|
|
const path = e.inputEvent.composedPath();
|
2021-06-18 11:10:20 +00:00
|
|
|
const isBackdrop = path.some(
|
|
|
|
(x) => x.classList && x.classList.contains("backdrop-active")
|
|
|
|
);
|
2021-06-18 10:53:32 +00:00
|
|
|
const notSelectablePath = path.some(
|
|
|
|
(x) => x.classList && x.classList.contains("not-selectable")
|
|
|
|
);
|
|
|
|
|
2021-07-23 15:13:06 +00:00
|
|
|
const isDraggable = path.some(
|
|
|
|
(x) => x.classList && x.classList.contains("draggable")
|
|
|
|
);
|
|
|
|
|
|
|
|
if (notSelectablePath || isBackdrop || isDraggable) {
|
2021-06-18 10:53:32 +00:00
|
|
|
return false;
|
|
|
|
} else return true;
|
|
|
|
};
|
|
|
|
|
2021-06-18 14:17:59 +00:00
|
|
|
onScroll = (e) => {
|
|
|
|
this.scroll.scrollBy(e.direction[0] * 10, e.direction[1] * 10);
|
|
|
|
};
|
2019-07-11 11:43:07 +00:00
|
|
|
render() {
|
2020-08-11 12:34:00 +00:00
|
|
|
const {
|
|
|
|
onDrop,
|
2020-11-24 14:04:42 +00:00
|
|
|
showPrimaryProgressBar,
|
2020-11-19 13:12:07 +00:00
|
|
|
primaryProgressBarIcon,
|
|
|
|
primaryProgressBarValue,
|
2020-11-25 10:49:54 +00:00
|
|
|
showPrimaryButtonAlert,
|
2020-11-19 13:12:07 +00:00
|
|
|
showSecondaryProgressBar,
|
|
|
|
secondaryProgressBarValue,
|
|
|
|
secondaryProgressBarIcon,
|
2020-11-25 10:49:54 +00:00
|
|
|
showSecondaryButtonAlert,
|
2020-08-11 12:34:00 +00:00
|
|
|
uploadFiles,
|
|
|
|
viewAs,
|
2021-04-13 06:35:07 +00:00
|
|
|
//withBodyAutoFocus,
|
2020-08-11 12:34:00 +00:00
|
|
|
withBodyScroll,
|
2020-10-16 12:38:04 +00:00
|
|
|
children,
|
2020-11-19 13:34:34 +00:00
|
|
|
isHeaderVisible,
|
2021-04-13 06:35:07 +00:00
|
|
|
//headerBorderBottom,
|
2021-01-19 12:27:09 +00:00
|
|
|
onOpenUploadPanel,
|
2021-01-15 14:48:05 +00:00
|
|
|
isTabletView,
|
2021-01-20 18:04:00 +00:00
|
|
|
firstLoad,
|
2021-05-14 08:21:59 +00:00
|
|
|
dragging,
|
2021-08-18 12:52:27 +00:00
|
|
|
isBackdropVisible,
|
2021-09-07 13:41:10 +00:00
|
|
|
isDesktop,
|
2021-12-14 11:45:40 +00:00
|
|
|
isHomepage,
|
2022-02-01 07:59:42 +00:00
|
|
|
maintenanceExist,
|
2022-02-28 13:13:33 +00:00
|
|
|
setMaintenanceExist,
|
|
|
|
snackbarExist,
|
2020-08-11 12:34:00 +00:00
|
|
|
} = this.props;
|
2022-03-11 08:04:09 +00:00
|
|
|
|
2020-08-11 12:34:00 +00:00
|
|
|
let sectionHeaderContent = null;
|
2021-12-16 13:04:23 +00:00
|
|
|
let sectionBarContent = null;
|
2020-08-11 12:34:00 +00:00
|
|
|
let sectionFilterContent = null;
|
|
|
|
let sectionPagingContent = null;
|
|
|
|
let sectionBodyContent = null;
|
2020-10-16 12:38:04 +00:00
|
|
|
React.Children.forEach(children, (child) => {
|
2020-08-11 12:34:00 +00:00
|
|
|
const childType =
|
|
|
|
child && child.type && (child.type.displayName || child.type.name);
|
|
|
|
|
|
|
|
switch (childType) {
|
|
|
|
case SectionHeader.displayName:
|
|
|
|
sectionHeaderContent = child;
|
|
|
|
break;
|
|
|
|
case SectionFilter.displayName:
|
|
|
|
sectionFilterContent = child;
|
|
|
|
break;
|
2021-12-16 13:04:23 +00:00
|
|
|
case SectionBar.displayName:
|
|
|
|
sectionBarContent = child;
|
|
|
|
break;
|
2020-08-11 12:34:00 +00:00
|
|
|
case SectionPaging.displayName:
|
|
|
|
sectionPagingContent = child;
|
|
|
|
break;
|
|
|
|
case SectionBody.displayName:
|
|
|
|
sectionBodyContent = child;
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2022-03-16 12:22:48 +00:00
|
|
|
const isSectionHeaderAvailable = !!sectionHeaderContent,
|
2020-08-11 12:34:00 +00:00
|
|
|
isSectionFilterAvailable = !!sectionFilterContent,
|
|
|
|
isSectionPagingAvailable = !!sectionPagingContent,
|
|
|
|
isSectionBodyAvailable =
|
|
|
|
!!sectionBodyContent ||
|
|
|
|
isSectionFilterAvailable ||
|
|
|
|
isSectionPagingAvailable,
|
|
|
|
isSectionAvailable =
|
|
|
|
isSectionHeaderAvailable ||
|
|
|
|
isSectionFilterAvailable ||
|
|
|
|
isSectionBodyAvailable ||
|
2022-03-16 12:22:48 +00:00
|
|
|
isSectionPagingAvailable;
|
2020-08-11 12:34:00 +00:00
|
|
|
|
2022-03-16 12:22:48 +00:00
|
|
|
const renderSection = () => {
|
2021-05-12 13:53:40 +00:00
|
|
|
return (
|
|
|
|
<>
|
2021-04-13 06:35:07 +00:00
|
|
|
{isSectionAvailable && (
|
|
|
|
<ReactResizeDetector
|
|
|
|
refreshRate={100}
|
|
|
|
refreshMode="debounce"
|
|
|
|
refreshOptions={{ trailing: true }}
|
|
|
|
>
|
|
|
|
{({ width, height }) => (
|
|
|
|
<Provider
|
|
|
|
value={{
|
|
|
|
sectionWidth: width,
|
|
|
|
sectionHeight: height,
|
|
|
|
}}
|
2020-12-18 17:16:13 +00:00
|
|
|
>
|
2022-03-28 07:20:56 +00:00
|
|
|
<SectionContainer
|
|
|
|
widthProp={width}
|
|
|
|
viewAs={viewAs}
|
|
|
|
maintenanceExist={maintenanceExist}
|
|
|
|
>
|
2022-02-01 07:59:42 +00:00
|
|
|
<LayoutContextConsumer>
|
|
|
|
{(value) => (
|
|
|
|
<StyledMainBar
|
|
|
|
width={width}
|
|
|
|
id="main-bar"
|
|
|
|
className={classnames("main-bar", {
|
|
|
|
"main-bar--hidden":
|
|
|
|
value.isVisible === undefined
|
|
|
|
? false
|
|
|
|
: !value.isVisible,
|
|
|
|
})}
|
|
|
|
>
|
2022-02-28 13:13:33 +00:00
|
|
|
<SubSectionBar
|
|
|
|
setMaintenanceExist={setMaintenanceExist}
|
|
|
|
>
|
2022-02-01 07:59:42 +00:00
|
|
|
{sectionBarContent
|
|
|
|
? sectionBarContent.props.children
|
|
|
|
: null}
|
|
|
|
</SubSectionBar>
|
|
|
|
</StyledMainBar>
|
|
|
|
)}
|
|
|
|
</LayoutContextConsumer>
|
|
|
|
|
2021-04-13 06:35:07 +00:00
|
|
|
{isSectionHeaderAvailable && (
|
|
|
|
<SubSectionHeader
|
2022-02-01 07:59:42 +00:00
|
|
|
maintenanceExist={maintenanceExist}
|
2022-02-28 13:13:33 +00:00
|
|
|
snackbarExist={snackbarExist}
|
2021-04-13 06:35:07 +00:00
|
|
|
isHeaderVisible={isHeaderVisible}
|
2021-10-06 12:44:39 +00:00
|
|
|
viewAs={viewAs}
|
2020-10-29 14:33:05 +00:00
|
|
|
>
|
2021-04-13 06:35:07 +00:00
|
|
|
{sectionHeaderContent
|
|
|
|
? sectionHeaderContent.props.children
|
|
|
|
: null}
|
|
|
|
</SubSectionHeader>
|
|
|
|
)}
|
2021-07-09 14:25:20 +00:00
|
|
|
|
2021-04-13 06:35:07 +00:00
|
|
|
{isSectionFilterAvailable && (
|
2021-07-09 14:25:20 +00:00
|
|
|
<>
|
2021-10-20 12:52:02 +00:00
|
|
|
<SubSectionFilter
|
|
|
|
className="section-header_filter"
|
|
|
|
viewAs={viewAs}
|
|
|
|
>
|
2021-07-09 14:25:20 +00:00
|
|
|
{sectionFilterContent
|
|
|
|
? sectionFilterContent.props.children
|
|
|
|
: null}
|
|
|
|
</SubSectionFilter>
|
|
|
|
</>
|
2021-04-13 06:35:07 +00:00
|
|
|
)}
|
|
|
|
{isSectionBodyAvailable && (
|
|
|
|
<>
|
|
|
|
<SubSectionBody
|
|
|
|
onDrop={onDrop}
|
|
|
|
uploadFiles={uploadFiles}
|
|
|
|
withScroll={withBodyScroll}
|
|
|
|
autoFocus={isMobile || isTabletView ? false : true}
|
|
|
|
viewAs={viewAs}
|
2021-12-14 11:45:40 +00:00
|
|
|
isHomepage={isHomepage}
|
2021-04-13 06:35:07 +00:00
|
|
|
>
|
|
|
|
{isSectionFilterAvailable && (
|
|
|
|
<SubSectionFilter className="section-body_filter">
|
|
|
|
{sectionFilterContent
|
|
|
|
? sectionFilterContent.props.children
|
|
|
|
: null}
|
|
|
|
</SubSectionFilter>
|
|
|
|
)}
|
|
|
|
<SubSectionBodyContent>
|
|
|
|
{sectionBodyContent
|
|
|
|
? sectionBodyContent.props.children
|
2020-10-29 14:33:05 +00:00
|
|
|
: null}
|
2021-04-13 06:35:07 +00:00
|
|
|
</SubSectionBodyContent>
|
|
|
|
{isSectionPagingAvailable && (
|
|
|
|
<SubSectionPaging>
|
|
|
|
{sectionPagingContent
|
|
|
|
? sectionPagingContent.props.children
|
|
|
|
: null}
|
|
|
|
</SubSectionPaging>
|
|
|
|
)}
|
|
|
|
</SubSectionBody>
|
|
|
|
</>
|
|
|
|
)}
|
2022-02-03 08:34:47 +00:00
|
|
|
{!(isMobile || isMobileUtils() || isTabletUtils()) ? (
|
2022-01-31 13:40:43 +00:00
|
|
|
showPrimaryProgressBar && showSecondaryProgressBar ? (
|
|
|
|
<>
|
|
|
|
<FloatingButton
|
|
|
|
className="layout-progress-bar"
|
|
|
|
icon={primaryProgressBarIcon}
|
|
|
|
percent={primaryProgressBarValue}
|
|
|
|
alert={showPrimaryButtonAlert}
|
|
|
|
onClick={onOpenUploadPanel}
|
|
|
|
/>
|
|
|
|
<FloatingButton
|
|
|
|
className="layout-progress-second-bar"
|
|
|
|
icon={secondaryProgressBarIcon}
|
|
|
|
percent={secondaryProgressBarValue}
|
|
|
|
alert={showSecondaryButtonAlert}
|
|
|
|
/>
|
|
|
|
</>
|
|
|
|
) : showPrimaryProgressBar &&
|
|
|
|
!showSecondaryProgressBar ? (
|
2021-04-13 06:35:07 +00:00
|
|
|
<FloatingButton
|
|
|
|
className="layout-progress-bar"
|
|
|
|
icon={primaryProgressBarIcon}
|
|
|
|
percent={primaryProgressBarValue}
|
|
|
|
alert={showPrimaryButtonAlert}
|
|
|
|
onClick={onOpenUploadPanel}
|
|
|
|
/>
|
2022-01-31 13:40:43 +00:00
|
|
|
) : !showPrimaryProgressBar &&
|
|
|
|
showSecondaryProgressBar ? (
|
2021-04-13 06:35:07 +00:00
|
|
|
<FloatingButton
|
2022-01-31 13:40:43 +00:00
|
|
|
className="layout-progress-bar"
|
2021-04-13 06:35:07 +00:00
|
|
|
icon={secondaryProgressBarIcon}
|
|
|
|
percent={secondaryProgressBarValue}
|
|
|
|
alert={showSecondaryButtonAlert}
|
|
|
|
/>
|
2022-01-31 13:40:43 +00:00
|
|
|
) : (
|
|
|
|
<></>
|
|
|
|
)
|
2021-04-13 06:35:07 +00:00
|
|
|
) : (
|
|
|
|
<></>
|
|
|
|
)}
|
2022-03-16 12:22:48 +00:00
|
|
|
</SectionContainer>
|
2021-04-13 06:35:07 +00:00
|
|
|
</Provider>
|
|
|
|
)}
|
|
|
|
</ReactResizeDetector>
|
|
|
|
)}
|
2021-05-12 13:53:40 +00:00
|
|
|
</>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
2021-06-18 14:17:59 +00:00
|
|
|
const scrollOptions = this.scroll
|
|
|
|
? {
|
|
|
|
container: this.scroll,
|
|
|
|
throttleTime: 0,
|
|
|
|
threshold: 100,
|
|
|
|
}
|
|
|
|
: {};
|
|
|
|
|
2021-06-17 11:36:45 +00:00
|
|
|
return (
|
|
|
|
<>
|
2022-03-16 12:22:48 +00:00
|
|
|
{renderSection()}
|
2021-06-17 15:46:22 +00:00
|
|
|
{!isMobile && uploadFiles && !dragging && (
|
2021-06-18 14:17:59 +00:00
|
|
|
<StyledSelectoWrapper>
|
|
|
|
<Selecto
|
2021-10-14 12:05:07 +00:00
|
|
|
boundContainer={".section-wrapper"}
|
2021-09-02 15:03:42 +00:00
|
|
|
dragContainer={".section-body"}
|
2021-06-22 21:00:42 +00:00
|
|
|
selectableTargets={[".files-item"]}
|
2021-06-23 12:39:43 +00:00
|
|
|
hitRate={0}
|
2021-06-18 14:17:59 +00:00
|
|
|
selectByClick={false}
|
|
|
|
selectFromInside={true}
|
|
|
|
ratio={0}
|
|
|
|
continueSelect={false}
|
|
|
|
onSelect={this.onSelect}
|
|
|
|
dragCondition={this.dragCondition}
|
|
|
|
scrollOptions={scrollOptions}
|
|
|
|
onScroll={this.onScroll}
|
|
|
|
/>
|
|
|
|
</StyledSelectoWrapper>
|
2021-06-17 15:46:22 +00:00
|
|
|
)}
|
2021-06-17 11:36:45 +00:00
|
|
|
</>
|
2019-09-12 12:15:22 +00:00
|
|
|
);
|
2019-07-11 11:43:07 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-03-16 12:22:48 +00:00
|
|
|
Section.propTypes = {
|
2020-08-11 12:34:00 +00:00
|
|
|
children: PropTypes.any,
|
2019-12-20 08:34:49 +00:00
|
|
|
withBodyScroll: PropTypes.bool,
|
2020-01-24 08:23:12 +00:00
|
|
|
withBodyAutoFocus: PropTypes.bool,
|
2020-11-19 13:12:07 +00:00
|
|
|
showPrimaryProgressBar: PropTypes.bool,
|
|
|
|
primaryProgressBarValue: PropTypes.number,
|
2020-11-25 10:49:54 +00:00
|
|
|
showPrimaryButtonAlert: PropTypes.bool,
|
2020-03-11 14:18:47 +00:00
|
|
|
progressBarDropDownContent: PropTypes.any,
|
2020-11-19 13:12:07 +00:00
|
|
|
primaryProgressBarIcon: PropTypes.string,
|
|
|
|
showSecondaryProgressBar: PropTypes.bool,
|
|
|
|
secondaryProgressBarValue: PropTypes.number,
|
|
|
|
secondaryProgressBarIcon: PropTypes.string,
|
2020-11-25 10:49:54 +00:00
|
|
|
showSecondaryButtonAlert: PropTypes.bool,
|
2020-05-29 06:25:28 +00:00
|
|
|
onDrop: PropTypes.func,
|
2020-06-09 07:02:13 +00:00
|
|
|
setSelections: PropTypes.func,
|
2020-09-24 12:06:37 +00:00
|
|
|
uploadFiles: PropTypes.bool,
|
2020-10-16 12:38:04 +00:00
|
|
|
hideAside: PropTypes.bool,
|
2020-10-29 14:33:05 +00:00
|
|
|
viewAs: PropTypes.string,
|
2021-01-19 12:27:09 +00:00
|
|
|
uploadPanelVisible: PropTypes.bool,
|
|
|
|
onOpenUploadPanel: PropTypes.func,
|
2021-01-26 15:21:50 +00:00
|
|
|
isTabletView: PropTypes.bool,
|
|
|
|
isHeaderVisible: PropTypes.bool,
|
|
|
|
firstLoad: PropTypes.bool,
|
2021-12-14 11:45:40 +00:00
|
|
|
isHomepage: PropTypes.bool,
|
2019-09-12 12:15:22 +00:00
|
|
|
};
|
2019-07-11 11:43:07 +00:00
|
|
|
|
2022-03-16 12:22:48 +00:00
|
|
|
Section.defaultProps = {
|
2020-01-24 08:23:12 +00:00
|
|
|
withBodyScroll: true,
|
2020-10-16 12:38:04 +00:00
|
|
|
withBodyAutoFocus: false,
|
2019-09-12 12:15:22 +00:00
|
|
|
};
|
2019-07-11 11:43:07 +00:00
|
|
|
|
2022-03-16 12:22:48 +00:00
|
|
|
Section.SectionHeader = SectionHeader;
|
|
|
|
Section.SectionFilter = SectionFilter;
|
|
|
|
Section.SectionBody = SectionBody;
|
|
|
|
Section.SectionPaging = SectionPaging;
|
2020-08-11 12:34:00 +00:00
|
|
|
|
2021-02-23 09:46:01 +00:00
|
|
|
export default inject(({ auth }) => {
|
2021-03-04 16:09:46 +00:00
|
|
|
const { isLoaded, settingsStore } = auth;
|
2021-03-03 09:05:08 +00:00
|
|
|
const {
|
|
|
|
isHeaderVisible,
|
|
|
|
isTabletView,
|
2022-03-16 12:22:48 +00:00
|
|
|
|
2021-08-18 12:52:27 +00:00
|
|
|
isBackdropVisible,
|
2022-03-16 12:22:48 +00:00
|
|
|
|
2021-08-18 12:52:27 +00:00
|
|
|
setIsBackdropVisible,
|
2021-09-07 13:41:10 +00:00
|
|
|
isDesktopClient,
|
2022-02-01 07:59:42 +00:00
|
|
|
maintenanceExist,
|
2022-02-28 13:13:33 +00:00
|
|
|
snackbarExist,
|
|
|
|
setMaintenanceExist,
|
2021-03-03 09:05:08 +00:00
|
|
|
} = settingsStore;
|
2021-08-18 12:52:27 +00:00
|
|
|
|
2020-10-13 07:52:44 +00:00
|
|
|
return {
|
2021-03-03 09:05:08 +00:00
|
|
|
isLoaded,
|
2021-02-23 09:46:01 +00:00
|
|
|
isTabletView,
|
2021-03-03 09:05:08 +00:00
|
|
|
isHeaderVisible,
|
2022-03-16 12:22:48 +00:00
|
|
|
|
2021-08-18 12:52:27 +00:00
|
|
|
isBackdropVisible,
|
|
|
|
setIsBackdropVisible,
|
2022-02-01 07:59:42 +00:00
|
|
|
maintenanceExist,
|
2022-02-28 13:13:33 +00:00
|
|
|
snackbarExist,
|
|
|
|
setMaintenanceExist,
|
2021-09-07 13:41:10 +00:00
|
|
|
isDesktop: isDesktopClient,
|
2020-10-13 07:52:44 +00:00
|
|
|
};
|
2022-03-16 12:22:48 +00:00
|
|
|
})(observer(Section));
|