Merge branch 'feature/files' into feature/loading-acceleration
# Conflicts: # products/ASC.Files/Client/src/components/Article/Body/index.js # products/ASC.Files/Client/src/store/files/actions.js
This commit is contained in:
commit
a2be460357
@ -64,9 +64,7 @@ const PureTreeSettings = ({
|
||||
|
||||
useEffect(() => {
|
||||
getFilesSettings()
|
||||
.catch(e => {
|
||||
setIsErrorSettings(true);
|
||||
});
|
||||
.catch(e => setIsErrorSettings(true));
|
||||
}, []);
|
||||
|
||||
const switcherIcon = obj => {
|
||||
|
@ -1,8 +1,8 @@
|
||||
import React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { toastr, utils } from "asc-web-components";
|
||||
import { store as initStore } from "asc-web-common";
|
||||
import ContentLoader from "react-content-loader";
|
||||
import { store as initStore, utils as commonUtils } from "asc-web-common";
|
||||
import TreeFolders from "./TreeFolders";
|
||||
import TreeSettings from "./TreeSettings";
|
||||
import isEmpty from "lodash/isEmpty";
|
||||
@ -18,8 +18,9 @@ import {
|
||||
} from "../../../store/files/actions";
|
||||
import store from "../../../store/store";
|
||||
import { NewFilesPanel } from "../../panels";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
|
||||
const { getCurrentModule } = initStore.auth.selectors;
|
||||
const { changeDocumentTitle } = commonUtils;
|
||||
|
||||
const TreeFolderLoader = () => (
|
||||
<ContentLoader
|
||||
@ -47,8 +48,8 @@ class ArticleBodyContent extends React.Component {
|
||||
} = props;
|
||||
|
||||
selectedFolderTitle
|
||||
? changeDocumentTitle(`${selectedFolderTitle} - ${currentModuleName}`)
|
||||
: changeDocumentTitle(`${currentModuleName} - ${organizationName}`);
|
||||
? setDocumentTitle(selectedFolderTitle)
|
||||
: setDocumentTitle();
|
||||
|
||||
this.state = {
|
||||
expandedKeys: filter.treeFolders,
|
||||
@ -110,8 +111,8 @@ class ArticleBodyContent extends React.Component {
|
||||
(e.node && e.node.props && e.node.props.title) || null;
|
||||
|
||||
selectedFolderTitle
|
||||
? changeDocumentTitle(`${selectedFolderTitle} - ${currentModuleName}`)
|
||||
: changeDocumentTitle(`${currentModuleName} - ${organizationName}`);
|
||||
? setDocumentTitle(selectedFolderTitle)
|
||||
: setDocumentTitle();
|
||||
|
||||
fetchFiles(data[0], newFilter, store.dispatch)
|
||||
.catch(err => toastr.error(err))
|
||||
|
@ -14,6 +14,7 @@ import { ConvertDialog } from "../../../../dialogs";
|
||||
import EditingWrapperComponent from "./EditingWrapperComponent";
|
||||
|
||||
const { FileAction } = constants;
|
||||
const sideColor = '#A3A9AE';
|
||||
|
||||
const SimpleFilesRowContent = styled(RowContent)`
|
||||
.badge-ext {
|
||||
@ -113,7 +114,10 @@ class FilesRowContent extends React.PureComponent {
|
||||
? createFolder(item.parentId, itemTitle)
|
||||
.then(() => this.completeAction(e)).finally(() => setIsLoading(false))
|
||||
: createFile(item.parentId, `${itemTitle}.${item.fileExst}`)
|
||||
.then(() => this.completeAction(e)).finally(() => setIsLoading(false))
|
||||
.then((file) => {
|
||||
window.open(file.webUrl, "_blank")
|
||||
this.completeAction(e)
|
||||
}).finally(() => setIsLoading(false))
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
@ -350,7 +354,7 @@ class FilesRowContent extends React.PureComponent {
|
||||
<SimpleFilesRowContent
|
||||
widthProp={widthProp}
|
||||
isMobile={isMobile}
|
||||
sideColor="#333"
|
||||
sideColor={sideColor}
|
||||
isFile={fileExst}
|
||||
onClick={this.onMobileRowClick}
|
||||
>
|
||||
@ -469,7 +473,7 @@ class FilesRowContent extends React.PureComponent {
|
||||
containerMinWidth='120px'
|
||||
containerWidth='15%'
|
||||
as="div"
|
||||
color="#333"
|
||||
color={sideColor}
|
||||
fontSize='12px'
|
||||
fontWeight={400}
|
||||
title={fileOwner}
|
||||
@ -483,7 +487,7 @@ class FilesRowContent extends React.PureComponent {
|
||||
title={updatedDate}
|
||||
fontSize='12px'
|
||||
fontWeight={400}
|
||||
color="#333"
|
||||
color={sideColor}
|
||||
className="row_update-text"
|
||||
>
|
||||
{updatedDate && updatedDate}
|
||||
@ -492,7 +496,7 @@ class FilesRowContent extends React.PureComponent {
|
||||
containerMinWidth='90px'
|
||||
containerWidth='10%'
|
||||
as="div"
|
||||
color="#333"
|
||||
color={sideColor}
|
||||
fontSize='12px'
|
||||
fontWeight={400}
|
||||
title=''
|
||||
|
@ -9,7 +9,7 @@ import { getFilterByLocation } from "../../../../../helpers/converters";
|
||||
import { constants, FilterInput } from 'asc-web-common';
|
||||
import store from "../../../../../store/store";
|
||||
import isEqual from "lodash/isEqual";
|
||||
import { isMobile } from 'react-device-detect';
|
||||
import { isMobileOnly } from 'react-device-detect';
|
||||
|
||||
const { FilterType } = constants;
|
||||
|
||||
@ -291,7 +291,7 @@ class SectionFilterContent extends React.Component {
|
||||
isReady={this.state.isReady}
|
||||
{...filterColumnCount}
|
||||
contextMenuHeader={t("AddFilter")}
|
||||
isMobile={isMobile}
|
||||
isMobile={isMobileOnly}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
@ -80,7 +80,10 @@ const StyledContainer = styled.div`
|
||||
|
||||
.option-button {
|
||||
margin-bottom: -1px;
|
||||
margin-left: 16px;
|
||||
|
||||
@media(min-width: 1024px) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
@media ${tablet} {
|
||||
& > div:first-child {
|
||||
|
@ -2,7 +2,7 @@ import React, { useEffect } from "react";
|
||||
import styled from "styled-components";
|
||||
import { connect } from "react-redux";
|
||||
import { Heading, ToggleButton } from "asc-web-components";
|
||||
import { utils as commonUtils} from "asc-web-common";
|
||||
import { Error403, Error520 } from "asc-web-common";
|
||||
|
||||
import {
|
||||
setUpdateIfExist,
|
||||
@ -13,8 +13,7 @@ import {
|
||||
setSelectedNode,
|
||||
setForceSave
|
||||
} from "../../../../../store/files/actions";
|
||||
|
||||
const { changeDocumentTitle } = commonUtils;
|
||||
import { setDocumentTitle } from "../../../../../helpers/utils";
|
||||
|
||||
const StyledSettings = styled.div`
|
||||
display: grid;
|
||||
@ -31,7 +30,7 @@ const StyledSettings = styled.div`
|
||||
`;
|
||||
|
||||
const SectionBodyContent = ({
|
||||
setting,
|
||||
setting, isLoading,
|
||||
selectedTreeNode, setSelectedNode,
|
||||
storeForceSave, setStoreForceSave ,
|
||||
enableThirdParty, setEnableThirdParty,
|
||||
@ -39,13 +38,13 @@ const SectionBodyContent = ({
|
||||
confirmDelete, setConfirmDelete,
|
||||
updateIfExist, setUpdateIfExist,
|
||||
forceSave, setForceSave,
|
||||
isAdmin,
|
||||
isAdmin, isErrorSettings,
|
||||
t
|
||||
}) => {
|
||||
|
||||
useEffect(() => {
|
||||
changeDocumentTitle(t(`${setting}`));
|
||||
}, [setting, changeDocumentTitle]);
|
||||
setDocumentTitle(t(`${setting}`));
|
||||
}, [setting, setDocumentTitle]);
|
||||
|
||||
useEffect(() => {
|
||||
if (setting !== selectedTreeNode[0]) {
|
||||
@ -159,11 +158,19 @@ const SectionBodyContent = ({
|
||||
if (setting === "admin" && isAdmin) content = renderAdminSettings();
|
||||
if (setting === "common") content = renderCommonSettings();
|
||||
if (setting === "thirdParty" && enableThirdParty) content = renderClouds();
|
||||
return content;
|
||||
|
||||
return isLoading ? null : (!enableThirdParty && setting === "thirdParty") ||
|
||||
(!isAdmin && setting === "admin" ) ? (
|
||||
<Error403 />
|
||||
) : isErrorSettings ? (
|
||||
<Error520 />
|
||||
) : (
|
||||
content
|
||||
);
|
||||
}
|
||||
|
||||
function mapStateToProps(state) {
|
||||
const { settingsTree, selectedTreeNode } = state.files;
|
||||
const { settingsTree, selectedTreeNode, isLoading } = state.files;
|
||||
const { isAdmin } = state.auth.user;
|
||||
const {
|
||||
storeOriginalFiles,
|
||||
@ -171,7 +178,8 @@ function mapStateToProps(state) {
|
||||
updateIfExist,
|
||||
forceSave,
|
||||
storeForceSave,
|
||||
enableThirdParty
|
||||
enableThirdParty,
|
||||
isErrorSettings
|
||||
} = settingsTree;
|
||||
|
||||
return {
|
||||
@ -182,7 +190,8 @@ function mapStateToProps(state) {
|
||||
updateIfExist,
|
||||
forceSave,
|
||||
storeForceSave,
|
||||
enableThirdParty
|
||||
enableThirdParty,
|
||||
isLoading
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
import React, { useEffect } from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { withRouter } from "react-router";
|
||||
import { PageLayout, utils, Error403, Error520 } from "asc-web-common";
|
||||
import { PageLayout, utils } from "asc-web-common";
|
||||
import { RequestLoader } from "asc-web-components";
|
||||
import {
|
||||
ArticleHeaderContent,
|
||||
@ -11,6 +11,11 @@ import {
|
||||
import { SectionHeaderContent, SectionBodyContent } from "./Section";
|
||||
import { withTranslation, I18nextProvider } from "react-i18next";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import {
|
||||
setIsErrorSettings,
|
||||
getFilesSettings,
|
||||
setIsLoading
|
||||
} from "../../../store/files/actions";
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "Settings",
|
||||
@ -23,14 +28,24 @@ const PureSettings = ({
|
||||
match,
|
||||
t,
|
||||
isLoading,
|
||||
enableThirdParty,
|
||||
isAdmin,
|
||||
isErrorSettings
|
||||
setIsErrorSettings,
|
||||
getFilesSettings,
|
||||
setIsLoading
|
||||
}) => {
|
||||
//console.log("Settings render()");
|
||||
const { setting } = match.params;
|
||||
|
||||
const settings = (
|
||||
useEffect(() => {
|
||||
setIsLoading(true);
|
||||
getFilesSettings()
|
||||
.then(() => setIsLoading(false))
|
||||
.catch(e => {
|
||||
setIsErrorSettings(true);
|
||||
setIsLoading(false)
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<RequestLoader
|
||||
visible={isLoading}
|
||||
@ -64,15 +79,6 @@ const PureSettings = ({
|
||||
</PageLayout>
|
||||
</>
|
||||
);
|
||||
|
||||
return (!enableThirdParty && setting === "thirdParty") ||
|
||||
(!isAdmin && setting === "admin") ? (
|
||||
<Error403 />
|
||||
) : isErrorSettings ? (
|
||||
<Error520 />
|
||||
) : (
|
||||
settings
|
||||
);
|
||||
};
|
||||
|
||||
const SettingsContainer = withTranslation()(PureSettings);
|
||||
@ -90,11 +96,15 @@ const Settings = props => {
|
||||
|
||||
function mapStateToProps(state) {
|
||||
return {
|
||||
isLoading: state.files.isLoading,
|
||||
enableThirdParty: state.files.settingsTree.enableThirdParty,
|
||||
isAdmin: state.auth.user.isAdmin,
|
||||
isErrorSettings: state.files.settingsTree.isErrorSettings
|
||||
isLoading: state.files.isLoading
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps)(withRouter(Settings));
|
||||
export default connect(
|
||||
mapStateToProps,
|
||||
{
|
||||
setIsErrorSettings,
|
||||
getFilesSettings,
|
||||
setIsLoading
|
||||
}
|
||||
)(withRouter(Settings));
|
||||
|
@ -12,12 +12,13 @@ import {
|
||||
} from "../../Article";
|
||||
import { SectionHeaderContent, SectionBodyContent } from "./Section";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
const i18n = createI18N({
|
||||
page: "VersionHistory",
|
||||
localesPath: "pages/VersionHistory"
|
||||
});
|
||||
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
|
||||
class PureVersionHistory extends React.Component {
|
||||
constructor(props) {
|
||||
@ -36,7 +37,7 @@ class PureVersionHistory extends React.Component {
|
||||
const { match, t } = this.props;
|
||||
const { fileId } = match.params;
|
||||
|
||||
//changeDocumentTitle(`${t("GroupAction")} – ${t("People")}`);
|
||||
//setDocumentTitle(t("GroupAction"));
|
||||
|
||||
if (fileId) {
|
||||
this.getFileVersions(fileId);
|
||||
|
31
products/ASC.Files/Client/src/helpers/utils.js
Normal file
31
products/ASC.Files/Client/src/helpers/utils.js
Normal file
@ -0,0 +1,31 @@
|
||||
import { store as commonStore } from 'asc-web-common';
|
||||
import store from '../store/store';
|
||||
|
||||
const { getCurrentModule } = commonStore.auth.selectors;
|
||||
|
||||
export const setDocumentTitle = (subTitle = null ) => {
|
||||
const { auth: commonState } = store.getState();
|
||||
|
||||
const { isAuthenticated, modules, settings } = commonState;
|
||||
const { organizationName, currentProductId } = settings;
|
||||
|
||||
let title, currentModule;
|
||||
|
||||
if(modules && currentProductId ){
|
||||
currentModule = getCurrentModule(modules, currentProductId);
|
||||
}
|
||||
|
||||
if (subTitle) {
|
||||
if (isAuthenticated && currentModule) {
|
||||
title = subTitle + ' - ' + currentModule.title;
|
||||
} else {
|
||||
title = subTitle + ' - ' + organizationName;
|
||||
}
|
||||
} else if (currentModule && organizationName) {
|
||||
title = currentModule.title + ' - ' + organizationName;
|
||||
} else {
|
||||
title = organizationName;
|
||||
}
|
||||
|
||||
document.title = title;
|
||||
}
|
@ -395,8 +395,10 @@ export function fetchTreeFolders(dispatch) {
|
||||
|
||||
export function createFile(folderId, title) {
|
||||
return dispatch => {
|
||||
return files.createFile(folderId, title).then(folder => {
|
||||
return files.createFile(folderId, title)
|
||||
.then(file => {
|
||||
fetchFolder(folderId, dispatch);
|
||||
return Promise.resolve(file)
|
||||
});
|
||||
};
|
||||
}
|
||||
|
@ -7,13 +7,14 @@ import { withTranslation, I18nextProvider } from "react-i18next";
|
||||
import { history, utils as commonUtils, store as initStore } from "asc-web-common";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import styled, { css } from "styled-components";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "Article",
|
||||
localesPath: "Article"
|
||||
});
|
||||
|
||||
const { changeLanguage, changeDocumentTitle } = commonUtils;
|
||||
const { changeLanguage } = commonUtils;
|
||||
const { getCurrentModule, isAdmin } = initStore.auth.selectors;
|
||||
|
||||
const StyledTreeMenu = styled(TreeMenu)`
|
||||
@ -80,8 +81,8 @@ class ArticleBodyContent extends React.Component {
|
||||
|
||||
const currentGroup = getSelectedGroup(groups, data ? data[0] : selectedKeys[0]);
|
||||
currentGroup
|
||||
? changeDocumentTitle(`${currentGroup.name} – ${currentModuleName}`)
|
||||
: changeDocumentTitle(`${currentModuleName} – ${organizationName}`);
|
||||
? setDocumentTitle(currentGroup.name)
|
||||
: setDocumentTitle();
|
||||
}
|
||||
shouldComponentUpdate(nextProps) {
|
||||
if (
|
||||
|
@ -79,11 +79,9 @@ class InviteDialogComponent extends React.Component {
|
||||
|
||||
componentDidMount() {
|
||||
const { t } = this.props;
|
||||
copy(this.state.userInvitationLink);
|
||||
|
||||
changeLanguage(i18n)
|
||||
.then(() => this.setState({ visible: true }))
|
||||
.then(() => toastr.success(t("LinkCopySuccess")));
|
||||
}
|
||||
|
||||
onClickToCloseButton = () =>
|
||||
|
@ -11,11 +11,12 @@ import { SectionHeaderContent, SectionBodyContent } from "./Section";
|
||||
import { I18nextProvider, withTranslation } from "react-i18next";
|
||||
import { fetchGroup, resetGroup } from "../../../store/group/actions";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
const i18n = createI18N({
|
||||
page: "GroupAction",
|
||||
localesPath: "pages/GroupAction"
|
||||
});
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
const { isAdmin } = store.auth.selectors;
|
||||
|
||||
class GroupAction extends React.Component {
|
||||
@ -23,7 +24,7 @@ class GroupAction extends React.Component {
|
||||
const { match, fetchGroup, t } = this.props;
|
||||
const { groupId } = match.params;
|
||||
|
||||
changeDocumentTitle(`${t("GroupAction")} – ${t("People")}`);
|
||||
setDocumentTitle(t("GroupAction"));
|
||||
changeLanguage(i18n);
|
||||
|
||||
if (groupId) {
|
||||
|
@ -7,7 +7,7 @@ import { getUserStatus } from "../../../../../store/people/selectors";
|
||||
const getFormatedGroups = (user, status, selectGroup) => {
|
||||
let temp = [];
|
||||
const groups = user.groups;
|
||||
const linkColor = "#333";
|
||||
const linkColor = "#A3A9AE";
|
||||
|
||||
if (!groups) temp.push({ key: 0, label: '' });
|
||||
|
||||
@ -77,7 +77,7 @@ const UserContent = ({ user, history, settings, selectGroup, widthProp, isMobile
|
||||
);
|
||||
|
||||
const nameColor = "#333";
|
||||
const sideInfoColor = "#333";
|
||||
const sideInfoColor = "#A3A9AE";
|
||||
|
||||
return (
|
||||
<RowContent
|
||||
|
@ -7,7 +7,7 @@ import { withTranslation } from "react-i18next";
|
||||
import { withRouter } from "react-router";
|
||||
import { getFilterByLocation } from "../../../../../helpers/converters";
|
||||
import { store, FilterInput } from 'asc-web-common';
|
||||
import { isMobile } from 'react-device-detect';
|
||||
import { isMobileOnly } from 'react-device-detect';
|
||||
const { isAdmin } = store.auth.selectors;
|
||||
|
||||
const getEmployeeStatus = filterValues => {
|
||||
@ -255,7 +255,7 @@ class SectionFilterContent extends React.Component {
|
||||
needForUpdate={this.needForUpdate}
|
||||
language={i18n.language}
|
||||
contextMenuHeader={t("AddFilter")}
|
||||
isMobile={isMobile}
|
||||
isMobile={isMobileOnly}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
@ -12,11 +12,13 @@ import { SectionHeaderContent, SectionBodyContent } from "./Section";
|
||||
import { fetchProfile, resetProfile } from "../../../store/profile/actions";
|
||||
import { I18nextProvider, withTranslation } from "react-i18next";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "Profile",
|
||||
localesPath: "pages/Profile"
|
||||
});
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
const { isAdmin } = store.auth.selectors;
|
||||
|
||||
class PureProfile extends React.Component {
|
||||
@ -32,7 +34,7 @@ class PureProfile extends React.Component {
|
||||
const { match, fetchProfile, t } = this.props;
|
||||
const { userId } = match.params;
|
||||
|
||||
changeDocumentTitle(`${t("Profile")} – ${t("People")}`);
|
||||
setDocumentTitle(t("Profile"));
|
||||
|
||||
const queryParams = this.state.queryString.split("&");
|
||||
const arrayOfQueryParams = queryParams.map(queryParam =>
|
||||
|
@ -16,11 +16,12 @@ import {
|
||||
import { fetchProfile } from "../../../store/profile/actions";
|
||||
import { I18nextProvider, withTranslation } from "react-i18next";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
const i18n = createI18N({
|
||||
page: "ProfileAction",
|
||||
localesPath: "pages/ProfileAction"
|
||||
});
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
const { isAdmin } = store.auth.selectors;
|
||||
|
||||
class ProfileAction extends React.Component {
|
||||
@ -28,7 +29,7 @@ class ProfileAction extends React.Component {
|
||||
const { match, fetchProfile, t } = this.props;
|
||||
const { userId } = match.params;
|
||||
|
||||
changeDocumentTitle(`${t("ProfileAction")} – ${t("People")}`);
|
||||
setDocumentTitle(t("ProfileAction"));
|
||||
changeLanguage(i18n);
|
||||
|
||||
if (userId) {
|
||||
|
@ -12,7 +12,7 @@ html, body {
|
||||
position: relative;
|
||||
|
||||
.pageLoader {
|
||||
position: fixed;
|
||||
position: absolute;
|
||||
left: calc(50% - 20px);
|
||||
top: 35%;
|
||||
}
|
||||
|
31
products/ASC.People/Client/src/helpers/utils.js
Normal file
31
products/ASC.People/Client/src/helpers/utils.js
Normal file
@ -0,0 +1,31 @@
|
||||
import { store as commonStore } from 'asc-web-common';
|
||||
import store from '../store/store';
|
||||
|
||||
const { getCurrentModule } = commonStore.auth.selectors;
|
||||
|
||||
export const setDocumentTitle = (subTitle = null ) => {
|
||||
const { auth: commonState } = store.getState();
|
||||
|
||||
const { isAuthenticated, modules, settings } = commonState;
|
||||
const { organizationName, currentProductId } = settings;
|
||||
|
||||
let title, currentModule;
|
||||
|
||||
if(modules && currentProductId ){
|
||||
currentModule = getCurrentModule(modules, currentProductId);
|
||||
}
|
||||
|
||||
if (subTitle) {
|
||||
if (isAuthenticated && currentModule) {
|
||||
title = subTitle + ' - ' + currentModule.title;
|
||||
} else {
|
||||
title = subTitle + ' - ' + organizationName;
|
||||
}
|
||||
} else if (currentModule && organizationName) {
|
||||
title = currentModule.title + ' - ' + organizationName;
|
||||
} else {
|
||||
title = organizationName;
|
||||
}
|
||||
|
||||
document.title = title;
|
||||
}
|
@ -5,14 +5,15 @@ import { useTranslation } from "react-i18next";
|
||||
import version from "../../../../package.json";
|
||||
import styled from "styled-components";
|
||||
import { Trans } from "react-i18next";
|
||||
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import { setDocumentTitle } from '../../../helpers/utils';
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "About",
|
||||
localesPath: "pages/About"
|
||||
});
|
||||
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
|
||||
const BodyStyle = styled.div`
|
||||
margin-top: 24px;
|
||||
@ -84,8 +85,8 @@ const Body = () => {
|
||||
|
||||
useEffect(() => {
|
||||
changeLanguage(i18n);
|
||||
changeDocumentTitle(`${t("AboutTitle")} – ${t("People")}`);
|
||||
}, [t, changeDocumentTitle]);
|
||||
setDocumentTitle(t("AboutTitle"));//TODO: implement the ability to read the current module in redux to implement the template `${t("AboutTitle")} – ${t("People")}`
|
||||
}, [t, setDocumentTitle]);
|
||||
|
||||
const gitHub = "GitHub";
|
||||
const license = "AGPL-3.0";
|
||||
|
@ -8,12 +8,14 @@ import { useTranslation } from "react-i18next";
|
||||
import styled from "styled-components";
|
||||
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "Home",
|
||||
localesPath: "pages/Home"
|
||||
});
|
||||
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
|
||||
const HomeContainer = styled.div`
|
||||
padding: 62px 15px 0 15px;
|
||||
@ -80,7 +82,7 @@ const Body = ({ modules, match, isLoaded, organizationName }) => {
|
||||
const { t } = useTranslation("translation", { i18n });
|
||||
const { error } = match.params;
|
||||
|
||||
changeDocumentTitle(`${organizationName}`);
|
||||
setDocumentTitle();
|
||||
|
||||
useEffect(() => error && toastr.error(error), [error]);
|
||||
|
||||
|
@ -15,9 +15,7 @@ import {
|
||||
restoreGreetingTitle
|
||||
} from "../../../../../store/settings/actions";
|
||||
import { saveToSessionStorage, getFromSessionStorage } from "../../utils";
|
||||
import { utils } from 'asc-web-common';
|
||||
|
||||
const { changeDocumentTitle } = utils;
|
||||
import { setDocumentTitle } from "../../../../../helpers/utils";
|
||||
|
||||
const StyledComponent = styled.div`
|
||||
.margin-top {
|
||||
@ -56,7 +54,7 @@ class CustomTitles extends React.Component {
|
||||
|
||||
greetingTitleFromSessionStorage = getFromSessionStorage("greetingTitle");
|
||||
|
||||
changeDocumentTitle(`${t("Customization")} – ${organizationName}`);
|
||||
setDocumentTitle(t("Customization"));
|
||||
|
||||
this.state = {
|
||||
isLoadedData: false,
|
||||
|
@ -9,8 +9,9 @@ import {
|
||||
getPortalTimezones
|
||||
} from "../../../../../store/settings/actions";
|
||||
import { default as clientStore } from "../../../../../store/store";
|
||||
import { setDocumentTitle } from "../../../../../helpers/utils";
|
||||
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
const {
|
||||
getPortalCultures,
|
||||
getModules,
|
||||
@ -101,7 +102,7 @@ class Customization extends React.Component {
|
||||
const languages = mapCulturesToArray(rawCultures, t);
|
||||
const timezones = mapTimezonesToArray(rawTimezones);
|
||||
|
||||
changeDocumentTitle(`${t("Customization")} – ${organizationName}`);
|
||||
setDocumentTitle(t("Customization"));
|
||||
|
||||
this.state = {
|
||||
isLoadedData: false,
|
||||
|
@ -19,8 +19,9 @@ import {
|
||||
} from "../../../../../store/settings/actions";
|
||||
import { saveToSessionStorage, getFromSessionStorage } from "../../utils";
|
||||
import { default as clientStore } from "../../../../../store/store";
|
||||
import { setDocumentTitle } from "../../../../../helpers/utils";
|
||||
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
const {
|
||||
getPortalCultures,
|
||||
getModules,
|
||||
@ -96,7 +97,7 @@ class LanguageAndTimeZone extends React.Component {
|
||||
languageFromSessionStorage = getFromSessionStorage("language");
|
||||
timezoneFromSessionStorage = getFromSessionStorage("timezone");
|
||||
|
||||
changeDocumentTitle(`${t("Customization")} – ${organizationName}`);
|
||||
setDocumentTitle(t("Customization"));
|
||||
|
||||
this.state = {
|
||||
isLoadedData: false,
|
||||
|
@ -12,12 +12,13 @@ import AdminsSettings from "./sub-components/admins";
|
||||
// import ModulesSettings from "./sub-components/modules";
|
||||
|
||||
import { createI18N } from "../../../../../helpers/i18n";
|
||||
import { setDocumentTitle } from "../../../../../helpers/utils";
|
||||
const i18n = createI18N({
|
||||
page: "Settings",
|
||||
localesPath: "pages/Settings"
|
||||
});
|
||||
|
||||
const { changeLanguage, changeDocumentTitle } = utils;
|
||||
const { changeLanguage } = utils;
|
||||
|
||||
const MainContainer = styled.div`
|
||||
padding-bottom: 16px;
|
||||
@ -35,7 +36,7 @@ class PureAccessRights extends Component {
|
||||
|
||||
const { t, organizationName } = props;
|
||||
|
||||
changeDocumentTitle(`${t("ManagementCategorySecurity")} – ${organizationName}`);
|
||||
setDocumentTitle(t("ManagementCategorySecurity"));
|
||||
|
||||
const url = props.history.location.pathname;
|
||||
const newUrl = url.split("/");
|
||||
|
@ -32,13 +32,15 @@ import {
|
||||
} from "../../../store/wizard/actions";
|
||||
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
import { setDocumentTitle } from "../../../helpers/utils";
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "Wizard",
|
||||
localesPath: "pages/Wizard"
|
||||
});
|
||||
|
||||
const { tablet } = utils.device;
|
||||
const { changeLanguage, changeDocumentTitle } = commonUtils;
|
||||
const { changeLanguage } = commonUtils;
|
||||
|
||||
const { EmailSettings } = utils.email;
|
||||
const emailSettings = new EmailSettings();
|
||||
@ -100,7 +102,7 @@ class Body extends Component {
|
||||
checkingMessages: []
|
||||
};
|
||||
|
||||
changeDocumentTitle(t("wizardTitle"));
|
||||
setDocumentTitle(t("wizardTitle"));
|
||||
}
|
||||
|
||||
async componentDidMount() {
|
||||
|
31
web/ASC.Web.Client/src/helpers/utils.js
Normal file
31
web/ASC.Web.Client/src/helpers/utils.js
Normal file
@ -0,0 +1,31 @@
|
||||
import { store as commonStore } from 'asc-web-common';
|
||||
import store from '../store/store';
|
||||
|
||||
const { getCurrentModule } = commonStore.auth.selectors;
|
||||
|
||||
export const setDocumentTitle = (subTitle = null ) => {
|
||||
const { auth: commonState } = store.getState();
|
||||
|
||||
const { isAuthenticated, modules, settings } = commonState;
|
||||
const { organizationName, currentProductId } = settings;
|
||||
|
||||
let title, currentModule;
|
||||
|
||||
if(modules && currentProductId ){
|
||||
currentModule = getCurrentModule(modules, currentProductId);
|
||||
}
|
||||
|
||||
if (subTitle) {
|
||||
if (isAuthenticated && currentModule) {
|
||||
title = subTitle + ' - ' + currentModule.title;
|
||||
} else {
|
||||
title = subTitle + ' - ' + organizationName;
|
||||
}
|
||||
} else if (currentModule && organizationName) {
|
||||
title = currentModule.title + ' - ' + organizationName;
|
||||
} else {
|
||||
title = organizationName;
|
||||
}
|
||||
|
||||
document.title = title;
|
||||
}
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "asc-web-common",
|
||||
"version": "1.0.232",
|
||||
"version": "1.0.238",
|
||||
"description": "Ascensio System SIA common components and solutions library",
|
||||
"license": "AGPL-3.0",
|
||||
"files": [
|
||||
|
@ -115,7 +115,7 @@ const StyledFilterInput = styled.div`
|
||||
`}
|
||||
|
||||
.combo-button-label {
|
||||
color: #333;
|
||||
color: #A3A9AE;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
@ -3,6 +3,7 @@ import styled from "styled-components";
|
||||
|
||||
const StyledMain = styled.main`
|
||||
height: 100vh;
|
||||
height: calc(var(--vh, 1vh) * 100);
|
||||
padding: ${props => (props.fullscreen ? "0" : "56px 0 0 0")};
|
||||
width: 100vw;
|
||||
z-index: 0;
|
||||
@ -12,6 +13,9 @@ const StyledMain = styled.main`
|
||||
`;
|
||||
|
||||
const Main = React.memo(props => {
|
||||
const vh = window.innerHeight * 0.01;
|
||||
document.documentElement.style.setProperty('--vh', `${vh}px`);
|
||||
|
||||
//console.log("Main render");
|
||||
return <StyledMain {...props} />;
|
||||
});
|
||||
|
@ -1,7 +1,7 @@
|
||||
import React from "react";
|
||||
import PropTypes from "prop-types";
|
||||
import styled from "styled-components";
|
||||
import { Icons } from "asc-web-components";
|
||||
import { Icons, Text } from "asc-web-components";
|
||||
|
||||
import ImageViewer from "./sub-components/image-viewer"
|
||||
import VideoViewer from "./sub-components/video-viewer"
|
||||
@ -352,7 +352,7 @@ class MediaViewer extends React.Component {
|
||||
|
||||
<div>
|
||||
<div className="details" ref={this.detailsContainer}>
|
||||
<div className="title">{fileTitle}</div>
|
||||
<Text isBold fontSize="14px" color="#fff" className="title">{fileTitle}</Text>
|
||||
<ControlBtn onClick={this.props.onClose && (this.props.onClose)} className="mediaPlayerClose">
|
||||
<Icons.CrossIcon size="medium" isfill={true} color="#fff" />
|
||||
</ControlBtn>
|
||||
|
@ -43,10 +43,6 @@ const StyledMediaViewer = styled.div`
|
||||
}
|
||||
.details{
|
||||
z-index: 4001;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
padding-top: 14px;
|
||||
padding-bottom: 14px;
|
||||
height: 20px;
|
||||
@ -57,8 +53,7 @@ const StyledMediaViewer = styled.div`
|
||||
left: 0;
|
||||
|
||||
.title{
|
||||
width: calc(100% - 100px);
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
@ -31,11 +31,12 @@ const StyledViewer = styled(Viewer)`
|
||||
}
|
||||
.react-viewer-toolbar li{
|
||||
width: 40px;
|
||||
height:30px;
|
||||
height: 30px;
|
||||
margin-top: 4px;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
line-height: 24px;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
.react-viewer-btn{
|
||||
background-color: transparent;
|
||||
|
@ -14,10 +14,14 @@ const StyledArticleBody = styled.div`
|
||||
height: calc(100% - 104px);
|
||||
display: table;
|
||||
width: 100%;
|
||||
|
||||
.custom-scrollbar{
|
||||
display:table-cell;
|
||||
}
|
||||
}
|
||||
|
||||
@media ${smallTablet} {
|
||||
display: block;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
@ -23,7 +23,7 @@ import { login, setIsLoaded } from "../../store/auth/actions";
|
||||
import { sendInstructionsToChangePassword } from "../../api/people";
|
||||
import Register from "./sub-components/register-container";
|
||||
//import history from "../../history";
|
||||
import { changeDocumentTitle, redirectToDefaultPage } from "../../utils";
|
||||
import { redirectToDefaultPage } from "../../utils";
|
||||
|
||||
const LoginContainer = styled.div`
|
||||
display: flex;
|
||||
@ -236,7 +236,7 @@ class Form extends Component {
|
||||
const { match, t, organizationName } = this.props;
|
||||
const { error, confirmedEmail } = match.params;
|
||||
|
||||
changeDocumentTitle(`${t("Authorization")} – ${organizationName}`);
|
||||
document.title = `${t("Authorization")} – ${organizationName}`; //TODO: implement the setDocumentTitle() utility in ASC.Web.Common
|
||||
|
||||
error && this.setState({ errorText: error });
|
||||
confirmedEmail && this.setState({ identifier: confirmedEmail });
|
||||
|
@ -40,12 +40,6 @@ export function changeLanguage(i18n) {
|
||||
: i18n.changeLanguage("en");
|
||||
}
|
||||
|
||||
export function changeDocumentTitle(title) {
|
||||
if (title !== document.title) {
|
||||
document.title = title;
|
||||
}
|
||||
}
|
||||
|
||||
export function redirectToDefaultPage() {
|
||||
if (
|
||||
(window.location.pathname === "/" || window.location.pathname === "") &&
|
||||
@ -56,4 +50,4 @@ export function redirectToDefaultPage() {
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
}
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "asc-web-components",
|
||||
"version": "1.0.449",
|
||||
"version": "1.0.452",
|
||||
"description": "Ascensio System SIA component library",
|
||||
"license": "AGPL-3.0",
|
||||
"main": "dist/asc-web-components.js",
|
||||
|
@ -132,7 +132,7 @@ ${props => !props.disableSideInfo
|
||||
|
||||
const TabletSideInfo = styled.div`
|
||||
display: none;
|
||||
|
||||
${props => props.color ? `color: ${props.color};` : null}
|
||||
${props => props.widthProp && (props.widthProp < size.tablet) || props.isMobile
|
||||
? `${sideInfoTabletStyle}`
|
||||
: `
|
||||
@ -154,7 +154,6 @@ const getSideInfo = content => {
|
||||
: '';
|
||||
}
|
||||
});
|
||||
|
||||
return info;
|
||||
};
|
||||
|
||||
|
@ -52,9 +52,7 @@ const StyledOptionButton = styled.div`
|
||||
width: ${props => props.spacerWidth && props.spacerWidth};
|
||||
|
||||
.expandButton > div:first-child {
|
||||
padding-top: 8px;
|
||||
padding-bottom: 8px;
|
||||
padding-left: 16px;
|
||||
padding: 8px 8px 8px 16px;
|
||||
}
|
||||
`;
|
||||
|
||||
|
@ -9,22 +9,22 @@ const Scrollbar = React.forwardRef((props, ref) => {
|
||||
smallWhite: {
|
||||
thumbV: { backgroundColor: 'rgba(256, 256, 256, 0.2)', width: '2px', marginLeft: '2px', borderRadius: 'inherit' },
|
||||
thumbH: { backgroundColor: 'rgba(256, 256, 256, 0.2)', height: '2px', marginTop: '2px', borderRadius: 'inherit' },
|
||||
view: { outline: 'none' }
|
||||
view: { outline: 'none', WebkitOverflowScrolling: 'auto' }
|
||||
},
|
||||
smallBlack: {
|
||||
thumbV: { backgroundColor: 'rgba(0, 0, 0, 0.1)', width: '3px', marginLeft: '2px', borderRadius: 'inherit' },
|
||||
thumbH: { backgroundColor: 'rgba(0, 0, 0, 0.1)', height: '3px', marginTop: '2px', borderRadius: 'inherit' },
|
||||
view: { outline: 'none' }
|
||||
view: { outline: 'none', WebkitOverflowScrolling: 'auto' }
|
||||
},
|
||||
mediumBlack: {
|
||||
thumbV: { backgroundColor: 'rgba(0, 0, 0, 0.1)', width: '8px', borderRadius: 'inherit' },
|
||||
thumbH: { backgroundColor: 'rgba(0, 0, 0, 0.1)', height: '8px', borderRadius: 'inherit' },
|
||||
view: { paddingRight: '16px', outline: 'none' }
|
||||
view: { paddingRight: '16px', outline: 'none', WebkitOverflowScrolling: 'auto' }
|
||||
},
|
||||
preMediumBlack: {
|
||||
thumbV: { backgroundColor: 'rgba(0, 0, 0, 0.1)', width: '5px', borderRadius: 'inherit', cursor: 'default' },
|
||||
thumbH: { backgroundColor: 'rgba(0, 0, 0, 0.1)', height: '5px', borderRadius: 'inherit', cursor: 'default' },
|
||||
view: { outline: 'none' }
|
||||
view: { outline: 'none', WebkitOverflowScrolling: 'auto' }
|
||||
},
|
||||
};
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user