{"version":3,"sources":["containers/CustomerPage/LicenseHistory/Subscription/index.js","styles/svg-components/Calendar.js","components/DateFilter/index.js","containers/CustomerPage/LicenseHistory/licenseTab.js"],"names":["Subscription","props","handleAddModal","modalType","track","onAddModal","$","addClass","location","page","query","state","isLoading","isLoggedin","pagination","isEmpty","emptyMessage","data","startDate","endDate","getFetchData","bind","onPageSelect","handleSelectedDate","this","drip","nextProps","setState","event","router","push","currentTarget","dataset","onFetchSubscriptionList","Promise","resolve","reject","then","response","success","subscriptionUsageLog","empty_msg","error","code","message","catch","console","log","selectedDate","prevState","subscriptionContent","className","colSpan","map","index","expiredLink","isSubscriptionLicense","download","_label","license_document","date_created","height","width","src","getImgixUrl","artist","artist_image","alt","name","href","trackUrl","target","plan_name","orderType","autoclear","onClick","DOWNLOAD_URL","_link","_labe","license_again","to","value","pageCount","url","onChange","callAction","active","Component","defaultProps","connect","dispatch","values","fetchLicenseSubscriptionList","modal","intent","addModal","Calendar","React","formatDate","date","year","getFullYear","toString","month","getMonth","substring","day","getDate","CustomDateInput","type","placeholder","DateFilter","inValidated","isClear","handleStartDate","handleEndDate","handleSubmit","handleClear","start_date","end_date","isMobile","htmlFor","selected","selectsStart","dateFormat","customInput","id","selectsEnd","minDate","style","position","disabled","Spinner","LicenseTab","classname"],"mappings":"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","file":"static/js/48.chunk.js?hash=7c74dce6","sourcesContent":["/* eslint-disable no-underscore-dangle */\nimport classname from \"classnames\";\nimport React, { Component, Fragment } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { connect } from \"react-redux\";\nimport { Link } from \"react-router\";\nimport Pagination from \"components/Pagination\";\nimport DateFilter from \"components/DateFilter\";\nimport { drip } from \"utils/drip\";\nimport LicenseTab from \"../licenseTab\";\nimport LicenseInfo from \"../../LicenseInfo\";\nimport { DOWNLOAD_URL } from \"../../../../constants\";\nimport { fetchLicenseSubscriptionList } from \"actions/licenseHistoryAction\";\nimport Spinner from \"styles/svg-components/Spinner.js\";\nimport $ from 'jquery';\nimport { addModal } from 'actions/authenticationAction';\nimport {getImgixUrl} from \"../../../../utils/helpers\";\n\n\nclass Subscription extends Component {\n  constructor(props) {\n    super(props);\n    const { location } = props;\n    let page = 1;\n    if (location.query.page) {\n      page = location.query.page;\n    }\n    this.state = {\n      isLoading: true,\n      isLoggedin: false,\n      pagination: {},\n      isEmpty: false,\n      emptyMessage: \"\",\n      data: [],\n      page,\n      startDate: null,\n      endDate: null,\n    };\n    this.getFetchData = this.getFetchData.bind(this);\n    this.onPageSelect = this.onPageSelect.bind(this);\n    this.handleSelectedDate = this.handleSelectedDate.bind(this);\n  }\n\n  componentDidMount() {\n    const { page } = this.state;\n    this.getFetchData({ page });\n    drip(\"Viewed Subscription License History\");\n  }\n\n  componentWillReceiveProps(nextProps) {\n    let page = 1;\n    if (nextProps.location.query.page) {\n      page = nextProps.location.query.page;\n    }\n    if (page !== this.state.page) {\n      this.setState({ page });\n      this.getFetchData({ page });\n    }\n  }\n\n  onPageSelect(event) {\n    this.props.router.push(\n      `/customer/license-history/subscription?page=${event.currentTarget.dataset.page}`\n    );\n  }\n\n  getFetchData(data) {\n    const { router, onFetchSubscriptionList } = this.props;\n    this.setState({ isLoading: true });\n    return new Promise((resolve, reject) => {\n      onFetchSubscriptionList(data)\n        .then((response) => {\n          if (response.success) {\n            if (!response.subscriptionUsageLog.empty_msg) {\n              this.setState({\n                isLoading: false,\n                emptyMessage: \"\",\n                isEmpty: false,\n                isLoggedin: true,\n                pagination: response.pagination,\n                data: response.subscriptionUsageLog,\n              });\n            } else {\n              this.setState({\n                isLoading: false,\n                isEmpty: true,\n                isLoggedin: true,\n                emptyMessage: response.subscriptionUsageLog.empty_msg,\n              });\n            }\n            resolve();\n          } else {\n            if (\n              response.error.code === 0 &&\n              response.error.message === \"No user found\"\n            ) {\n              router.push(\"/signin/customer-license-history-subscription\");\n              this.setState({\n                isLoading: false,\n                isEmpty: true,\n                isLoggedin: false,\n              });\n              return false;\n            }\n            this.setState({ isLoading: false });\n            reject();\n          }\n        })\n        .catch((error) => {\n          console.log(error);\n          this.setState({ isLoading: false });\n        });\n    });\n  }\n\n  handleSelectedDate(selectedDate) {\n    this.setState((prevState) => ({\n      ...prevState,\n      ...selectedDate,\n    }));\n  }\n\n  handleAddModal = (modalType = '', track = {}) => {\n    this.props.onAddModal(modalType, track);\n    $('body').addClass('modal-overlay-active');\n  }\n\n  render() {\n    const {\n      isLoading,\n      isLoggedin,\n      pagination,\n      data,\n      isEmpty,\n      startDate,\n      endDate,\n      emptyMessage,\n    } = this.state;\n    let subscriptionContent;\n    if (!isLoading) {\n      if (isLoggedin) {\n        subscriptionContent = (\n          <Fragment>\n            <div className=\"table-responsive spacer d-none d-md-block\">\n              <table className=\"table payperuse-page-table\">\n                <thead>\n                  <tr>\n                    <th className=\"order-detail-row-title\">Date</th>\n                    <th>Track</th>\n                    <th>License Type</th>\n                    <th></th>\n                    {/* <th></th> */}\n                    {/* <th></th> */}\n                  </tr>\n                </thead>\n                <tbody>\n                  {isEmpty && (\n                    <tr>\n                      <td colSpan=\"6\" className=\"text-center\">\n                        {emptyMessage}\n                      </td>\n                    </tr>\n                  )}\n                  {!isEmpty &&\n                    data.map((track, index) => {\n                      let expiredLink = false;\n                      let expiredUsageLink = false;\n\n                      track.isSubscriptionLicense = true;\n\n                      if (track.download) {\n                        if (track.download._label === \"Download Expired\" ||\n                          track.download._label === \"Usage Invalidated\") {\n                          expiredLink = true;\n                        }\n                        if (track.license_document._label === \"Usage Invalidated\") {\n                          expiredUsageLink = true;\n                        }\n                      }\n\n                      return (\n                        <tr key={index}>\n                          <td>\n                            <div className=\"order-detail-row\">\n                              <span className=\"created-date\">{track.date_created}</span>\n                            </div>\n                          </td>\n                          <td className=\"license-history-track\">\n                            <img\n                              className=\"spacer-r-sm\"\n                              height=\"50\"\n                              width=\"50\"\n                              src={getImgixUrl(track.artist.artist_image, 100)}\n                              alt={track.artist.name}\n                            />\n                            <Link\n                              className=\"track-title\"\n                              href={track.trackUrl}\n                              target=\"_blank\"\n                            >\n                              {track.name}\n                            </Link>\n                          </td>\n                          <td>\n                            <span className=\"license-type\">{track.plan_name}</span>\n                            <br />\n                            <span className=\"license-type\">{track.orderType}</span>\n                          </td>\n                          <td className=\"icon-section\">\n                            {track.autoclear &&\n                              <a\n                                // href={\"#\"}\n                                className=\"checkout-purchase-license-btn ic-autoclear cursor-pointer\"\n                              >\n                                <img onClick={() => this.handleAddModal('autoClear', track)} src={\"https://cdn.musicvine.com/images/ic_autosavecode.svg\"} alt={track.autoclear._label} />\n                                <div className=\"player-tooltip\"><span>{track.autoclear._label}</span></div>\n                              </a>\n                            }\n\n                            {track.download &&\n                              <Fragment>\n                                { !expiredLink &&\n                                <a\n                                  href={`${DOWNLOAD_URL}${track.download._link}`}\n                                  className={`checkout-purchase-license-btn ic-download`}\n                                >\n                                  <img\n                                    src={\"https://cdn.musicvine.com/images/ic_download.svg\"}\n                                    alt={track.download._label}\n                                  />\n                                  <div className=\"player-tooltip\"><span>{track.download._label}</span></div>\n                                </a>\n                                }\n                                { expiredLink &&\n                                <span\n                                  className={`checkout-purchase-license-btn ic-download-expire`}\n                                >\n                                      <img\n                                        src={\"https://cdn.uppbeat.io/images/lh_download-expired.svg\"}\n                                        alt={track.download._label}\n                                      />\n                                      <div className=\"player-tooltip\"><span>{track.download._label}</span></div>\n                                    </span>\n                                }\n                              </Fragment>\n                            }\n\n                            {track.license_document &&\n                              <a\n                                className=\"checkout-purchase-license-btn ic-license\"\n                                href={`${track.license_document._link}`}\n                                target=\"_blank\"\n                              >\n                                <img src={\"https://cdn.musicvine.com/images/ic_license.svg\"} alt={track.license_document._labe} />\n                                <div className=\"player-tooltip\"><span>{track.license_document._label}</span></div>\n                              </a>\n                            }\n\n                            {track.license_again &&\n                              <Fragment>\n                                <span className=\"icon-separator\"></span>\n                                <Link\n                                  className=\"checkout-purchase-license-btn ic-license\"\n                                  to={`${track.license_again._link}`}\n                                >\n                                  <img src={\"https://cdn.uppbeat.io/images/lh_license-again.svg\"} alt={track.license_again._label} />\n                                  <div className=\"player-tooltip right-align\"><span>{track.license_again._label}</span></div>\n                                </Link>\n                              </Fragment>\n                            }\n                          </td>\n                        </tr>\n                      );\n                    })}\n                </tbody>\n              </table>\n            </div>\n            <div className=\"license-history-mobile-list d-md-none\">\n              {isEmpty && (\n                <div className=\"row py-4 order-border-top\">\n                  <div className=\"col-12\">\n                    <div className=\"text-center mb-4\">\n                      <p>{emptyMessage}</p>\n                    </div>\n                  </div>\n                </div>\n              )}\n              {!isEmpty &&\n                data.map((value, index) => (\n\n                  <div className=\"main-mobile-content\" key={index}>\n                    <div className=\"detail-section\">\n                      <span className=\"created-date\">{value.date_created}</span>\n                    </div>\n\n                    <div className=\"profile-section\">\n                      <div className=\"single-profile-section flex-grow-1\">\n                        <img\n                          className=\"spacer-r\"\n                          height=\"50\"\n                          width=\"50\"\n                          src={value.artist.artist_image}\n                          alt={value.artist.name}\n                        />\n\n                        <div className={\"flex-grow-1\"}>\n                          <p>\n                            <Link\n                              className=\"track-title\"\n                              href={value.trackUrl}\n                              target=\"_blank\"\n                            >\n                              {value.name}\n                            </Link>\n                          </p>\n                          <p className=\"license-type\">{value.plan_name}</p>\n                          <p className=\"license-type\">{value.orderType}</p>\n                        </div>\n\n                        <img\n                          className=\"see-more-icon\"\n                          src={\"https://cdn.uppbeat.io/images/lh_more.svg\"}\n                          alt=\"more\"\n                          onClick={() => this.handleAddModal('seeMoreLicenseOption', value)}\n                        />\n                      </div>\n                    </div>\n                  </div>\n\n                ))}\n            </div>\n            {pagination && pagination.pageCount > 1 && (\n              <Pagination\n                url={\"/customer/license-history/subscription\"}\n                pagination={pagination}\n                onPageSelect={this.onPageSelect}\n              />\n            )}\n          </Fragment>\n        );\n      } else {\n        subscriptionContent = (\n          <div className=\"account-error-message\">\n            <h2>Access denied</h2>\n          </div>\n        );\n      }\n    } else {\n      subscriptionContent = (\n        <div className=\"music-loading-message music-loading-message--light\">\n          <div className=\"music-loader-message-container\">\n            <h3 className=\"music-loading-message-title\">Loading...</h3>\n            <div className=\"circle-loader\">\n              <div className=\"bounce1\"></div>\n              <div className=\"bounce2\"></div>\n              <div className=\"bounce3\"></div>\n            </div>\n          </div>\n        </div>\n      );\n    }\n    return (\n      <Fragment>\n        <LicenseInfo>\n          <section className=\"subscription license-history-section\">\n            <div className=\"content-container content-max-width-sm\">\n              {isLoggedin && (\n                <div className=\"filter-container d-xs-block\">\n                  <DateFilter\n                    startDate={startDate}\n                    endDate={endDate}\n                    onChange={this.handleSelectedDate}\n                    callAction={this.getFetchData}\n                  />\n                  <LicenseTab active=\"subscription\" />\n                </div>\n              )}\n              {subscriptionContent}\n            </div>\n          </section>\n        </LicenseInfo>\n      </Fragment>\n    );\n  }\n}\n\nSubscription.propTypes = {\n  location: PropTypes.instanceOf(Object),\n  onFetchSubscriptionList: PropTypes.func,\n};\n\nSubscription.defaultProps = {\n  location: {},\n  onFetchSubscriptionList: () => { },\n};\n\nconst mapDispatchToProps = (dispatch) => ({\n  onFetchSubscriptionList: (values) =>\n    dispatch(fetchLicenseSubscriptionList(values)),\n  onAddModal: (modal, intent) => dispatch(addModal(modal, intent)),\n});\n\nexport default connect(null, mapDispatchToProps)(Subscription);\n","import React from 'react';\nimport InlineSVG from 'svg-inline-react';\n\nclass Calendar extends React.Component {\n  render() {\n    const calendar = `<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n    width=\"36.447px\" height=\"36.447px\" viewBox=\"0 0 36.447 36.447\" style=\"enable-background:new 0 0 36.447 36.447;\"\n    xml:space=\"preserve\">\n        <g>\n            <g>\n                <path d=\"M30.224,3.948h-1.098V2.75c0-1.517-1.197-2.75-2.67-2.75c-1.474,0-2.67,1.233-2.67,2.75v1.197h-2.74V2.75\n                    c0-1.517-1.197-2.75-2.67-2.75c-1.473,0-2.67,1.233-2.67,2.75v1.197h-2.74V2.75c0-1.517-1.197-2.75-2.67-2.75\n                    c-1.473,0-2.67,1.233-2.67,2.75v1.197H6.224c-2.343,0-4.25,1.907-4.25,4.25v24c0,2.343,1.907,4.25,4.25,4.25h24\n                    c2.344,0,4.25-1.907,4.25-4.25v-24C34.474,5.855,32.567,3.948,30.224,3.948z M25.286,2.75c0-0.689,0.525-1.25,1.17-1.25\n                    c0.646,0,1.17,0.561,1.17,1.25v4.896c0,0.689-0.524,1.25-1.17,1.25c-0.645,0-1.17-0.561-1.17-1.25V2.75z M17.206,2.75\n                    c0-0.689,0.525-1.25,1.17-1.25s1.17,0.561,1.17,1.25v4.896c0,0.689-0.525,1.25-1.17,1.25s-1.17-0.561-1.17-1.25V2.75z M9.125,2.75\n                    c0-0.689,0.525-1.25,1.17-1.25s1.17,0.561,1.17,1.25v4.896c0,0.689-0.525,1.25-1.17,1.25s-1.17-0.561-1.17-1.25V2.75z\n                        M31.974,32.198c0,0.965-0.785,1.75-1.75,1.75h-24c-0.965,0-1.75-0.785-1.75-1.75v-22h27.5V32.198z\"/>\n                <rect x=\"6.724\" y=\"14.626\" width=\"4.595\" height=\"4.089\"/>\n                <rect x=\"12.857\" y=\"14.626\" width=\"4.596\" height=\"4.089\"/>\n                <rect x=\"18.995\" y=\"14.626\" width=\"4.595\" height=\"4.089\"/>\n                <rect x=\"25.128\" y=\"14.626\" width=\"4.596\" height=\"4.089\"/>\n                <rect x=\"6.724\" y=\"20.084\" width=\"4.595\" height=\"4.086\"/>\n                <rect x=\"12.857\" y=\"20.084\" width=\"4.596\" height=\"4.086\"/>\n                <rect x=\"18.995\" y=\"20.084\" width=\"4.595\" height=\"4.086\"/>\n                <rect x=\"25.128\" y=\"20.084\" width=\"4.596\" height=\"4.086\"/>\n                <rect x=\"6.724\" y=\"25.54\" width=\"4.595\" height=\"4.086\"/>\n                <rect x=\"12.857\" y=\"25.54\" width=\"4.596\" height=\"4.086\"/>\n                <rect x=\"18.995\" y=\"25.54\" width=\"4.595\" height=\"4.086\"/>\n                <rect x=\"25.128\" y=\"25.54\" width=\"4.596\" height=\"4.086\"/>\n            </g>\n        </g>\n    </svg>`;\n    return <InlineSVG src={calendar} />;\n  }\n}\n\nexport default Calendar;\n","import React, { Component, Fragment } from 'react';\nimport PropTypes from 'prop-types';\nimport CalendarIcon from 'styles/svg-components/Calendar.js';\nimport DatePicker from 'react-datepicker';\nimport 'react-datepicker/dist/react-datepicker.css';\nimport Spinner from 'styles/svg-components/Spinner.js';\n\nfunction formatDate(date) {\n  const year = date.getFullYear().toString();\n  const month = (date.getMonth() + 101).toString().substring(1);\n  const day = (date.getDate() + 100).toString().substring(1);\n  return `${day}-${month}-${year}`;\n}\n\nconst CustomDateInput = ({ value, onClick }) => (\n  <Fragment>\n    <input\n      type=\"text\"\n      className=\"form-control\"\n      onClick={onClick}\n      value={value}\n      placeholder=\"DD-MM-YYYY\"\n    />\n    <span className=\"input-group-addon\" onClick={onClick}>\n      <div className=\"svg-container\">\n        <CalendarIcon />\n      </div>\n    </span>\n  </Fragment>\n);\n\nclass DateFilter extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      isLoading: false,\n      inValidated: false,\n      isClear: (props.startDate && props.endDate && true) || false,\n      startDate: props.startDate,\n      endDate: props.endDate,\n    };\n    this.handleStartDate = this.handleStartDate.bind(this);\n    this.handleEndDate = this.handleEndDate.bind(this);\n    this.handleSubmit = this.handleSubmit.bind(this);\n    this.handleClear = this.handleClear.bind(this);\n  }\n\n  handleStartDate(startDate) {\n    this.setState({ startDate });\n  }\n\n  handleEndDate(endDate) {\n    this.setState({ endDate });\n  }\n\n  handleSubmit() {\n    const { callAction, onChange } = this.props;\n    const { startDate, endDate } = this.state;\n    if (startDate && endDate) {\n      this.setState({ isLoading: true, inValidated: false, isClear: true });\n      onChange({ startDate, endDate });\n      callAction({\n        page: 1,\n        start_date: formatDate(startDate),\n        end_date: formatDate(endDate),\n      })\n        .then(() => {\n          this.setState({ isLoading: false });\n        })\n        .catch(() => {\n          this.setState({ isLoading: false });\n        });\n    } else {\n      this.setState({ inValidated: true });\n    }\n  }\n\n  handleClear() {\n    const { callAction, onChange } = this.props;\n    this.setState({ startDate: null, endDate: null, isClear: false });\n    onChange({ startDate: null, endDate: null });\n    callAction({ page: 1 })\n      .then(() => {\n        this.setState({ isLoading: false, isClear: false });\n      })\n      .catch(() => {\n        this.setState({ isLoading: false, isClear: false });\n      });\n  }\n\n  render() {\n    const { startDate, endDate, inValidated, isClear, isLoading, isMobile } = this.state;\n    return (\n      <div className=\"date-filter-contianer\">\n        <div className=\"form-inline\">\n          <div className=\"form-group spacer-r input-group date\">\n            <label\n              className=\"spacer-r-sm\"\n              htmlFor=\"customer_license_history_filter_start_date\"\n            >\n              From:\n            </label>\n            <div>\n              <DatePicker\n                selected={startDate}\n                selectsStart\n                startDate={startDate}\n                endDate={endDate}\n                dateFormat=\"dd-MM-yyyy\"\n                onChange={this.handleStartDate}\n                customInput={<CustomDateInput />}\n              />\n              {!startDate && inValidated && (\n                <p className=\"validate-status validate-invalid\">Required</p>\n              )}\n            </div>\n          </div>\n          <div\n            className=\"form-group spacer-r input-group date\"\n            id=\"datetimepickerTo\"\n          >\n            <label\n              className=\"spacer-r-sm\"\n              htmlFor=\"customer_license_history_filter_end_date\"\n            >\n              To:\n            </label>\n            <div>\n              <DatePicker\n                selected={endDate}\n                selectsEnd\n                startDate={startDate}\n                endDate={endDate}\n                minDate={startDate}\n                dateFormat=\"dd-MM-yyyy\"\n                onChange={this.handleEndDate}\n                customInput={<CustomDateInput />}\n              />\n              {!endDate && inValidated && (\n                <p className=\"validate-status validate-invalid\">Required</p>\n              )}\n            </div>\n          </div>\n        </div>\n        <div className=\"filter-submit-container\">\n          <div style={{ position: 'relative' }}>\n            <button\n              className=\"btn btn-primary filter-apply-btn\"\n              disabled={isLoading}\n              onClick={this.handleSubmit}\n            >\n              Apply\n            </button>\n            {isLoading && (\n              <div className=\"text-center\">\n                <div className=\"js-spinner-login spacer-b js-spinner\">\n                  <Spinner />\n                </div>\n              </div>\n            )}\n          </div>\n          {isClear &&\n            <div>\n              <button\n                className=\"btn btn-danger filter-apply-btn\"\n                disabled={isLoading}\n                onClick={this.handleClear}\n              >\n                Clear\n              </button>\n            </div>\n          }\n        </div>\n      </div>\n    );\n  }\n}\n\nDateFilter.propTypes = {\n  callAction: PropTypes.func,\n  onChange: PropTypes.func,\n  isMobile: PropTypes.bool,\n};\n\nDateFilter.defaultProps = {\n  callAction: () => {},\n  onChange: () => {},\n  isMobile: false,\n};\n\nexport default DateFilter;\n","import classname from 'classnames';\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { Link } from 'react-router';\n\nconst LicenseTab = ({ active }) => (\n  <div className=\"tab-filter-container\">\n    <Link\n      name=\"licenses\"\n      to=\"/customer/license-history/subscription\"\n      className={classname('btn status-filter-btn', {\n        'btn-success': active === 'subscription',\n        'btn-default': active !== 'subscription',\n      })}\n    >\n        Subscription\n      </Link>\n    <Link\n      name=\"subscriptionLicenses\"\n      to=\"/customer/license-history/pay-per-use\"\n      className={classname('btn status-filter-btn', {\n        'btn-success': active === 'pay-per-use',\n        'btn-default': active !== 'pay-per-use',\n      })}\n    >\n        Pay Per Use\n      </Link>\n  </div>\n  );\n\nLicenseTab.propTypes = {\n  active: PropTypes.string,\n};\n\nLicenseTab.defaultProps = {\n  active: 'subscription',\n};\n\nexport default LicenseTab;\n"],"sourceRoot":""}