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

Merge branch 'develop' into feature/floating-button

Browse Source
This commit is contained in:
Viktor Fomin 2020-12-07 14:50:49 +03:00 committed by GitHub
commit 982ce4e12c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
42 changed files with 429 additions and 306 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
products/ASC.Files/Client/public/index.html
View File

@ -239,16 +239,5 @@
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
<script>
if (localStorage.getItem("asc_auth_key")){
let el = document.getElementById("burger-loader-svg");
let el1 = document.getElementById("logo-loader-svg");
let el2 = document.getElementById("avatar-loader-svg");
el.style.display = "block";
el1.style.display = "block";
el2.style.display = "block";
}
</script>
</body>
</html>

54
products/ASC.Files/Client/src/App.js
View File

@ -10,7 +10,6 @@ import config from "../package.json";
import {
store as commonStore,
constants,
history,
PrivateRoute,
PublicRoute,
@ -32,8 +31,8 @@ const {
setCurrentProductId,
setCurrentProductHomePage,
getPortalCultures,
getIsAuthenticated,
} = commonStore.auth.actions;
const { AUTH_KEY } = constants;
class App extends React.Component {
constructor(props) {
@ -43,8 +42,6 @@ class App extends React.Component {
}
componentDidMount() {
utils.removeTempContent();
const {
setModuleInfo,
getUser,
@ -53,33 +50,37 @@ class App extends React.Component {
getPortalCultures,
fetchTreeFolders,
setIsLoaded,
getIsAuthenticated,
} = this.props;
setModuleInfo();
getIsAuthenticated().then((isAuthenticated) => {
if (!isAuthenticated) {
utils.updateTempContent();
return setIsLoaded();
} else {
utils.updateTempContent(isAuthenticated);
}
const token = localStorage.getItem(AUTH_KEY);
const requests = this.isEditor
? [getUser()]
: [
getUser(),
getPortalSettings(),
getModules(),
getPortalCultures(),
fetchTreeFolders(),
];
if (!token) {
return setIsLoaded();
}
const requests = this.isEditor
? [getUser()]
: [
getUser(),
getPortalSettings(),
getModules(),
getPortalCultures(),
fetchTreeFolders(),
];
Promise.all(requests)
.catch((e) => {
toastr.error(e);
})
.finally(() => {
setIsLoaded();
});
Promise.all(requests)
.catch((e) => {
toastr.error(e);
})
.finally(() => {
utils.updateTempContent();
setIsLoaded();
});
});
}
render() {
@ -140,6 +141,7 @@ const mapStateToProps = (state) => {
const mapDispatchToProps = (dispatch) => {
return {
getIsAuthenticated: () => getIsAuthenticated(dispatch),
setModuleInfo: () => {
dispatch(setCurrentProductHomePage(config.homepage));
dispatch(setCurrentProductId("e67be73d-f9ae-4ce1-8fec-1880cb518cb4"));

2
products/ASC.Files/Client/src/components/Article/Body/index.js
View File

@ -107,7 +107,7 @@ class ArticleBodyContent extends React.Component {
const { showNewFilesPanel, expandedKeys, newFolderId } = this.state;
//console.log("Article Body render", this.props, this.state.expandedKeys);
console.log("Article Body render");
//console.log("Article Body render");
return (
<>
{showNewFilesPanel && (

2
products/ASC.Files/Client/src/components/pages/Home/Section/Body/index.js
View File

@ -1546,7 +1546,7 @@ class SectionBodyContent extends React.Component {
};
render() {
console.log("Files Home SectionBodyContent render", this.props);
//console.log("Files Home SectionBodyContent render", this.props);
const {
viewer,

2
products/ASC.Files/Client/src/components/pages/Home/Section/Filter/index.js
View File

@ -295,7 +295,7 @@ class SectionFilterContent extends React.Component {
}
render() {
console.log("Filter render");
//console.log("Filter render");
const selectedFilterData = this.getSelectedFilterData();
const { t, language, firstLoad, sectionWidth } = this.props;
const filterColumnCount =

2
products/ASC.Files/Client/src/components/pages/Home/index.js
View File

@ -129,7 +129,7 @@ class PureHome extends React.Component {
if (filter) {
const folderId = filter.folder;
console.log("filter", filter);
//console.log("filter", filter);
return fetchFiles(folderId, filter);
}

5
products/ASC.Files/Client/src/index.js
View File

@ -9,10 +9,7 @@ import "./custom.scss";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import { ErrorBoundary, utils } from "asc-web-common";
const { redirectToDefaultPage } = utils;
redirectToDefaultPage();
import { ErrorBoundary } from "asc-web-common";
ReactDOM.render(
<Provider store={store}>

11
products/ASC.People/Client/public/index.html
View File

@ -239,16 +239,5 @@
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
<script>
if (localStorage.getItem("asc_auth_key")){
let el = document.getElementById("burger-loader-svg");
let el1 = document.getElementById("logo-loader-svg");
let el2 = document.getElementById("avatar-loader-svg");
el.style.display = "block";
el1.style.display = "block";
el2.style.display = "block";
}
</script>
</body>
</html>

54
products/ASC.People/Client/src/App.js
View File

@ -16,7 +16,6 @@ import {
Offline,
utils,
store as commonStore,
constants,
NavMenu,
Main,
toastr,
@ -34,8 +33,8 @@ const {
setCurrentProductHomePage,
getPortalPasswordSettings,
getPortalCultures,
getIsAuthenticated,
} = commonStore.auth.actions;
const { AUTH_KEY } = constants;
/*const Profile = lazy(() => import("./components/pages/Profile"));
const ProfileAction = lazy(() => import("./components/pages/ProfileAction"));
@ -43,8 +42,6 @@ const GroupAction = lazy(() => import("./components/pages/GroupAction"));*/
class App extends React.Component {
componentDidMount() {
utils.removeTempContent();
const {
setModuleInfo,
getUser,
@ -55,33 +52,37 @@ class App extends React.Component {
fetchGroups,
fetchPeople,
setIsLoaded,
getIsAuthenticated,
} = this.props;
setModuleInfo();
getIsAuthenticated().then((isAuthenticated) => {
if (!isAuthenticated) {
utils.updateTempContent();
return setIsLoaded();
} else {
utils.updateTempContent(isAuthenticated);
}
const token = localStorage.getItem(AUTH_KEY);
const requests = [
getUser(),
getPortalSettings(),
getModules(),
getPortalPasswordSettings(),
getPortalCultures(),
fetchGroups(),
fetchPeople(),
];
if (!token) {
return setIsLoaded();
}
const requests = [
getUser(),
getPortalSettings(),
getModules(),
getPortalPasswordSettings(),
getPortalCultures(),
fetchGroups(),
fetchPeople(),
];
Promise.all(requests)
.catch((e) => {
toastr.error(e);
})
.finally(() => {
setIsLoaded();
});
Promise.all(requests)
.catch((e) => {
toastr.error(e);
})
.finally(() => {
utils.updateTempContent();
setIsLoaded();
});
});
}
render() {
@ -156,6 +157,7 @@ const mapStateToProps = (state) => {
const mapDispatchToProps = (dispatch) => {
return {
getIsAuthenticated: () => getIsAuthenticated(dispatch),
setModuleInfo: () => {
dispatch(setCurrentProductHomePage(config.homepage));
dispatch(setCurrentProductId("f4d98afd-d336-4332-8778-3c6945c81ea0"));

5
products/ASC.People/Client/src/index.js
View File

@ -7,10 +7,7 @@ import "./custom.scss";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import { ErrorBoundary, utils } from "asc-web-common";
const { redirectToDefaultPage } = utils;
redirectToDefaultPage();
import { ErrorBoundary } from "asc-web-common";
ReactDOM.render(
<Provider store={store}>

11
web/ASC.Web.Client/public/index.html
View File

@ -212,16 +212,5 @@
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
<script>
if (localStorage.getItem("asc_auth_key")){
let el = document.getElementById("burger-loader-svg");
let el1 = document.getElementById("logo-loader-svg");
let el2 = document.getElementById("avatar-loader-svg");
el.style.display = "block";
el1.style.display = "block";
el2.style.display = "block";
}
</script>
</body>
</html>

54
web/ASC.Web.Client/src/App.js
View File

@ -3,7 +3,6 @@ import { Router, Route, Switch } from "react-router-dom";
import { connect } from "react-redux";
import {
store as CommonStore,
constants,
history,
PrivateRoute,
PublicRoute,
@ -28,35 +27,43 @@ const {
getUser,
getPortalSettings,
getModules,
getIsAuthenticated,
} = CommonStore.auth.actions;
class App extends React.Component {
componentDidMount() {
utils.removeTempContent();
const {
getPortalSettings,
getUser,
getModules,
setIsLoaded,
getIsAuthenticated,
} = this.props;
const { getPortalSettings, getUser, getModules, setIsLoaded } = this.props;
getIsAuthenticated()
.then((isAuthenticated) => {
if (isAuthenticated) utils.updateTempContent(isAuthenticated);
const requests = [];
if (!isAuthenticated) {
requests.push(getPortalSettings());
} else if (
!window.location.pathname.includes("confirm/EmailActivation")
) {
requests.push(getUser());
requests.push(getPortalSettings());
requests.push(getModules());
}
const { AUTH_KEY } = constants;
const token = localStorage.getItem(AUTH_KEY);
const requests = [];
if (!token) {
requests.push(getPortalSettings());
} else if (!window.location.pathname.includes("confirm/EmailActivation")) {
requests.push(getUser());
requests.push(getPortalSettings());
requests.push(getModules());
}
Promise.all(requests)
.catch((e) => {
toastr.error(e);
Promise.all(requests)
.catch((e) => {
toastr.error(e);
})
.finally(() => {
utils.updateTempContent();
setIsLoaded();
});
})
.finally(() => {
setIsLoaded();
});
.catch((err) => toastr.error(err));
}
render() {
@ -113,6 +120,7 @@ const mapStateToProps = (state) => {
const mapDispatchToProps = (dispatch) => {
return {
getIsAuthenticated: () => getIsAuthenticated(dispatch),
getPortalSettings: () => getPortalSettings(dispatch),
getUser: () => getUser(dispatch),
getModules: () => getModules(dispatch),

23
web/ASC.Web.Client/src/components/pages/Confirm/index.js
View File

@ -2,9 +2,12 @@ import React, { Suspense, lazy, useEffect } from "react";
import { Route, Switch } from "react-router-dom";
import ConfirmRoute from "../../../helpers/confirmRoute";
import { I18nextProvider } from "react-i18next";
import { Error404, utils } from "asc-web-common";
import { Error404, utils, store, PageLayout, Loaders } from "asc-web-common";
import { createI18N } from "../../../helpers/i18n";
import { connect } from "react-redux";
const { getIsLoaded } = store.auth.selectors;
const i18n = createI18N({
page: "Confirm",
localesPath: "pages/Confirm",
@ -23,13 +26,19 @@ const ChangePhoneForm = lazy(() => import("./sub-components/changePhone"));
const ProfileRemoveForm = lazy(() => import("./sub-components/profileRemove"));
const ChangeOwnerForm = lazy(() => import("./sub-components/changeOwner"));
const Confirm = ({ match }) => {
const Confirm = ({ match, isLoaded }) => {
useEffect(() => {
changeLanguage(i18n);
}, []);
//console.log("Confirm render");
return (
!isLoaded ? <PageLayout>
<PageLayout.SectionBody>
<Loaders.Rectangle height="90vh"/>
</PageLayout.SectionBody>
</PageLayout> :
<I18nextProvider i18n={i18n}>
<Suspense fallback={null}>
<Switch>
@ -80,4 +89,10 @@ const Confirm = ({ match }) => {
);
};
export default Confirm;
function mapStateToProps(state) {
return {
isLoaded: getIsLoaded(state)
};
}
export default connect(mapStateToProps)(Confirm);

9
web/ASC.Web.Client/src/components/pages/Confirm/sub-components/activateEmail.js
View File

@ -5,13 +5,14 @@ import { Loader } from "asc-web-components";
import { PageLayout } from "asc-web-common";
import { connect } from "react-redux";
import PropTypes from "prop-types";
import { store } from "asc-web-common";
import { store, utils as commonUtils } from "asc-web-common";
import { changeEmail } from "../../../../store/confirm/actions";
const { logout } = store.auth.actions;
const { tryRedirectTo } = commonUtils;
class ActivateEmail extends React.PureComponent {
componentDidMount() {
const { history, logout, changeEmail, linkData } = this.props;
const { logout, changeEmail, linkData } = this.props;
const [email, uid, key] = [
linkData.email,
linkData.uid,
@ -20,11 +21,11 @@ class ActivateEmail extends React.PureComponent {
logout();
changeEmail(uid, email, key)
.then((res) => {
history.push(`/login/confirmed-email=${email}`);
tryRedirectTo(`/login/confirmed-email=${email}`);
})
.catch((e) => {
// console.log('activate email error', e);
history.push(`/login/error=${e}`);
tryRedirectTo(`/login/error=${e}`);
});
}

7
web/ASC.Web.Client/src/components/pages/Confirm/sub-components/activateUser.js
View File

@ -19,7 +19,7 @@ import {
activateConfirmUser,
} from "../../../../store/confirm/actions";
const { EmployeeActivationStatus } = constants;
const { createPasswordHash } = commonUtils;
const { createPasswordHash, tryRedirectTo } = commonUtils;
const inputWidth = "400px";
const ConfirmContainer = styled.div`
@ -82,7 +82,7 @@ class Confirm extends React.PureComponent {
onSubmit = (e) => {
this.setState({ isLoading: true }, function () {
const { activateConfirmUser, history, hashSettings } = this.props;
const { activateConfirmUser, hashSettings, defaultPage } = this.props;
this.setState({ errorText: "" });
@ -131,7 +131,7 @@ class Confirm extends React.PureComponent {
this.state.userId,
EmployeeActivationStatus.Activated
)
.then(() => history.push("/"))
.then(() => tryRedirectTo(defaultPage))
.catch((error) => {
console.error("activate error", error);
this.setState({
@ -344,6 +344,7 @@ function mapStateToProps(state) {
settings: state.auth.settings.passwordSettings,
greetingTitle: state.auth.settings.greetingSettings,
hashSettings: state.auth.settings.hashSettings,
defaultPage: state.auth.settings.defaultPage,
};
}

18
web/ASC.Web.Client/src/components/pages/Confirm/sub-components/changeEmail.js
View File

@ -2,10 +2,11 @@ import React from "react";
import { withRouter } from "react-router";
import { withTranslation } from "react-i18next";
import { Loader } from "asc-web-components";
import { PageLayout } from "asc-web-common";
import { PageLayout, utils as commonUtils } from "asc-web-common";
import { connect } from "react-redux";
import PropTypes from "prop-types";
import { changeEmail } from "../../../../store/confirm/actions";
const { tryRedirectTo } = commonUtils;
class ChangeEmail extends React.PureComponent {
componentDidMount() {
@ -15,29 +16,33 @@ class ChangeEmail extends React.PureComponent {
changeEmail(userId, email, key)
.then((res) => {
console.log("change client email success", res);
window.location.href = `${window.location.origin}/products/people/view/@self?email_change=success`;
tryRedirectTo(
`${window.location.origin}/products/people/view/@self?email_change=success`
);
})
.catch((e) => {
console.log("change client email error", e);
window.location.href = `${window.location.origin}/error=${e}`;
tryRedirectTo(`${window.location.origin}/error=${e}`);
});
}
}
componentDidUpdate() {
const { changeEmail, userId, isLoaded, linkData } = this.props;
const { changeEmail, userId, isLoaded, linkData, defaultPage } = this.props;
if (isLoaded) {
const [email, key] = [linkData.email, linkData.confirmHeader];
changeEmail(userId, email, key)
.then((res) => {
console.log("change client email success", res);
window.location.href = `${window.location.origin}/products/people/view/@self?email_change=success`;
tryRedirectTo(
`${window.location.origin}/products/people/view/@self?email_change=success`
);
})
.catch((e) => {
console.log("change client email error", e);
});
} else {
window.location.href = "/";
tryRedirectTo(defaultPage);
}
}
@ -63,6 +68,7 @@ function mapStateToProps(state) {
return {
isLoaded: state.auth.isLoaded,
userId: state.auth.user.id,
defaultPage: state.auth.settings.defaultPage,
};
}

12
web/ASC.Web.Client/src/components/pages/Confirm/sub-components/changeOwner.js
View File

@ -4,7 +4,8 @@ import { withTranslation } from "react-i18next";
import { connect } from "react-redux";
import styled from "styled-components";
import { Button, Text, toastr } from "asc-web-components";
import { PageLayout } from "asc-web-common";
import { PageLayout, utils as commonUtils } from "asc-web-common";
const { tryRedirectTo } = commonUtils;
const BodyStyle = styled.div`
margin-top: 70px;
@ -58,11 +59,11 @@ class Form extends React.PureComponent {
};
onRedirect = () => {
this.props.history.push("/");
tryRedirectTo(this.props.defaultPage);
};
onCancelClick = () => {
this.props.history.push("/");
tryRedirectTo(this.props.defaultPage);
};
render() {
@ -126,7 +127,10 @@ const ChangePasswordForm = (props) => (
);
function mapStateToProps(state) {
return { greetingTitle: state.auth.settings.greetingSettings };
return {
greetingTitle: state.auth.settings.greetingSettings,
defaultPage: state.auth.settings.defaultPage,
};
}
export default connect(

11
web/ASC.Web.Client/src/components/pages/Confirm/sub-components/changePassword.js
View File

@ -19,7 +19,7 @@ import {
changePassword,
} from "../../../../store/confirm/actions";
const { createPasswordHash } = commonUtils;
const { createPasswordHash, tryRedirectTo } = commonUtils;
const { logout } = store.auth.actions;
const BodyStyle = styled.form`
@ -80,7 +80,7 @@ class Form extends React.PureComponent {
onSubmit = (e) => {
this.setState({ isLoading: true }, function () {
const { userId, password, key } = this.state;
const { history, changePassword, hashSettings } = this.props;
const { changePassword, hashSettings, defaultPage } = this.props;
let hasError = false;
if (!this.state.passwordValid) {
@ -99,8 +99,8 @@ class Form extends React.PureComponent {
changePassword(userId, hash, key)
.then(() => this.props.logout())
.then(() => {
history.push("/");
toastr.success(this.props.t("ChangePasswordSuccess"));
tryRedirectTo(defaultPage);
})
.catch((error) => {
toastr.error(this.props.t(`${error}`));
@ -110,10 +110,10 @@ class Form extends React.PureComponent {
};
componentDidMount() {
const { getConfirmationInfo, history } = this.props;
const { getConfirmationInfo, defaultPage } = this.props;
getConfirmationInfo(this.state.key).catch((error) => {
toastr.error(this.props.t(`${error}`));
history.push("/");
tryRedirectTo(defaultPage);
});
window.addEventListener("keydown", this.onKeyPress);
@ -221,6 +221,7 @@ function mapStateToProps(state) {
isAuthenticated: state.auth.isAuthenticated,
greetingTitle: state.auth.settings.greetingSettings,
hashSettings: state.auth.settings.hashSettings,
defaultPage: state.auth.settings.defaultPage,
};
}

2
web/ASC.Web.Client/src/components/pages/Confirm/sub-components/changePhone.js
View File

@ -50,7 +50,7 @@ const PhoneForm = (props) => {
const buttonTranslation = `Enter number`;
const onSubmit = () => {
console.log("onSubmit CHANGE");
console.log("onSubmit CHANGE"); //TODO: Why do nothing?
};
const onKeyPress = (target) => {

9
web/ASC.Web.Client/src/components/pages/Confirm/sub-components/createUser.js
View File

@ -19,7 +19,7 @@ import {
createConfirmUser,
} from "../../../../store/confirm/actions";
const { logout, login } = store.auth.actions;
const { createPasswordHash } = commonUtils;
const { createPasswordHash, tryRedirectTo } = commonUtils;
const inputWidth = "400px";
const ConfirmContainer = styled.div`
@ -89,7 +89,7 @@ class Confirm extends React.PureComponent {
onSubmit = () => {
this.setState({ isLoading: true }, () => {
const { history, createConfirmUser, linkData, hashSettings } = this.props;
const { defaultPage, createConfirmUser, linkData, hashSettings } = this.props;
const isVisitor = parseInt(linkData.emplType) === 2;
this.setState({ errorText: "" });
@ -142,7 +142,7 @@ class Confirm extends React.PureComponent {
createConfirmUser(registerData, loginData, this.state.key)
.then(() => {
toastr.success("User has been created successfully");
return history.push("/");
tryRedirectTo(defaultPage);
})
.catch((error) => {
console.error("confirm error", error);
@ -368,6 +368,7 @@ function mapStateToProps(state) {
settings: state.auth.settings.passwordSettings,
greetingTitle: state.auth.settings.greetingSettings,
hashSettings: state.auth.settings.hashSettings,
defaultPage: state.auth.settings.defaultPage
};
}
@ -375,5 +376,5 @@ export default connect(mapStateToProps, {
getConfirmationInfo,
createConfirmUser,
login,
logout,
logout
})(withRouter(withTranslation()(CreateUserForm)));

12
web/ASC.Web.Client/src/helpers/confirmRoute.js
View File

@ -4,9 +4,9 @@ import { ValidationResult } from "./../helpers/constants";
import { Loader } from "asc-web-components";
import { connect } from "react-redux";
import { withRouter } from "react-router";
import { api, constants, utils, PageLayout } from "asc-web-common";
import { api, utils, PageLayout, store } from "asc-web-common";
const { isAuthenticated } = store.auth.selectors;
const { checkConfirmLink } = api.user;
const { AUTH_KEY } = constants;
const { getObjectByLocation } = utils;
class ConfirmRoute extends React.Component {
@ -19,14 +19,14 @@ class ConfirmRoute extends React.Component {
}
componentDidMount() {
const { forUnauthorized, history } = this.props;
const { forUnauthorized, history, isAuthenticated } = this.props;
if (forUnauthorized && localStorage.getItem(AUTH_KEY))
if (forUnauthorized && isAuthenticated)
return history.push(
`/error=Access error. You should be unauthorized for performing this action`
);
const { location, isAuthenticated } = this.props;
const { location } = this.props;
const { search } = location;
const queryParams = getObjectByLocation(location);
@ -100,7 +100,7 @@ class ConfirmRoute extends React.Component {
function mapStateToProps(state) {
return {
isAuthenticated: state.auth.isAuthenticated,
isAuthenticated: isAuthenticated(state)
};
}

5
web/ASC.Web.Client/src/index.js
View File

@ -5,10 +5,7 @@ import store from "./store/store";
import "./custom.scss";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import { ErrorBoundary, utils } from "asc-web-common";
const { redirectToDefaultPage } = utils;
redirectToDefaultPage();
import { ErrorBoundary } from "asc-web-common";
ReactDOM.render(
<Provider store={store}>

41
web/ASC.Web.Client/src/store/confirm/actions.js
View File

@ -30,9 +30,27 @@ export function createConfirmUser(registerData, loginData, key) {
return (dispatch) => {
return api.people
.createUser(data, key)
.then((user) => dispatch(setCurrentUser(user)))
.then(() => api.user.login(loginData.userName, loginData.passwordHash))
.then(() => loadInitInfo(dispatch));
.then((user) => {
dispatch(setCurrentUser(user));
})
.then(() => {
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
login(
loginData.userName,
loginData.passwordHash
)(dispatch)
.then(() => {
resolve(loadInitInfo(dispatch));
})
.catch((e) => {
reject(e);
});
}, 1000);
});
return promise;
});
};
}
@ -56,7 +74,22 @@ export function activateConfirmUser(
return api.people.updateActivationStatus(activationStatus, userId, key);
})
.then((data) => {
return dispatch(login(loginData.userName, loginData.passwordHash));
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
login(
data.userName,
data.passwordHash
)(dispatch)
.then(() => {
resolve(loadInitInfo(dispatch));
})
.catch((e) => {
reject(e);
});
}, 1000);
});
return promise;
})
.then((data) => {
return api.people.updateUser(changedData);

2
web/ASC.Web.Common/package.json
View File

@ -1,6 +1,6 @@
{
"name": "asc-web-common",
"version": "1.0.284",
"version": "1.0.285",
"description": "Ascensio System SIA common components and solutions library",
"license": "AGPL-3.0",
"files": [

14
web/ASC.Web.Common/src/api/client.js
View File

@ -1,5 +1,4 @@
import axios from "axios";
import { AUTH_KEY } from "../constants";
//import history from "../history";
const PREFIX = "api";
@ -16,8 +15,6 @@ const client = axios.create({
timeout: 30000, // default is `0` (no timeout)
});
setAuthorizationToken(localStorage.getItem(AUTH_KEY));
client.interceptors.response.use(
(response) => {
return response;
@ -25,7 +22,7 @@ client.interceptors.response.use(
(error) => {
switch (true) {
case error.response.status === 401:
setAuthorizationToken();
setWithCredentialsStatus(false);
window.location.href = "/login";
break;
case error.response.status === 402:
@ -41,13 +38,8 @@ client.interceptors.response.use(
}
);
export function setAuthorizationToken(token) {
client.defaults.withCredentials = true;
if (token) {
localStorage.setItem(AUTH_KEY, true);
} else {
localStorage.clear();
}
export function setWithCredentialsStatus(state) {
client.defaults.withCredentials = state;
}
export function setClientBasePath(path) {

19
web/ASC.Web.Common/src/api/user/index.js
View File

@ -1,4 +1,4 @@
import { request, setAuthorizationToken } from "../client";
import { request, setWithCredentialsStatus } from "../client";
export function login(userName, passwordHash) {
const data = {
@ -10,9 +10,6 @@ export function login(userName, passwordHash) {
method: "post",
url: "/authentication.json",
data,
}).then((tokenData) => {
setAuthorizationToken(true);
return Promise.resolve(tokenData);
});
}
@ -20,9 +17,6 @@ export function logout() {
return request({
method: "post",
url: "/authentication/logout",
}).then(() => {
setAuthorizationToken();
return Promise.resolve();
});
}
@ -33,3 +27,14 @@ export function checkConfirmLink(data) {
data,
});
}
export function checkIsAuthenticated() {
return request({
method: "get",
url: "/authentication",
withCredentials: true,
}).then((state) => {
setWithCredentialsStatus(state);
return state;
});
}

2
web/ASC.Web.Common/src/components/NavMenu/index.js
View File

@ -104,7 +104,7 @@ class NavMenu extends React.Component {
const isAsideAvailable = !!asideContent;
console.log("NavMenu render", this.state, this.props);
//console.log("NavMenu render", this.state, this.props);
return (
<StyledContainer>

24
web/ASC.Web.Common/src/components/PageLayout/index.js
View File

@ -82,6 +82,9 @@ class PageLayoutComponent extends React.Component {
isArticleVisible: isArticleVisibleAndPinned,
isArticlePinned: isArticleVisibleAndPinned,
};
this.timeoutHandler = null;
this.intervalHandler = null;
}
componentDidUpdate(prevProps) {
@ -104,6 +107,11 @@ class PageLayoutComponent extends React.Component {
"orientationchange",
this.orientationChangeHandler
);
if(this.intervalHandler)
clearInterval(this.intervalHandler);
if(this.timeoutHandler)
clearTimeout(this.timeoutHandler);
}
orientationChangeHandler = () => {
@ -124,20 +132,22 @@ class PageLayoutComponent extends React.Component {
const intervalTime = 100;
const endTimeoutTime = 1000;
let interval, timeout, lastInnerHeight, noChangeCount;
let lastInnerHeight, noChangeCount;
const updateHeight = () => {
clearInterval(interval);
clearTimeout(timeout);
if(this.intervalHandler)
clearInterval(this.intervalHandler);
if(this.timeoutHandler)
clearTimeout(this.timeoutHandler);
interval = null;
timeout = null;
this.intervalHandler = null;
this.timeoutHandler = null;
const vh = (window.innerHeight - 57) * 0.01;
document.documentElement.style.setProperty("--vh", `${vh}px`);
};
interval = setInterval(() => {
this.intervalHandler = setInterval(() => {
if (window.innerHeight === lastInnerHeight) {
noChangeCount++;
@ -150,7 +160,7 @@ class PageLayoutComponent extends React.Component {
}
});
timeout = setTimeout(() => {
this.timeoutHandler = setTimeout(() => {
updateHeight();
}, endTimeoutTime);
};

5
web/ASC.Web.Common/src/components/PageLayout/sub-components/section-body.js
View File

@ -86,6 +86,11 @@ class SectionBody extends React.Component {
this.focusRef.current.focus();
}
componentWillUnmount() {
this.focusRef = null;
this.scrollRef = null;
}
render() {
//console.log("PageLayout SectionBody render");
const {

34
web/ASC.Web.Common/src/components/PrivateRoute/PrivateRoute.js
View File

@ -3,16 +3,17 @@ import React from "react";
import { Redirect, Route } from "react-router-dom";
import { connect } from "react-redux";
//import { Loader } from "asc-web-components";
//import PageLayout from "../PageLayout";
import { getCurrentUser, isAdmin, isMe } from "../../store/auth/selectors.js";
import { AUTH_KEY } from "../../constants";
import PageLayout from "../PageLayout";
import { getCurrentUser, getIsLoaded, isAdmin, isAuthenticated, isMe } from "../../store/auth/selectors.js";
import { Error401, Error404 } from "../../pages/errors";
import isEmpty from "lodash/isEmpty";
import RectangleLoader from "../Loaders/RectangleLoader/RectangleLoader";
//import isEmpty from "lodash/isEmpty";
const PrivateRoute = ({ component: Component, ...rest }) => {
const {
isAdmin,
isAuthenticated,
isLoaded,
restricted,
allowForMe,
user,
@ -21,7 +22,7 @@ const PrivateRoute = ({ component: Component, ...rest }) => {
const { userId } = computedMatch.params;
const renderComponent = (props) => {
if (!isAuthenticated) {
if (isLoaded && !isAuthenticated) {
console.log("PrivateRoute render Redirect to login", rest);
return (
<Redirect
@ -33,11 +34,21 @@ const PrivateRoute = ({ component: Component, ...rest }) => {
);
}
const userLoaded = !isEmpty(user);
if (!userLoaded) {
return <Component {...props} />;
if(!isLoaded) {
return (
<PageLayout>
<PageLayout.SectionBody>
<RectangleLoader height="90vh"/>
</PageLayout.SectionBody>
</PageLayout>
);
}
// const userLoaded = !isEmpty(user);
// if (!userLoaded) {
// return <Component {...props} />;
// }
// if (!userLoaded) {
// console.log("PrivateRoute render Loader", rest);
// return (
@ -76,14 +87,11 @@ const PrivateRoute = ({ component: Component, ...rest }) => {
};
function mapStateToProps(state) {
const { isLoaded, isAuthenticated } = state.auth;
return {
isAdmin: isAdmin(state),
user: getCurrentUser(state),
isAuthenticated: !(
!localStorage.getItem(AUTH_KEY) ||
(isLoaded && !isAuthenticated)
),
isAuthenticated: isAuthenticated(state),
isLoaded: getIsLoaded(state)
};
}

29
web/ASC.Web.Common/src/components/PublicRoute/PublicRoute.js
View File

@ -1,16 +1,26 @@
/* eslint-disable react/prop-types */
import React from "react";
import { Redirect, Route } from "react-router-dom";
import { AUTH_KEY } from "../../constants";
import { connect } from "react-redux";
import { getIsLoaded, isAuthenticated } from "../../store/auth/selectors";
import PageLayout from "../PageLayout";
import RectangleLoader from "../Loaders/RectangleLoader/RectangleLoader";
export const PublicRoute = ({ component: Component, ...rest }) => {
const token = localStorage.getItem(AUTH_KEY);
const { wizardToken, wizardCompleted } = rest;
const { wizardToken, wizardCompleted, isAuthenticated, isLoaded } = rest;
const renderComponent = (props) => {
if (token) {
if(!isLoaded) {
return (
<PageLayout>
<PageLayout.SectionBody>
<RectangleLoader height="90vh"/>
</PageLayout.SectionBody>
</PageLayout>
);
}
if (isAuthenticated) {
return (
<Redirect
to={{
@ -38,9 +48,14 @@ export const PublicRoute = ({ component: Component, ...rest }) => {
};
function mapStateToProps(state) {
const { settings } = state.auth;
const {wizardToken, wizardCompleted} = settings;
return {
wizardToken: state.auth.settings.wizardToken,
wizardCompleted: state.auth.settings.wizardCompleted,
isAuthenticated: isAuthenticated(state),
isLoaded: getIsLoaded(state),
wizardToken,
wizardCompleted,
};
}

1
web/ASC.Web.Common/src/constants/index.js
View File

@ -1,4 +1,3 @@
export const AUTH_KEY = "asc_auth_key";
export const LANGUAGE = "language";
export const ARTICLE_PINNED_KEY = "asc_article_pinned_key";

102
web/ASC.Web.Common/src/pages/login/index.js
View File

@ -10,9 +10,8 @@ import {
Link,
toastr,
Checkbox,
HelpButton,
PasswordInput,
FieldContainer,
FieldContainer
} from "asc-web-components";
import PageLayout from "../../components/PageLayout";
import { connect } from "react-redux";
@ -23,12 +22,11 @@ import ForgotPasswordModalDialog from "./sub-components/forgot-password-modal-di
import {
login,
setIsLoaded,
reloadPortalSettings,
reloadPortalSettings
} from "../../store/auth/actions";
import { sendInstructionsToChangePassword } from "../../api/people";
import Register from "./sub-components/register-container";
import { createPasswordHash } from "../../utils";
import { redirectToDefaultPage } from "../../utils";
import { createPasswordHash, tryRedirectTo } from "../../utils";
const { getLanguage } = store.auth.selectors;
const LoginContainer = styled.div`
display: flex;
@ -75,8 +73,7 @@ const LoginContainer = styled.div`
padding: 14px 0;
.login-checkbox-wrapper {
position: absolute;
display: inline-flex;
display: flex;
.login-checkbox {
float: left;
@ -84,23 +81,11 @@ const LoginContainer = styled.div`
font-size: 12px;
}
}
.login-tooltip {
display: inline-flex;
@media (min-width: 1025px) {
margin-left: 8px;
margin-top: 4px;
}
@media (max-width: 1024px) {
padding: 4px 8px 8px 8px;
}
}
}
.login-link {
float: right;
line-height: 16px;
line-height: 18px;
margin-left: auto;
}
}
@ -126,7 +111,8 @@ const LoginContainer = styled.div`
const LoginFormWrapper = styled.div`
display: grid;
grid-template-rows: ${props => props.enabledJoin ? css`1fr 66px` : css`1fr`};
grid-template-rows: ${(props) =>
props.enabledJoin ? css`1fr 66px` : css`1fr`};
width: 100%;
height: calc(100vh-56px);
`;
@ -211,7 +197,12 @@ class Form extends Component {
onSubmit = () => {
const { errorText, identifier, password } = this.state;
const { login, setIsLoaded, hashSettings } = this.props;
const {
login,
setIsLoaded,
hashSettings,
defaultPage
} = this.props;
errorText && this.setState({ errorText: "" });
let hasError = false;
@ -237,12 +228,17 @@ class Form extends Component {
login(userName, hash)
.then(() => {
if (!redirectToDefaultPage()) {
if (!tryRedirectTo(defaultPage)) {
setIsLoaded(true);
}
})
.catch((error) => {
this.setState({ errorText: error, isLoading: false });
this.setState({
errorText: error,
identifierValid: !error,
passwordValid: !error,
isLoading: false,
});
});
};
@ -250,8 +246,8 @@ class Form extends Component {
const {
match,
t,
hashSettings,
reloadPortalSettings,
hashSettings, // eslint-disable-line react/prop-types
reloadPortalSettings, // eslint-disable-line react/prop-types
organizationName,
} = this.props;
const { error, confirmedEmail } = match.params;
@ -315,7 +311,7 @@ class Form extends Component {
isVertical={true}
labelVisible={false}
hasError={!identifierValid}
errorMessage={t("RequiredFieldMessage")}
errorMessage={errorText ? errorText : t("RequiredFieldMessage")} //TODO: Add wrong login server error
>
<TextInput
id="login"
@ -337,7 +333,7 @@ class Form extends Component {
isVertical={true}
labelVisible={false}
hasError={!passwordValid}
errorMessage={t("RequiredFieldMessage")}
errorMessage={errorText ? "" : t("RequiredFieldMessage")} //TODO: Add wrong password server error
>
<PasswordInput
simpleView={true}
@ -365,25 +361,24 @@ class Form extends Component {
onChange={this.onChangeCheckbox}
label={<Text fontSize="13px">{t("Remember")}</Text>}
/>
<HelpButton
{/*<HelpButton
className="login-tooltip"
helpButtonHeaderContent={t("CookieSettingsTitle")}
tooltipContent={
<Text fontSize="12px">{t("RememberHelper")}</Text>
}
/>
/>*/}
<Link
fontSize="13px"
color="#316DAA"
className="login-link"
type="page"
isHovered={false}
onClick={this.onClick}
>
{t("ForgotPassword")}
</Link>
</div>
<Link
fontSize="13px"
color="#316DAA"
className="login-link"
type="page"
isHovered={false}
onClick={this.onClick}
>
{t("ForgotPassword")}
</Link>
</div>
{openDialog && (
@ -417,9 +412,11 @@ class Form extends Component {
{t("MessageEmailConfirmed")} {t("MessageAuthorize")}
</Text>
)}
{/* TODO: old error indication
<Text fontSize="14px" color="#c30">
{errorText}
</Text>
</Text> */}
{socialButtons.length ? (
<Box displayProp="flex" alignItems="center">
@ -450,6 +447,7 @@ Form.propTypes = {
socialButtons: PropTypes.array,
organizationName: PropTypes.string,
homepage: PropTypes.string,
defaultPage: PropTypes.string,
};
Form.defaultProps = {
@ -471,7 +469,7 @@ const LoginForm = (props) => {
<LoginFormWrapper enabledJoin={enabledJoin}>
<PageLayout>
<PageLayout.SectionBody>
<FormWrapper i18n={i18n} {...props} />
<FormWrapper i18n={i18n} {...props} />
</PageLayout.SectionBody>
</PageLayout>
<Register />
@ -486,21 +484,29 @@ LoginForm.propTypes = {
};
function mapStateToProps(state) {
const { isLoaded, settings } = state.auth;
const { greetingSettings, organizationName, hashSettings, enabledJoin } = settings;
const { isLoaded, settings, isAuthenticated } = state.auth;
const {
greetingSettings,
organizationName,
hashSettings,
enabledJoin,
defaultPage
} = settings;
return {
isAuthenticated,
isLoaded,
organizationName,
language: getLanguage(state),
greetingTitle: greetingSettings,
hashSettings,
enabledJoin
enabledJoin,
defaultPage
};
}
export default connect(mapStateToProps, {
login,
setIsLoaded,
reloadPortalSettings,
reloadPortalSettings
})(withRouter(LoginForm));

7
web/ASC.Web.Common/src/pages/login/sub-components/register-container.js
View File

@ -10,6 +10,9 @@ import { connect } from "react-redux";
import i18n from "../i18n";
const StyledRegister = styled(Box)`
display: flex;
align-items: center;
justify-content: center;
z-index: 184;
width: 100%;
height: 66px;
@ -60,9 +63,7 @@ const Register = ({ t }) => {
return (
<>
<StyledRegister onClick={onRegisterClick}>
<Text color="#316DAA" textAlign="center">
{t("Register")}
</Text>
<Text color="#316DAA">{t("Register")}</Text>
</StyledRegister>
{visible && (

36
web/ASC.Web.Common/src/store/auth/actions.js
View File

@ -1,4 +1,6 @@
import { default as api } from "../../api";
import { setWithCredentialsStatus } from "../../api/client";
import history from "../../history";
export const LOGIN_POST = "LOGIN_POST";
export const SET_CURRENT_USER = "SET_CURRENT_USER";
@ -17,6 +19,7 @@ export const SET_CURRENT_PRODUCT_HOME_PAGE = "SET_CURRENT_PRODUCT_HOME_PAGE";
export const SET_GREETING_SETTINGS = "SET_GREETING_SETTINGS";
export const SET_CUSTOM_NAMES = "SET_CUSTOM_NAMES";
export const SET_WIZARD_COMPLETED = "SET_WIZARD_COMPLETED";
export const SET_IS_AUTHENTICATED = "SET_IS_AUTHENTICATED";
export function setCurrentUser(user) {
return {
@ -128,13 +131,30 @@ export function setWizardComplete() {
};
}
export function setIsAuthenticated(isAuthenticated) {
return {
type: SET_IS_AUTHENTICATED,
isAuthenticated,
};
}
export function getUser(dispatch) {
return api.people
.getUser()
.then((user) => dispatch(setCurrentUser(user)))
.then(() => dispatch(setIsAuthenticated(true)))
.catch((err) => dispatch(setCurrentUser({})));
}
export function getIsAuthenticated(dispatch) {
return api.user
.checkIsAuthenticated()
.then((success) => {
dispatch(setIsAuthenticated(success));
return success;
});
}
export function getPortalSettings(dispatch) {
return api.settings.getSettings().then((settings) => {
const { passwordHash: hashSettings, ...otherSettings } = settings;
@ -176,16 +196,22 @@ export function login(user, hash) {
return api.user
.login(user, hash)
.then(() => dispatch(setIsLoaded(false)))
.then(() => {
setWithCredentialsStatus(true);
return dispatch(setIsAuthenticated(true));
})
.then(() => getUserInfo(dispatch));
};
}
export function logout() {
return (dispatch) => {
return api.user
.logout()
.then(() => dispatch(setLogout()))
.then(() => dispatch(setIsLoaded(true)));
return api.user.logout().then(() => {
setWithCredentialsStatus(false);
dispatch(setLogout());
history.push("/login");
});
};
}
@ -209,4 +235,4 @@ export function getPortalPasswordSettings(dispatch, confirmKey = null) {
export const reloadPortalSettings = () => {
return (dispatch) => getPortalSettings(dispatch);
};
};

11
web/ASC.Web.Common/src/store/auth/reducer.js
View File

@ -15,9 +15,9 @@ import {
SET_GREETING_SETTINGS,
SET_CUSTOM_NAMES,
SET_WIZARD_COMPLETED,
SET_IS_AUTHENTICATED,
} from "./actions";
import isEmpty from "lodash/isEmpty";
import { LANGUAGE, AUTH_KEY } from "../../constants";
import { LANGUAGE } from "../../constants";
const initialState = {
isAuthenticated: false,
@ -73,10 +73,12 @@ const authReducer = (state = initialState, action) => {
localStorage.getItem(LANGUAGE) !== action.user.cultureName &&
localStorage.setItem(LANGUAGE, action.user.cultureName);
return Object.assign({}, state, {
isAuthenticated:
!isEmpty(action.user) || localStorage.getItem(AUTH_KEY),
user: action.user,
});
case SET_IS_AUTHENTICATED:
return Object.assign({}, state, {
isAuthenticated: action.isAuthenticated,
});
case SET_MODULES:
return Object.assign({}, state, {
modules: action.modules,
@ -150,6 +152,7 @@ const authReducer = (state = initialState, action) => {
});
case LOGOUT:
return Object.assign({}, initialState, {
isLoaded: true,
settings: state.settings,
});
case SET_WIZARD_COMPLETED:

2
web/ASC.Web.Common/src/store/auth/selectors.js
View File

@ -45,6 +45,8 @@ const getCustomModules = (isAdmin) => {
export const getCurrentUser = (state) => state.auth.user;
export const isAuthenticated = (state) => state.auth.isAuthenticated;
export const getCurrentUserId = (state) => state.auth.user;
export const getModules = (state) => state.auth.modules;

47
web/ASC.Web.Common/src/utils/index.js
View File

@ -1,4 +1,4 @@
import { AUTH_KEY, LANGUAGE } from "../constants";
import { LANGUAGE } from "../constants";
import sjcl from "sjcl";
import { isMobile } from "react-device-detect";
@ -44,20 +44,6 @@ export function changeLanguage(
: i18n.changeLanguage("en");
}
export function redirectToDefaultPage() {
if (
(window.location.pathname === "/" ||
window.location.pathname === "" ||
window.location.pathname === "/login") &&
localStorage.getItem(AUTH_KEY) !== null
) {
setTimeout(() => window.location.replace("/products/files"), 0);
return true;
}
return false;
}
export function createPasswordHash(password, hashSettings) {
if (
!password ||
@ -82,10 +68,20 @@ export function createPasswordHash(password, hashSettings) {
return hash;
}
export function removeTempContent() {
const tempElm = document.getElementById("temp-content");
if (tempElm) {
tempElm.outerHTML = "";
export function updateTempContent(isAuth = false) {
if (isAuth) {
let el = document.getElementById("burger-loader-svg");
let el1 = document.getElementById("logo-loader-svg");
let el2 = document.getElementById("avatar-loader-svg");
el.style.display = "block";
el1.style.display = "block";
el2.style.display = "block";
} else {
const tempElm = document.getElementById("temp-content");
if (tempElm) {
tempElm.outerHTML = "";
}
}
}
@ -109,3 +105,16 @@ export function showLoader() {
}
export { withLayoutSize } from "./withLayoutSize";
export function tryRedirectTo(page) {
if (
window.location &&
window.location.pathname &&
window.location.pathname.indexOf(page) !== -1
)
return false;
//TODO: check if we already on default page
window.location.replace(page);
return true;
}

2
web/ASC.Web.Components/package.json
View File

@ -1,6 +1,6 @@
{
"name": "asc-web-components",
"version": "1.0.489",
"version": "1.0.490",
"description": "Ascensio System SIA component library",
"license": "AGPL-3.0",
"main": "dist/asc-web-components.js",

2
web/ASC.Web.Components/src/components/avatar/index.js
View File

@ -5,7 +5,7 @@ import { Icons } from "../icons";
import Link from "../link";
const whiteColor = "#FFFFFF";
const avatarBackground = "#ECEEF1";
const avatarBackground = "#D0D5DA";
const namedAvatarBackground = "#2DA7DB";
const noneUserSelect = css`

20
web/ASC.Web.Components/src/components/text-input/index.js
View File

@ -5,8 +5,7 @@ import commonInputStyle from "../text-input/common-input-styles";
import MaskedInput from "react-text-mask";
import isEqual from "lodash/isEqual";
/* eslint-disable no-unused-vars */
/* eslint-disable react/prop-types */
/* eslint-disable no-unused-vars, react/prop-types */
const Input = ({
isAutoFocussed,
isDisabled,
@ -25,8 +24,7 @@ const Input = ({
) : (
<input {...props} />
);
/* eslint-enable react/prop-types */
/* eslint-enable no-unused-vars */
/* eslint-enable react/prop-types, no-unused-vars */
const StyledInput = styled(Input).attrs((props) => ({
id: props.id,
@ -77,25 +75,31 @@ const StyledInput = styled(Input).attrs((props) => ({
transition: all 0.2s ease 0s;
::-webkit-input-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-ms-input-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::placeholder {
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}

14
web/ASC.Web.Components/src/components/textarea/index.js
View File

@ -56,25 +56,31 @@ const StyledTextarea = styled(ClearTextareaAutosize)`
}
::-webkit-input-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-ms-input-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::placeholder {
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}