IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'release/1.0.0' into develop

Browse Source 
# Conflicts:
#	packages/asc-web-components/aside/aside.js
This commit is contained in:
Alexey Safronov 2021-10-22 09:02:39 +03:00
commit 94a466ed48
42 changed files with 306 additions and 222 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/asc-web-common/components/MediaViewer/MediaViewer.js
View File

@ -13,6 +13,7 @@ import equal from "fast-deep-equal/react";
import Hammer from "hammerjs";
import IconButton from "@appserver/components/icon-button";
import commonIconsStyles from "@appserver/components/utils/common-icons-style";
import { isDesktop } from "react-device-detect";
const StyledVideoViewer = styled(VideoViewer)`
z-index: 301;
@ -104,7 +105,7 @@ class MediaViewer extends React.Component {
document.getElementsByClassName("videoViewerOverlay")[0]
);
}
if (_this.hammer) {
if (_this.hammer && !isDesktop) {
_this.hammer.on("swipeleft", _this.nextMedia);
_this.hammer.on("swiperight", _this.prevMedia);
}

5
packages/asc-web-common/components/PageLayout/index.js
View File

@ -357,7 +357,10 @@ class PageLayout extends React.Component {
paddingRight: "20px",
}}
></div>
<SubSectionFilter className="section-header_filter">
<SubSectionFilter
className="section-header_filter"
viewAs={viewAs}
>
{sectionFilterContent
? sectionFilterContent.props.children
: null}

7
packages/asc-web-common/components/PageLayout/sub-components/section-body.js
View File

@ -35,7 +35,12 @@ const commonStyles = css`
flex: 1 0 auto;
outline: none;
${(props) => props.viewAs == "tile" && "padding-right:0;"}
${(props) =>
props.viewAs == "tile" &&
css`
padding-right: 0;
padding-left: 20px;
`}
.section-wrapper {
display: flex;

13
packages/asc-web-common/components/PageLayout/sub-components/section-filter.js
View File

@ -1,11 +1,20 @@
import React from "react";
import styled from "styled-components";
import styled, { css } from "styled-components";
import equal from "fast-deep-equal/react";
import { tablet } from "@appserver/components/utils/device";
import { tablet, desktop } from "@appserver/components/utils/device";
const StyledSectionFilter = styled.div`
margin: 11px 24px 9px 0;
@media ${desktop} {
${(props) =>
(props.viewAs === "table" || props.viewAs === "tile") &&
css`
margin-left: -4px;
margin-right: 20px;
`};
}
@media ${tablet} {
margin-left: -4px;
}

7
packages/asc-web-common/components/PageLayout/sub-components/section-header.js
View File

@ -25,7 +25,12 @@ const StyledSectionHeader = styled.div`
} */
`}
@media ${desktop} {
${(props) =>
(props.viewAs === "table" || props.viewAs === "tile") &&
"margin-left: -4px"};
}
@media ${tablet} {
${(props) =>
props.viewAs !== "tablet" &&

4
packages/asc-web-common/utils/firebase.js
View File

@ -53,8 +53,8 @@ class FirebaseHelper {
this.config["projectId"] &&
this.config["storageBucket"] &&
this.config["messagingSenderId"] &&
this.config["appId"] &&
this.config["measurementId"]
this.config["appId"] /*&&
this.config["measurementId"]*/
);
}

6
packages/asc-web-components/aside/aside.js
View File

@ -24,7 +24,11 @@ const Aside = React.memo((props) => {
contentPaddingBottom={contentPaddingBottom}
className={`${className} not-selectable aside`}
>
{withoutBodyScroll ? children : <Scrollbar>{children}</Scrollbar>}
{withoutBodyScroll ? (
children
) : (
<Scrollbar stype="mediumBlack">{children}</Scrollbar>
)}
</StyledAside>
);
});

8
packages/asc-web-components/avatar-editor/sub-components/avatar-editor-body.js
View File

@ -311,7 +311,13 @@ class AvatarEditorBody extends React.Component {
const desktopMode = isDesktop();
return (
<Text as="span">
<Link type="action" isHovered color="#316DAA" onClick={this.openDialog}>
<Link
type="action"
fontWeight={600}
isHovered
color="#316DAA"
onClick={this.openDialog}
>
{selectNewPhotoLabel}
</Link>{" "}
{desktopMode && orDropFileHereLabel}

1
packages/asc-web-components/avatar/avatar.stories.js
View File

@ -27,5 +27,4 @@ Default.args = {
source: "",
userName: "",
editing: false,
editLabel: "Edit photo",
};

38
packages/asc-web-components/avatar/index.js
View File

@ -4,7 +4,6 @@ import styled from "styled-components";
import { GuestIcon, AdministratorIcon, OwnerIcon } from "./svg";
import {
EditLink,
EmptyIcon,
EditContainer,
AvatarWrapper,
@ -13,7 +12,7 @@ import {
StyledImage,
StyledAvatar,
} from "./styled-avatar";
import Link from "../link";
import IconButton from "../icon-button";
import commonIconsStyles from "../utils/common-icons-style";
const whiteColor = "#FFFFFF";
@ -57,15 +56,7 @@ Initials.propTypes = {
// eslint-disable-next-line react/display-name
const Avatar = (props) => {
//console.log("Avatar render");
const {
size,
source,
userName,
role,
editing,
editLabel,
editAction,
} = props;
const { size, source, userName, role, editing, editAction } = props;
const avatarContent = source ? (
<StyledImage src={source} />
@ -83,21 +74,13 @@ const Avatar = (props) => {
{avatarContent}
</AvatarWrapper>
{editing && size === "max" && (
<EditContainer gradient={!!source}>
<EditLink>
<Link
type="action"
title={editLabel}
isTextOverflow={true}
isHovered={true}
fontSize="14px"
fontWeight={600}
color={whiteColor}
onClick={editAction}
>
{editLabel}
</Link>
</EditLink>
<EditContainer>
<IconButton
color={whiteColor}
iconName="/static/images/pencil.react.svg"
onClick={editAction}
size={16}
/>
</EditContainer>
)}
<RoleWrapper size={size}>{roleIcon}</RoleWrapper>
@ -112,8 +95,6 @@ Avatar.propTypes = {
role: PropTypes.oneOf(["owner", "admin", "guest", "user"]),
/** The address of the image for an image avatar */
source: PropTypes.string,
/** Displays avatar edit layer */
editLabel: PropTypes.string,
userName: PropTypes.string,
editing: PropTypes.bool,
/** Function called when the avatar change button is pressed */
@ -130,7 +111,6 @@ Avatar.defaultProps = {
size: "medium",
role: "",
source: "",
editLabel: "Edit photo",
userName: "",
editing: false,
};

40
packages/asc-web-components/avatar/styled-avatar.js
View File

@ -5,23 +5,6 @@ import NoUserSelect from "../utils/commonStyles";
import { CameraIcon } from "./svg";
import commonIconsStyles from "../utils/common-icons-style";
const EditLink = styled.div`
padding-left: ${(props) => props.theme.avatar.editLink.paddingLeft};
padding-right: ${(props) => props.theme.avatar.editLink.paddingRight};
a:hover {
border-bottom: ${(props) => props.theme.avatar.editLink.borderBottom};
}
span {
display: ${(props) => props.theme.avatar.editLink.display};
max-width: ${(props) => props.theme.avatar.editLink.maxWidth};
text-decoration: ${(props) => props.theme.avatar.editLink.textDecoration};
}
`;
EditLink.defaultProps = { theme: Base };
const EmptyIcon = styled(CameraIcon)`
${commonIconsStyles}
border-radius: ${(props) => props.theme.avatar.image.borderRadius};
@ -29,21 +12,17 @@ const EmptyIcon = styled(CameraIcon)`
EmptyIcon.defaultProps = { theme: Base };
const EditContainer = styled.div`
box-sizing: ${(props) => props.theme.avatar.editContainer.boxSizing};
position: absolute;
width: ${(props) => props.theme.avatar.editContainer.width};
height: ${(props) => props.theme.avatar.editContainer.height};
top: ${(props) => props.theme.avatar.editContainer.top};
left: ${(props) => props.theme.avatar.editContainer.left};
transform: ${(props) => props.theme.avatar.editContainer.transform};
padding: ${(props) => props.theme.avatar.editContainer.padding};
text-align: ${(props) => props.theme.avatar.editContainer.textAlign};
line-height: ${(props) => props.theme.avatar.editContainer.lineHeight};
display: flex;
right: ${(props) => props.theme.avatar.editContainer.right};
bottom: ${(props) => props.theme.avatar.editContainer.bottom};
background-color: ${(props) =>
props.theme.avatar.editContainer.backgroundColor};
border-radius: ${(props) => props.theme.avatar.editContainer.borderRadius};
background: ${(props) =>
props.gradient
? props.theme.avatar.editContainer.linearGradient
: props.theme.avatar.editContainer.transparent};
height: ${(props) => props.theme.avatar.editContainer.height};
width: ${(props) => props.theme.avatar.editContainer.width};
align-items: center;
justify-content: center;
`;
EditContainer.defaultProps = { theme: Base };
@ -129,7 +108,6 @@ const StyledAvatar = styled.div`
StyledAvatar.defaultProps = { theme: Base };
export {
EditLink,
EmptyIcon,
EditContainer,
AvatarWrapper,

2
packages/asc-web-components/scrollbar/custom-scrollbars-virtual-list.js
View File

@ -2,7 +2,7 @@
import React from "react";
import Scrollbar from "../scrollbar";
class CustomScrollbars extends React.Component {
export class CustomScrollbars extends React.Component {
refSetter = (scrollbarsRef, forwardedRef) => {
if (scrollbarsRef) {
forwardedRef(scrollbarsRef.view);

5
packages/asc-web-components/scrollbar/styled-scrollbar.js
View File

@ -16,6 +16,11 @@ const StyledScrollbar = styled(Scrollbars)`
? props.color
: props.theme.scrollbar.backgroundColorHorizontal};
}
.nav-thumb-vertical:hover {
background-color: ${(props) =>
props.theme.scrollbar.hoverBackgroundColorVertical};
}
`;
StyledScrollbar.defaultProps = {

31
packages/asc-web-components/themes/base.js
View File

@ -478,8 +478,9 @@ const Base = {
},
scrollbar: {
backgroundColorVertical: "#e5e5e5",
backgroundColorVertical: "rgba(208, 213, 218, 1)",
backgroundColorHorizontal: "rgba(0, 0, 0, 0.1)",
hoverBackgroundColorVertical: "rgba(163, 169, 174, 1)",
},
modalDialog: {
@ -917,28 +918,12 @@ const Base = {
},
editContainer: {
boxSizing: "border-box",
width: "100%",
height: "100%",
top: "50%",
left: "50%",
transform: "translate(-50%, -50%)",
padding: "75% 16px 5px",
textAlign: "center",
lineHeight: "19px",
right: "0px",
bottom: "0px",
backgroundColor: "#265a8f",
borderRadius: "50%",
linearGradient:
"linear-gradient(180deg, rgba(6, 22, 38, 0) 24.48%, rgba(6, 22, 38, 0.75) 100%)",
transparent: "transparent",
},
editLink: {
paddingLeft: "10px",
paddingRight: "10px",
borderBottom: "none",
display: "inline-block",
maxWidth: "100%",
textDecoration: "underline dashed",
height: "32px",
width: "32px",
},
image: {
@ -1403,7 +1388,7 @@ const Base = {
maxWidth: "175px",
lineHeightWithoutBorder: "16px",
lineHeightTextDecoration: "underline dashed transparent",
lineHeightTextDecoration: "underline dashed",
},
childrenButton: {

30
packages/asc-web-components/themes/dark.js
View File

@ -444,8 +444,9 @@ const Dark = {
},
scrollbar: {
backgroundColorVertical: "rgba(255, 255, 255, 0.5)",
backgroundColorVertical: "rgba(208, 213, 218, 1)",
backgroundColorHorizontal: "rgba(255, 255, 255, 0.5)",
hoverBackgroundColorVertical: "rgba(163, 169, 174, 1)",
},
modalDialog: {
@ -880,29 +881,14 @@ const Dark = {
},
},
editContainer: {
boxSizing: "border-box",
width: "100%",
height: "100%",
top: "50%",
left: "50%",
transform: "translate(-50%, -50%)",
padding: "75% 16px 5px",
textAlign: "center",
lineHeight: "19px",
right: "0px",
bottom: "0px",
backgroundColor: "#265a8f",
borderRadius: "50%",
linearGradient:
"linear-gradient(180deg, rgba(6, 22, 38, 0) 24.48%, rgba(6, 22, 38, 0.75) 100%)",
transparent: "transparent",
height: "32px",
width: "32px",
},
editLink: {
paddingLeft: "10px",
paddingRight: "10px",
borderBottom: "none",
display: "inline-block",
maxWidth: "100%",
textDecoration: "underline dashed",
},
image: {
width: "100%",
height: "100%",
@ -1194,7 +1180,7 @@ const Dark = {
maxWidth: "175px",
lineHeightWithoutBorder: "16px",
lineHeightTextDecoration: "underline dashed transparent",
lineHeightTextDecoration: "underline dashed",
},
childrenButton: {

19
products/ASC.Files/Client/src/HOCs/withContent.js
View File

@ -109,18 +109,19 @@ export default function withContent(WrappedContent) {
return this.completeAction(e);
};
onClickUpdateItem = (e) => {
onClickUpdateItem = (e, open = true) => {
const { fileActionType } = this.props;
fileActionType === FileAction.Create
? this.createItem(e)
? this.createItem(e, open)
: this.updateItem(e);
};
createItem = (e) => {
createItem = (e, open) => {
const {
createFile,
item,
setIsLoading,
isLoading,
openDocEditor,
isPrivacy,
isDesktop,
@ -131,6 +132,8 @@ export default function withContent(WrappedContent) {
} = this.props;
const { itemTitle } = this.state;
if (isLoading) return;
setIsLoading(true);
const itemId = e.currentTarget.dataset.itemid;
@ -141,7 +144,7 @@ export default function withContent(WrappedContent) {
}
let tab =
!isDesktop && item.fileExst
!isDesktop && item.fileExst && open
? window.open(
combineUrl(
AppServerConfig.proxyURL,
@ -170,10 +173,12 @@ export default function withContent(WrappedContent) {
encryptedFile,
true,
false
).then(() => openDocEditor(file.id, file.providerKey, tab));
).then(
() => open && openDocEditor(file.id, file.providerKey, tab)
);
});
}
return openDocEditor(file.id, file.providerKey, tab);
return open && openDocEditor(file.id, file.providerKey, tab);
})
.then(() => this.completeAction(itemId))
.catch((e) => toastr.error(e))
@ -315,6 +320,7 @@ export default function withContent(WrappedContent) {
const { editCompleteAction } = filesActionsStore;
const {
setIsLoading,
isLoading,
openDocEditor,
updateFile,
renameFolder,
@ -338,6 +344,7 @@ export default function withContent(WrappedContent) {
return {
setIsLoading,
isLoading,
isTrashFolder: isRecycleBinFolder,
openDocEditor,
updateFile,

2
products/ASC.Files/Client/src/HOCs/withFileActions.js
View File

@ -96,7 +96,7 @@ export default function withFileActions(WrappedFileItem) {
}
e.preventDefault();
setTooltipPosition(e.pageX, e.pageY);
setStartDrag(true);
!isFileName && setStartDrag(true);
!isActive && setBufferSelection(null);
};

4
products/ASC.Files/Client/src/components/EditingWrapperComponent.js
View File

@ -46,6 +46,8 @@ const EditingWrapper = styled.div`
border-bottom: 1px solid #eceef1;
padding-bottom: 4px;
margin-top: 4px;
margin-left: -4px;
`}
${(props) =>
@ -149,6 +151,7 @@ const EditingWrapperComponent = (props) => {
};
const onFocus = (e) => e.target.select();
const onBlur = (e) => onClickUpdateItem(e, false);
return (
<EditingWrapper viewAs={viewAs}>
@ -164,6 +167,7 @@ const EditingWrapperComponent = (props) => {
onKeyUp={onKeyUpUpdateItem}
onKeyDown={onEscapeKeyPress}
onFocus={onFocus}
onBlur={onBlur}
isDisabled={isLoading}
data-itemid={itemId}
withBorder={!isTable}

4
products/ASC.Files/Client/src/components/panels/StyledPanels.js
View File

@ -92,11 +92,11 @@ const StyledVersionHistoryPanel = styled.div`
${PanelStyles}
.version-history-modal-dialog {
transform: translateX(${(props) => (props.visible ? "0" : "720px")});
width: 720px;
width: 500px;
}
.version-history-aside-panel {
transform: translateX(${(props) => (props.visible ? "0" : "720px")});
width: 720px;
width: 500px;
}
.version-history-panel-header {
height: 53px;

6
products/ASC.Files/Client/src/components/panels/UploadPanel/FileList.js
View File

@ -1,10 +1,14 @@
import React from "react";
import CustomScrollbarsVirtualList from "@appserver/components/scrollbar/custom-scrollbars-virtual-list";
import CustomScrollbars from "@appserver/components/scrollbar/custom-scrollbars-virtual-list";
import AutoSizer from "react-virtualized-auto-sizer";
import { FixedSizeList as List } from "react-window";
import RowWrapper from "./RowWrapper";
import { inject, observer } from "mobx-react";
const CustomScrollbarsVirtualList = React.forwardRef((props, ref) => (
<CustomScrollbars stype="mediumBlack" {...props} forwardedRef={ref} />
));
const FileList = ({ uploadDataFiles }) => {
//console.log("FileList render");

6
products/ASC.Files/Client/src/components/panels/UploadPanel/index.js
View File

@ -87,7 +87,11 @@ class UploadPanelComponent extends React.Component {
zIndex={zIndex}
isAside={true}
/>
<Aside className="header_aside-panel" visible={visible}>
<Aside
className="header_aside-panel"
visible={visible}
withoutBodyScroll
>
<StyledContent>
<StyledHeaderContent className="upload-panel_header-content">
<Heading className="upload_panel-header" size="medium" truncate>

4
products/ASC.Files/Client/src/pages/Home/Section/Body/TableView/TableRow.js
View File

@ -63,6 +63,10 @@ const StyledTableRow = styled(TableRow)`
"url(images/cursor.palm.svg), auto"};
}
.table-container_element {
margin-left: ${(props) => (props.item.isFolder ? "-3px" : "-4px")};
}
&:hover {
.table-container_row-checkbox-wrapper {
${(props) => props.dragging && rowCheckboxDraggingHoverStyle}

14
products/ASC.Files/Client/src/pages/Home/Section/Body/TilesView/FilesTileContent.js
View File

@ -9,6 +9,7 @@ import Text from "@appserver/components/text";
import TileContent from "./sub-components/TileContent";
import withContent from "../../../../../HOCs/withContent";
import withBadges from "../../../../../HOCs/withBadges";
import { isMobile } from "react-device-detect";
const SimpleFilesTileContent = styled(TileContent)`
.row-main-container {
@ -54,7 +55,8 @@ const SimpleFilesTileContent = styled(TileContent)`
}
.title-link {
font-size: 14px;
font-size: ${isMobile ? "15px" : "13px"};
margin-top: 2px;
}
.favorite,
@ -83,18 +85,14 @@ const FilesTileContent = ({
return (
<>
<SimpleFilesTileContent
sideColor="#333"
isFile={fileExst}
//disableSideInfo
>
<SimpleFilesTileContent sideColor="#333" isFile={fileExst}>
<Link
className="title-link item-file-name"
containerWidth="100%"
type="page"
title={title}
fontWeight="600"
fontSize="14px"
fontSize={isMobile ? "15px" : "13px"}
target="_blank"
{...linkStyles}
color="#333"
@ -106,7 +104,7 @@ const FilesTileContent = ({
className="badge-ext"
as="span"
color="#A3A9AE"
fontSize="14px"
fontSize={isMobile ? "15px" : "13px"}
fontWeight={600}
truncate={true}
>

88
products/ASC.Files/Client/src/pages/Home/Section/Body/TilesView/sub-components/Tile.js
View File

@ -6,6 +6,7 @@ import { ReactSVG } from "react-svg";
import styled, { css } from "styled-components";
import ContextMenu from "@appserver/components/context-menu";
import { tablet } from "@appserver/components/utils/device";
import { isDesktop, isMobile } from "react-device-detect";
import Link from "@appserver/components/link";
@ -100,9 +101,11 @@ const StyledTile = styled.div`
}
.checkbox {
display: flex;
opacity: ${(props) => (props.checked ? 1 : 0)};
flex: 0 0 16px;
margin-right: 4px;
justify-content: center;
@media ${tablet} {
opacity: 1;
@ -112,11 +115,18 @@ const StyledTile = styled.div`
.file-checkbox {
display: ${(props) => (props.checked ? "flex" : "none")};
flex: 0 0 16px;
margin-right: ${(props) => (props.isFolder ? "8px" : "4px")};
margin-top: 3px;
margin-left: ${(props) =>
isMobile
? css`
${props.isFolder ? "6px" : "12px"};
`
: css`
${props.isFolder ? "5px" : "8px"}
`};
@media ${tablet} {
display: flex;
margin-top: 2px;
}
}
@ -126,33 +136,47 @@ const StyledTile = styled.div`
flex: 0 0 auto;
margin-right: 4px;
user-select: none;
margin-top: 3px;
margin-top: ${(props) => (props.isFolder ? "-6px" : "-4px")};
margin-top: ${(props) => (props.isFolder ? "-8px" : "-6px")};
height: 32px;
width: 32px;
height: ${isMobile ? "32px" : "24px"};
width: ${isMobile ? "32px" : "24px"};
img {
height: 32px;
width: 32px;
height: ${isMobile ? "32px" : "24px"};
width: ${isMobile ? "32px" : "24px"};
}
@media ${tablet} {
display: none;
}
margin-left: ${(props) =>
isMobile
? css`
${props.isFolder ? "2px" : "4px"};
`
: css`
${props.isFolder ? "2px" : "4px"}
`};
}
.file-icon_container {
min-width: 36px;
min-width: ${isMobile ? "36px" : "28px"};
}
@media ${tablet} {
min-width: 28px;
}
.styled-content {
padding-left: 10px;
padding-left: ${(props) =>
isMobile
? css`
${props.isFolder ? "8px" : "12px"};
`
: css`
${props.isFolder ? "10px" : "13px"}
`};
}
:hover {
${(props) =>
!props.dragging &&
props.isDesktop &&
css`
.checkbox {
opacity: 1;
@ -173,8 +197,12 @@ const StyledFileTileTop = styled.div`
align-items: baseline;
background-color: #f8f9f9;
padding: 13px;
height: 157px;
height: ${(props) => (props.checked || props.isActive ? "156px" : "156px")};
position: relative;
border-bottom: ${(props) =>
props.checked || props.isActive
? "1px solid #D0D5DA"
: "1px solid transparent"};
.thumbnail-image,
.temporary-icon > .injected-svg {
@ -195,8 +223,6 @@ const StyledFileTileBottom = styled.div`
padding-right: 0;
min-height: 56px;
box-sizing: border-box;
border-top: ${(props) =>
(props.checked || props.isActive) && "1px solid #D0D5DA"};
`;
const StyledContent = styled.div`
@ -292,6 +318,13 @@ class Tile extends React.PureComponent {
onSelect && onSelect(e.target.checked, item);
};
onFileIconClick = () => {
if (isDesktop) return;
const { onSelect, item } = this.props;
onSelect && onSelect(true, item);
};
render() {
const {
checked,
@ -348,12 +381,18 @@ class Tile extends React.PureComponent {
isRecycleBin={isRecycleBin}
checked={checked}
isActive={isActive}
isDesktop={isDesktop}
>
{isFolder || (!fileExst && id === -1) ? (
<>
{renderElement && !(!fileExst && id === -1) && !isEdit && (
<div className="file-icon_container">
<StyledElement className="file-icon">{element}</StyledElement>
<StyledElement
className="file-icon"
onClick={this.onFileIconClick}
>
{element}
</StyledElement>
<Checkbox
className="checkbox file-checkbox"
isChecked={checked}
@ -363,6 +402,7 @@ class Tile extends React.PureComponent {
</div>
)}
<StyledContent
className="styled-content"
isFolder={(isFolder && !fileExst) || (!fileExst && id === -1)}
>
{children}
@ -386,11 +426,15 @@ class Tile extends React.PureComponent {
</>
) : (
<>
<StyledFileTileTop>{icon}</StyledFileTileTop>
<StyledFileTileBottom checked={checked} isActive={isActive}>
<StyledFileTileTop checked={checked} isActive={isActive}>
{icon}
</StyledFileTileTop>
<StyledFileTileBottom>
{id !== -1 && !isEdit && (
<div className="file-icon_container">
<div className="file-icon">{element}</div>
<div className="file-icon" onClick={this.onFileIconClick}>
{element}
</div>
<Checkbox
className="file-checkbox"
isChecked={checked}

55
products/ASC.Files/Client/src/pages/Home/Section/Body/TilesView/sub-components/TileContainer.js
View File

@ -1,35 +1,50 @@
/* eslint-disable react/display-name */
import React, { memo } from "react";
import styled from "styled-components";
import styled, { css } from "styled-components";
import PropTypes from "prop-types";
import { FixedSizeList as List, areEqual } from "react-window";
import AutoSizer from "react-virtualized-auto-sizer";
import Heading from "@appserver/components/heading";
import ContextMenu from "@appserver/components/context-menu";
import CustomScrollbarsVirtualList from "@appserver/components/scrollbar";
import { tablet } from "@appserver/components/utils/device";
import { tablet, desktop } from "@appserver/components/utils/device";
const foldersStyle = css`
grid-gap: 19px 14px;
@media ${desktop} {
margin-left: -1px;
padding-right: 1px;
}
@media ${tablet} {
grid-gap: 17px 12px;
margin-left: -1px;
}
`;
const filesStyle = css`
grid-gap: 14px 18px;
@media ${desktop} {
padding-right: 5px;
}
@media ${tablet} {
grid-gap: 12px 14px;
margin-left: -1px;
padding-right: 2px;
}
`;
const StyledGridWrapper = styled.div`
display: grid;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
width: 100%;
grid-gap: ${(props) => (props.isFolders ? "13px 14px" : "16px 18px")};
padding-bottom: 24px;
padding-right: 2px;
box-sizing: border-box;
padding-left: 1px;
@media ${tablet} {
margin-left: -6px !important;
}
@media (min-width: 1024px) {
margin-left: -2px;
}
@media (max-width: 1024px) {
margin-left: -2px;
}
${(props) => (props.isFolders ? foldersStyle : filesStyle)};
`;
const StyledTileContainer = styled.div`
@ -59,6 +74,8 @@ const StyledTileContainer = styled.div`
&.files {
padding-top: 8px;
}
margin-left: -1px;
}
@media (min-width: 1024px) {
@ -68,6 +85,10 @@ const StyledTileContainer = styled.div`
}
}
}
@media ${tablet} {
margin-right: -3px;
}
`;
class TileContainer extends React.PureComponent {

4
products/ASC.Files/Client/src/store/FilesStore.js
View File

@ -1062,7 +1062,7 @@ class FilesStore {
const { getFileIcon, getFolderIcon } = this.formatsStore.iconFormatsStore;
if (items.length && items[0].id === -1) return; //TODO: if change media collection from state remove this;
const iconSize = this.viewAs === "tile" ? 32 : 24;
const iconSize = this.viewAs === "tile" && isMobile ? 32 : 24;
const icon = this.fileActionStore.extension
? getFileIcon(`.${this.fileActionStore.extension}`, iconSize)
: getFolderIcon(null, iconSize);
@ -1134,7 +1134,7 @@ class FilesStore {
const isThirdPartyFolder = providerKey && id === rootFolderId;
//const isCanWebEdit = canWebEdit(item.fileExst);
const iconSize = this.viewAs === "tile" ? 32 : 24;
const iconSize = this.viewAs === "tile" && isMobile ? 32 : 24;
const icon = getIcon(iconSize, fileExst, providerKey, contentLength);
let isFolder = false;

34
products/ASC.Files/Client/src/store/UploadDataStore.js
View File

@ -389,7 +389,7 @@ class UploadDataStore {
this.uploadToFolder = null;
this.percent = 0;
}
if (this.converted) {
if (this.uploaded && this.converted) {
this.files = [];
this.filesToConversion = [];
}
@ -874,25 +874,25 @@ class UploadDataStore {
return;
}
let operationItem = null;
let operationItem = data;
let finished = data.finished;
while (progress !== 100) {
await this.getOperationProgress(data.id)
.then((item) => {
operationItem = item;
progress = item ? item.progress : 100;
while (!finished) {
const item = await this.getOperationProgress(data.id);
operationItem = item;
progress = item ? item.progress : 100;
finished = item.finished;
setSecondaryProgressBarData({
icon: pbData.icon,
label: pbData.label || label,
percent: progress,
visible: true,
alert: false,
});
})
.catch((err) => Promise.reject(err));
setSecondaryProgressBarData({
icon: pbData.icon,
label: pbData.label || label,
percent: progress,
visible: true,
alert: false,
});
}
return Promise.resolve(operationItem);
return operationItem;
};
moveToCopyTo = (destFolderId, pbData, isCopy) => {

3
products/ASC.Files/Core/Core/Dao/TeamlabDao/FolderDao.cs
View File

@ -515,6 +515,7 @@ namespace ASC.Files.Core.Data
var toInsert = FilesDbContext.Tree
.Where(r => r.FolderId == toFolderId)
.OrderBy(r => r.Level)
.ToList();
foreach (var subfolder in subfolders)
@ -525,7 +526,7 @@ namespace ASC.Files.Core.Data
{
FolderId = subfolder.Key,
ParentId = f.ParentId,
Level = f.Level + 1
Level = subfolder.Value + 1 + f.Level
};
FilesDbContext.AddOrUpdate(r => r.Tree, newTree);
}

58
products/ASC.Files/Core/Services/WCFService/FileOperations/FileDownloadOperation.cs
View File

@ -36,6 +36,7 @@ using ASC.Common.Threading;
using ASC.Common.Web;
using ASC.Core.Tenants;
using ASC.Files.Core;
using ASC.Files.Core.EF;
using ASC.Files.Core.Resources;
using ASC.MessagingSystem;
using ASC.Web.Core.Files;
@ -116,11 +117,44 @@ namespace ASC.Web.Files.Services.WCFService.FileOperations
stream,
MimeMapping.GetMimeMapping(path),
"attachment; filename=\"" + fileName + "\"");
Result = string.Format("{0}?{1}=bulk&ext={2}", filesLinkUtility.FileHandlerPath, FilesLinkUtility.Action, archiveExtension);
Result = string.Format("{0}?{1}=bulk&ext={2}", filesLinkUtility.FileHandlerPath, FilesLinkUtility.Action, archiveExtension);
TaskInfo.SetProperty(PROGRESS, 100);
TaskInfo.SetProperty(RESULT, Result);
TaskInfo.SetProperty(FINISHED, true);
}
FillDistributedTask();
TaskInfo.PublishChanges();
}
public override void PublishChanges(DistributedTask task)
{
var thirdpartyTask = ThirdPartyOperation.GetDistributedTask();
var daoTask = DaoOperation.GetDistributedTask();
var error1 = thirdpartyTask.GetProperty<string>(ERROR);
var error2 = daoTask.GetProperty<string>(ERROR);
if (!string.IsNullOrEmpty(error1))
{
Error = error1;
}
else if (!string.IsNullOrEmpty(error2))
{
Error = error2;
}
successProcessed = thirdpartyTask.GetProperty<int>(PROCESSED) + daoTask.GetProperty<int>(PROCESSED);
var progressSteps = ThirdPartyOperation.Total + DaoOperation.Total + 1;
var progress = (int)(successProcessed / (double)progressSteps * 100);
base.FillDistributedTask();
TaskInfo.SetProperty(PROGRESS, progress < 100 ? progress : progress);
TaskInfo.PublishChanges();
}
}
@ -145,7 +179,8 @@ namespace ASC.Web.Files.Services.WCFService.FileOperations
{
if (!Files.Any() && !Folders.Any()) return;
entriesPathId = GetEntriesPathId(scope);
entriesPathId = GetEntriesPathId(scope);
if (entriesPathId == null || entriesPathId.Count == 0)
{
if (Files.Count > 0)
@ -156,7 +191,11 @@ namespace ASC.Web.Files.Services.WCFService.FileOperations
throw new DirectoryNotFoundException(FilesCommonResource.ErrorMassage_FolderNotFound);
}
ReplaceLongPath(entriesPathId);
ReplaceLongPath(entriesPathId);
Total = entriesPathId.Count;
TaskInfo.PublishChanges();
}
private ItemNameValueCollection<T> ExecPathFromFile(IServiceScope scope, File<T> file, string path)
@ -236,7 +275,7 @@ namespace ASC.Web.Files.Services.WCFService.FileOperations
}
return entriesPathId;
}
internal void CompressToZip(Stream stream, IServiceScope scope)
{
if (entriesPathId == null) return;
@ -345,6 +384,15 @@ namespace ASC.Web.Files.Services.WCFService.FileOperations
}
compressTo.CloseEntry();
counter++;
if (!Equals(entryId, default(T)) && file != null)
{
ProcessedFile(entryId);
}
else
{
ProcessedFolder(default(T));
}
}
ProgressStep();

2
products/ASC.Files/Core/Services/WCFService/FileOperations/FileOperation.cs
View File

@ -149,7 +149,7 @@ namespace ASC.Web.Files.Services.WCFService.FileOperations
base.FillDistributedTask();
}
public void PublishChanges(DistributedTask task)
public virtual void PublishChanges(DistributedTask task)
{
var thirdpartyTask = ThirdPartyOperation.GetDistributedTask();
var daoTask = DaoOperation.GetDistributedTask();

2
products/ASC.Files/Tests/ASC.Files.Tests.csproj
View File

@ -11,7 +11,7 @@
</ItemGroup>
<ItemGroup>
<PackageReference Include="AppLimit.CloudComputing.SharpBox" Version="1.1.0.456" />
<PackageReference Include="AppLimit.CloudComputing.SharpBox" Version="1.1.0.457" />
<PackageReference Include="Autofac" Version="6.0.0" />
<PackageReference Include="Autofac.Configuration" Version="6.0.0" />
<PackageReference Include="Autofac.Extensions.DependencyInjection" Version="7.1.0" />

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/ContactField.js
View File

@ -21,8 +21,6 @@ class ContactField extends React.Component {
}
render() {
console.log("ContactField render");
const {
isDisabled,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/ContactsField.js
View File

@ -66,8 +66,6 @@ class ContactsField extends React.Component {
}
render() {
console.log("ContactsField render");
const {
pattern,
contacts,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/DateField.js
View File

@ -9,8 +9,6 @@ class DateField extends React.Component {
}
render() {
console.log("DateField render");
const {
isRequired,
hasError,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/DepartmentField.js
View File

@ -16,8 +16,6 @@ class DepartmentField extends React.Component {
};
render() {
console.log("DepartmentField render");
const {
isRequired,
isDisabled,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/EmailField.js
View File

@ -9,8 +9,6 @@ class EmailField extends React.Component {
}
render() {
console.log("EmailField render");
const {
isRequired,
hasError,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/PasswordField.js
View File

@ -11,8 +11,6 @@ class PasswordField extends React.Component {
}
render() {
console.log("PasswordField render");
const {
isRequired,
hasError,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/RadioField.js
View File

@ -9,8 +9,6 @@ class RadioField extends React.Component {
}
render() {
//console.log("RadioField render");
const {
isRequired,
hasError,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/TextChangeField.js
View File

@ -18,8 +18,6 @@ class TextChangeField extends React.Component {
}
render() {
console.log("TextChangeField render");
const {
isRequired,
hasError,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/FormFields/TextField.js
View File

@ -9,8 +9,6 @@ class TextField extends React.Component {
}
render() {
console.log("TextField render");
const {
isRequired,
hasError,

2
products/ASC.People/Client/src/pages/ProfileAction/Section/Body/updateUserForm.js
View File

@ -499,7 +499,6 @@ class UpdateUserForm extends React.Component {
this.setState({ isLoading: true });
const { profile, setAvatarMax, personal } = this.props;
console.log("profile", profile);
if (isUpdate) {
createThumbnailsAvatar(profile.id, {
x: Math.round(result.x * avatar.defaultWidth - result.width / 2),
@ -727,7 +726,6 @@ class UpdateUserForm extends React.Component {
source={this.props.avatarMax || profile.avatarMax}
userName={profile.displayName}
editing={true}
editLabel={t("Common:EditAvatar")}
editAction={
isMobile ? this.openAvatarEditorPage : this.openAvatarEditor
}

3
public/images/pencil.react.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.35866 11.0127L0.366956 14.6494C0.204108 15.2466 0.752062 15.7945 1.34924 15.6317L4.98595 14.64C5.32177 14.5484 5.62787 14.3708 5.87399 14.1247L12.7918 7.20689L8.79177 3.20689L1.87399 10.1247C1.62787 10.3708 1.45024 10.6769 1.35866 11.0127ZM10.2059 1.79264L14.2059 5.79264L14.9985 4.99999C16.103 3.89541 16.103 2.1046 14.9985 1.00006C13.8939 -0.104537 12.103 -0.104507 10.9984 1.00012L10.2059 1.79264Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 572 B