This commit is contained in:
Nikita Gopienko 2019-09-12 14:02:42 +03:00
commit e114ff9280
11 changed files with 71 additions and 20 deletions

View File

@ -67,7 +67,7 @@ class PurePeopleLayout extends React.Component {
const getAvailableModules = (modules) => {
const separator = { seporator: true, id: 'nav-seporator-1' };
const separator = { separator: true, id: 'nav-separator-1' };
const products = modules.map(product => {
return {
id: product.id,

View File

@ -269,7 +269,7 @@ class CreateUserForm extends React.Component {
labelText={`${t("CustomDepartment", { department })}:`}
isDisabled={isLoading}
departments={profile.groups}
addButtonTitle={t("Add")}
addButtonTitle={t("AddButton")}
onAddDepartment={this.onAddGroup}
onRemoveDepartment={this.onGroupClose}
/>

View File

@ -395,7 +395,7 @@ class UpdateUserForm extends React.Component {
labelText={`${t("CustomDepartment", { department })}:`}
isDisabled={isLoading}
departments={profile.groups}
addButtonTitle={t("Add")}
addButtonTitle={t("AddButton")}
onAddDepartment={this.onAddGroup}
onRemoveDepartment={this.onGroupClose}
/>

View File

@ -12,7 +12,11 @@
"CancelButton": "Cancel",
"CopyEmailAndPassword": "Copy e-mail & password",
"UserType": "Type",
"AddButton": "Add",
"ContactInformation": "Contact Information",
"AddContact": "Add contact",
"SocialProfiles": "Social Profiles",
"ActivationLink": "Activation link",
"AddPhoto": "Add photo",
"TemporaryPassword": "Temporary password",

View File

@ -66,7 +66,7 @@ class PureStudioLayout extends React.Component {
const getAvailableModules = modules => {
const separator = { seporator: true, id: "nav-seporator-1" };
const separator = { separator: true, id: "nav-separator-1" };
const products =
modules.map(product => {
return {

View File

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

View File

@ -66,7 +66,7 @@ class Layout extends React.Component {
isolateModules.push(item);
} else {
mainModules.push(item);
if (item.seporator) continue;
if (item.separator) continue;
totalNotifications+=item.notifications;
}
}
@ -195,7 +195,7 @@ class Layout extends React.Component {
{
this.state.mainModules.map(item =>
<NavItem
seporator={!!item.seporator}
separator={!!item.separator}
key={item.id}
opened={this.state.isNavOpened}
active={item.id == this.state.currentModuleId}

View File

@ -45,8 +45,8 @@ const currentUserActions = [
const availableModules = [
{
seporator: true,
id: 'nav-seporator-1'
separator: true,
id: 'nav-separator-1'
},
{
id: '11111111-1111-1111-1111-111111111111',
@ -84,8 +84,8 @@ const availableModules = [
onBadgeClick: (e) => action('ProjectsIconBadge Clicked')(e)
},
{
seporator: true,
id: 'nav-seporator-2'
separator: true,
id: 'nav-separator-2'
},
{
id: '55555555-5555-5555-5555-555555555555',

View File

@ -6,7 +6,7 @@ import { Icons } from '../../icons'
const baseColor = '#7A95B0',
activeColor = '#FFFFFF';
const NavItemSeporator = styled.div`
const NavItemSeparator = styled.div`
border-bottom: 1px solid ${baseColor};
margin: 0 16px;
`;
@ -43,12 +43,12 @@ const NavItemBadge = styled(Badge)`
const NavItem = React.memo(props => {
//console.log("NavItem render");
const { seporator, opened, active, iconName, children, badgeNumber, onClick, onBadgeClick } = props;
const { separator, opened, active, iconName, children, badgeNumber, onClick, onBadgeClick } = props;
const color = active ? activeColor : baseColor;
return (
seporator
? <NavItemSeporator/>
separator
? <NavItemSeparator/>
: <NavItemWrapper onClick={onClick}>
{React.createElement(Icons[iconName], {size: "big", isfill: true, color: color})}
{children && <NavItemLabel opened={opened} color={color}>{children}</NavItemLabel>}

View File

@ -1,6 +1,7 @@
import React from 'react'
import styled from 'styled-components'
import PropTypes from 'prop-types'
import isEqual from "lodash/isEqual";
import { tablet } from '../../utils/device';
import InputBlock from '../input-block'
@ -66,16 +67,18 @@ const StyledTooltipItem = styled(Text.Body)`
color: ${props => props.valid ? '#44bb00' : '#B40404'};
`;
class PasswordInput extends React.PureComponent {
class PasswordInput extends React.Component {
constructor(props) {
super(props);
const { inputValue, inputType } = props;
this.state = {
type: props.inputType,
type: inputType,
progressColor: 'transparent',
progressWidth: 0,
inputValue: '',
inputValue: inputValue,
displayTooltip: false,
validLength: false,
validDigits: false,
@ -237,6 +240,10 @@ class PasswordInput extends React.PureComponent {
onCopyToClipboard && onCopyToClipboard(formattedText);
}
shouldComponentUpdate(nextProps,nextState) {
return !isEqual(this.props, nextProps) || !isEqual(this.state, nextState);
}
render() {
//console.log('PasswordInput render()');
const {

View File

@ -1,5 +1,5 @@
import React from 'react';
import { mount } from 'enzyme';
import { mount, shallow } from 'enzyme';
import PasswordInput from '.';
const basePasswordSettings = {
@ -96,4 +96,44 @@ describe('<PasswordInput />', () => {
expect(wrapper.prop('isDisabled')).toEqual(true);
});
it('not re-render test', () => {
const wrapper = shallow(<PasswordInput {...baseProps} />).instance();
const shouldUpdate = wrapper.shouldComponentUpdate(wrapper.props, wrapper.state);
expect(shouldUpdate).toBe(false);
});
it('re-render test', () => {
const wrapper = shallow(<PasswordInput {...baseProps} />).instance();
const shouldUpdate = wrapper.shouldComponentUpdate({
inputName: 'demoPasswordInput',
emailInputName: 'demoEmailInput',
inputValue: '',
clipActionResource: 'Copy e-mail and password',
clipEmailResource: 'E-mail: ',
clipPasswordResource: 'Password: ',
tooltipPasswordTitle: 'Password must contain:',
tooltipPasswordLength: 'from 6 to 30 characters',
tooltipPasswordDigits: 'digits',
tooltipPasswordCapital: 'capital letters',
tooltipPasswordSpecial: 'special characters (!@#$%^&*)',
generatorSpecial: '!@#$%^&*',
passwordSettings: {
minLength: 8,
upperCase: false,
digits: false,
specSymbols: false
},
isDisabled: false,
placeholder: 'password',
onChange: () => jest.fn(),
onValidateInput: () => jest.fn(),
onCopyToClipboard: () => jest.fn()
}, wrapper.state);
expect(shouldUpdate).toBe(true);
});
});