Merge branch 'develop' into feature/oauth2-client

This commit is contained in:
Timofey Boyko 2024-06-03 10:12:51 +03:00
commit 05c2f12d44
12 changed files with 104 additions and 56 deletions

View File

@ -158,7 +158,7 @@ const withHotkeys = (Component) => {
document.addEventListener("paste", onPaste);
return () => {
window.removeEventListener("keypress", throttledKeyDownEvent);
window.removeEventListener("keydown", throttledKeyDownEvent);
document.removeEventListener("paste", onPaste);
};
});

View File

@ -62,7 +62,11 @@ const StyledModalDialogContainer = styled(ModalDialogContainer)`
.user-delete {
line-height: 20px;
padding-bottom: 16px;
${(props) =>
(!props.areUsersOnly || props.deleteWithoutReassign) &&
css`
padding-bottom: 16px;
`}
}
.text-warning {
@ -118,6 +122,8 @@ const DeleteProfileEverDialogComponent = (props) => {
usersToDelete[0].isAdmin ||
usersToDelete[0].isCollaborator);
const areUsersOnly = usersToDelete.every((user) => user.isVisitor);
const onDeleteUser = (id) => {
const filter = Filter.getDefault();
setIsRequestRunning(true);
@ -182,6 +188,8 @@ const DeleteProfileEverDialogComponent = (props) => {
visible={visible}
onClose={onClose}
needReassignData={needReassignData}
deleteWithoutReassign={deleteWithoutReassign}
areUsersOnly={areUsersOnly}
>
<ModalDialog.Header>
{onlyOneUser ? t("DeleteUser") : t("DeletingUsers")}
@ -193,6 +201,7 @@ const DeleteProfileEverDialogComponent = (props) => {
deleteWithoutReassign={deleteWithoutReassign}
users={usersToDelete}
onlyOneUser={onlyOneUser}
areUsersOnly={areUsersOnly}
t={t}
/>
</ModalDialog.Body>

View File

@ -40,6 +40,7 @@ const BodyComponent = (props) => {
userPerformedDeletion,
users,
onlyOneUser,
areUsersOnly,
} = props;
const warningMessageMyDocuments = t("DeleteMyDocumentsUser");
@ -87,8 +88,12 @@ const BodyComponent = (props) => {
return (
<>
<Text className="user-delete">{t("ActionCannotBeUndone")}</Text>
<Text className="text-warning">{t("Common:Warning")}</Text>
<Text className="text-delete-description">{warningMessage}</Text>
{!areUsersOnly && (
<>
<Text className="text-warning">{t("Common:Warning")}</Text>
<Text className="text-delete-description">{warningMessage}</Text>
</>
)}
</>
);
}
@ -96,8 +101,12 @@ const BodyComponent = (props) => {
return (
<>
<Text className="user-delete">{deleteMessage}</Text>
<Text className="text-warning">{t("Common:Warning")}</Text>
<Text className="text-delete-description">{warningMessage}</Text>
{!areUsersOnly && (
<>
<Text className="text-warning">{t("Common:Warning")}</Text>
<Text className="text-delete-description">{warningMessage}</Text>
</>
)}
{needReassignData && (
<Link

View File

@ -827,7 +827,7 @@ const SectionHeaderContent = (props) => {
};
const onNavigationButtonClick = () => {
onCreateAndCopySharedLink(props.roomItem, t);
onCreateAndCopySharedLink(selectedFolder, t);
};
const headerMenu = isAccountsPage
@ -1236,11 +1236,6 @@ export default inject(
shared) ||
(sharedItem && sharedItem.canCopyPublicLink);
const roomItem =
navigationPath.length > 1
? navigationPath[navigationPath.length - 2]
: selectedFolder;
return {
isGracePeriod,
setInviteUsersWarningDialogVisible,
@ -1366,8 +1361,6 @@ export default inject(
onClickReconnectStorage,
getFolderModel,
onCreateRoom,
roomItem,
};
},
)(

View File

@ -42,8 +42,8 @@ import {
import {
TEditHistory,
TGetReferenceData,
TSharedUsers,
} from "@docspace/shared/api/files/types";
import { TUser } from "@docspace/shared/api/people/types";
import { EDITOR_ID } from "@docspace/shared/constants";
import {
assign,
@ -67,7 +67,6 @@ import {
THistoryData,
UseEventsProps,
} from "@/types";
import { useTranslation } from "react-i18next";
type IConfigEvents = Pick<IConfig, "events">;
@ -87,7 +86,7 @@ const useEditorEvents = ({
const [events, setEvents] = React.useState<IConfigEvents>({});
const [documentReady, setDocumentReady] = React.useState(false);
const [createUrl, setCreateUrl] = React.useState<Nullable<string>>(null);
const [usersInRoom, setUsersInRoom] = React.useState<TUser[]>([]);
const [usersInRoom, setUsersInRoom] = React.useState<TSharedUsers[]>([]);
const [docTitle, setDocTitle] = React.useState("");
const [docSaved, setDocSaved] = React.useState(false);
@ -452,14 +451,7 @@ const useEditorEvents = ({
: getSharedUsers(fileInfo.id));
if (c !== "protect") {
const usersArray = users.map(
(item) =>
({
email: item.email,
name: item.name,
}) as unknown as TUser,
);
setUsersInRoom(usersArray);
setUsersInRoom(users);
}
docEditor?.setUsers?.({

View File

@ -26,6 +26,7 @@
import React from "react";
import { cookies } from "next/headers";
import dynamic from "next/dynamic";
import { SYSTEM_THEME_KEY } from "@docspace/shared/constants";
import { ThemeKeys, WhiteLabelLogoType } from "@docspace/shared/enums";
@ -37,18 +38,23 @@ import { FormWrapper } from "@docspace/shared/components/form-wrapper";
import SimpleNav from "@/components/SimpleNav";
import { LoginContent, LoginFormWrapper } from "@/components/Login";
import GreetingContainer from "@/components/GreetingContainer";
import { getColorTheme, getPortalCultures, getSettings } from "@/utils/actions";
import LanguageComboboxWrapper from "@/components/LanguageCombobox";
import { getColorTheme, getSettings } from "@/utils/actions";
const LanguageComboboxWrapper = dynamic(
() => import("@/components/LanguageCombobox"),
{
ssr: false,
},
);
export default async function Layout({
children,
}: {
children: React.ReactNode;
}) {
const [settings, colorTheme, cultures] = await Promise.all([
const [settings, colorTheme] = await Promise.all([
getSettings(),
getColorTheme(),
getPortalCultures(),
]);
const cookieStore = cookies();
@ -72,7 +78,7 @@ export default async function Layout({
<LoginFormWrapper id="login-page" bgPattern={bgPattern}>
<div className="bg-cover" />
<Scrollbar id="customScrollBar">
<LanguageComboboxWrapper cultures={cultures} />
<LanguageComboboxWrapper />
<LoginContent>
<ColorTheme
themeId={ThemeId.LinkForgotPassword}

View File

@ -26,24 +26,33 @@
"use client";
import { useState, useEffect } from "react";
import { useTranslation } from "react-i18next";
import { setLanguageForUnauthorized } from "@docspace/shared/utils/common";
import { LanguageCombobox } from "@docspace/shared/components/language-combobox";
import { TPortalCultures } from "@docspace/shared/api/settings/types";
import { DeviceType } from "@docspace/shared/enums";
import { Nullable } from "@docspace/shared/types";
import { TPortalCultures } from "@docspace/shared/api/settings/types";
import useDeviceType from "@/hooks/useDeviceType";
import { getPortalCultures } from "@/utils/actions";
export interface TLanguageCombobox {
cultures: TPortalCultures;
}
const LanguageComboboxWrapper = (props: TLanguageCombobox) => {
const { cultures } = props;
const LanguageComboboxWrapper = () => {
const { i18n } = useTranslation(["Login", "Common"]);
const currentCulture = i18n.language;
const [cultures, setCultures] = useState<Nullable<TPortalCultures>>(null);
useEffect(() => {
const fetchData = async () => {
const cultures = await getPortalCultures();
if (cultures) setCultures(cultures);
};
fetchData();
}, []);
const onLanguageSelect = (culture: { key: string }) => {
const { key } = culture;
@ -53,6 +62,8 @@ const LanguageComboboxWrapper = (props: TLanguageCombobox) => {
const { currentDeviceType } = useDeviceType();
const isMobileView = currentDeviceType === DeviceType.mobile;
if (!cultures) return <></>;
return (
<LanguageCombobox
className="language-combo-box"

View File

@ -41,7 +41,9 @@ const NavItem = styled.div`
position: relative;
white-space: nowrap;
display: flex;
gap: 8px;
`;
NavItem.defaultProps = { theme: Base };
const Label = styled.div<{ isDisabled?: boolean; selected?: boolean }>`
@ -49,10 +51,12 @@ const Label = styled.div<{ isDisabled?: boolean; selected?: boolean }>`
border-radius: ${(props) => props.theme.tabsContainer.label.borderRadius};
min-width: ${(props) => props.theme.tabsContainer.label.minWidth};
width: ${(props) => props.theme.tabsContainer.label.width};
display: flex;
align-items: center;
.title_style {
text-align: center;
margin: ${(props) => props.theme.tabsContainer.label.title.margin};
padding: ${(props) => props.theme.tabsContainer.label.title.padding};
overflow: ${(props) =>
props.theme.interfaceDirection === "rtl" ? "visible" : "hidden"};
${NoUserSelect};
@ -67,13 +71,25 @@ const Label = styled.div<{ isDisabled?: boolean; selected?: boolean }>`
${(props) =>
props.selected
? css`
border: 1px solid transparent;
cursor: default;
background-color: ${props.theme.tabsContainer.label.backgroundColor};
.title_style {
color: ${props.theme.tabsContainer.label.title.color};
}
&:hover {
cursor: pointer;
opacity: 0.85;
}
&:active {
background: ${props.theme.tabsContainer.label
.activeSelectedBackgroundColor};
}
`
: css`
border: ${props.theme.tabsContainer.label.border};
&:hover {
cursor: pointer;
background-color: ${props.theme.tabsContainer.label
@ -82,14 +98,17 @@ const Label = styled.div<{ isDisabled?: boolean; selected?: boolean }>`
color: ${props.theme.tabsContainer.label.title.hoverColor};
}
}
&:active {
background-color: ${props.theme.tabsContainer.label
.activeBackgroundColor};
}
`}
${(props) =>
props.isDisabled &&
props.selected &&
css`
background-color: ${props.theme.tabsContainer.label
.disableBackgroundColor};
${props.selected && `opacity: 0.6;`}
.title_style {
color: ${props.theme.tabsContainer.label.title.disableColor};
}

