# All files / composer/components PinterestComposerBar.jsx

0% Statements 0/9
0% Branches 0/7
0% Functions 0/5
0% Lines 0/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82

     import React from 'react';
    import PropTypes from 'prop-types';
    import SourceUrl from '../components/SourceUrl';
    import PinterestSelectedBoards from '../components/PinterestSelectedBoards';
    import BoardSelector from '../components/BoardSelector';
    import Dropdown, { DropdownTrigger, DropdownContent } from '../components/Dropdown';
    import styles from './css/PinterestComposerBar.css';

    class PinterestComposerBar extends React.Component {
      static propTypes = {
        draftId: PropTypes.string.isRequired,
        shouldShowInlineSubprofileDropdown: PropTypes.bool.isRequired,
        visibleNotifications: PropTypes.array.isRequired,
        sourceUrl: PropTypes.string,
        profiles: PropTypes.array,
      };

      static defaultProps = {
        sourceUrl: null,
      };

      state = {
        isInlineSubprofileDropdownExpanded: false,
      };

      onInlineSubprofileDropdownExpanded = () => {
        this.setState({ isInlineSubprofileDropdownExpanded: true });
      };

      onInlineSubprofileDropdownCollapsed = () => {
        this.setState({ isInlineSubprofileDropdownExpanded: false });
      };

      onBoardSelectorChange = () => {
        this.setState({ isInlineSubprofileDropdownExpanded: false });
      };

      render() {
        const {
          profiles, draftId, sourceUrl,
          shouldShowInlineSubprofileDropdown,
          visibleNotifications,
        } = this.props;

        const selectedPinterestProfiles =
          profiles.filter((profile) => profile.isSelected && profile.service.name === 'pinterest');
        const uniqueSelectedProfile =
          selectedPinterestProfiles.length === 1 ? selectedPinterestProfiles[0] : null;
        const hasUniqueSelectedProfile = uniqueSelectedProfile !== null;

        return (
          <div className={styles.pinterestComposerBar}>
            <PinterestSelectedBoards profiles={profiles} />

            {shouldShowInlineSubprofileDropdown && hasUniqueSelectedProfile &&
              <Dropdown
                isDropdownExpanded={this.state.isInlineSubprofileDropdownExpanded}
                onShow={this.onInlineSubprofileDropdownExpanded}
                onHide={this.onInlineSubprofileDropdownCollapsed}
                className={styles.inlineSubprofileDropdown}
              >
                <DropdownTrigger className={styles.tertiaryButton}>Change</DropdownTrigger>
                <DropdownContent className={styles.inlineSubprofileDropdownContent}>
                  <BoardSelector
                    profile={uniqueSelectedProfile}
                    subprofiles={uniqueSelectedProfile.subprofiles}
                    subprofilesCount={uniqueSelectedProfile.subprofiles.length}
                    visibleNotifications={visibleNotifications}
                    canUnselectSubprofiles={false}
                    onChange={this.onBoardSelectorChange}
                  />
                </DropdownContent>
              </Dropdown>}

            <SourceUrl sourceUrl={sourceUrl} draftId={draftId} />
          </div>
        );
      }
    }

    export default PinterestComposerBar;