Web:Files:Home: change method for changing view from row to table and back

This commit is contained in:
Timofey Boyko 2022-05-17 12:47:12 +03:00
parent f91448f4c7
commit 6fccae257f
2 changed files with 23 additions and 10 deletions

View File

@ -5,6 +5,7 @@ import SimpleFilesRow from "./SimpleFilesRow";
import { isMobile } from "react-device-detect";
import styled from "styled-components";
import marginStyles from "./CommonStyles";
import { isTablet } from "@appserver/components/utils/device";
import { Base } from "@appserver/components/themes";
const StyledRowContainer = styled(RowContainer)`
@ -57,11 +58,21 @@ const StyledRowContainer = styled(RowContainer)`
StyledRowContainer.defaultProps = { theme: Base };
const FilesRowContainer = ({ filesList, sectionWidth, viewAs, setViewAs }) => {
const FilesRowContainer = ({
filesList,
sectionWidth,
viewAs,
setViewAs,
infoPanelVisible,
}) => {
useEffect(() => {
if ((viewAs !== "table" && viewAs !== "row") || !sectionWidth) return;
if (sectionWidth < 1025 || isMobile) {
if (
(sectionWidth < 1025 && !infoPanelVisible) ||
(isTablet() && infoPanelVisible) ||
isMobile
) {
viewAs !== "row" && setViewAs("row");
} else {
viewAs !== "table" && setViewAs("table");
@ -85,12 +96,14 @@ const FilesRowContainer = ({ filesList, sectionWidth, viewAs, setViewAs }) => {
);
};
export default inject(({ filesStore }) => {
export default inject(({ filesStore, infoPanelStore }) => {
const { filesList, viewAs, setViewAs } = filesStore;
const { isVisible: infoPanelVisible } = infoPanelStore;
return {
filesList,
viewAs,
setViewAs,
infoPanelVisible,
};
})(observer(FilesRowContainer));

View File

@ -6,6 +6,7 @@ import TableHeader from "./TableHeader";
import TableBody from "@appserver/components/table-container/TableBody";
import { isMobile } from "react-device-detect";
import styled, { css } from "styled-components";
import { isTablet } from "@appserver/components/utils/device";
import { Base } from "@appserver/components/themes";
const marginCss = css`
@ -108,14 +109,13 @@ const Table = ({
const ref = useRef(null);
useEffect(() => {
if (
(viewAs !== "table" && viewAs !== "row") ||
!setViewAs ||
infoPanelVisible
)
return;
if ((viewAs !== "table" && viewAs !== "row") || !setViewAs) return;
if (sectionWidth < 1025 || isMobile) {
if (
(sectionWidth < 1025 && !infoPanelVisible) ||
(isTablet() && infoPanelVisible) ||
isMobile
) {
viewAs !== "row" && setViewAs("row");
} else {
viewAs !== "table" && setViewAs("table");