@plusscommunities/pluss-core-web 1.7.3-beta.1 → 1.7.4-beta.0

package/src/components/GenericInput.js

@@ -1,169 +0,0 @@
-import React, { Component } from 'react';
-import _ from 'lodash';
-import Textarea from 'react-textarea-autosize';
-
-class GenericInput extends Component {
-  componentDidUpdate(prevProps, prevState) {
-    if (!_.isUndefined(this.props.autofocus) && this.props.autofocus) {
-      this._input.focus();
-    }
-  }
-
-  getAutoComplete() {
-    if (!_.isUndefined(this.props.autoComplete)) {
-      return this.props.autoComplete ? 'on' : 'off';
-    }
-    return 'off';
-  }
-
-  isValid() {
-    if (!_.isUndefined(this.props.isValid) && typeof this.props.isValid === 'function') {
-      return this.props.isValid();
-    }
-    return this.props.isValid;
-  }
-
-  showError() {
-    return (
-      !_.isUndefined(this.props.showError) &&
-      ((typeof this.props.showError === 'function' && this.props.showError()) ||
-        (typeof this.props.showError === 'boolean' && this.props.showError))
-    );
-  }
-
-  getClassNames() {
-    let string = `${this.props.className} genericInputContainer`;
-    if (!_.isUndefined(this.props.disabled) && this.props.disabled) {
-      string += ' genericInput-disabled';
-    }
-    if (this.props.large) {
-      string += ' genericInput-large';
-    }
-    if (!_.isUndefined(this.props.type) && this.props.type === 'textarea') {
-      string += ' genericInput-textarea';
-    }
-    if (this.isValid()) {
-      return string + ' genericInput-valid';
-    }
-    if (this.showError()) {
-      return string + ' genericInput-error';
-    }
-    return string;
-  }
-
-  getLabelStyle() {
-    const style = {};
-    if (_.isEmpty(this.props.value) && !this.props.alwaysShowLabel) {
-      style.opacity = 0;
-    }
-    return style;
-  }
-
-  renderError() {
-    if (this.showError() && !this.isValid()) {
-      return <div className={'fieldLabel fieldLabel-warning'}>{this.props.errorMessage ? this.props.errorMessage : 'Required'}</div>;
-    }
-    return null;
-  }
-  renderHelp() {
-    if (!_.isEmpty(this.props.help)) {
-      return <div className="genericInput-help">{this.props.help}</div>;
-    }
-    return null;
-  }
-
-  renderInput() {
-    if (!_.isUndefined(this.props.inputComponent)) {
-      return (
-        <div style={{ ...styles.row, alignItems: 'flex-start' }}>
-          {this.props.isRequired && <div className="inputRequired " />}
-          {this.props.inputComponent}
-          {this.props.rightContent}
-        </div>
-      );
-    }
-    if (!_.isUndefined(this.props.type) && this.props.type === 'textarea') {
-      // Render expandable text area
-      return (
-        <div style={{ ...styles.row, alignItems: 'flex-start' }}>
-          {this.props.isRequired && <div className="inputRequired " />}
-          <Textarea
-            id={this.props.id}
-            placeholder={!_.isUndefined(this.props.placeholder) ? this.props.placeholder : this.props.label}
-            type={!_.isUndefined(this.props.type) ? this.props.type : 'text'}
-            className={`genericInput ${this.props.inputClass}`}
-            value={this.props.value || ''}
-            onChange={this.props.onChange}
-            onKeyPress={this.props.onKeyPress || this.props.onEnter}
-            onKeyDown={this.props.onKeyDown}
-            style={{ ...this.props.inputStyle }}
-            readOnly={!_.isUndefined(this.props.readOnly) ? this.props.readOnly : false}
-            disabled={!_.isUndefined(this.props.disabled) ? this.props.disabled : false}
-            autoComplete={this.getAutoComplete()}
-            maxLength={this.props.maxLength}
-            onFocus={this.props.onFocus}
-            onBlur={this.props.onBlur}
-          />
-          {this.props.rightContent}
-        </div>
-      );
-    }
-    // Render default input
-    return (
-      <div style={{ ...styles.row, ...this.props.textWrapperStyle }}>
-        {this.props.isRequired && <div className="inputRequired " />}
-        <input
-          ref={(c) => (this._input = c)}
-          id={this.props.id}
-          placeholder={!_.isUndefined(this.props.placeholder) ? this.props.placeholder : this.props.label}
-          type={!_.isUndefined(this.props.type) ? this.props.type : 'text'}
-          className={`genericInput ${this.props.inputClass}`}
-          value={this.props.value || ''}
-          onChange={this.props.onChange}
-          onClick={this.props.onClick}
-          onKeyPress={this.props.onKeyPress || this.props.onEnter}
-          onKeyDown={this.props.onKeyDown}
-          style={{ ...this.props.inputStyle }}
-          readOnly={!_.isUndefined(this.props.readOnly) ? this.props.readOnly : false}
-          disabled={!_.isUndefined(this.props.disabled) ? this.props.disabled : false}
-          autoComplete={this.getAutoComplete()}
-          autoFocus={!_.isUndefined(this.props.autofocus) ? this.props.autofocus : false}
-          maxLength={this.props.maxLength}
-          onFocus={this.props.onFocus}
-          onBlur={this.props.onBlur}
-        />
-        {this.props.rightContent}
-      </div>
-    );
-  }
-
-  render() {
-    return (
-      <div className={this.getClassNames()} style={{ ...this.props.style }}>
-        <div style={{ ...styles.row, marginBottom: 0, justifyContent: 'space-between' }}>
-          {!_.isUndefined(this.props.label) && (
-            <div className="fieldLabel" style={this.getLabelStyle()}>
-              {this.props.label}
-            </div>
-          )}
-          {this.renderError()}
-        </div>
-        {/* Render either generic input or large text area  */}
-        {this.renderInput()}
-        {/* Render bottom help info */}
-        {this.renderHelp()}
-      </div>
-    );
-  }
-}
-
-const styles = {
-  row: {
-    display: 'flex',
-    flexDirection: 'row',
-    // marginBottom: 8,
-    alignItems: 'center',
-  },
-};
-
-export { GenericInput };