View File

@ -57,6 +57,9 @@ const StyledTextInput = styled(Input).attrs((props) => ({
props.isDisabled
? props.theme.input.disableBackgroundColor
: props.theme.input.backgroundColor};
-webkit-background-clip: text !important;
-webkit-text-fill-color: ${(props) =>
props.isDisabled
? props.theme.input.disableColor
@ -65,8 +68,8 @@ const StyledTextInput = styled(Input).attrs((props) => ({
: props.theme.textInput.placeholderColor} !important;
caret-color: ${(props) =>
props.isDisabled ? props.theme.input.disableColor : props.theme.text.color};
-webkit-background-clip: text !important;
box-shadow: inset 0 0 20px 20px
box-shadow: inset 0 0 0 30px
${(props) =>
props.isDisabled
? props.theme.input.disableBackgroundColor

View File

@ -1030,18 +1030,22 @@ export const getBaseTheme = () => {
},
label: {
height: " 32px",
height: " 30px",
border: "1px solid #ECEEF1",
borderRadius: "16px",
minWidth: "fit-content",
marginRight: "8px",
width: "fit-content",
backgroundColor: blueLightMid,
hoverBackgroundColor: grayLight,
hoverBackgroundColor: "#F3F4F4",
disableBackgroundColor: grayLightMid,
activeBackgroundColor: "#ECEEF1",
activeSelectedBackgroundColor:
"linear-gradient(0deg, #265a8f, #265a8f), linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1))",
title: {
margin: "7px 15px 7px 15px",
padding: "4px 16px",
overflow: "hidden",
color: white,
hoverColor: black,

View File

@ -1000,18 +1000,21 @@ const Dark: TTheme = {
},
label: {
height: " 32px",
height: " 30px",
border: "1px solid #474747",
borderRadius: "16px",
minWidth: "fit-content",
marginRight: "8px",
width: "fit-content",
backgroundColor: "#d6d6d6",
hoverBackgroundColor: "#3D3D3D",
disableBackgroundColor: "#292929",
backgroundColor: "#FFFFFF",
hoverBackgroundColor: "#474747",
disableBackgroundColor: "#282828",
activeBackgroundColor: "#282828",
activeSelectedBackgroundColor: "linear-gradient(0deg, #FFFFFF, #FFFFFF), linear-gradient(0deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.18))",
title: {
margin: "7px 15px 7px 15px",
padding: "4px 16px",
overflow: "hidden",
color: black,
hoverColor: "#a4a4a4",

View File

@ -30,18 +30,17 @@
import { LANGUAGE } from "../constants";
export function getCookie(name: string) {
if (name === LANGUAGE) {
if (typeof window !== "undefined" && name === LANGUAGE) {
const url = new URL(window.location.href);
const culture = url.searchParams.get("culture");
if (url.pathname === "/confirm/LinkInvite" && culture) {
return culture;
}
if (url.pathname === "/login/" && culture) {
return culture;
}
}
if (typeof document === "undefined") return undefined;
const matches = document.cookie.match(
new RegExp(
"(?:^|; )" +