Merge branch 'release/v2.0.0' of github.com:ONLYOFFICE/DocSpace-client into release/v2.0.0

This commit is contained in:
Timofey Boyko 2023-11-07 18:28:25 +03:00
commit 6bdf498323
17 changed files with 104 additions and 54 deletions

View File

@ -1,4 +1,4 @@
import React, { useState, useEffect, useCallback } from "react";
import React, { useState, useEffect, useRef, useCallback } from "react";
import TagHandler from "./handlers/TagHandler";
import SetRoomParams from "./sub-components/SetRoomParams";
@ -25,8 +25,23 @@ const EditRoomDialog = ({
...fetchedRoomParams,
});
const setRoomTags = (newTags) =>
setRoomParams({ ...roomParams, tags: newTags });
const prevRoomParams = useRef(
Object.freeze({
...roomParams,
}),
);
const compareRoomParams = (prevParams, currentParams) => {
return (
prevParams.title === currentParams.title &&
prevParams.roomOwner.id === currentParams.roomOwner.id &&
prevParams.tags.sort().toString() === currentParams.tags.sort().toString() &&
((prevParams.icon.uploadedFile === "" && currentParams.icon.uploadedFile === null) ||
prevParams.icon.uploadedFile === currentParams.icon.uploadedFile)
);
};
const setRoomTags = (newTags) => setRoomParams({ ...roomParams, tags: newTags });
const tagHandler = new TagHandler(roomParams.tags, setRoomTags, fetchedTags);
@ -50,11 +65,16 @@ const EditRoomDialog = ({
};
useEffect(() => {
if (fetchedImage)
if (fetchedImage) {
setRoomParams({
...roomParams,
icon: { ...roomParams.icon, uploadedFile: fetchedImage },
});
prevRoomParams.current = {
...roomParams,
icon: { ...roomParams.icon, uploadedFile: fetchedImage },
};
}
}, [fetchedImage]);
const onCloseAction = () => {
@ -70,8 +90,7 @@ const EditRoomDialog = ({
visible={visible}
onClose={onCloseAction}
isScrollLocked={isScrollLocked}
withFooterBorder
>
withFooterBorder>
<ModalDialog.Header>
<DialogHeader isEdit />
</ModalDialog.Header>
@ -102,7 +121,7 @@ const EditRoomDialog = ({
primary
scale
onClick={onEditRoom}
isDisabled={isWrongTitle}
isDisabled={isWrongTitle || compareRoomParams(prevRoomParams.current, roomParams)}
isLoading={isLoading}
/>
<Button

View File

@ -6,6 +6,7 @@ import Text from "@docspace/components/text";
import { parseAddresses } from "@docspace/components/utils/email";
import { getAccessOptions } from "../utils";
import { getUserRole } from "@docspace/common/utils";
import {
StyledEditInput,
@ -35,6 +36,7 @@ const Item = ({
const name = !!avatar ? (displayName !== "" ? displayName : email) : email;
const source = !!avatar ? avatar : AtReactSvgUrl;
const role = getUserRole(item);
const [edit, setEdit] = useState(false);
const [inputValue, setInputValue] = useState(name);
@ -168,7 +170,7 @@ const Item = ({
return (
<>
<Avatar size="min" role="user" source={source} />
<Avatar size="min" role={role} source={source} />
{edit ? editBody : displayBody}
</>
);

View File

@ -95,7 +95,7 @@ const StyledSettingsComponent = styled.div`
}
.link-learn-more {
display: block;
display: inline-block;
margin: 4px 0 16px 0;
font-weight: 600;
}

View File

@ -21,7 +21,10 @@ const ListHeader = styled.header`
align-items: center;
@media ${tablet} {
margin-top: -4px;
margin-top: -5px;
}
@media ${mobile} {
margin-top: 8px;
}
`;

View File

@ -43,7 +43,7 @@ const HeaderContainer = styled.div`
}
.arrow-button {
margin-inline-end: 18.5px;
margin-inline-end: 17px;
@media ${tablet} {
padding-block: 8px;

View File

@ -12,7 +12,7 @@ import { Base } from "@docspace/components/themes";
import HistoryRow from "./HistoryRow";
const StyledRowContainer = styled(RowContainer)`
margin-top: 11px;
margin-top: 12px;
.row-list-item {
cursor: pointer;

View File

@ -12,8 +12,7 @@ import HistoryTableHeader from "./HistoryTableHeader";
import { useViewEffect } from "@docspace/common/hooks";
const TableWrapper = styled(TableContainer)`
margin-top: 2px;
margin-left: 2px;
margin-top: -2px;
.table-container_header {
position: absolute;
@ -30,13 +29,33 @@ const TableWrapper = styled(TableContainer)`
.table-list-item {
cursor: pointer;
padding-left: 20px;
&:hover {
background-color: ${(props) => (props.theme.isBase ? "#f3f4f4" : "#3D3D3D")};
background-color: ${(props) => props.theme.filesSection.tableView.row.backgroundActive};
.table-container_cell {
margin-top: -1px;
border-top: ${(props) => `1px solid ${props.theme.filesSection.tableView.row.borderColor}`};
margin-left: -24px;
padding-left: 24px;
}
.checkboxWrapper {
padding-left: 32px;
}
.table-container_row-context-menu-wrapper {
margin-right: -20px;
padding-right: 20px;
}
}
}
.table-list-item:has(.selected-table-row) {
background-color: ${(props) => (props.theme.isBase ? "#f3f4f4" : "#3D3D3D")};
background-color: ${(props) => props.theme.filesSection.tableView.row.backgroundActive};
}
`;

View File

@ -26,7 +26,20 @@ const TableWrapper = styled(TableContainer)`
margin-top: -1px;
&:hover {
cursor: pointer;
background-color: ${(props) => (props.theme.isBase ? "#F8F9F9" : "#3D3D3D")};
background-color: ${(props) => props.theme.filesSection.tableView.row.backgroundActive};
.table-container_cell {
margin-top: -1px;
border-top: ${(props) => `1px solid ${props.theme.filesSection.tableView.row.borderColor}`};
margin-left: -24px;
padding-left: 24px;
}
.table-container_row-context-menu-wrapper {
margin-right: -20px;
padding-right: 20px;
}
}
}
`;

View File

@ -40,7 +40,7 @@ export const MainContainer = styled.div`
max-width: 700px;
.link-learn-more {
display: block;
display: inline-block;
margin: 4px 0 16px 0;
font-weight: 600;
}

View File

@ -5,7 +5,6 @@ import React, { useState, useEffect } from "react";
import { inject, observer } from "mobx-react";
import { withTranslation } from "react-i18next";
import { ReactSVG } from "react-svg";
import { isDesktop } from "@docspace/components/utils/device";
import Text from "@docspace/components/text";
import Link from "@docspace/components/link";
import Box from "@docspace/components/box";
@ -28,6 +27,7 @@ import {
TableBody,
TableDataCell,
} from "./styled-active-sessions";
import { DeviceType } from "@docspace/common/constants";
const removeIcon = (
<ReactSVG className="remove-icon" src={RemoveSessionSvgUrl} />
@ -52,7 +52,11 @@ const ActiveSessions = ({
sessions,
currentSession,
setSessions,
currentDeviceType,
}) => {
const isDesktop = currentDeviceType === DeviceType.desktop;
const isMobile = currentDeviceType === DeviceType.mobile;
const [modalData, setModalData] = useState({});
const [loading, setLoading] = useState(false);
const { interfaceDirection } = useTheme();
@ -112,7 +116,7 @@ const ActiveSessions = ({
return new Date(date).toLocaleString(locale);
};
const tableCell = (platform, browser) =>
interfaceDirection === "rtl" && isDesktop() ? (
interfaceDirection === "rtl" && !isMobile ? (
<>
<span className="session-browser">
<span>{browser}</span>
@ -157,7 +161,7 @@ const ActiveSessions = ({
}
/>
</Box>
{!isDesktop() ? (
{!isDesktop ? (
<Table>
<TableBody>
{sessions.map((session) => (
@ -251,7 +255,7 @@ const ActiveSessions = ({
};
export default inject(({ auth, setup }) => {
const { culture } = auth.settingsStore;
const { culture, currentDeviceType } = auth.settingsStore;
const { user } = auth.userStore;
const locale = (user && user.cultureName) || culture || "en";
@ -285,5 +289,6 @@ export default inject(({ auth, setup }) => {
currentSession,
getSessions,
setSessions,
currentDeviceType,
};
})(observer(withTranslation(["Profile", "Common"])(ActiveSessions)));

View File

@ -125,19 +125,6 @@ export const StyledInfo = styled.div`
height: 36px;
margin-top: 7px;
}
.language-combo-box {
.combo-button {
${(props) =>
props.theme.interfaceDirection === "rtl"
? css`
margin-right: -16px;
`
: css`
margin-left: -16px;
`}
}
}
}
}
}

View File

@ -1,6 +1,6 @@
import React, { useState, useRef } from "react";
import PropTypes from "prop-types";
import VerticalDotsReactSvgUrl from "PUBLIC_DIR/images/vertical-dots.react.svg?url";
import VerticalDotsReactSvgUrl from "PUBLIC_DIR/images/icons/17/vertical-dots.react.svg?url";
import IconButton from "@docspace/components/icon-button";
import ContextMenu from "@docspace/components/context-menu";
@ -33,7 +33,7 @@ const ContextButton = (props) => {
onClick={onClick}
iconName={VerticalDotsReactSvgUrl}
id={props.id}
size={15}
size={17}
isFill
/>
<ContextMenu

View File

@ -8,7 +8,7 @@ import { Base } from "@docspace/components/themes";
import ToggleInfoPanelButton from "./toggle-infopanel-btn";
import PlusButton from "./plus-btn";
import ContextButton from "./context-btn";
import VerticalDotsReactSvgUrl from "PUBLIC_DIR/images/vertical-dots.react.svg?url";
import VerticalDotsReactSvgUrl from "PUBLIC_DIR/images/icons/17/vertical-dots.react.svg?url";
const StyledContainer = styled.div`
${(props) =>
@ -45,26 +45,27 @@ const StyledContainer = styled.div`
}
.option-button {
${(props) =>
min-width: 17px;
/* ${(props) =>
props.theme.interfaceDirection === "rtl"
? css`
margin-left: 16px;
`
: css`
margin-right: 16px;
`}
min-width: 15px;
`} */
@media ${tablet} {
/* @media ${tablet} {
${(props) =>
props.theme.interfaceDirection === "rtl"
? css`
margin-left: 9px;
`
: css`
margin-right: 9px;
`}
}
props.theme.interfaceDirection === "rtl"
? css`
margin-left: 9px;
`
: css`
margin-right: 9px;
`}
} */
}
.trash-button {
@ -237,7 +238,7 @@ const ControlButtons = ({
zIndex={402}
className="option-button"
iconName={VerticalDotsReactSvgUrl}
size={15}
size={17}
isFill
getData={getContextOptionsFolder}
isDisabled={false}

View File

@ -38,7 +38,6 @@ const StyledInfoPanelToggleColorThemeWrapper = styled(ColorTheme)`
.info-panel-toggle {
margin: auto;
margin-top: 25%;
margin-inline-end: 8px;
}
}
`}

View File

@ -191,7 +191,7 @@ class InfoPanelStore {
const currentFolderRoomId =
this.selectedFolderStore.pathParts &&
this.selectedFolderStore.pathParts[1].id;
this.selectedFolderStore.pathParts[1]?.id;
const prevRoomId = this.selectionParentRoom?.id;
if (!currentFolderRoomId || currentFolderRoomId === prevRoomId) return;

View File

@ -235,7 +235,6 @@ const StyledInfoPanelToggleColorThemeWrapper = styled(ColorTheme)`
.info-panel-toggle {
margin: auto;
margin-top: 25%;
margin-inline-end: 8px;
}
}
`}

View File

@ -0,0 +1,3 @@
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.5 2.5C10.5 3.60457 9.60457 4.5 8.5 4.5C7.39543 4.5 6.5 3.60457 6.5 2.5C6.5 1.39543 7.39543 0.5 8.5 0.5C9.60457 0.5 10.5 1.39543 10.5 2.5ZM8.5 10.5C9.60457 10.5 10.5 9.60457 10.5 8.5C10.5 7.39543 9.60457 6.5 8.5 6.5C7.39543 6.5 6.5 7.39543 6.5 8.5C6.5 9.60457 7.39543 10.5 8.5 10.5ZM8.5 16.5C9.60457 16.5 10.5 15.6046 10.5 14.5C10.5 13.3954 9.60457 12.5 8.5 12.5C7.39543 12.5 6.5 13.3954 6.5 14.5C6.5 15.6046 7.39543 16.5 8.5 16.5Z" fill="#A3A9AE"/>
</svg>

After

Width:  |  Height:  |  Size: 605 B