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

Web: Client: Settings: move buttons to component

Browse Source
This commit is contained in:
Viktor Fomin 2022-04-03 22:18:53 +03:00
parent ea495d2b13
commit 0c4bcb2399
5 changed files with 65 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
web/ASC.Web.Client/src/components/pages/Settings/categories/security/StyledSecurity.js
View File

@ -84,6 +84,7 @@ export const ButtonsWrapper = styled.div`
flex-direction: row;
gap: 8px;
align-items: center;
margin-top: 24px;
@media (max-width: 375px) {
position: absolute;

37
web/ASC.Web.Client/src/components/pages/Settings/categories/security/access-portal/passwordStrength.js
View File

@ -4,7 +4,6 @@ import { withRouter } from "react-router";
import { withTranslation } from "react-i18next";
import { inject, observer } from "mobx-react";
import Box from "@appserver/components/box";
import Button from "@appserver/components/button";
import Text from "@appserver/components/text";
import Link from "@appserver/components/link";
import Slider from "@appserver/components/slider";
@ -12,9 +11,9 @@ import Checkbox from "@appserver/components/checkbox";
import SectionLoader from "../sub-components/section-loader";
import { getLanguage } from "@appserver/common/utils";
import { isMobile } from "react-device-detect";
import { ButtonsWrapper } from "../StyledSecurity";
import { getPortalPasswordSettings } from "@appserver/common/api/settings";
import toastr from "@appserver/components/toast/toastr";
import Buttons from "../sub-components/buttons";
const MainContainer = styled.div`
width: 100%;
@ -34,7 +33,6 @@ const MainContainer = styled.div`
flex-direction: column;
gap: 8px;
margin-top: 18px;
margin-bottom: 24px;
}
@media (max-width: 375px) {
@ -202,33 +200,12 @@ const PasswordStrength = (props) => {
/>
</Box>
<ButtonsWrapper>
<Button
label={t("Common:SaveButton")}
size="small"
primary={true}
className="button"
onClick={onSaveClick}
isDisabled={!showReminder}
/>
<Button
label={t("Common:CancelButton")}
size="small"
className="button"
onClick={onCancelClick}
isDisabled={!showReminder}
/>
{showReminder && (
<Text
color="#A3A9AE"
fontSize="12px"
fontWeight="600"
className="reminder"
>
{t("YouHaveUnsavedChanges")}
</Text>
)}
</ButtonsWrapper>
<Buttons
t={t}
showReminder={showReminder}
onSaveClick={onSaveClick}
onCancelClick={onCancelClick}
/>
</MainContainer>
);
};

37
web/ASC.Web.Client/src/components/pages/Settings/categories/security/access-portal/tfa.js
View File

@ -4,14 +4,13 @@ import { withRouter } from "react-router";
import { withTranslation } from "react-i18next";
import { inject, observer } from "mobx-react";
import RadioButtonGroup from "@appserver/components/radio-button-group";
import Button from "@appserver/components/button";
import Text from "@appserver/components/text";
import Link from "@appserver/components/link";
import toastr from "@appserver/components/toast/toastr";
import SectionLoader from "../sub-components/section-loader";
import { getLanguage } from "@appserver/common/utils";
import { isMobile } from "react-device-detect";
import { ButtonsWrapper } from "../StyledSecurity";
import Buttons from "../sub-components/buttons";
const MainContainer = styled.div`
width: 100%;
@ -22,7 +21,6 @@ const MainContainer = styled.div`
.box {
margin-top: 20px;
margin-bottom: 24px;
}
`;
@ -134,33 +132,12 @@ const TwoFactorAuth = (props) => {
onClick={onSelectTfaType}
/>
<ButtonsWrapper>
<Button
label={t("Common:SaveButton")}
size="small"
primary={true}
className="button"
onClick={onSaveClick}
isDisabled={!showReminder}
/>
<Button
label={t("Common:CancelButton")}
size="small"
className="button"
onClick={onCancelClick}
isDisabled={!showReminder}
/>
{showReminder && (
<Text
color="#A3A9AE"
fontSize="12px"
fontWeight="600"
className="reminder"
>
{t("YouHaveUnsavedChanges")}
</Text>
)}
</ButtonsWrapper>
<Buttons
t={t}
showReminder={showReminder}
onSaveClick={onSaveClick}
onCancelClick={onCancelClick}
/>
</MainContainer>
);
};

37
web/ASC.Web.Client/src/components/pages/Settings/categories/security/access-portal/trustedMail.js
View File

@ -11,6 +11,7 @@ import { isMobile } from "react-device-detect";
import { getLanguage } from "@appserver/common/utils";
import { ButtonsWrapper } from "../StyledSecurity";
import UserFields from "../sub-components/user-fields";
import Buttons from "../sub-components/buttons";
const MainContainer = styled.div`
width: 100%;
@ -44,6 +45,9 @@ const TrustedMail = (props) => {
}
};
const onSaveClick = () => {};
const onCancelClick = () => {};
const lng = getLanguage(localStorage.getItem("language") || "en");
return (
<MainContainer>
@ -97,33 +101,12 @@ const TrustedMail = (props) => {
</Text>
<Text>{t("TrustedMailWarningHelper")}</Text>
<ButtonsWrapper>
<Button
label={t("Common:SaveButton")}
size="small"
primary={true}
className="button"
//onClick={onSaveClick}
isDisabled={!showReminder}
/>
<Button
label={t("Common:CancelButton")}
size="small"
className="button"
//onClick={onCancelClick}
isDisabled={!showReminder}
/>
{showReminder && (
<Text
color="#A3A9AE"
fontSize="12px"
fontWeight="600"
className="reminder"
>
{t("YouHaveUnsavedChanges")}
</Text>
)}
</ButtonsWrapper>
<Buttons
t={t}
showReminder={showReminder}
onSaveClick={onSaveClick}
onCancelClick={onCancelClick}
/>
</MainContainer>
);
};

40
web/ASC.Web.Client/src/components/pages/Settings/categories/security/sub-components/buttons.js Normal file
View File

@ -0,0 +1,40 @@
import React from "react";
import Button from "@appserver/components/button";
import Text from "@appserver/components/text";
import { ButtonsWrapper } from "../StyledSecurity";
const Buttons = (props) => {
const { t, showReminder, onSaveClick, onCancelClick } = props;
return (
<ButtonsWrapper>
<Button
label={t("Common:SaveButton")}
size="small"
primary={true}
className="button"
onClick={onSaveClick}
isDisabled={!showReminder}
/>
<Button
label={t("Common:CancelButton")}
size="small"
className="button"
onClick={onCancelClick}
isDisabled={!showReminder}
/>
{showReminder && (
<Text
color="#A3A9AE"
fontSize="12px"
fontWeight="600"
className="reminder"
>
{t("YouHaveUnsavedChanges")}
</Text>
)}
</ButtonsWrapper>
);
};
export default Buttons;