package/src/components/Header.js

@@ -1,82 +0,0 @@
-import React, { Component } from 'react';
-import { withRouter } from 'react-router';
-import { connect } from 'react-redux';
-import { setNavData } from '../actions';
-import { Button } from './Button';
-
-class Header extends Component {
-  getHomeLink() {
-    this.props.history.replace('/');
-  }
-
-  goToHelpGuide = () => {
-    window.open('https://www.plusscommunities.com/user-guide', '_blank');
-  };
-
-  toggleSideMenu = () => {
-    this.props.setNavData({ isSideMenuOpen: !this.props.isSideMenuOpen });
-  };
-
-  renderRight() {
-    if (this.props.rightContent) {
-      return this.props.rightContent;
-    }
-    return (
-      <div className="flex flex-center">
-        <Button buttonType="primary" onClick={this.goToHelpGuide} narrow isActive className="marginRight-16">
-          Help Guide
-        </Button>
-        <div className="sideMenuButtonContainer"></div>
-      </div>
-    );
-  }
-
-  renderHeader() {
-    return (
-      <div className="header">
-        <div id="leftContainer" style={{ display: 'inline-block' }}>
-          {this.props.children && (
-            <div style={{ display: 'flex', height: '100%', alignItems: 'center', marginLeft: 16 }}>{this.props.children}</div>
-          )}
-        </div>
-        {this.renderRight()}
-      </div>
-    );
-  }
-
-  renderSimpleHeader() {
-    return (
-      <div className={`header header-simple ${this.props.fixed ? 'header-fixed' : ''}`}>
-        <div className="container1200 flex flex-center">
-          <img
-            className="header_logo"
-            src="https://pluss-prd-media.s3-ap-southeast-2.amazonaws.com/assets/plusscommunities-new.svg"
-            alt="logo"
-          />
-        </div>
-      </div>
-    );
-  }
-
-  renderContainerHeader() {
-    return <div className={`header header-simple ${this.props.fixed ? 'header-fixed' : ''}`}>{this.props.children}</div>;
-  }
-
-  render() {
-    if (this.props.simple) {
-      return this.renderSimpleHeader();
-    }
-    if (this.props.onlyContainer) {
-      return this.renderContainerHeader();
-    }
-    return this.renderHeader();
-  }
-}
-
-const mapStateToProps = (state) => {
-  return { auth: state.auth, isSideMenuOpen: state.nav.isSideMenuOpen };
-};
-
-let exportObj = connect(mapStateToProps, { setNavData })(withRouter(Header));
-
-export { exportObj as Header };

package/src/components/HubSidebar.js

@@ -1,134 +0,0 @@
-import React, { PureComponent } from 'react';
-import _ from 'lodash';
-import { connect } from 'react-redux';
-import { setNavData } from '../actions';
-import { SideNavItem } from './SideNavItem';
-import { Button } from './Button';
-import { Text } from './Text';
-
-class HubSidebar extends PureComponent {
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      showSidebar: false,
-    };
-  }
-
-  componentDidMount() {
-    this.props.setNavData({
-      condensedSidebar: true,
-    });
-    setTimeout(() => {
-      this.setState({
-        showSidebar: true,
-      });
-    }, 50);
-  }
-
-  componentWillUnmount() {
-    this.props.setNavData({
-      condensedSidebar: false,
-    });
-    this.setState({
-      showSidebar: false,
-    });
-  }
-
-  renderButton(item, index) {
-    return (
-      <div key={`button_${index}`} className="hubSidebar_newButtonContainer">
-        <Button buttonType={item.buttonType || 'primary'} isActive leftIcon={item.icon} narrow onClick={item.onClick}>
-          {item.text}
-        </Button>
-      </div>
-    );
-  }
-
-  renderNewButton(item, index) {
-    return this.renderButton({ ...item, icon: 'plus' }, index);
-  }
-
-  renderNavItem(item, index) {
-    return (
-      <SideNavItem
-        Text={item.text}
-        Icon={item.icon}
-        Link={item.url}
-        isFontAwesome={item.isFontAwesome}
-        isSVG={item.isSVG}
-        key={`navitem_${index}`}
-        selected={item.selected}
-        onClick={item.onClick}
-      />
-    );
-  }
-
-  renderSection(section, index) {
-    return (
-      <div className="hubSidebar_section" key={`section_${index}`}>
-        <Text type="h3" className="hubSidebar_sectionTitle">
-          {section.title}
-        </Text>
-        {section.items.map((item, itemIndex) => {
-          switch (item.type) {
-            case 'button':
-              return this.renderButton(item, itemIndex);
-            case 'newButton':
-              return this.renderNewButton(item, itemIndex);
-            case 'navItem':
-              return this.renderNavItem(item, itemIndex);
-            default:
-              return null;
-          }
-        })}
-      </div>
-    );
-  }
-
-  renderHelpGuide = () => {
-    if (!this.props.helpGuide) return null
-
-    const { text, url } = this.props.helpGuide
-
-    const onHelpGuidePress = () => {
-      if (!url) return
-      window.open(url, '_blank')
-    }
-    return (
-      <div className="hubSidebar_helpGuideContainer">
-        <Button buttonType="outlined" isActive leftIcon="info-circle" narrow onClick={onHelpGuidePress}>
-          {text || 'Help Guide'}
-        </Button>
-      </div>
-    )
-  }
-
-  render() {
-    return (
-      <div
-        className={`hubSidebar${this.state.showSidebar ? ' hubSidebar-show' : ''} ${this.props.className ? this.props.className : ''}`}
-        style={this.props.style}
-      >
-        {/* Top Add Button */}
-        <div className="hubSidebar_content">
-          {/* Title */}
-          {this.props.sections.map((section, i) => {
-            return this.renderSection(section, i);
-          })}
-        </div>
-
-        {/* Help Guide Button. */}
-        {this.renderHelpGuide()}
-      </div>
-    );
-  }
-}
-
-const mapStateToProps = (state) => {
-  return { auth: state.auth, isSideMenuOpen: state.nav.isSideMenuOpen };
-};
-
-let exportObj = connect(mapStateToProps, { setNavData })(HubSidebar);
-
-export { exportObj as HubSidebar };