\n \n {props.children}\n \n
\n \n \n {\n child.props.titleKey && child.props.title ? (\n
\n \n )\n if (activeTab === index) {\n tabContent.push(child);\n }\n }\n });\n\n\n return (\n \n \n {props.children}\n \n
\n \n this.keyboardEvent(e, index)}\n tabIndex={active ? 0 : -1}\n >\n
\n )\n\n });\n\n let navGrpStyle = {\n width: this.props.width,\n backgroundColor: this.props.color,\n overflow: 'hidden',\n }\n\n let settings = {\n dots : false,\n arrows : this.pagination,\n infinite : false,\n speed : 250,\n swipeToSlide : true,\n touchMove : true,\n variableWidth: true,\n draggable : this.pagination,\n }\n\n if (!this.pagination) {\n // settings.slickGoTo = 0;\n if (this.refs.scrollNav && this.refs.scrollNav.slickGoTo) {\n this.refs.scrollNav.slickGoTo(0);\n }\n }\n\n return (\n \n \n {title.title}\n \n
\n \n \n {title.title === 'Book Evolution' ? this.props.issuerName : statusText || }\n\n
\n \n {!noEvents ? title.details || : }\n
\n\n \n {icon.eventIcon &&
\n \n \n
\n }\n nextArrow={\n \n
\n }\n >\n {\n buttons.filter(btn => btn)\n }\n \n \n );\n\n }\n\n}\n\nScrollingNav.propTypes = {\n\t/**\n\t * string `title` : Button Label\n\t *\n\t * string `status` : Button Subtext\n\t */\n titles: PropTypes.arrayOf(PropTypes.object),\n width: PropTypes.string,\n color: PropTypes.string,\n issuerName: PropTypes.string,\n};\nScrollingNav.defaultProps = {\n titles: [{}],\n width: \"100%\",\n color: \"#fff\",\n};\n\nexport default withLanguage(ScrollingNav);\n","/* eslint-disable */\nimport React from 'react';\nimport { ResponsiveContainer, ComposedChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, Text } from 'recharts';\nimport ColorChip from '../ColorChip/ColorChip';\nimport PropTypes from 'prop-types';\nimport { NiceScale } from '../../utils/niceScale';\nimport * as ValueFormatters from '../../utils/valueFormatters';\nimport { colors, extendedColors } from '../../utils/visualisationColors';\n\nconst selectPalette = extended => extended ? extendedColors : colors;\n\nconst DefaultBar = (props) => {\n const { fill, x, y, width, height } = props;\n\n return (\n \n {title && ({title})}\n
\n );\n}\n\nconst topBarLegend = (index, height, marginTop, engagementModule, props) => {\n const { x, payload, width } = props;\n\n if (index === 0) {\n const xCoord = x - (width / 2);\n\n let iconFont = payload.name === 'plane' ? 'Glyphter' : 'icomoon'\n\n\n return (\n - \n {\n [...payload].reverse().map((entry, index) => {\n return (\n
\n \n \n \n {slices()}\n \n \n \n
\n );\n};\n\nexport default DonutChart;\n\nDonutChart.defaultProps = {\n animate: false,\n wideColorPalette: true,\n};\n","export const isIE = content => `\n @media all and (-ms-high-contrast: none), (-ms-hight-contrast: active) {\n ${/* IE 10/11 */''}\n ${content}\n }\n\n @supports (-ms-accelerator: true) {\n ${/* Edge 12- 15 */''}\n ${content}\n }\n @supports (-ms-ime-align: auto) {\n ${/* Edge 16+ */''}\n ${content}\n }\n`;\n\nexport const isChromeOrSafari = content => `\n @supports (-webkit-appearance-) {\n ${content}\n }\n`;","import React, { Fragment, Component } from 'react'\nimport styled from 'styled-components';\n\nimport { isIE } from 'shared/styles/mixins/browser';\n\nconst StyledLabel = styled.label`\n display: inline-block;\n cursor: pointer;\n position: relative;\n padding-left: 2rem;\n line-height: 2.4rem;\n font-size: 1rem;\n font-family: \"Univers Next for HSBC Regular\",sans-serif;\n font-weight: 500;\n color: #333;\n outline: none;\n &:before {\n content: \"\";\n display: inline-block;\n width: 1.4rem;\n height: 1.4rem;\n position: absolute;\n left: 0;\n bottom: .5rem;\n border: 1px solid #929292;\n margin-right: 1rem;\n }\n`\n\nconst StyledInput = styled.input`\n display: none;\n &:checked+label:before {\n content: \"\\f00a\";\n font-family: 'HSBC Icons';\n font-size: 1.4rem;\n line-height: 1.4rem;\n color: #008580;\n text-align: center;\n\n ${\n isIE(`\n line-height: 1.1;\n `)\n }\n }\n`;\n\nclass Checkbox extends Component {\n\n onClick = () => {\n if(this.props.disabled !== false) {\n this.props.onCheckedChange && this.props.onCheckedChange(!this.props.checked);\n }\n }\n\n render() {\n return (\n \n\t\t\t\t\t\t{title.status}\n\t\t\t\t\t
\n\t\t\t\t\n\t\t\t)\n\t\t});\n\n\t\tlet btnGrpStyle = {\n\t\t\twidth: this.props.width,\n\t\t\tbackgroundColor: this.props.color,\n\n\t\t}\n\n\n\t\treturn (\n\t\t\t\n\t\t\t\t\t{buttons}\n\t\t\t
\n\t\t);\n\t}\n\n}\n\nHsbcButtonGroup.propTypes = {\n\t/**\n\t * string `title` : Button Label\n\t *\n\t * string `status` : Button Subtext (Tranche nav)\n\t */\n\ttitles: PropTypes.arrayOf(PropTypes.object),\n\twidth: PropTypes.string,\n\tcolor: PropTypes.string,\n\t/**\n\t * Bool value to disable tranche nav horizontal scroll\n\t */\n\tdisablePagination: PropTypes.bool\n};\nHsbcButtonGroup.defaultProps = {\n\ttitles: [{ title: \"Home\" }, { title: \"1st\" }, { title: \"2nd\" }],\n\twidth: \"100%\",\n\tcolor: \"#fff\",\n\tdisablePagination: false,\n};\n\nexport default HsbcButtonGroup;\n","/* @flow weak */\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nexport default function Flag({\n props,\n onClick,\n className,\n size,\n children,\n}) {\n\n let flagStyle = {\n color: '#000',\n height:'21px',\n fontFamily: 'Univers Next',\n fontSize : '12px',\n lineHeight:'14px',\n display: 'inline-block',\n marginLeft : '10px',\n position:'relative',\n verticalAlign:'middle',\n }\n\n let textContainerStyle = {\n height:'100%',\n backgroundColor : '#EDB343',\n // float:'left',\n padding:'4px 10px'\n }\n\n // let tailStyle = {\n // height:'100%',\n // // float:'left',\n // position:'absolute',\n // left:'calc(100% - 1px)',\n // top : '0px'\n\n // }\n\n return (\n \n {children && (
*/}\n
\n )\n\n}\n\nFlag.propTypes = {\n\t/**\n\t * Flag label\n\t */\n\tchildren: PropTypes.string,\n};\n\nFlag.defaultProps = {\n children: \"\"\n};\n","/* eslint-disable */\n//\n// Home\n//\n// import _HeroBanner from './Home/HeroBanner/HeroBanner';\n// export { _HeroBanner as HeroBanner };\n// import _HomeModule from './Home/HomeModule/HomeModule';\n// export { _HomeModule as HomeModule };\n// import _HomeModuleCarousel from './Home/HomeModuleCarousel/HomeModuleCarousel';\n// export { _HomeModuleCarousel as HomeModuleCarousel };\n// import _LatestEcmOrders from './Home/LatestEcmOrders/LatestEcmOrders';\n// export { _LatestEcmOrders as LatestEcmOrders };\n// import _DocumentsModule from './Home/DocumentsModule/DocumentsModule';\n// export { _DocumentsModule as DocumentsModule };\n// import _LatestDcmOrders from './Home/LatestDcmOrders/LatestDcmOrders';\n// export { _LatestDcmOrders as LatestDcmOrders };\n// import _LatestDcm2Orders from './Home/LatestDcm2Orders/LatestDcm2Orders';\n// export { _LatestDcm2Orders as LatestDcm2Orders };\n// import _LatestFeedback from './Home/LatestFeedback/LatestFeedback';\n// export { _LatestFeedback as LatestFeedback };\n// import _EngagementChart from './Home/EngagementChart/EngagementChart';\n// export { _EngagementChart as EngagementChart };\n\n\n//\n// Investor Engagement\n//\n// import _EngagementTable from './InvestorEngagement/EngagementTable/EngagementTable';\n// export { _EngagementTable as EngagementTable }\n// import _InvestorCardView from './InvestorEngagement/InvestorCardView/InvestorCardView';\n// export { _InvestorCardView as InvestorCardView }\n// import _InvestorEngagementIconBlock from './InvestorEngagement/InvestorEngagementIconBlock/InvestorEngagementIconBlock';\n// export { _InvestorEngagementIconBlock as InvestorEngagementIconBlock }\n// import _OrderDetail from './InvestorEngagement/OrderDetail/OrderDetail';\n// export { _OrderDetail as OrderDetail };\n// import _EmptyStateTab from './InvestorEngagement/EmptyStateTab/EmptyStateTab';\n// export { _EmptyStateTab as EmptyStateTab };\n// import _EngagementDetail from './InvestorEngagement/EngagementDetail/EngagementDetail';\n// export { _EngagementDetail as EngagementDetail };\n// import _EmptyEngagementDetail from './InvestorEngagement/EmptyEngagementDetail/EmptyEngagementDetail';\n// export { _EmptyEngagementDetail as EmptyEngagementDetail };\n\n//\n// Utils\n//\nimport * as _VisualisationColors from './utils/visualisationColors';\nexport { _VisualisationColors as VisualisationColors };\nimport * as _ValueFormatters from './utils/valueFormatters';\nexport { _ValueFormatters as ValueFormatters };\nimport * as _SiteConstants from './utils/siteConstants';\nexport { _SiteConstants as SiteConstants };\nimport * as _Sorters from './utils/sorters';\nexport { _Sorters as Sorters };\nimport { NiceScale as _NiceScale } from './utils/niceScale';\nexport { _NiceScale as NiceScale };\n\n//\n// Investor Feedback\n//\n// import _FeedbackDetail from './InvestorFeedback/FeedbackDetail/FeedbackDetail';\n// export { _FeedbackDetail as FeedbackDetail }\n// import _FeedbackHighlight from './InvestorFeedback/FeedbackHighlight/FeedbackHighlight';\n// export { _FeedbackHighlight as FeedbackHighlight }\n// import _FeedbackHighlightContainer from './InvestorFeedback/FeedbackHighlightContainer/FeedbackHighlightContainer';\n// export { _FeedbackHighlightContainer as FeedbackHighlightContainer }\n// import _FeedbackChartSentiment from './InvestorFeedback/FeedbackChartSentiment/FeedbackChartSentiment';\n// export { _FeedbackChartSentiment as FeedbackChartSentiment }\n// import _AccessibleChartData from './InvestorFeedback/FeedbackChartSentiment/AccessibleChartData';\n// export { _AccessibleChartData as AccessibleChartData }\n// import _FeedbackChartPriceDemand from './InvestorFeedback/FeedbackChartPriceDemand/FeedbackChartPriceDemand';\n// export { _FeedbackChartPriceDemand as FeedbackChartPriceDemand }\n// import _FeedbackChartThemeDistribution from './InvestorFeedback/FeedbackChartThemeDistribution/FeedbackChartThemeDistribution';\n// export { _FeedbackChartThemeDistribution as FeedbackChartThemeDistribution }\n\n//\n// Layout\n//\nimport _AppContainer from './layouts/AppContainer/AppContainer';\nexport { _AppContainer as AppContainer };\nimport _NavMain from './layouts/NavMain/NavMain';\nexport { _NavMain as NavMain };\nimport _StandardTable from './layouts/StandardTable/StandardTable';\nexport { _StandardTable as StandardTable };\nimport _Tab from './layouts/Tab/Tab';\nexport { _Tab as Tab };\nimport _NewTabsContainer from './layouts/NewTabsContainer/NewTabsContainer';\nexport { _NewTabsContainer as NewTabsContainer };\n\nimport _IsvAppContainer from './layouts/IsvAppContainer/IsvAppContainer';\nexport { _IsvAppContainer as IsvAppContainer };\n// import _ScrollingContainer from './layouts/ScrollingContainer/ScrollingContainer';\n// export { _ScrollingContainer as ScrollingContainer }\n// import _DynamicScrollContainer from './layouts/DynamicScrollContainer/DynamicScrollContainer';\n// export { _DynamicScrollContainer as DynamicScrollContainer };\n// import _TabsContainer from './layouts/TabsContainer/TabsContainer';\n// export { _TabsContainer as TabsContainer };\n// import _HorizontalScrollTable from './layouts/HorizontalScrollTable/HorizontalScrollTable';\n// export { _HorizontalScrollTable as HorizontalScrollTable };\n\n//\n// My Docs\n//\n// import _CategoryList from './MyDocs/CategoryList/CategoryList';\n// export { _CategoryList as CategoryList };\n// import _DocumentsContainer from './MyDocs/DocumentsContainer/DocumentsContainer';\n// export { _DocumentsContainer as DocumentsContainer }\n// import _Document from './MyDocs/Document/Document';\n// export { _Document as Document }\n\n//\n// Components\n//\nimport _LoadingAnimation from './components/LoadingAnimation/LoadingAnimation';\nexport { _LoadingAnimation as LoadingAnimation }\nimport _Icon from './components/Icon/Icon';\nexport { _Icon as Icon };\nimport * as _SvgIcons from './components/SvgIcon';\nexport {_SvgIcons as SvgIcons};\nimport _ScrollingNav from './components/ScrollingNav/ScrollingNav';\nexport { _ScrollingNav as ScrollingNav };\nimport _StackedBarChart from './components/StackedBarChart/StackedBar';\nexport { _StackedBarChart as StackedBarChart };\nimport _ColorChip from './components/ColorChip/ColorChip';\nexport { _ColorChip as ColorChip };\nimport _DonutChart from './components/DonutChart/DonutChart';\nexport { _DonutChart as DonutChart };\nimport _HsbcButton, {\n PrimaryButton as _PrimaryButton,\n SecondarySlateButton as _SecondarySlateButton,\n SecondaryButton as _SecondaryButton,\n LegacyButton as _LegacyButton\n} from './components/HsbcButton';\nexport { _HsbcButton as HsbcButton };\nexport { _PrimaryButton as PrimaryButton };\nexport { _SecondarySlateButton as SecondarySlateButton };\nexport { _SecondaryButton as SecondaryButton };\nexport { _LegacyButton as LegacyButton };\n\nimport _Checkbox from './components/HsbcCheckbox';\nexport { _Checkbox as Checkbox }\n\nimport _HsbcButtonGroup from './components/HsbcButtonGroup/HsbcButtonGroup';\nexport { _HsbcButtonGroup as HsbcButtonGroup };\nimport _Flag from './components/Flag/Flag';\nexport { _Flag as Flag };\n// import _PopOverSystem from './components/PopOverSystem/PopOverSystem';\n// export { _PopOverSystem as PopOverSystem };\n// import _PopOverWrapper from './components/PopOverWrapper/PopOverWrapper';\n// export { _PopOverWrapper as PopOverWrapper };\n// import _Carousel from './components/Carousel/Carousel';\n// export { _Carousel as Carousel };\n// import _DetailsTable from './components/DetailsTable/DetailsTable';\n// export { _DetailsTable as DetailsTable }\n\n\n//\n// Roadshow\n//\n// import _DetailsView from './EventDetails/DetailsView/DetailsView';\n// export { _DetailsView as DetailsView }\n","import React, { PureComponent } from 'react';\nimport ReactDOM from 'react-dom';\nimport { compose } from 'recompose';\nimport styled from 'styled-components';\n\nimport { FontIcon } from 'shared/components/Icon';\n\nimport withModals from 'shared/hoc/withModals';\nimport Popup from 'shared/components/Popup';\nimport DropdownSystem from './DropdownSystem';\nimport Scrollable from 'shared/components/Scrollable';\nimport { Row, Col } from 'shared/components/Grid';\n\nimport { styledEllipsis } from 'shared/styles/mixins/ellipsis';\nimport keys from 'shared/accessibility/constants/keys';\nimport { outlines, typography } from 'shared/styles/variables/theme'\n\nconst CustomIcon = styled(FontIcon)`\n display: inline-block;\n\n font-size: 10px;\n margin-top: 2px;\n margin-right: 2px;\n\n transition: transform .3s linear;\n\n &.opened {\n transform: rotateX(180deg) rotateZ(90deg);\n }\n &.closed {\n transform: rotateX(0deg) rotateZ(90deg);\n }\n`;\n\nconst Chevron = ({ reversed, isDropdownOpen, isMasthead }) => (\n {children}
)}\n {/* \n
\n
\n ),\n }, {\n ...baseColumnProps(sort),\n dataField: 'lastModified',\n text: translationString(\"common.upload_date\", props.language, \"Upload Date\"),\n headerClasses: 'doc-header',\n headerStyle: {\n ...headerStyles,\n marginTop: 7,\n textAlign: 'right',\n borderLeft: 'none',\n borderBottom: 'none',\n },\n style: {\n ...cellStyle,\n width: '25%',\n fontFamily: 'Univers Next Lt',\n color: fontColors.grey,\n fontSize: typography.sizes['12px'],\n paddingTop: 16,\n textAlign: 'right',\n },\n formatter: (value, data) => ValueFormatters.dateFormatter('dayMonthYearZoneShort', data.lastModified || data.created),\n }];\n \n return columns;\n }\n\n return (\n \n \n
\n
\n \n \",\n props.language,\n `Open document ${data.title}`,\n [\n ['', data.title]\n ]\n )\n }\n onKeyDown={e => buttonKeyHandler(e, () => { props.documentRequestedEvent(); props.requestDoc(data.documentVersionId, data.title) })}\n onClick={() => { props.documentRequestedEvent(); props.requestDoc(data.documentVersionId, data.title) }}\n tabIndex={0}\n >\n {data.title}\n \n
\n \n \n {data.description || translationString(\"my_docs.no_comments\", props.language, \"No Comments\")}\n \n
\n \n
\n );\n}\n\nconst mapDispatchToProps = dispatch => ({\n requestDoc: (docId, docName) => dispatch(requestDoc(docId, docName)),\n})\n\nexport default compose(\n withAnalytics((ev) => ({\n documentRequestedEvent: () => ev(events.MY_DOCS_OPEN_DOCUMENT),\n })),\n connect(null, mapDispatchToProps),\n withLanguage\n)(DocumentsContainer);\n","import React, { Component } from 'react';\nimport { Row, Col } from 'react-bootstrap';\nimport { connect } from 'react-redux';\nimport { compose } from 'recompose';\nimport styled from 'styled-components';\n// TODO\nimport { ValueFormatters, Sorters } from 'mk-pattern-library-react';\n\nimport { FeatureContainer, HeaderContainer } from 'shared/styles/components/containers';\nimport { FeatureHeading, HeadingDescription } from 'shared/styles/components/headings';\nimport { DateAsOf } from 'shared/styles/components/date';\nimport withAnalytics from 'shared/hoc/withAnalytics';\nimport withTranslate from 'shared/hoc/withTranslate';\n\nimport { featurePageIds } from 'constants/featurePages';\nimport { getMyDocsData } from 'selectors';\n\nimport DocumentList from 'MyDocs/Documents/DocumentList/DocumentList';\n\nconst ROADSHOW_CATEGORY_ID = 6;\n\nconst EmptyDocumentList = styled.div`\n width: 100%;\n text-align: center;\n`;\n\nclass DocumentMode extends Component {\n componentDidMount() {\n this.props.viewChange();\n }\n\n render() {\n const roadshowDocs = this.props.myDocs\n .filter((document) => ((ROADSHOW_CATEGORY_ID === document.category.documentCategoryId)))\n .sort((a, b) => Sorters.doubleSort('title', a, b, 'desc', 'created'))\n .filter(doc => doc.master)\n\n return (\n \n {\n /* Transparent Layer for large modal (all contacts/feedback detail) */\n this.props.backgroundLayer && (\n \n \n {\n this.props.closeIcon && (\n \n
\n \n \n \n {company.companyName}\n
\n {\n company.people.map((person, ind) => (\n\n \n
\n \n \n
\n \n
\n
\n ))\n }\n \n ))\n }\n\n \n
\n {\n contactMasterList.banks.map((company, ind) => (\n \n {company.companyName}\n
\n \n\n \n
\n \n \n
\n \n
\n
\n ))\n }\n \n \n
\n \n \n
\n \n \n
\n \n
\n
\n ))\n }\n\n {\n contactMasterList.travelContacts.map((person, ind) => (\n \n \n
\n \n \n
\n \n
\n
\n ))\n }\n \n \n
\n ))\n }\n {coordinator.name}
\n \n
\n {\n coordinator.title && ({coordinator.title}
)\n }\n {\n coordinator.directTelephone && (T: {coordinator.directTelephone}
)\n }\n {\n coordinator.mobileTelephone && (M: {coordinator.mobileTelephone}
)\n }\n {coordinator.email}
\n \n
\n )\n }\n \n
\n )\n }\n\n return (\n \n
\n )\n }\n}\n\nexport default compose(\n connect(\n state => ({\n roadShowSummaryOnline: getRoadShowSummaryOnline(state),\n }),\n )\n)(OnlineRoadshowModal);\n","import React, { PureComponent } from 'react';\nimport { connect } from 'react-redux';\nimport { compose } from 'recompose';\nimport styled from 'styled-components';\n\nimport { SvgIcon } from 'shared/components/Icon';\n\nimport { tabIds, roadshowContactTabs } from 'constants/tabIds';\nimport HorizontalTab from 'shared/accessibility/components/HorizontalTabs/HorizontalTab';\nimport HorizontalTabs from 'shared/accessibility/components/HorizontalTabs';\n\nimport Popup, { Divider } from 'shared/components/Popup';\nimport PopupSystem from 'shared/components/PopupSystem';\nimport Scrollable from 'shared/components/Scrollable';\n\nimport withTranslate from 'shared/hoc/withTranslate';\nimport HsbcLink from 'shared/accessibility/components/Link';\n\nimport {\n getRoadShowSummaryOnline,\n getRoadShowContacts,\n getRoadShowSummaryCoordinators\n} from 'selectors';\n\nimport ContactsModalContent from './ContactsModal.component';\nimport CoordinatorsContent from './CoordinatorsModal.component';\nimport OnlineRoadshowContent from './OnlineRoadshowModal.component';\n\nconst EnhancedDivider = styled(Divider)`\n margin: 0 0 30px;\n`;\n\nconst EmptySpace = styled.div`\n height: 20px;\n width: 100%;\n`;\n\nclass CombinedContacts extends PureComponent {\n modalOpenClick = () => {\n if (!this.props.isModalOpen) {\n this.props.openModal();\n this.props.adobeOpenModalEvent();\n }\n }\n\n render() {\n return (\n {url}
\n \n
\n \n { clickCopy('link-input') }}\n onKeyDown={e => buttonKeyHandler(e, () => clickCopy('link-input'))}\n tabIndex={0}\n >\n { clickCopy('pass-input') }}\n onKeyDown={e => buttonKeyHandler(e, () => clickCopy('pass-input'))}\n >\n
\n \n
\n {this.props.btnText}\n \n }\n />\n );\n }\n}\n\nexport default compose(\n withTranslate(\n translate => ({\n // tabs\n allContactsTabText: translate('roadshow.all_contacts', 'All Contacts'),\n roadshowCoordinatorsText: translate('roadshow.roadshow_coordinators', 'Roadshow Coordinators'),\n onlineRoadshowText: translate('roadshow.online_roadshow', 'Online Roadshow'),\n })\n ),\n connect(\n state => ({\n // duplication in each dedicated hoc ( we're aware of that )\n isOnlineRoadshowAvailable: getRoadShowSummaryOnline(state) && getRoadShowSummaryOnline(state).url,\n areAllContactsAvailable: getRoadShowContacts(state).length > 0,\n areRoadshowCoordinatorsAvailable: getRoadShowSummaryCoordinators(state).length > 0,\n }),\n ),\n)(CombinedContacts);\n","import { connect } from 'react-redux';\nimport { compose } from 'recompose';\n\nimport withTranslate from 'shared/hoc/withTranslate';\nimport { withAnalytics2 } from 'shared/hoc/withAnalytics';\n\nimport { tabIds, roadshowContactTabs } from 'constants/tabIds';\nimport { changeTab } from 'actions/UtilityActions';\n\nimport * as modalIds from 'constants/modalIds';\nimport withModals from 'shared/hoc/withModals';\n\nimport { getRoadShowContacts } from 'selectors';\n\nimport CombinedContacts from './index';\n\nexport default compose(\n withTranslate(\n translate => ({\n btnText: translate('roadshow.all_contacts', 'All Contacts'),\n })\n ),\n connect(\n state => {\n const areAllContactsAvailable = getRoadShowContacts(state).length > 0;\n return ({\n isBtnDisabled: !areAllContactsAvailable,\n visibleTab: roadshowContactTabs.ALL_CONTACTS,\n })\n },\n dispatch => ({\n changeTab: () => dispatch(changeTab(tabIds.ROADSHOW_CONTACT_TABS, roadshowContactTabs.ALL_CONTACTS)) \n })\n ),\n withModals(\n selection => ({\n modalId: modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_2,\n isModalOpen: selection(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_2),\n }),\n (close, open, props) => ({\n openModal: () => {\n props.changeTab(); // to default\n open(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_2);\n },\n closeModal: () => close(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_2),\n }),\n ),\n withAnalytics2(\n (ev, events) => ({\n adobeOpenModalEvent: () => ev(events.ROADSHOW_CONTACTS_BUTTON),\n }),\n ),\n)(CombinedContacts);","import { connect } from 'react-redux';\nimport { compose } from 'recompose';\n\nimport withTranslate from 'shared/hoc/withTranslate';\nimport { withAnalytics2 } from 'shared/hoc/withAnalytics';\n\nimport { changeTab } from 'actions/UtilityActions';\nimport { tabIds, roadshowContactTabs } from 'constants/tabIds';\n\nimport * as modalIds from 'constants/modalIds';\nimport withModals from 'shared/hoc/withModals';\n\nimport { getRoadShowSummaryOnline } from 'selectors';\n\nimport CombinedContacts from './index';\n\nexport default compose(\n withTranslate(\n translate => ({\n btnText: translate('roadshow.online_roadshow', 'Online Roadshow'),\n })\n ),\n connect(\n state => {\n const isOnlineRoadshowAvailable = getRoadShowSummaryOnline(state) && getRoadShowSummaryOnline(state).url;\n return ({\n isBtnDisabled: !isOnlineRoadshowAvailable,\n visibleTab: roadshowContactTabs.ONLINE,\n })\n },\n dispatch => ({\n changeTab: () => dispatch(changeTab(tabIds.ROADSHOW_CONTACT_TABS, roadshowContactTabs.ONLINE)) \n })\n ),\n withModals(\n selection => ({\n modalId: modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_1,\n isModalOpen: selection(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_1),\n }),\n (close, open, props) => ({\n openModal: () => {\n props.changeTab(); // to default\n open(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_1);\n },\n closeModal: () => close(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_1),\n }),\n ),\n withAnalytics2(\n (ev, events) => ({\n adobeOpenModalEvent: () => ev(events.ROADSHOW_ONLINE_BUTTON),\n }),\n ),\n)(CombinedContacts);","import { connect } from 'react-redux';\nimport { compose } from 'recompose';\n\nimport withTranslate from 'shared/hoc/withTranslate';\nimport { withAnalytics2 } from 'shared/hoc/withAnalytics';\n\nimport { tabIds, roadshowContactTabs } from 'constants/tabIds';\nimport { changeTab } from 'actions/UtilityActions';\n\nimport * as modalIds from 'constants/modalIds';\nimport withModals from 'shared/hoc/withModals';\n\nimport { getRoadShowSummaryCoordinators } from 'selectors';\n\nimport CombinedContacts from './index';\n\nexport default compose(\n withTranslate(\n translate => ({\n btnText: translate('roadshow.roadshow_coordinators', 'Roadshow Coordinators'),\n })\n ),\n connect(\n state => {\n const areRoadshowCoordinatorsAvailable = getRoadShowSummaryCoordinators(state).length > 0;\n return ({\n isBtnDisabled: !areRoadshowCoordinatorsAvailable,\n visibleTab: roadshowContactTabs.COORDINATORS,\n });\n },\n dispatch => ({\n changeTab: () => dispatch(changeTab(tabIds.ROADSHOW_CONTACT_TABS, roadshowContactTabs.COORDINATORS)) \n })\n ),\n withModals(\n selection => ({\n modalId: modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_3,\n isModalOpen: selection(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_3),\n }),\n (close, open, props) => ({\n openModal: () => {\n props.changeTab(); // to default\n open(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_3);\n },\n closeModal: () => close(modalIds.ROADSHOW_COMBINED_CONTACTS_MODAL_ID_3),\n }),\n ),\n withAnalytics2(\n (ev, events) => ({\n adobeOpenModalEvent: () => null, // missing event ev(events.ROADSHOW_COORDINATORS_BUTTON),\n }),\n ),\n)(CombinedContacts);","import React from 'react';\n// TODO\nimport { Icon } from 'mk-pattern-library-react';\n\nexport const debounce = (func, wait, immediate) => {\n var timeout;\n return () => {\n /* eslint-disable-next-line */\n const context = this, args = arguments;\n const later = function() {\n timeout = null;\n if (!immediate) func.apply(context, args);\n };\n const callNow = immediate && !timeout;\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n if (callNow) func.apply(context, args);\n };\n};\n\nexport const roadShowEventTypes = new Map();\nroadShowEventTypes.set(0, {\n title : () => ``,\n participantsTitle: 'Team Attendees',\n eventTypeId : 0,\n});\nroadShowEventTypes.set(1, {\n title : (host) => `1:1 Call ${(host) ? `(${host})` : ``}`,\n participantsTitle: 'Team Attendees',\n eventTypeId : 1,\n});\nroadShowEventTypes.set(2, {\n title : (host) => `1:1 Conference Call ${(host) ? `(${host})` : ``}`,\n participantsTitle: 'Team Attendees',\n eventTypeId : 2,\n});\nroadShowEventTypes.set(3, {\n title : (host, num) => `${num || 'X'}:1 ${(host) ? `(${host})` : ``}`,\n participantsTitle: 'Team Attendees',\n eventTypeId : 3,\n});\nroadShowEventTypes.set(4, {\n title : () => `Group Meeting`,\n participantsTitle: 'Team Attendees',\n eventTypeId : 4,\n});\nroadShowEventTypes.set(5, {\n title : () => `Conference Call`,\n participantsTitle: 'Team Attendees',\n eventTypeId : 5,\n});\nroadShowEventTypes.set(6, {\n title : () => `Private Meeting`,\n participantsTitle: 'Team Attendees',\n eventTypeId : 6,\n});\nroadShowEventTypes.set(7, {\n title : () => `Placeholder`,\n participantsTitle: 'Team Attendees',\n eventTypeId : 7,\n});\nroadShowEventTypes.set(8, {\n title : () => `Flight`,\n icon : \n \n \n {eventLabel}\n \n
\n )\n }\n\n \n {eventType.icon}\n
\n \n \n
\n \n \n | \n \n )\n }\n \n {\n event.teams && (\n \n \n {\n this.props.teamDetails[teamName].roadshowTeamCode\n }\n \n ))\n }\n \n )\n }\n \n
\n
\n \n \n
\n \n\n {startTime && (eventTypeId !== 12) &&\n ({eventTitle}
\n {eventText}{eventIcon && ({eventIcon}
)}\n \n
\n )\n }\n \n
\n {\n endTime && (\n \n {\n ValueFormatters.dateFormatter('zoneTime', startTime)\n }\n
\n {\n (\n endTimeZone && (endTimeZone === startTimeZone) && null\n ) || (\n endTimeZone && (endTimeZone !== startTimeZone) && (\n {startTimeZone}
\n )\n ) || null\n }\n \n to \n
\n )\n }\n {\n endTime && (\n \n
\n )\n }\n \n {\n ValueFormatters.dateFormatter('zoneTime', endTime)\n }\n
\n {\n (\n !endTimeZone && (\n {startTimeZone}
\n )\n ) || (\n {endTimeZone}
\n )\n }\n ${commentLine}`;\n })\n}\n\nconst CoordinatorComments = (props) => {\n const comments = props.comments;\n return (\n
\n
\n \n \n )\n}\n\nexport default CoordinatorComments","/* @flow */\nimport React from 'react';\nimport { Row, Col } from 'react-bootstrap';\n// TODO\nimport { ValueFormatters } from 'mk-pattern-library-react';\n\nimport CoordinatorComments from '../CoordinatorComments/CoordinatorComments';\n\nimport TranslationText from 'translations/TranslationText';\n\nconst LogisticsDetails = (props) => {\n const { event, driver, eventType } = props,\n spacingSm = { marginBottom: 5 },\n spacingLg = { marginBottom: 8 },\n dealType = props.dealType;\n\n // Planes and Trains\n const travelWithIcon = (location1, location2, carrier) => (\n \n
\n \n {ValueFormatters.dateFormatter('zoneTime', event.startDateLocal || '--')}\n {event.startTimeZone}\n
\n {location1.place}
\n {location1.roomNumber}
\n {location1.addressLine1}
\n {location1.addressLine2}
\n {location1.addressLine3}
\n {location1.addressLine4}
\n {location1.telephone}
\n {/* Terminal --
*/}\n \n )\n }\n\n { \n location1 && (\n {(eventType.eventTypeId === 8 || eventType.eventTypeId === 9) ? 'Flight' : 'Train'}
\n {event.travelNumber}
\n {carrier}
\n \n )\n }\n\n {\n location2 && (\n \n
\n \n {ValueFormatters.dateFormatter('zoneTime', event.endDateLocal || '--')}\n {event.endTimeZone}\n
\n {location2.place}
\n {location1.roomNumber}
\n {location2.addressLine1}
\n {location2.addressLine2}
\n {location2.addressLine3}
\n {location2.addressLine4}
\n {location2.telephone}
\n {/* Terminal --
*/}\n\n \n )\n }\n {\n event.notes && (\n
\n {location1.place}
\n {location1.roomNumber}
\n {location1.addressLine1}
\n {location1.addressLine2}
\n {location1.addressLine3}
\n {location1.addressLine4}
\n\n {dealType && dealType === \"DCM\" && (\n \n {location1.city && (location1.city + ', ')}\n {location1.country}\n
\n )}\n \n )}\n {location2 && (\n
\n {location2.place}
\n {location2.roomNumber}
\n {location2.addressLine1}
\n {location2.addressLine2}
\n {location2.addressLine3}
\n {location2.addressLine4}
\n\n {dealType && dealType === \"DCM\" && (\n \n {location2.city && (location2.city + ', ')}\n {location2.country}\n
\n )}\n )}\n\n \n
\n {driver.name}
\n {driver.mobileTelephone && `Tel: ${driver.mobileTelephone}`}
\n \n )}\n {carrier && (\n \n
\n {carrier}
\n {/* {driver.directTelephone && `Tel: ${driver.directTelephone}`}
*/}\n \n )}\n {event.notes &&\n ({location1.place}
\n \n
\n \n )}\n\n\n {event.notes &&\n ({location1.roomNumber}
\n {location1.addressLine1}
\n {location1.addressLine2}
\n {location1.addressLine3}
\n {location1.addressLine4}
\n {dealType && dealType === \"DCM\" && (\n \n {location1.city && (location1.city + ', ')}\n {location1.country}\n
\n )}\n\n {location1.telephone && (\n {location1.telephone}
\n )}\n \n
\n \n {ValueFormatters.dateFormatter('zoneTime', event.startDateLocal || '--')}\n {event.startTimeZone}\n
\n {location1.place}
\n {location1.roomNumber}
\n {location1.addressLine1}
\n {location1.addressLine2}
\n {location1.addressLine3}
\n {location1.addressLine4}
\n\n {dealType && dealType === \"DCM\" && (\n \n {location1.city && (location1.city + ', ')}\n {location1.country}\n
\n )}\n )}\n {location2 && (\n
\n \n {ValueFormatters.dateFormatter('zoneTime', event.endDateLocal || '--')}\n {event.endTimeZone}\n
\n {location2.place}
\n {location2.roomNumber}
\n {location2.addressLine1}
\n {location2.addressLine2}
\n {location2.addressLine3}
\n {location2.addressLine4}
\n\n {dealType && dealType === \"DCM\" && (\n \n {location2.city && (location2.city + ', ')}\n {location2.country}\n
\n )}\n\n )}\n\n {event.notes &&\n ({section}
})}\n \n \n {/* {event.booked == false &&\n \n
\n } */}\n\n \n {eventLocation &&\n (
\n\n
\n\n )\n let meetingSections = [];\n\n meetingSections.push(\n meetingLocation\n )\n\n return (\n {eventLocation.place}
\n \n
\n )\n }\n\n\n\n {event.notes &&\n ({eventLocation.roomNumber}
\n {eventLocation.addressLine1}
\n {eventLocation.addressLine2}
\n {eventLocation.addressLine3}
\n {eventLocation.addressLine4}
\n {dealType && dealType === \"DCM\" && (\n \n {eventLocation.city && (eventLocation.city + ', ')}\n {eventLocation.country}\n
\n )}\n\n {eventLocation.telephone && (\n {eventLocation.telephone}
\n )}\n {section}
})}\n \n \n { \n documentVersionId && \n handleDownloadClick(documentVersionId)}\n >\n { \n \n
\n }\n {firmName}\n {/* {investorList.keyInvestor && (\n {firmName}\n
\n }\n \n
\n )}\n\n {(pastGroupEvent && (investorDetailSections.length > 0)) && (\n
\n )}\n\n {(investorDetailSections.length > 0) && investorDetailSections.map((section, ind) => { return \n
\n )}\n {pastGroupEvent && (investorDetailSections2.length > 0) && investorDetailSections2.map((section, ind) => { return \n
\n {banker.company}
\n {banker.name}
\n {ValueFormatters.choosePhoneFormatter(banker)}
\n \n )\n\n const salesInfo = (salesContact, ind) => (\n \n
\n {salesContact.company}
\n {salesContact.name}
\n {ValueFormatters.choosePhoneFormatter(salesContact)}
\n \n )\n\n const { bankers, salesContacts } = props;\n return (\n {participant.name}
\n {participant.booking}
\n {/* There may be 2 lines of information to display here */}\n {/* {participant.telephone}
*/}\n \n )\n\n return (\n {participantsTitle}
\n \n \n \n \n \n \n \n \n
\n \n \n {activeDay.view}\n \n \n\n {\n this.handleDocumentClick(this.props.fullScheduleDocumentId, \"Full Roadshow Schedule\");\n this.props.fullScheduleButtonEvent();\n }}\n disabled={!this.props.fullScheduleDocumentId}\n >\n \n {cityList}\n \n \n
\n \n
\n {\n this.props.selectedTeam && (\n \n
\n )\n }\n {\n this.props.multiTeamMode && !this.props.selectedTeam && (\n \n
\n )\n }\n
\n );\n }\n}\n\nexport default compose(\n withLanguage,\n withTranslate(translate => ({\n calendarRegionAriaLabel: translate('', 'Calendar day list'),\n notificationHeadlineText: translate('', 'Warning.'),\n notificationDescText: translate('roadshow.to_view_the_correct_schedule_please_choose_your_ro', 'To view the correct schedule please choose your Roadshow Team from the Team Selector above...'),\n planeText: translate('roadshow.plane', 'plane'),\n trainText: translate('roadshow.plane', 'train'),\n carText: translate('roadshow.plane', 'car'),\n })),\n withAnalytics((ev, view) => ({\n // view\n viewChange: () => view(featurePageIds.ROADSHOW_DAILY_SCHEDULE_PAGE),\n // events\n carouselChangeEvent: () => ev(events.ROADSHOW_CAROUSEL_DATE_CHANGE),\n fullScheduleButtonEvent: () => ev(events.ROADSHOW_FULL_SCHEDULE_BUTTON),\n eventDetailButtonEvent: () => ev(events.ROADSHOW_EVENT_DETAIL),\n })),\n connect(\n state => ({\n selectedTeam: getSelectedTeam(state),\n multiTeamMode: getMultiTeamMode(state),\n eventsForSelectedDay: getEventsForSelectedDay(state),\n roadShowSummaryDates: getRoadShowEventDates(state),\n dateReceived: state.roadShowData.dateReceived,\n fullScheduleDocumentId: state.roadShowData.fullScheduleDocumentId,\n selectedDay: getRoadShowSelectedDay(state),\n dailyEventId: getDailyEventId(state),\n }),\n dispatch => ({\n updateSelectedDay: day => dispatch(updateSelectedDay(day)),\n requestDoc: (docId, docName) => dispatch(requestDoc(docId, docName)),\n changeDailyEvent: eventId => dispatch(setRoadShowDailyEvent(eventId)),\n })\n ),\n)(RoadShowContainer)\n","import React, { PureComponent } from 'react';\nimport { connect } from 'react-redux';\n\nimport dealFeatures from 'constants/dealFeatures';\nimport { checkFeature } from 'actions/UtilityActions';\n\nimport { isDCMDealType, isECMDealType, areDCMOrdersFetched, areECMOrdersFetched, getTrancheLoader } from 'selectors';\n\nimport Loading, { FeaturePageLoadingContainer } from 'shared/components/Loading';\n\nclass OrderBook extends PureComponent {\n componentDidMount() {\n this.props.checkFeature(dealFeatures.ORDERBOOK);\n }\n\n render() {\n if (this.props.isDCM) {\n if (this.props.trancheLoader ? false : this.props.isDCMFetching) {\n return (\n \n
\n \n\n \n
\n
\n \n \n\n {ValueFormatters.dateFormatter('dayMonth', headerDisplayData.currentStatusDate) === '' ? '' : ` ${ValueFormatters.dateFormatter('dayMonth', headerDisplayData.currentStatusDate)}`}\n\n
\n
\n \n
\n \n \n\n {ValueFormatters.dateFormatter('dayMonth', headerDisplayData.currentStatusDate) === '' ? '' : ` ${ValueFormatters.dateFormatter('dayMonth', headerDisplayData.currentStatusDate)}`}\n\n
\n
\n \n {trancheTitles && (\n \n
\n )}\n {\n dealType === 'ecm' &&\n \n
)}\n
\n );\n};\n\nexport default compose(\n withAnalytics(\n (ev) => ({\n carouselEvent: () => ev(events.ORDERS_SUMMARY_CAROUSEL_BUTTON),\n fullOrderBookEvent: () => ev(events.ORDERS_SUMMARY_FULL_ORDERBOOK_BUTTON),\n orderSummaryEvent: () => ev(events.FULL_ORDERBOOK_SUMMARY_BUTTON),\n amendedOrderEvent: () => ev(events.ORDERBOOK_AMENDED_SUMMARY_BOTTON),\n bookEvolutionEvent: () => ev(events.BOOK_EVOLUTION_SUMMARY_BOTTON)\n })\n ),\n withTranslate(\n translate => ({\n viewFullOrderBook: translate('', 'View full order book'),\n viewSummary: translate('', 'View order summary'),\n viewAmendedOrderSummary: translate('', 'View Amended Order Summary'),\n viewBookEvolution: translate('', 'View Book Evolution'),\n stickyToggleFullOrderBook: translate('orders.full_order_book', 'Full Order Book'),\n stickyToggleSummary: translate('orders.order_book_summary', 'Order Book Summary'),\n stickyAmendedOrderSummary: translate('orders.amended_order_summary', 'Amended Order Summary'),\n stickyBookEvolution: translate('orders.order_evolution', 'Order Evolution'),\n })\n ),\n connect(\n state => ({\n issuerName: getIssuerName(state),\n isAmended: selectIsAmended(state),\n dealId: state.utility.dealsData.dealId,\n }),\n dispatch => ({\n includeAmendedOrders: checked => {\n dispatch(includeAmendedOrders(checked));\n },\n resetOrderBookDropDowns: (dealId) => dispatch(resetOrderBookDropDowns(dealId)),\n refreshFullOrderBook: (dealId) => dispatch(refreshFullOrderBook(dealId)),\n filterOrderSummary: (dealId, interval, investorId, trancheId, loader) => dispatch(filterOrderSummary(dealId, investorId, trancheId, interval, loader)),\n filterAmendedOrderSummary: (dealId, investorId, trancheId) => dispatch(filterAmendedOrderSummary(dealId, investorId, trancheId)),\n filterBookEvolutionSummary: (dealId, investorId, trancheId, interval, loader) => dispatch(filterBookEvolutionSummary(dealId, investorId, trancheId, interval, loader)),\n getCurrentActiveSummaryTab: (activeTab) => dispatch(getCurrentActiveSummaryTab(activeTab))\n })\n )\n)(OrderbookHeader);\n","import moment from 'moment-timezone';\nimport numeral from 'numeral';\n\n//\n// Number utils\n//\nconst emptyNumberValue = '';\n\nconst commaFormatter = value => {\n if ((typeof value === 'undefined') || value === null) {\n return emptyNumberValue;\n }\n\n if (value >= 1000) {\n return numeral(value).format('0,0');\n }\n \n return numeral(value).format('0,0.00');\n};\n\n//\n// Number formatters \n//\nconst oneDecimalPointPercent = value => {\n if (typeof value !== 'number') return emptyNumberValue;\n return `${value.toFixed(1)}%`;\n};\n\nconst oneDecimalPoint = value => {\n if (typeof value !== 'number') return emptyNumberValue;\n return value.toFixed(1);\n}\n\nconst twoDecimalPoint = value => {\n if (typeof value !== 'number') return emptyNumberValue;\n return commaFormatter(value.toFixed(2));\n}\n\nconst million = value => {\n if (typeof value === 'number') {\n return commaFormatter(value / 1000000);\n }\n\n // (?)\n return emptyNumberValue;\n}\n\nexport const numberFormatters = {\n oneDecimalPointPercent,\n oneDecimalPoint,\n twoDecimalPoint,\n million,\n};\n\n//\n// Date Formatter\n//\nconst emptyDateValue = '';\n\nconst dayMonthYear = validTime => validTime.format('DD MMM YYYY');\nconst zoneTime = validTime => validTime.parseZone().format('HH:mm');\n\nconst dayMonth = value => {\n const time = moment(value);\n if (!time.isValid()) return emptyDateValue;\n\n const now = moment();\n if (now.isSame(time, 'day')) {\n // today\n return time.format('HH:mm');\n }\n\n return time.format('DD MMM');\n}\n\nconst dayMonthYearZoneShort = value => {\n const time = moment(value);\n if (!time.isValid()) return emptyDateValue;\n\n const zone = moment.tz.zone(moment.tz.guess(Date.now()));\n const zoneTime = moment.tz(time, zone.name);\n\n let timeAbbreviation = zone.abbr(Date.now());\n timeAbbreviation = ((timeAbbreviation[0] === '+' || timeAbbreviation === '-') ? 'GMT' : '') + timeAbbreviation;\n\n return `${zoneTime.format('DD MMM YYYY HH:mm')} (${timeAbbreviation})`;\n}\n\nconst dayMonthYearWithProvidedZone = (value, timeZone) => {\n const time = moment(value);\n if (!time.isValid()) return emptyDateValue;\n\n return `${dayMonthYear(time)} ${zoneTime(time)} ${timeZone}`;\n}\n\nconst dateTime = (value, timeZone) => {\n const time = moment(value);\n if (!time.isValid()) return emptyDateValue;\n\n if (moment().isSame(time, 'day')) {\n return dayMonthYear(time);\n }\n\n return `${dayMonthYear(time)} ${timeZone}`;\n}\n\nconst timeAbbr = () => {\n let abbr = moment.tz.zone(moment.tz.guess()).abbr(Date.now());\n return ((timeAbbr[0] === '+' || timeAbbr === '-') ? 'GMT' : '') + abbr;\n}\n\nexport const dateFormatters = {\n dayMonth,\n dayMonthYearZoneShort,\n dayMonthYearWithProvidedZone,\n dateTime,\n timeAbbr,\n};\n\n//\n// Other\n//\nexport default {\n numberFormatters,\n dateFormatters,\n};\n","import React from 'react';\nimport styled from 'styled-components';\n// TODO\nimport { ValueFormatters } from 'mk-pattern-library-react';\n\nconst TopValue = styled.div`\n font-size: 0.875rem;\n line-height: 1rem;\n text-align: right;\n font-weight: normal;\n`;\n\nconst BottomValue = styled.div`\n font-size: 0.750rem;\n line-height: 1rem;\n text-align: right;\n font-weight: normal;\n`;\n\nexport default (props) =>\n \n = 1 ?\n [\n ...trancheTitles,\n ALL_TRANCHES_RECORD\n ] : trancheTitles\n }\n btnWidth='auto'\n handleClick={(...a) => {\n trancheClick(...a);\n carouselEvent();\n }}\n active={trancheActive}\n issuerName={issuerName}\n />\n
\n \n \n {ValueFormatters.millionFormatter(props.topValue)} \n {props.bottomValue && {ValueFormatters.commaDecimalFormatter(props.bottomValue)}x }\n
\n","import React, { Component } from 'react';\nimport styled from 'styled-components';\n\nimport ScrollableTable from 'shared/components/ScrollableTable';\n\nconst ScrollbleContainer = styled.div`\n\n`;\n\nclass OrderBookTable extends Component {\n render() {\n return (\n \n {\n this.props.viewType === 'demandDetail'\n ?
\n );\n }\n}\n\nexport default compose(\n withTranslate((translate, props) => ({\n demandDetails: translate(\n \"orders.demand_details_@_\n hello\n
\n )\n });\n return $cellDivs\n\n }\n\n render() {\n const currentTrancheData = this.props.currentTrancheData;\n // const trancheDescription = `${dealsData.dealCurrency}m ${dealsData.dealTotalDemandCoverage} / ${dealsData.dealSizeFinal} / ${dealsData.dealCurrency} ${dealsData.dealDemandLowestSharePrice}-${dealsData.dealDemandHighestSharePrice}`;\n const dealsData = this.props.dealsData\n return (\n \n Total (m) \n {ValueFormatters.millionFormatter(props.currentTrancheData.trancheTotalOrderAmount || 0)}\n \n
\n }, {\n ...defaultColumnProps,\n dataField: 'softAmount',\n text: props.softText,\n headerClasses: '',\n style: rightAlignedCellStyle,\n headerStyle: rightAlignedHeaderStyle,\n headerSortingStyle: sortedHeaderStyle,\n columnFlex: 0.5,\n formatter: millionFormatter,\n footerFormatter: () =>\n {data['status'].toLowerCase()}
\n ),\n })\n\n return columns;\n}\n\nclass FullOrderBookAllTranchesTable extends Component {\n constructor(props) {\n super(props);\n this.state = {\n allInvestorType: [],\n };\n }\n\n componentWillMount() {\n this.sort = new SortState('externalSourceLastModified', SORT.ASCENDING, this.props.columnSortEvent, this.props.onSort);\n }\n\n componentDidMount() {\n if (this.props.data && this.props.data.length) {\n const getInvestorTypes = this.props.data.map((order) => {\n return {\n label: order.investorType, value: order.investorType\n }\n })\n\n const uniqueInvestorTypes = getInvestorTypes.filter((elem, index) => getInvestorTypes.findIndex(obj => obj.value === elem.value) === index).sort((a, b) => a.value.trim() < b.value.trim() ? -1 : 1)\n uniqueInvestorTypes.unshift(DEFAULT_ALL)\n this.setState({\n allInvestorType: uniqueInvestorTypes\n });\n }\n }\n\n setRowBackgroundStyle = (row) => {\n switch (row.status) {\n case ORDER_STATUS.DELETED:\n case ORDER_STATUS.CANCELLED: return applyRowbackground('#ff0000');\n case ORDER_STATUS.INACTIVE: return applyRowbackground('#808080');\n default: return null;\n }\n }\n\n onDropdownChange = (e, option) => {\n this.props.selectInvestorTypeDropdown({ text: option.value, value: option.value })\n }\n\n getFullOrderBookData = (data) => {\n const { selectedInvestorType } = this.props;\n if (selectedInvestorType.value !== 'ALL') {\n return data.filter((item) => item.investorType === selectedInvestorType.value)\n } else return data;\n }\n\n render() {\n return (\n <>\n {\n this.state.allInvestorType && this.state.allInvestorType.length &&\n\n \n \n Investor Type: \n \n \n
\n }\n \n\n \n {\n this.handleViewToggle(\"orderDetail\");\n this.props.buttonChangeEvent(events.FULL_ORDERBOOK_TAB_ORDER_DETAIL)\n }}\n >\n {\n this.handleViewToggle(\"investorType\");\n this.props.buttonChangeEvent(events.FULL_ORDERBOOK_TAB_INVESTOR_TYPE)\n }}\n >\n \n \n }\n {\n active.id !== ALL_TRANCHES_RECORD.id ?\n \n \n \n \n ) :\n this.props.allTranchesFullOrderBookTable.length ?\n <>\n \n
\n
\n ) : (\n \n
\n }\n \n }\n \n
\n )\n );\n }\n}\nconst mapStateToProps = (state) => ({\n dealId: state.utility.dealsData.dealId,\n trancheTitles: getTrancheTitles(state),\n currentTrancheId: state.orderBookData.currentTrancheId,\n currentTrancheData: getCurrentTranche(state),\n dateReceived: state.orderBookData.dateReceived,\n fullOrderBookTable: getDCMFullOrderBookTable(state),\n allTranchesFullOrderBookTable: getDCMAllTranchesFullOrderBookTable(state),\n loading: state.orderBookData.dataFetching\n});\n\nconst mapDispatchToProps = dispatch => ({\n requestOrders: (trancheId, loader) => dispatch(requestOrders(trancheId, loader)),\n requestOrdersForAllTranches: (dealId, loader) => dispatch(requestOrdersForAllTranches(dealId, loader)),\n updateCurrentTranche: (trancheId, loader) => dispatch(updateCurrentTranche(trancheId, 'DCM')),\n changeFullOrderBookSort: (column, direction) => dispatch(changeFullOrderBookSort(column, direction)),\n changeAllTranchesFullOrderBookSort: (column, direction) => dispatch(changeAllTranchesFullOrderBookSort(column, direction)),\n getCurrentActiveSummaryTab: (activeTab) => dispatch(getCurrentActiveSummaryTab(activeTab))\n});\n\nexport default compose(\n withAnalytics((ev, view) => ({\n viewChange: () => view(featurePageIds.ORDERBOOK_FULL_PAGE),\n buttonChangeEvent: eventDetails => ev(eventDetails),\n })),\n connect(mapStateToProps, mapDispatchToProps)\n)(FullOrderBookContainer);\n","import React, { PureComponent } from 'react';\nimport { connect } from 'react-redux';\n\nimport {\n isDCMDealType,\n isECMDealType,\n isDCMOrderbookContentAvailable,\n isECMOrderbookContentAvailable\n} from 'selectors';\n\nimport PageContentNotAvailable from 'components/PageContentNotAvailable';\n\nimport ECMFullOrderBookContainer from './ecm/FullOrderBook/FullOrderBook.container';\nimport DCMFullOrderBookContainer from './dcm/FullOrderBook/FullOrderBook.container';\n\nclass FullOrderBookComponent extends PureComponent {\n render() {\n if (!this.props.isDCMAvailable && !this.props.isECMAvailable) {\n return \n {props.children}\n
\n );\n};\n\nconst DescriptionSection = (props) =>{\n let style = {\n display: 'inline-block',\n verticalAlign:'middle',\n whiteSpace : 'nowrap',\n overflow:'hidden',\n textOverflow : 'ellipsis',\n }\n return (\n \n {props.children}\n
\n)}\n\nconst ColorChip = (props) => {\n const { size, description, colorHex, opacity, fullChip } = props;\n const chipStyle = {\n backgroundColor: colorHex,\n opacity: opacity,\n display: 'inline-block',\n width: size,\n height: size,\n minWidth: size,\n marginRight: 10,\n verticalAlign:'middle'\n };\n return (\n \n {\n ValueFormatters.commaDecimalFormatter(props.sharePrice)\n }\n ({ props.currency}m)\n
(m)\n
\n 3 ? 'scrollAlign': '' }\n data={this.props.popoverData.otherTableData}\n columns={this.Columns({ ...this.props }, true)}\n caption={this.props.tableCaption}\n />\n this.handlePopOver(null)}\n style={closeBtnStyle}>\n
\n \n \n }\n \n {\n this.state.view === 'TABLE' && this.props.tableTitle ? (\n
\n \n {this.props.tableTitle}\n
\n ) : null\n }\n {\n this.state.view === 'CHART' ? (\n this.props.children\n ) : this.props.table || (\n\n \n \n \n {this.props.legendTitle}\n \n \n \n \n
\n {val}
\n \n ),\n }, {\n dataField: 'investorType',\n text: translationString(\"orders.type\", props.language, \"Type\"),\n headerStyle: {\n ...otherHeaderAlignedLeftStyle,\n width: '70px',\n },\n style: {\n ...otherRowAlignedLeft,\n },\n formatter: (val, data, index) => (\n (!val && val !== false) ? '-' : {val}
\n ),\n }];\n\n if (props.type === 'ecm') {\n columns.push({\n dataField: 'shareDemandSummary.demandAtBottomSharePrice.demandAmount',\n headerFormatter: () => (\n \n {\n ValueFormatters.commaDecimalFormatter(props.currentTrancheData.dealTotalDemandSummary.demandAtBottomSharePrice.sharePrice)\n }\n ({props.currentTrancheData.dealCurrency}m)\n
(m)\n
({timeAbbr})\n
\n \n {\n this.props.tabChangeEvent(events.ORDERS_SUMMARY_TOP10_TAB_ORDERS);\n }}\n >\n \n \n \n {\n this.props.tabChangeEvent(events.ORDERS_SUMMARY_TOP10_TAB_NEW_OR_CHANGED);\n }}\n >\n \n \n \n \n
\n );\n }\n}\n\nexport default compose(\n withLanguage,\n withAnalytics((ev) => ({\n tabChangeEvent: eventDetails => ev(eventDetails),\n })),\n withTranslate(translate => ({\n tab1Title: translate('orders.top_10_orders', 'Top 10 Orders'),\n tab2Title: translate('orders.most_recent_top_10_new_changed', 'Most Recent Top 10 New/Changed'),\n tab1TableCaption: translate('orders.top_10_table_caption', 'Table showing top 10 orders'),\n tab2TableCaption: translate('orders.most_recent_10_table_caption', 'Table showing most recent top 10 new/changed orders')\n })),\n)(TopTenTable);\n","import React, { Fragment } from 'react';\nimport { Row, Col, ProgressBar } from 'react-bootstrap';\nimport styled from 'styled-components';\n// TODO\nimport { ValueFormatters } from 'mk-pattern-library-react';\n\nimport TranslationText, { translationString } from 'translations/TranslationText';\nimport withLanguage from 'translations/withLanguage';\n\nconst DLContainer = styled.dl`\n margin: 0;\n\n dt {\n font-weight: normal;\n }\n`;\n\nconst StatusBar = props => {\n let trancheTargetAmount,\n trancheTotalOrderAmount,\n orderPercentage;\n\n if (props.barType === 'dcm') {\n trancheTargetAmount = props.currentTranche.trancheTargetAmount;\n trancheTotalOrderAmount = props.currentTranche.trancheTotalOrderAmount;\n orderPercentage = props.currentTranche.trancheTotalSubscribed;\n } else {\n trancheTargetAmount = props.currentTranche.dealIpoValue;\n trancheTotalOrderAmount = props.currentTranche.dealTotalDemandAmountAtLowestPrice;\n orderPercentage = props.currentTranche.dealTotalDemandCoverage;\n }\n\n let progress = Math.round((orderPercentage) * 100);\n let progressBarOver = false;\n\n if (progress > 100) {\n progressBarOver = true;\n progress = ((1 / orderPercentage) * 100);\n }\n\n return (\n \n
\n {ValueFormatters.millionFormatter(trancheTargetAmount)}
\n\n {ValueFormatters.millionFormatter(trancheTotalOrderAmount)}
\n \n \n
\n
\n );\n }\n}\nconst mapStateToProps = (state) => ({\n currentTrancheData: getCurrentTranche(state),\n investorCountrySummaryData: getDemandDataForSummary(state, 'investorCountrySummaryDataByShareLowest'),\n investorTypeSummaryData: getDemandDataForSummary(state, 'investorTypeSummaryDataByShareLowest'),\n\n investorCountrySummaryDataByShare: state.orderBookData.investorCountrySummaryDataByShare,\n investorTypeSummaryDataByShare: state.orderBookData.investorTypeSummaryDataByShare,\n externalSourceLastModifiedSummaryDataByShare: state.orderBookData.externalSourceLastModifiedSummaryDataByShare,\n // TODO: This objetc includes tranches, may need to pull out tranche data and remove trancheData below\n dealsData: state.utility.dealsData,\n lowestSharePrice: state.utility.dealsData.dealTotalDemandSummary.demandAtBottomSharePrice.sharePrice,\n // investorTypeDataByShare: state.orderBookData.ShareDemandByInvestorType,\n currentTrancheId: state.orderBookData.currentTrancheId,\n dealId: state.utility.dealsData.dealId,\n // trancheData: state.orderBookData.TrancheData,\n // titles: state.orderBookData.tranches,\n orderData: state.orderBookData.orderData,\n // currentTranche: state.orderBookData.currentTranche,\n dateReceived: state.orderBookData.dateReceived,\n});\n\nconst mapDispatchToProps = dispatch => ({\n updateCurrentTranche: (trancheId) => dispatch(updateCurrentTranche(trancheId, 'ECM')),\n});\n\nexport default compose(\n withLanguage,\n withTranslate((translate, props) => ({\n tab1Title: translate('orders.demand_by_investor_type', 'Demand by Investor Type'),\n tab2Title: translate('orders.demand_by_country', 'Demand by Country'),\n tab3Title: translate('orders.demand_by_day', 'Demand by Day'),\n })),\n withAnalytics((ev, view) => ({\n viewChange: () => view(featurePageIds.ORDERBOOK_SUMMARY_PAGE),\n tabChangeEvent: eventDetails => ev(eventDetails),\n })),\n connect(mapStateToProps, mapDispatchToProps),\n)(OrderSummaryContainer);\n","import React, { Component } from 'react';\nimport { connect } from 'react-redux';\nimport { compose } from 'recompose';\nimport styled from 'styled-components';\nimport PopupSystem from 'shared/components/PopupSystem';\nimport Popup, { Divider } from 'shared/components/Popup';\nimport { closeOrderSummaryDetailView } from 'actions/OrderBookActions';\nimport withTranslate from 'shared/hoc/withTranslate';\nimport { dateFormatter } from '../../SharedTableComponents/formatters';\nimport {\n leftAlignedCellStyle,\n rightAlignedCellStyle,\n leftAlignedHeaderStyle,\n} from '../../shared/table/styles';\nimport { tableEllipsis } from 'shared/styles/mixins/ellipsis';\nimport ScrollableTable from 'shared/components/ScrollableTable';\nimport { ValueFormatters } from 'mk-pattern-library-react';\nconst ScrollbleContainer = styled.div`\n div:nth-of-type(1) {\n max-height: 380px;\n }\n`;\n\nconst ModalAlignCenter = styled.div`\n position:fixed;\n top:50%;\n left:50%;\n transform: translate(-50%,-50%);\n`;\n\nconst ModalContent = styled.div`\n display: flex;\n flex-direction: column;\n padding-top: 20px;\n\n ${Divider} {\n display: block;\n margin: 1rem 0;\n }\n`;\n\nclass OrderSummaryModal extends Component {\n\n Columns = (props) => {\n const columns = [\n {\n attrs: {\n role: \"rowheader\",\n },\n dataField: 'orderId',\n text: props.orderIdText,\n style: leftAlignedCellStyle,\n headerStyle: leftAlignedHeaderStyle,\n columnFlex: 0.60,\n },\n {\n dataField: 'investorLongName',\n text: props.investorNameText,\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 1.50,\n },\n {\n dataField: 'investorType',\n text: props.investorTypeText,\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 1,\n },\n {\n dataField: 'investorCountry',\n text: props.investorCountryText,\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 0.95,\n },\n {\n dataField: 'currency',\n text: props.currencyText,\n headerStyle: leftAlignedHeaderStyle,\n style: rightAlignedCellStyle,\n columnFlex: 0.60,\n },\n {\n dataField: 'orderAmount',\n text: props.orderAmountText,\n headerStyle: leftAlignedHeaderStyle,\n style: rightAlignedCellStyle,\n columnFlex: 0.75,\n formatter: ValueFormatters.commaDecimalFormatter,\n },\n {\n dataField: 'limitSecurity',\n text: props.limitSecurityText,\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 1,\n },\n {\n dataField: 'trancheName',\n text: props.trancheNameText,\n headerStyle: leftAlignedHeaderStyle,\n style: {\n ...leftAlignedCellStyle,\n ...tableEllipsis\n },\n columnFlex: 1,\n },\n {\n dataField: 'externalSourceLastModified',\n text: props.dateText,\n headerClasses: '',\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 0.80,\n formatter: (value) => (\n dateFormatter('localTime', value)\n ),\n }\n ];\n\n const amendedOrderColumn = {\n dataField: 'amendedAmount',\n text: props.amendedAmountText,\n headerStyle: leftAlignedHeaderStyle,\n style: rightAlignedCellStyle,\n columnFlex: 0.65,\n formatter: ValueFormatters.commaDecimalFormatter,\n }\n\n if (this.props.bookEvolution) {\n columns.splice(6, 0, amendedOrderColumn)\n }\n\n return columns;\n }\n\n closeModalClick = () => {\n this.props.closeOrderSummaryDetailView(this.props.modalId);\n }\n\n render() {\n const { isModalOpen, modalSummary } = this.props;\n return (\n \n \n this.props.tabChangeEvent(events.ORDERS_SUMMARY_DEMAND_TAB_BY_INVESTOR_TYPE)}\n >\n \n this.handleChartTabViewToggle(\"lowest\")}\n >\n \"}\n replace={[\n [\"\", `${ValueFormatters.commaDecimalFormatter(dealsData.dealTotalDemandSummary.demandAtBottomSharePrice.sharePrice)} (${dealsData.dealCurrency})`]\n ]}\n defaultText={`Demand @ ${ValueFormatters.commaDecimalFormatter(dealsData.dealTotalDemandSummary.demandAtBottomSharePrice.sharePrice)} (${dealsData.dealCurrency})`}\n />\n \n\n this.handleChartTabViewToggle(\"all\")}\n >\n \n\n {\n this.state.chartTabView === 'lowest' && (\n this.props.tabChangeEvent(events.ORDERS_SUMMARY_DEMAND_TAB_BY_COUNTRY)}\n >\n \n this.handleChartTabViewToggle(\"lowest\")}\n >\n \"}\n replace={[\n [\"\", `${ValueFormatters.commaDecimalFormatter(dealsData.dealTotalDemandSummary.demandAtBottomSharePrice.sharePrice)} (${dealsData.dealCurrency})`]\n ]}\n defaultText={`Demand @ ${ValueFormatters.commaDecimalFormatter(dealsData.dealTotalDemandSummary.demandAtBottomSharePrice.sharePrice)} (${dealsData.dealCurrency})`}\n />\n \n\n this.handleChartTabViewToggle(\"all\")}\n >\n \n\n\n {\n this.state.chartTabView === 'lowest' && (\n {\n this.props.tabChangeEvent(events.ORDERS_SUMMARY_DEMAND_TAB_BY_DAY);\n }}\n >\n \n
\n \n \n \n \n \n \n
\n \n \n }\n />\n )\n }\n}\n\nconst mapStateToProps = (state) => ({\n isModalOpen: state.orderBookData.isModalOpen,\n modalSummary: state.orderBookData.modalSummary,\n})\n\nconst mapDispatchToProps = dispatch => ({\n closeOrderSummaryDetailView: () => dispatch(closeOrderSummaryDetailView())\n})\n\nexport default compose(\n connect(mapStateToProps, mapDispatchToProps),\n withTranslate((translate) => ({\n orderIdText: translate('orders.orderId', 'Order Id'),\n issuerNameText: translate('orders.issuer_name', 'Issuer Name'),\n investorNameText: translate('orders.investor_name', 'Investor Name'),\n investorTypeText: translate('orders.investor_types', 'Investor Type'),\n investorCountryText: translate('orders.investor_country', 'Investor Country'),\n currencyText: translate('orders.currency', 'Currency'),\n orderAmountText: translate('orders.order_amount', 'Order Amount') + ' (m)',\n limitSecurityText: translate('orders.limit_security', 'Limit Security'),\n trancheNameText: translate('orders.tranche_name', 'Tranche Name'),\n dateText: translate('orders.date_time_entered', 'Date and Time entered'),\n amendedAmountText: translate('orders.amended_amount', 'Amended Amount') + ' (m)',\n })),\n)(OrderSummaryModal);\n","\nexport const landingDimensions = {\n // tile\n TILE_HEIGHT: 225,\n TILE_WIDTH: 280,\n};\n","import React from 'react';\nimport styled from 'styled-components';\n\nimport { FontIcon } from 'shared/components/Icon';\n\nimport { backgrounds, typography, components, fontColors } from 'shared/styles/variables/theme';\n\nimport { landingDimensions } from '../Landing.styles';\n\nexport const TileContainerOuter = styled.div`\n padding: 0px;\n width: ${landingDimensions.TILE_WIDTH}px;\n min-width: ${landingDimensions.TILE_WIDTH}px;\n max-width: ${landingDimensions.TILE_WIDTH}px;\n height: ${landingDimensions.TILE_HEIGHT}px;\n background: ${backgrounds.white};\n border: 1px solid ${backgrounds.gray};\n opacity: 0.9;\n`;\n\nexport const TileContentInner = styled.div`\n padding: 12px;\n`;\n\nexport const TileHeader = styled.h3`\n margin: 0px;\n padding: 12px;\n font-size: ${typography.sizes['13px']};\n line-height: 1;\n border-bottom: 1px solid ${backgrounds.gray};\n\n a {\n ${components.link['--default']}\n\n font-family: ${typography.family.normal};\n\n &:focus {\n ${components.link['--state']['--focus']}\n }\n\n &:hover {\n ${components.link['--state']['--hover']}\n\n span::before {\n text-decoration: none;\n }\n }\n }\n`;\n\nexport const TileContent = styled.div``;\n\nexport const DateContent = styled.div`\n color: ${fontColors.darkGrey};\n font-size: ${typography.sizes['11px']};\n`;\n\nconst linkContainerIconStyle = {\n verticalAlign: 'middle',\n marginLeft: 7,\n color: '#DB0011',\n fontSize: 10,\n display: 'inline-block',\n marginTop: -2,\n};\n\nexport const ChevronIcon = React.memo(props =>\n \n \n \n {investorNameText}: \n \n\n \n {trancheNameText}: \n \n\n {\n !isAmenededOrderSummary &&\n <>\n \n {dateText} : \n \n\n \n {timeIntervalText}: \n \n \n }\n \n
\n )\n}\n\nconst mapStateToProps = (state) => ({\n selectedInvestor: getSelectedInvestor(state),\n selectedTranche: getSelectedTranche(state),\n selectedInterval: getSelectedInterval(state),\n selectedDate: getSelectedDate(state),\n});\n\nconst mapDispatchToProps = dispatch => ({\n selectOrderSummaryDropdown: (investorId, trancheId, interval, date) => dispatch(selectOrderSummaryDropdown(investorId, trancheId, interval, date)),\n filterOrderSummary: (dealId, interval, investorId, trancheId, loader, isFilter) => dispatch(filterOrderSummary(dealId, investorId, trancheId, interval, loader, isFilter)),\n filterBookEvolutionSummary: (dealId, interval, investorId, trancheId, loader, isFilter) => dispatch(filterBookEvolutionSummary(dealId, investorId, trancheId, interval, loader, isFilter)),\n});\n\nexport default compose(\n connect(mapStateToProps, mapDispatchToProps),\n)(OrderSummaryDropdownList)\n","import React from 'react';\nimport {\n LineChart,\n ResponsiveContainer,\n Legend,\n Line,\n XAxis,\n YAxis,\n Tooltip,\n CartesianGrid\n} from 'recharts';\nimport { extendedColorsForLineChart } from 'mk-pattern-library-react/utils/visualisationColors';\nimport { TileContentInner, EmptyContent } from 'Landing/dcm/Tiles/styles.js';\nimport { SvgIcon } from 'shared/components/Icon';\nimport styled from 'styled-components';\nimport { ValueFormatters } from 'mk-pattern-library-react';\n\nconst AmendedOrderLegendsContainer = styled.div`\n width: 1162px;\n text-align: center;\n margin-left: -40px\n`;\n\nconst AmendedOrderLegendsUlList = styled.ul`\n margin: 5px 0 10px !important;\n padding: 0px;\n text-align: center;\n`;\n\nconst AmendedOrderLegendsList = styled.li`\n display: inline-block;\n margin-right: 10px;\n`;\n\nconst AmendedOrderLegendsWrapper = styled.div`\n display: inline-block;\n &:not(:last-child) {\n margin-right: 40px;\n }\n`;\n\nconst AmendedOrderLegendItem = styled.span``;\n\nconst legendIconStyle = {\n height: '14px',\n width: '14px',\n display: 'inline-block',\n verticalAlign: 'middle',\n marginRight: '4px'\n}\n\nconst getChartSlices = (lineChartSummary, lineChartList, chartLabel) => {\n switch (chartLabel) {\n case 'bookEvaluation':\n case 'orderSummary': {\n const tranches = Object.keys(lineChartSummary[0]);\n const filteredTrancheList = lineChartList.filter(i => tranches.includes(i.key));\n const isAnimation = filteredTrancheList.length === 1 ? false : true\n return filteredTrancheList.map((tranche, index) => {\n const color = extendedColorsForLineChart(index, tranche.key);\n return \n \n \n {xAxisLabel}}\n />\n {yAxisLabel}}\n />\n {\n chartLabel === 'amendedOrderSummary' ?\n :\n \n }\n {\n return `${tooltipLabel}: ${value}`\n }\n }\n />\n {getChartSlices(lineChartSummary, lineChartList, chartLabel)}\n \n \n
:\n \n \n {\n props.tabChangeEvent(\n events.ORDERS_SUMMARY_DEMAND_TAB_BY_REGION\n );\n }}\n >\n {\n props.tabChangeEvent(\n events.ORDERS_SUMMARY_DEMAND_TAB_BY_INVESTOR_TYPE\n );\n }}\n >\n {\n props.tabChangeEvent(\n events.ORDERS_SUMMARY_DEMAND_TAB_BY_COUNTRY\n );\n }}\n >\n \n
\n \n \n \n \n {isOrderSummaryEnable ? (\n \n \n Note: Time interval is not to scale.\n \n \n ) : (\n \n \n {props.notAvailable}\n \n \n )}\n \n \n {isOrderSummaryEnable ? (\n \n \n Point in time cumulative total\n \n \n ) : (\n \n \n {props.notAvailable}\n \n \n )}\n \n \n
\n \n \n \n setTheadRef(data)}\n style={{ width: `${tableStyle}` }}\n list={orderSummaryList}\n >\n \n \n {dateText}\n \n\n \n {timeEntered}\n \n {orderSummaryList.trancheOrders.map(\n (item, index) =>\n item.count > 0 && (\n \n {item.trancheName+ \" (m)\"}\n \n )\n )}\n \n \n {\n orderSummaryList.amendedOrderIdList.map((id, index) => (\n \n Order ID - {id.orderId}\n \n ))\n }\n \n \n \n {orderSummaryList.orderSummary.map((order, index) => {\n return (\n \n \n {order.dateEntered\n ? dateFormatter('localDate', order.dateEntered)\n : ''}\n \n \n {order.timeEntered}\n \n {\n orderSummaryList.amendedOrderIdList.map((id, index) => (\n \n {ValueFormatters.commaDecimalFormatter(order[id.orderId])}\n \n ))\n }\n \n );\n })}\n \n \n
\n );\n}\n\nexport default AmendedSummaryTable;","import React, { useState, useEffect } from 'react';\nimport { connect } from 'react-redux';\nimport { Row, Col } from 'react-bootstrap';\nimport { compose } from 'recompose';\nimport styled from 'styled-components';\nimport _ from \"lodash\";\n\nimport { updateCurrentTranche } from 'actions/OrderBookActions';\nimport { getTrancheTitles, getCurrentTranche, getAmendedOrderSummaryData, getInvestorNames, getTrancheLists, getSelectedInvestor, getSelectedTranche } from 'selectors';\n\nimport TranslationText, { translationString } from 'translations/TranslationText';\nimport withLanguage from 'translations/withLanguage';\nimport withTranslate from 'shared/hoc/withTranslate';\n\nimport OrderbookHeader from '../../shared/summary/OrderbookHeader';\n// analytics\nimport { featurePageIds } from 'constants/featurePages';\nimport withAnalytics from 'shared/hoc/withAnalytics';\nimport { ALL_INVESTORS, ALL_TRANCHES } from 'constants/orders';\n\n// tabs\nimport { tabIds, allTranchesAmendedSummarySubTabs } from 'constants/tabIds';\nimport HorizontalTab from 'shared/accessibility/components/HorizontalTabs/HorizontalTab';\nimport HorizontalTabs from 'shared/accessibility/components/HorizontalTabs';\n// import OrderSummaryLineChart from '../OrderSummary/OrderSummaryLineChart';\nimport AmendedSummaryTable from \"./AmendedSummaryTable\";\nimport OrderSummaryDropdownList from \"../OrderSummary/OrderSummaryDropdownList\"\nimport { TileContentInner, EmptyContent } from 'Landing/dcm/Tiles/styles.js';\nimport { dateFormatter } from '../../SharedTableComponents/formatters';\nimport { Sorters } from 'mk-pattern-library-react';\nimport Loading from 'shared/components/Loading';\n\nconst LoadingContainer = styled.div`\n width: 100%;\n height: calc(100vh - 280px);\n position: relative;\n`;\n\nconst LoadingWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%,-50%);\n`;\n\nconst DropDownPicker = styled.div`\n margin: 30px 0px\n`;\n// const CumulativeTextWrapper = styled.div`\n// position: absolute;\n// top: 10px;\n// color: #000;\n// right: 10px;\n// font-weight: 600;\n// `;\nconst AmendedOrderSummaryContainer = (props) => {\n\n const [amendedOrderSummaryData, setAmendedOrderSummaryData] = useState([]);\n const [amendedInvestorList, setAmendedInvestorList] = useState([])\n const [orderSummary, setOrderSummary] = useState([])\n const [trancheOrders, setTrancheOrders] = useState([])\n const [amendedOrderIdList, setAmendedOrderIdList] = useState([])\n\n useEffect(() => {\n props.viewChange();\n }, [])\n\n useEffect(() => {\n getUpdatedStructuredOrders();\n }, [props.amendedOrderSummaryData])\n\n useEffect(() => {\n getFilteredStructuredOrders()\n }, [amendedInvestorList.length, props.selectedInvestor, props.selectedTranche, amendedOrderSummaryData])\n\n const handleTrancheNavClick = (selectedTranche) => {\n props.updateCurrentTranche(selectedTranche.id);\n }\n\n const getUpdatedStructuredOrders = () => {\n const amendedResultData = JSON.parse(JSON.stringify(props.amendedOrderSummaryData));\n\n // To Destructure the API response\n const structuredIndividualOrders = amendedResultData\n .map((item) => item.individualOrders\n .map((order) => order.orders)\n .reduce((acc, val) => acc.concat(val), []))\n .reduce((acc, val) => acc.concat(val), []);\n\n // Trimming the Extra Spaces for Investor Names\n structuredIndividualOrders.forEach((item) => {\n item.investorLongName = item.investorLongName.trim();\n })\n\n // Getting All Unique Amended Investor Name List from Destructure API Response\n const amendedInvestorList = [...new Map(structuredIndividualOrders.map((item) =>\n [item[\"investorLongName\"], item])).values()]\n .sort((a, b) => a.investorLongName.trim() < b.investorLongName.trim() ? -1 : 1)\n .map((item) => {\n return {\n key: item.investorID,\n value: item.investorLongName,\n label: item.investorLongName,\n }\n })\n\n setAmendedOrderSummaryData(structuredIndividualOrders)\n setAmendedInvestorList(amendedInvestorList)\n }\n\n const getFilteredStructuredOrders = () => {\n const orderSummary = [];\n const sortedOrderSummary = [];\n let filteredData = [];\n let filteredTrancheData = [];\n\n const isIntialInvestor = _.isEqual(props.selectedInvestor, ALL_INVESTORS); // Check Wheather Default Investor Name is Selected\n const isIntialTranche = _.isEqual(props.selectedTranche, ALL_TRANCHES); // Check Wheather Default Tranche Name is Selected\n\n // Filter the Data as per Investor Names\n filteredData = amendedOrderSummaryData.filter((order) => order.investorLongName === (isIntialInvestor ? amendedInvestorList[0].value : props.selectedInvestor.value))\n\n // Filter the Data as per Tranche Names\n !isIntialTranche ? filteredTrancheData = filteredData.filter((order) => order.trancheName === props.selectedTranche.value) : filteredTrancheData = filteredData;\n\n // Formatting the Existing Received Date to Date-Month\n filteredTrancheData.forEach((item) => {\n item[item.orderId] = item.orderAmount;\n item.dateTimeInterval = dateFormatter('dateMonth', item.externalSourceLastModified) + ' ' + item.timeEntered\n })\n\n // Sort the Orders Ascending (Date)\n filteredTrancheData.sort((a, b) => Sorters.doubleSort('dateEntered', a, b, 'asc', 'externalSourceLastModified'))\n\n const sameData = JSON.parse(JSON.stringify(filteredTrancheData));\n\n // If next order has same date then display only time entry, remove the date.\n filteredTrancheData.forEach((order, index) => {\n if (filteredTrancheData.length > 1) {\n if (index !== filteredTrancheData.length - 1) {\n order = getFilterdData(sameData, filteredTrancheData, index, index + 1);\n } else {\n order = getFilterdData(sameData, filteredTrancheData, index, index - 1);\n }\n orderSummary.push(order);\n }\n else orderSummary.push(order);\n })\n\n const orderIdList = orderSummary.map((item) => {\n return {\n orderId: item.orderId,\n trancheName: item.trancheName,\n }\n });\n\n // Separate all Unique IDs from order list for Table Header Columns\n const amendedOrderIdList = [...new Map(orderIdList.map((item) => [item[\"orderId\"], item])).values()].sort((a, b) => a.trancheName < b.trancheName ? -1 : 1);\n\n orderSummary.forEach((item) => {\n const obj = {}\n amendedOrderIdList.forEach((subItem) => {\n obj[subItem.orderId] = subItem.orderId === item.orderId ? item.orderAmount : null;\n obj['dateEntered'] = item.dateEntered;\n obj['timeEntered'] = item.timeEntered;\n obj['dateTimeInterval'] = item.dateTimeInterval;\n });\n sortedOrderSummary.push(obj)\n });\n\n const updatedOrderSummary = getMappedAmendedOrderList(sortedOrderSummary, amendedOrderIdList)\n\n // Get the Column Count for Each Order\n const trancheOrders = props.trancheNameList.map((order) => {\n return {\n count: getColumnCount(amendedOrderIdList, order.value),\n trancheName: order.value,\n }\n }).sort((a, b) => a.trancheName < b.trancheName ? -1 : 1)\n\n setOrderSummary(updatedOrderSummary)\n setTrancheOrders(trancheOrders)\n setAmendedOrderIdList(amendedOrderIdList)\n }\n\n const getMappedAmendedOrderList = (arr, amendedOrderIdList) => {\n return arr.reduce((acc, val) => {\n const index = acc.findIndex(el => el.dateEntered === val.dateEntered && el.timeEntered === val.timeEntered);\n if (index !== -1) {\n amendedOrderIdList.forEach((id, i) => {\n acc[index][id.orderId] = val[id.orderId] ? val[id.orderId] : acc[index][id.orderId]\n });\n } else {\n acc.push(val);\n };\n return acc;\n }, []);\n }\n\n const getFilterdData = (data, structuredIndividualOrders, index, nextIndex) => {\n if (nextIndex !== 0 && index < nextIndex) {\n if ((structuredIndividualOrders[index].dateEntered === structuredIndividualOrders[nextIndex].dateEntered) &&\n (structuredIndividualOrders[index].dateTimeInterval !== structuredIndividualOrders[nextIndex].dateTimeInterval)) {\n data[nextIndex].dateEntered = \"\";\n data[nextIndex].dateTimeInterval = data[nextIndex].timeEntered;\n }\n }\n return data[index];\n }\n\n const getColumnCount = (orderIdList, trancheName) => {\n return orderIdList.filter((item) => item.trancheName === trancheName).length\n }\n\n const active = { id: props.currentTrancheId }\n const currentTrancheData = props.currentTrancheData;\n\n const isAmendedOrderSummaryEnable = orderSummary && orderSummary.length;\n\n const trancheTitles = props.trancheTitles.map(t => ({\n ...t,\n btnAriaLabel: translationString(\n 'orders.open_tranche_\n {\n currentTrancheData ? (\n
\n );\n}\n\nconst mapStateToProps = (state) => ({\n currentTrancheData: getCurrentTranche(state),\n trancheTitles: getTrancheTitles(state),\n orderData: state.orderBookData.orderData,\n currentTrancheId: state.orderBookData.currentTrancheId,\n dealId: state.utility.dealsData.dealId,\n dateReceived: state.orderBookData.dateReceived,\n amendedOrderSummaryData: getAmendedOrderSummaryData(state),\n investorNameList: getInvestorNames(state),\n trancheNameList: getTrancheLists(state),\n selectedInvestor: getSelectedInvestor(state),\n selectedTranche: getSelectedTranche(state),\n loading: state.orderBookData.dataFetching,\n});\n\nconst mapDispatchToProps = dispatch => ({\n updateCurrentTranche: (trancheId, loader) => dispatch(updateCurrentTranche(trancheId, 'DCM')),\n});\n\nexport default compose(\n withLanguage,\n connect(mapStateToProps, mapDispatchToProps),\n withAnalytics((ev, view) => ({\n viewChange: () => view(featurePageIds.ORDERBOOK_AMENDED_PAGE),\n })),\n withTranslate((translate, props) => ({\n viewChart: translate('orders.view_chart', 'View Chart'),\n viewTable: translate('orders.view_table', 'View Table'),\n notAvailable: translate('others.content_not_yet_available', 'Content Not Yet Available'),\n investorNameText: translate('orders.investor_name', 'Investor Name'),\n trancheNameText: translate('orders.tranche_name', 'Tranche Name'),\n dateText: translate('orders.date', 'Date'),\n timeEntered: translate('orders.time_entered', 'Time Entered'),\n })),\n)(AmendedOrderSummaryContainer)\n","import React, { Component } from \"react\";\nimport styled from \"styled-components\";\nimport PopupSystem from \"shared/components/PopupSystem\";\nimport Popup, { Divider } from \"shared/components/Popup\";\nimport { dateFormatter } from \"../../SharedTableComponents/formatters\";\nimport {\n leftAlignedCellStyle,\n rightAlignedCellStyle,\n leftAlignedHeaderStyle,\n} from \"../../shared/table/styles\";\nimport ScrollableTable from \"shared/components/ScrollableTable\";\nimport { ValueFormatters } from \"mk-pattern-library-react\";\nconst ScrollbleContainer = styled.div`\n div:nth-of-type(1) {\n max-height: 380px;\n }\n`;\n\nconst textStyle = {\n textTransform: 'capitalize'\n}\n\nconst ModalAlignCenter = styled.div`\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`;\n\nconst ModalContent = styled.div`\n display: flex;\n flex-direction: column;\n padding-top: 20px;\n\n ${Divider} {\n display: block;\n margin: 1rem 0;\n }\n`;\n\nclass BookEvolutionsOrderSummaryDetailView extends Component {\n Columns = (props) => {\n const columns = [\n {\n attrs: {\n role: \"rowheader\",\n },\n dataField: \"orderId\",\n text: props.orderIdText,\n style: leftAlignedCellStyle,\n headerStyle: leftAlignedHeaderStyle,\n columnFlex: 0.6,\n },\n {\n dataField: \"investorLongName\",\n text: props.investorNameText,\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 1.5,\n },\n {\n dataField: \"orderAmount\",\n text: props.orderAmountText,\n headerStyle: leftAlignedHeaderStyle,\n style: rightAlignedCellStyle,\n columnFlex: 0.75,\n formatter: ValueFormatters.commaDecimalFormatter,\n },\n {\n dataField: \"limitSecurity\",\n text: props.limitSecurityText,\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 1,\n },\n {\n dataField: \"externalSourceLastModified\",\n text: props.dateText,\n headerClasses: \"\",\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 0.8,\n formatter: (value) => dateFormatter(\"localTime\", value),\n },\n {\n dataField: \"status\",\n text: props.statusText,\n headerClasses: \"\",\n headerStyle: leftAlignedHeaderStyle,\n style: leftAlignedCellStyle,\n columnFlex: 0.8,\n formatter: (value, data, index) => (\n \n \n \n \n \n ):(\n \n \n : null\n }\n
\n )\n }\n \n
\n ) : (\n \n \n {/* \n {\n isAmendedOrderSummaryEnable ? (\n \n \n Note: Time interval is not to scale.\n \n \n ) : (\n \n \n {props.notAvailable}\n \n \n )\n }\n */}\n \n {\n isAmendedOrderSummaryEnable ? (\n \n \n {props.notAvailable}\n \n \n )\n }\n \n \n
\n \n \n
\n )\n }\n {data['status'].toLowerCase()}
\n )\n },\n ];\n\n return columns;\n };\n\n closeModalClick = () => {\n this.props.setIsModalOpen(false);\n };\n\n render() {\n const { isModalOpen, modalSummary } = this.props;\n return (\n\n \n \n \n \n
\n \n \n }\n />\n );\n }\n}\n\nexport default BookEvolutionsOrderSummaryDetailView;\n","import React, { useState, useEffect } from \"react\";\nimport Table from \"../TableContainer/Table\";\nimport TableHead from \"../TableContainer/TableHead\";\nimport TableBody from \"../TableContainer/TableBody\";\nimport TableRow from \"../TableContainer/TableRow\";\nimport TableHeaderCell from \"../TableContainer/TableHeaderCell\";\nimport TableColumnCell from \"../TableContainer/TableColumnCell\";\nimport { Sorters } from \"mk-pattern-library-react\";\nimport { DEFAULT_ALL_DAY, DEFAULT_ALL } from \"constants/orders\";\nimport { TileContentInner, EmptyContent } from \"Landing/dcm/Tiles/styles.js\";\nimport { Icon } from \"mk-pattern-library-react\";\nimport BookEvolutionsOrderSummaryDetailView from \"./BookEvolutionOrderSummaryDetailView\";\nimport \"mk-pattern-library-react/styles/table-amended-order.scss\";\nimport { dateFormatter } from \"../../SharedTableComponents/formatters\";\nimport styled from 'styled-components';\n\nconst timeIntervalStyle = {\n textAlign: \"center\",\n};\n\nconst timeIntervalStyleHighlighted = {\n textAlign: \"center\",\n backgroundColor: \"yellow\",\n};\n\nconst stageTextStyle = {\n fontSize: \"10px\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n cursor: \"pointer\",\n};\n\nconst iconStyle = {\n fontSize: 6,\n color: \"#ff0000\",\n marginRight: \"3px\",\n};\n\nconst NoWrapRow = styled.div`\n width: 200px;\n overflow: hidden;\n text-overflow: ellipsis;\n padding:3px;\n`\n\nexport const pickCaret = (direction, activeSort) => {\n const caretColor = activeSort ? \"#4D6474\" : \"#c0c0c0\";\n if (direction === \"asc\") {\n return (\n \n \n
\n
\n )}\n \n );\n};\n\nexport default AmendedOrderInvestorTable;\n","import React, { } from \"react\";\nimport styled from \"styled-components\";\nimport { SvgIcon } from \"shared/components/Icon\";\nimport {\n STATIC_MINUTES,\n DEFAULT_TIME_INTERVAL,\n} from \"constants/orders\";\nimport TextField from \"@mui/material/TextField\";\nimport Autocomplete from \"@mui/material/Autocomplete\";\nimport { IconButton } from \"@mui/material\";\nimport { Icon } from \"mk-pattern-library-react\";\nimport Popup from \"shared/components/Popup\";\nimport PopupSystem from \"shared/components/PopupSystem\";\nimport { typography } from \"shared/styles/variables/theme\";\n\nconst styles = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n};\n\nconst trancheContainerStyles = {\n ...styles,\n flexDirection: \"column\",\n alignItems: \"start\",\n};\n\nconst TranchesDropDownContainer = styled.div`\n ${trancheContainerStyles},\n span {\n margin: 0 0 10px;\n }\n`;\n\nconst closeIconStyle = {\n right: \"15px\",\n top: \"15px\",\n cursor: \"pointer\",\n};\n\nconst arrowDropdownIconStyle = {\n transform: \"rotate(90deg)\",\n marginTop: \"2px\",\n width: \"18px\",\n height: \"18px\",\n};\n\nfunction SpecificTimePopup({\n isModalOpen,\n setIsModalOpen,\n hour,\n min,\n setHour,\n setMin,\n onDropdownChange,\n selectedTranche,\n selectedInvestorType,\n selectedDate,\n}) {\n const isValidHour = (hourValue) => {\n return hourValue && hourValue < 24 && hourValue >= 0;\n };\n\n const disabledStyle = () => {\n if (!isValidHour(hour)) {\n return {\n pointerEvents: \"none\",\n color: \"#ccc\",\n };\n } else {\n return {};\n }\n };\n return (\n \n {\" \"}\n setIsModalOpen(false)}\n clickableElement={null}\n content={\n {\n let hourToDisplay = hour.length === 1 ? `0${hour}` : hour;\n let minToDisplay =\n min.value.length === 1 ? `0${min.value}` : min.value;\n onDropdownChange(\n undefined,\n selectedTranche,\n selectedDate,\n DEFAULT_TIME_INTERVAL,\n {\n key: 1,\n value: `${hour}:${min.value} to 23:59`,\n label: `${hourToDisplay}:${minToDisplay} to 00:00`,\n disableTimeInterval: true,\n },\n selectedInvestorType,\n false\n );\n setIsModalOpen(false);\n }}\n secondaryButtonKey=\"login_screen.ok\"\n >\n {\n setIsModalOpen(false);\n }}\n sx={{\n position: \"absolute\",\n right: 8,\n top: 8,\n }}\n >\n setHour(e.target.value)}\n />\n \n \n {\"Minute\"}:\n \n \n \n }\n />\n
\n );\n}\n\nexport default SpecificTimePopup;\n","import React, { useState, useEffect } from \"react\";\nimport { isEqual } from \"lodash\";\nimport { compose } from \"recompose\";\nimport { connect } from \"react-redux\";\nimport TextField from \"@mui/material/TextField\";\nimport { IconButton } from \"@mui/material\";\nimport { Icon } from \"mk-pattern-library-react\";\nimport Table from \"../TableContainer/Table\";\nimport TableHead from \"../TableContainer/TableHead\";\nimport TableBody from \"../TableContainer/TableBody\";\nimport TableRow from \"../TableContainer/TableRow\";\nimport TableHeaderCell from \"../TableContainer/TableHeaderCell\";\nimport TableColumnCell from \"../TableContainer/TableColumnCell\";\nimport Popup from \"shared/components/Popup\";\nimport PopupSystem from \"shared/components/PopupSystem\";\nimport { typography } from \"shared/styles/variables/theme\";\nimport { SvgIcon } from \"shared/components/Icon\";\nimport flexbox from \"shared/styles/mixins/flexbox\";\nimport styled from \"styled-components\";\nimport { updateStages } from \"actions/OrderBookActions\";\nimport { getStages } from \"selectors\";\nimport Autocomplete from \"@mui/material/Autocomplete\";\nimport { dateFormatter } from \"../../SharedTableComponents/formatters\";\n\nconst IconContainer = styled.div`\n ${flexbox(\"row\", \"center\", \"flex-start\")}\n cursor: pointer;\n`;\n\nconst closeIconStyle = {\n right: \"15px\",\n top: \"15px\",\n cursor: \"pointer\",\n};\n\nconst trancheContainerStyles = {\n display: \"flex\",\n justifyContent: \"space-between\",\n flexDirection: \"column\",\n alignItems: \"start\",\n};\n\nconst arrowDropdownIconStyle = {\n transform: \"rotate(90deg)\",\n marginTop: \"2px\",\n width: \"18px\",\n height: \"18px\",\n};\nconst TranchesDropDownContainer = styled.div`\n ${trancheContainerStyles},\n`;\nconst useStateWithCallback = (initialValue) => {\n const [value, setValue] = useState(initialValue);\n\n const setValueAndCallback = (newValue, callback) => {\n setValue((prevValue) => {\n if (callback) {\n callback(prevValue, newValue);\n }\n return newValue;\n });\n };\n\n return [value, setValueAndCallback];\n};\nfunction SetStagesPopup({\n isModalOpen,\n setIsModalOpen,\n updateStages,\n stages,\n dealId,\n allDatesList,\n}) {\n const [arrayOfStages, setArrayOfStages] = useStateWithCallback([]);\n const [dataNotLoaded, setDataNotLoaded] = useState(true);\n\n useEffect(() => {\n setArrayOfStages([...stages], () => {\n if (isModalOpen) setDataNotLoaded(false);\n });\n }, [stages]);\n\n const checkIfDateSelected = (index) => {\n if (arrayOfStages[index].stageDate) {\n return true;\n }\n return false;\n };\n\n const isValidHour = (hourValueString) => {\n const hourValue = hourValueString\n ? parseInt(hourValueString)\n : hourValueString;\n return hourValue === \"\" || (hourValue < 24 && hourValue >= 0);\n };\n\n const isStagesDataChanged = (initialStageData, newStageData) => {\n return !isEqual(initialStageData, newStageData);\n };\n const isValidMinute = (minValueString) => {\n const minValue = minValueString ? parseInt(minValueString) : minValueString;\n return minValue === \"\" || (minValue < 60 && minValue >= 0);\n };\n\n const handleChange = (event, index, clearTimeValue, dateDropdownvalue) => {\n const tempArrayOfStages = [...arrayOfStages];\n let objectToSet = { ...tempArrayOfStages[index] };\n let stageTimeToSet = objectToSet.stageTime;\n let stageDateToSet = objectToSet.stageDate;\n if (clearTimeValue) {\n objectToSet = { ...objectToSet, stageTime: \"\", stageDate: null };\n } else {\n let value =\n !event.target.value || event.target.value === \"0\"\n ? \"00\"\n : parseInt(event.target.value) !== 0 &&\n parseInt(event.target.value) < 10\n ? `0${event.target.value}`\n : parseInt(event.target.value);\n value = parseInt(value) > 9 ? parseInt(value) : `0${parseInt(value)}`;\n if (event.target.name === \"hour\") {\n if (!stageTimeToSet.length) {\n stageTimeToSet = `${value}:00`;\n } else {\n let hh = value;\n let mm = stageTimeToSet.split(\":\")[1];\n stageTimeToSet = `${hh}:${mm}`;\n }\n } else if (event.target.name === \"min\") {\n if (!stageTimeToSet.length) {\n stageTimeToSet = `00:${value}`;\n } else {\n let hh = stageTimeToSet.split(\":\")[0];\n let mm = value;\n stageTimeToSet = `${hh}:${mm}`;\n }\n } else {\n stageTimeToSet = stageTimeToSet ? stageTimeToSet : `00:00`;\n stageDateToSet = dateDropdownvalue;\n }\n objectToSet = {\n ...objectToSet,\n stageTime: stageTimeToSet,\n stageDate: stageDateToSet,\n };\n }\n tempArrayOfStages[index] = { ...objectToSet };\n let hour = stageTimeToSet ? stageTimeToSet.split(\":\")[0] : stageTimeToSet;\n let min = stageTimeToSet ? stageTimeToSet.split(\":\")[1] : stageTimeToSet;\n if (isValidMinute(min) && isValidHour(hour)) {\n setArrayOfStages([...tempArrayOfStages]);\n }\n };\n\n const disabledStyle = () => {\n if (!isStagesDataChanged(stages, arrayOfStages)) {\n return {\n pointerEvents: \"none\",\n color: \"#ccc\",\n };\n } else {\n return {};\n }\n };\n\n return (\n Hour :
\n\n {\n setIsModalOpen(false);\n setDataNotLoaded(true);\n }}\n clickableElement={null}\n content={\n {\n updateStages(dealId, arrayOfStages);\n setIsModalOpen(false);\n setDataNotLoaded(true);\n }}\n secondaryButtonKey=\"orders.save\"\n >\n {\n if (isStagesDataChanged(stages, arrayOfStages)) {\n if (\n window.confirm(\n \"Changes not saved . Are you sure you want to discard changes ?\"\n )\n ) {\n setArrayOfStages([...stages]);\n setIsModalOpen(false);\n setDataNotLoaded(true);\n }\n } else {\n setIsModalOpen(false);\n }\n }}\n sx={{\n position: \"absolute\",\n right: 8,\n top: 8,\n }}\n >\n
\n );\n}\n\nconst mapStateToProps = (state) => ({\n stages: getStages(state),\n});\n\nconst mapDispatchToProps = (dispatch) => ({\n updateStages: (dealId, data) => dispatch(updateStages(dealId, data)),\n});\n\nexport default compose(connect(mapStateToProps, mapDispatchToProps))(\n SetStagesPopup\n);\n","import React, { useEffect, useState } from \"react\";\nimport { compose } from \"recompose\";\nimport { connect } from \"react-redux\";\nimport styled from \"styled-components\";\nimport { SvgIcon } from \"shared/components/Icon\";\nimport {\n selectAmendedOrderByInvestorDropDown,\n filterBookEvolutionSummaryForAmendedOrderByInvestor,\n requestStages,\n setIsSetStagesModalOpen\n} from \"actions/OrderBookActions\";\nimport {\n TIME_INTERVALS,\n DEFAULT_ALL,\n TIME_RANGES,\n STATIC_MINUTES,\n DEFAULT_MIN,\n DEFAULT_TIME_INTERVAL,\n} from \"constants/orders\";\nimport {\n getSelectedInvestorType,\n getSelectedTranche,\n getSelectedInterval,\n getSelectedDate,\n getSelectedTimeRange,\n getIsSetStagesModalOpen\n} from \"selectors\";\nimport TextField from \"@mui/material/TextField\";\nimport Autocomplete from \"@mui/material/Autocomplete\";\nimport { Checkbox, HsbcButton } from \"mk-pattern-library-react\";\nimport SpecificTimePopup from \"./SpecificTimePopup\";\nimport SetStagesPopup from \"./SetStagesPopup\";\nimport { dateFormatter } from \"../../SharedTableComponents/formatters\";\n\nconst styles = {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n};\nconst trancheContainerStyles = {\n ...styles,\n flexDirection: \"column\",\n alignItems: \"start\",\n};\n\nconst DropDownContainer = styled.div`\n ${styles}\n justify-content: space-between;\n`;\n\nconst TranchesDropDownContainer = styled.div`\n ${trancheContainerStyles},\n span {\n margin: 0 0 10px;\n }\n`;\n\nconst arrowDropdownIconStyle = {\n transform: \"rotate(90deg)\",\n marginTop: \"2px\",\n width: \"18px\",\n height: \"18px\",\n};\n\nconst AmendedOrderDropdownFiltersList = ({\n dealId,\n selectedInvestorType,\n selectedTimeRange,\n selectedTranche,\n selectedInterval,\n selectedDate,\n investorTypeText,\n trancheNameText,\n timeIntervalText,\n allTranchelists,\n getDateSummary,\n dateText,\n isAmenededOrderSummary,\n orginalOrderbookData,\n selectAmendedOrderByInvestorDropDown,\n filterBookEvolutionSummaryForAmendedOrderByInvestor,\n isShowStagesChecked,\n setIsShowStagesChecked,\n requestStages,\n isSetStagesModalOpen,\n setIsSetStagesModalOpen\n}) => {\n const [investorTypeList, setInvestorTypeList] = useState([]);\n const [datesList, setDatesList] = useState([]);\n const [isFromSpecificTimeModalOpen, setIsFromSpecificTimeModalOpen] =\n useState(false);\n const [hour, setHour] = useState(\"00\");\n const [min, setMin] = useState(DEFAULT_MIN);\n\n useEffect(() => {\n if (orginalOrderbookData && orginalOrderbookData.length) {\n let datesArray = [];\n const getInvestorTypes = orginalOrderbookData.map((order) => {\n datesArray.push({\n label: dateFormatter(\"localDate\", order.dateEntered),\n value: dateFormatter(\"localDate\", order.dateEntered),\n });\n return {\n label: order.investorType,\n value: order.investorType,\n };\n });\n\n const uniqueInvestorTypes = getInvestorTypes\n .filter(\n (elem, index) =>\n getInvestorTypes.findIndex((obj) => obj.value === elem.value) ===\n index\n )\n .sort((a, b) => (a.value.trim() < b.value.trim() ? -1 : 1));\n const uniqueDates = datesArray.filter(\n (elem, index) =>\n datesArray.findIndex((obj) => obj.value === elem.value) === index\n );\n\n uniqueInvestorTypes.unshift(DEFAULT_ALL);\n setInvestorTypeList(uniqueInvestorTypes);\n setDatesList(uniqueDates);\n }\n }, []);\n\n const onDropdownChange = (\n e,\n trancheName,\n date,\n interval,\n timeRange,\n investorType,\n applyLocalFilter\n ) => {\n if (\n selectedTranche.value !== trancheName.value ||\n selectedInterval.value !== interval.value ||\n selectedDate.value !== date.value ||\n selectedTimeRange.value !== timeRange.value ||\n selectedInvestorType.value !== investorType.value\n ) {\n selectAmendedOrderByInvestorDropDown(\n trancheName,\n date,\n interval,\n timeRange,\n investorType\n );\n if (!applyLocalFilter) {\n filterBookEvolutionSummaryForAmendedOrderByInvestor(\n dealId,\n interval.key,\n 0,\n trancheName.key,\n true\n );\n }\n }\n };\n\n const initialSelectedTranche =\n selectedTranche.value === DEFAULT_ALL.value\n ? allTranchelists[0]\n : selectedTranche;\n const initialSelectedDate =\n selectedDate.value === DEFAULT_ALL.value ? getDateSummary[0] : selectedDate;\n\n return (\n Set Stages
\n\n\n \n \n \n Stages \n\n Date \n \n Event Time ( hh : mm ) ( GMT )\n \n \n \n \n {arrayOfStages.map((stage, index) => {\n let hour = stage.stageTime\n ? stage.stageTime.split(\":\")[0]\n : \"\";\n let min = stage.stageTime\n ? stage.stageTime.split(\":\")[1]\n : \"\";\n return (\n \n {`${stage.stageName} (${stage.stageShortname})`} \n \n \n \n \n \n handleChange(e, index)}\n disabled={\n dataNotLoaded || !checkIfDateSelected(index)\n }\n />\n handleChange(e, index)}\n disabled={\n dataNotLoaded || !checkIfDateSelected(index)\n }\n />\n \n \n {stage.stageTime &&\n stage.stageTime.length &&\n !dataNotLoaded && (\n {\n handleChange(e, index, true);\n }}\n >\n \n \n );\n })}\n \n \n
\n \n }\n />\n \n \n \n {trancheNameText}:\n {\n setIsShowStagesChecked(!isShowStagesChecked);\n onDropdownChange(\n undefined,\n selectedTranche,\n selectedDate,\n DEFAULT_TIME_INTERVAL,\n selectedTimeRange,\n selectedInvestorType,\n false\n );\n }}\n checked={isShowStagesChecked}\n />\n \n \n {investorTypeText}:\n {\n requestStages(dealId);\n setIsSetStagesModalOpen(true);\n }}\n className=\"btn-default btn-action btn-action-type text-action btn-margin-top\"\n size=\"normal\"\n >\n Set Stages\n \n \n {!isAmenededOrderSummary && (\n <>\n \n {dateText} :\n \n\n \n {timeIntervalText}:\n \n\n \n {\"Time Range (GMT)\"}:\n \n \n )}\n \n
\n );\n};\n\nconst mapStateToProps = (state) => ({\n selectedInvestorType: getSelectedInvestorType(state),\n selectedTimeRange: getSelectedTimeRange(state),\n selectedTranche: getSelectedTranche(state),\n selectedInterval: getSelectedInterval(state),\n selectedDate: getSelectedDate(state),\n isSetStagesModalOpen: getIsSetStagesModalOpen(state)\n});\n\nconst mapDispatchToProps = (dispatch) => ({\n filterBookEvolutionSummaryForAmendedOrderByInvestor: (dealId, interval, investorId, trancheName, isFilter) => dispatch(filterBookEvolutionSummaryForAmendedOrderByInvestor(dealId, interval, investorId, trancheName, isFilter)),\n selectAmendedOrderByInvestorDropDown: (selectedTranche, selectedDate, selectedInterval, selectedTimeRange, selectedInvestorType) => dispatch(selectAmendedOrderByInvestorDropDown(selectedTranche, selectedDate, selectedInterval, selectedTimeRange, selectedInvestorType)),\n requestStages: (dealId) => dispatch(requestStages(dealId)),\n setIsSetStagesModalOpen: (isModalOpen) => dispatch(setIsSetStagesModalOpen(isModalOpen))\n});\n\nexport default compose(connect(mapStateToProps, mapDispatchToProps))(\n AmendedOrderDropdownFiltersList\n);\n","import React, { useEffect, useState } from \"react\";\nimport { connect } from \"react-redux\";\nimport { Row, Col } from \"react-bootstrap\";\nimport _ from \"lodash\";\nimport { compose } from \"recompose\";\nimport styled from \"styled-components\";\n\nimport * as modalIds from \"constants/modalIds\";\nimport { ALL_INVESTORS, ALL_TRANCHES, DEFAULT_TIME_INTERVAL, DEFAULT_ALL } from \"constants/orders\";\nimport {\n updateCurrentTranche,\n openOrderSummaryDetailView,\n resetOrderBookDropDowns,\n filterBookEvolutionSummary,\n filterBookEvolutionSummaryForAmendedOrderByInvestor,\n requestStages,\n} from \"actions/OrderBookActions\";\nimport {\n getTrancheTitles,\n getCurrentTranche,\n getBookEvolutionData,\n getBookEvolutionDataForAmendedOrderByInvestor,\n getSelectedDate,\n getTrancheLists,\n getAmendedOrderSummaryData,\n getInvestorNames,\n getSelectedInvestor,\n getSelectedInvestorType,\n getSelectedTimeRange,\n getSelectedTranche,\n getStages\n} from \"selectors\";\n\nimport TranslationText, {\n translationString,\n} from \"translations/TranslationText\";\nimport withLanguage from \"translations/withLanguage\";\nimport withTranslate from \"shared/hoc/withTranslate\";\n\nimport OrderbookHeader from \"../../shared/summary/OrderbookHeader\";\n// analytics\nimport { featurePageIds } from \"constants/featurePages\";\nimport withAnalytics from \"shared/hoc/withAnalytics\";\n\n// tabs\nimport { tabIds, allTranchesBookEvolutionSubTabs } from \"constants/tabIds\";\nimport HorizontalTab from \"shared/accessibility/components/HorizontalTabs/HorizontalTab\";\nimport HorizontalTabs from \"shared/accessibility/components/HorizontalTabs\";\n\nimport OrderSummaryDetailView from \"../OrderSummary/OrderSummaryDetailView\";\nimport OrderSummaryTable from \"../OrderSummary/OrderSummaryTable\";\nimport AmendedOrderInvestorTable from \"../BookEvolution/AmendedOrderInvestorTable\";\nimport OrderSummaryDropdownList from \"../OrderSummary/OrderSummaryDropdownList\";\nimport { TileContentInner, EmptyContent } from \"Landing/dcm/Tiles/styles.js\";\nimport OrderSummaryLineChart from \"../OrderSummary/OrderSummaryLineChart\";\nimport { dateFormatter } from \"../../SharedTableComponents/formatters\";\nimport Loading from \"shared/components/Loading\";\nimport { Sorters } from \"mk-pattern-library-react\";\nimport AmendedOrderDropdownFiltersList from \"./AmendedOrderDropdownFiltersList\";\n\nimport Button from '@mui/material/Button';\nimport Dialog from '@mui/material/Dialog';\nimport AppBar from '@mui/material/AppBar';\nimport Toolbar from '@mui/material/Toolbar';\nimport IconButton from '@mui/material/IconButton';\nimport Typography from '@mui/material/Typography';\nimport CloseIcon from '@mui/icons-material/Cancel';\nimport Slide from '@mui/material/Slide';\nimport { DialogContent } from \"@material-ui/core\";\nimport FullScreenIcon from '@mui/icons-material/FitScreen';\nimport FullScreenTip from '@mui/material/Tooltip';\nimport { Box } from \"@mui/system\";\n\nconst Transition = React.forwardRef(function Transition(props, ref) {\n return \n \n {\n setShowAmendedOrderInvestorFilters(false);\n }}\n >\n {isOrderSummaryEnable ? (\n \n \n Note: Time interval is not to scale.\n \n \n ) : (\n \n {props.notAvailable} \n \n )}\n \n {\n setShowAmendedOrderInvestorFilters(false);\n }}\n >\n {isOrderSummaryEnable ? (\n \n \n ) : (\n \n {props.notAvailable} \n \n )}\n \n {\n setShowAmendedOrderInvestorFilters(true);\n }}\n >\n
\n \n \n \n \n \n \n \n \n \n \n \n Order By Investor\n \n \n \n \n \n \n \n \n \n \n
\n {LoadOrderByInvestorTable()}\n \n \n \n {showFilters && (
\n \n {LoadOrderByInvestorFilter()}\n
)}\n {LoadOrderByInvestorTable()}\n \n
\n )}\n \n
{`${props.demandPrice} (${props.currency}m)`}\n
\n {`${props.demandPrice} (${props.currency}m)`}\n
({props.timeZone})\n
({props.timeZone})\n
\n \n \n \n {this.props.trancheText} \n \n \n \n {this.props.totalOrderText} (m) \n \n {\n numberFormatters.million(this.props.order.firmAmount)\n }\n \n \n
\n \n {\n dateFormatters.dateTime(this.props.order.externalSourceLastModified, this.props.timeZone)\n }\n \n
\n ) : (\n \n isLrnReferenceEditable ? handleEdit(event,maturityDate) : null}>\n
\n {lrnRef}
(jpeg, jpg, png, gif, pdf, doc, docx, xls, xlsx files only. File size does not exceed 7MB)
\n \n\n\n \n
\n
\n )\n}\n\nexport default compose(\n connect(\n (state) => ({\n selectedDealData: getIsvCurrentDeal(state),\n isIsvExternalUser: isIsvExternalUser(state),\n isIsvCsmUser: isIsvCsmUser(state),\n isIsvRRTeamUser: isIsvRRTeamUser(state),\n dealId: getIsvCurrentDealId(state),\n latestCommentsDataForCurrentDeal: selectLatestCommentsDataForCurrentDeal(state),\n }),\n (dispatch) => ({\n handleDocumentApproveReject: (data) => {\n dispatch(handleDocumentApproveReject(data));\n },\n handleClientDocuments: (data) => {\n dispatch(handleClientDocuments(data));\n },\n getLatestCommentsByDealId: (dealId, isClientScreen, isEcbReturn) => {\n dispatch(getLatestCommentsByDealId(dealId, isClientScreen, isEcbReturn));\n },\n getLatestCommentsByCommentId: (commentId, isClientScreen, isEcbReturn) => {\n dispatch(getLatestCommentsByCommentId(commentId, isClientScreen, isEcbReturn));\n },\n handleGetLatestCommentsByCommentsId: (data) => {\n dispatch(handleGetLatestCommentsByCommentsId(data))\n },\n handleGetLatestCommentsByDealIdResponse: (data) => {\n dispatch(handleGetLatestCommentsByDealIdResponse(data))\n },\n setTitleColumnWidth: (width) => {\n dispatch(setTitleColumnWidth(width))\n }\n })\n )\n)(DealInformationTable);","import React, { PureComponent } from \"react\";\nimport styled from \"styled-components\";\nimport { compose } from 'recompose';\nimport { connect } from 'react-redux';\nimport { fontColors } from \"shared/styles/variables/theme\";\nimport { applyIsvCloseBanner, handleConfirmationDialogue } from \"Isv/actions/IsvInformationBannerAction\";\nimport FileUploadOverlay from 'Isv/components/FileUpload/FileUploadOverlays/FileUploadOverlay';\nimport { isIsvRRTeamUser, isIsvCsmUser } from \"selectors\";\nimport IsvInformationBanner from \"Isv/components/InformationBanner/InformationBanner\"\nimport DealInformationTable from './DealInformationTable'\nimport ConfirmationDialog from 'Isv/components/common/ConfirmationDialog';\nimport {\n viewDocument,\n handleOpenUploadOverlay,\n deleteSupportingDocument,\n handleSubmitDealInformation,\n handeFinalSubmission,\n handleCommentsPopup,\n getLatestCommentsByCommentId,\n handleGetLatestCommentsByCommentsId,\n downloadAllDocuments,\n handleReferenceInformationStatus\n} from 'Isv/actions/IsvDocumentsAction';\nimport {\n getIsvCurrentDealId,\n getIsvCurrentDeal,\n dealInformationBannerReducer,\n isIsvExternalUser,\n selectConfirmationBannerStatus,\n selectDocumentDeleteId,\n selectLatestCommentsDataForCurrentDeal,\n selectIsvTableColumnWidth,\n dataFetching\n} from \"Isv/selectors\";\nimport { PrimaryButton, SecondarySlateButton, SecondaryButton } from 'mk-pattern-library-react';\nimport { primaryBtnStyle, defaultBtnStyle } from 'Isv/styles/buttonStyle';\nimport DealInformationCommentBoxContainer from './DealInformationCommentBoxContainer';\nimport { browserHistory } from 'react-router';\nimport {\n WORKFLOW_STATUS,\n ISV_DOCUMENT_REVIEW_STATUS,\n NEXT_ACTION_OWNER,\n REJECTED_STATUS,\n ISV_DOCUMENT_TYPE\n} from 'Isv/constants/isvDocumentReviewStatus'\nimport Loading from 'shared/components/Loading';\n\nconst Header = styled.h2`\n font-size: 26px;\n color: ${fontColors.black};\n font-weight: 600;\n`;\n\nconst InformationButtonContainer = styled.div`\n margin: 20px 0;\n display: flex;\n justify-content : flex-end;\n width: 100%\n button {\n &:not(:first-child) {\n margin-left: 20px;\n }\n \n }\n`\nconst CommentStyle = styled.div`\n border: 1px solid #d8d8d8;\n border-radius: 2px;\n padding: 5px;\n width: 100%;\n font-size: 12px;\n margin-top: 5px;\n`\n\nconst DocumentActionContainer = styled.div`\n display: flex;\n align-items: center;\n width: 100%;\n`\n\nconst AdditionalCommentContainer = styled.div`\n max-width: ${(props) => (props.isClientData ? props.width - 14 : props.width) + 'px'};\n width: 100%;\n`\n\nconst AdditonalCommentHeader = styled.span`\n font-weight: 600;\n font-size: 12px;\n`\nconst LoadingContainer = styled.div`\n position: fixed;\n top: 0px;\n left: 0px;\n z-index: 999;\n height: 100%;\n width: 100%;\n`;\n\nconst LoadingWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%,-50%);\n`;\n\nclass DealInformation extends PureComponent {\n\n state = {\n isSupportingUploadButtonDisabled: false,\n documentStatusrole: this.props.isIsvCsmUser ? 'isCsmApproved' : 'isRrApproved',\n isFinalReviewCompleted: false,\n }\n\n viewDocument = (documentId, title, fileName, dealDocumentId) => {\n this.props.viewDocument(documentId, title, fileName, dealDocumentId);\n }\n\n CheckReviewSubmitted = (dealDocuments) => {\n let isSubmitReviewButtonDisabled = true;\n dealDocuments && dealDocuments.forEach(doc => {\n isSubmitReviewButtonDisabled = doc.document.clientDocumentFile.length ? false: true;\n });\n return isSubmitReviewButtonDisabled;\n }\n\n CheckSubmitEnabled = (dealDocuments, nextAction) => {\n let count = 0, isSubmitButtonDisabled;\n const currentDate = new Date();\n currentDate.setHours(0, 0, 0, 0);\n if (dealDocuments && dealDocuments.clientDocumentFile) {\n dealDocuments.clientDocumentFile.forEach(doc => {\n !doc[this.state.documentStatusrole] && count++;\n });\n isSubmitButtonDisabled = dealDocuments && dealDocuments.status && dealDocuments.status.nextAction !== nextAction ? true : count >= 1;\n }\n return isSubmitButtonDisabled;\n }\n\n handleSubmitDealInformation = (dealId, label) => {\n const { selectedDealData, isIsvCsmUser } = this.props;\n const currentDate = new Date();\n currentDate.setHours(0, 0, 0, 0);\n\n if ((selectedDealData && isIsvCsmUser && selectedDealData.status && \n selectedDealData.status.statusName !== \"Completed\" && selectedDealData.status.nextAction === \"CSM\") && \n ((selectedDealData.isFinalSubmission && selectedDealData.maturityDate == null) || \n (selectedDealData.maturityDate !== null && currentDate > new Date(selectedDealData.maturityDate)))\n ) {\n browserHistory.push({ pathname: \"/\", state: { fromDealInformation: true } });\n } \n else {\n this.props.handleSubmitDealInformation(dealId, label)\n }\n }\n\n enableDisableInformationBanner = (selectedDealData) => {\n return selectedDealData && selectedDealData.status && \n ((this.props.isIsvExternalUser && selectedDealData.status.nextAction === NEXT_ACTION_OWNER.CLIENT) || \n (this.props.isIsvCsmUser && selectedDealData.status.nextAction === NEXT_ACTION_OWNER.CSM) ||(this.props.isIsvRRTeamUser && selectedDealData.status.nextAction === NEXT_ACTION_OWNER.RR_TEAM)) \n }\n\n CheckInformationBannerText = () => {\n const { selectedDealData } = this.props;\n if (this.props.isIsvExternalUser){\n let status = selectedDealData && selectedDealData.status &&\n selectedDealData.status.workflowName === WORKFLOW_STATUS.DRAFT_ECB_SUBMISSION\n ? \"Please upload all information prior to submitting for HSBC review. If uploading additional information not assigned to your deal, please use “Upload” button at the bottom of the screen, if uploading for information assigned to your deal, please use the upload icon in “Download/Upload/Delete” column.\"\n : selectedDealData && selectedDealData.status &&\n selectedDealData.status.workflowName === WORKFLOW_STATUS.FINAL_ECB_SUBMISSION &&\n selectedDealData.status.statusName === ISV_DOCUMENT_REVIEW_STATUS.PENDING_ONE_WAY_LETTER\n ? \"Please upload all information (signed where required) for HSBC review.\"\n : \"\";\n return status;\n }\n else if (this.props.isIsvRRTeamUser)\n return \"Please ensure you review each information prior to approving/rejecting. If rejecting, a comment is required to be added. You can view the information by clicking on the title column.\";\n else\n return \"Please ensure you review each information prior to approving/rejecting. If rejecting, a comment is required to be added. You can view the information by clicking on the title. To upload information relating to the template, please use the upload icon in Upload column. To delete information from the deal, please use the delete icon in Delete column.\";\n }\n\n handleUploadSubmitButton = (deleteDocumentId, isFinalReviewCompleted, isCSMFinalSubmission) => {\n if (isFinalReviewCompleted) {\n this.handleSubmitDealInformation(this.props.dealId, 'SubmitToRBI');\n this.setState({\n isFinalReviewCompleted: false\n });\n this.props.handleConfirmationDialogue(false);\n } else if (isCSMFinalSubmission) {\n this.props.handleSubmitDealInformation(this.props.dealId, 'SendToDraft');\n this.props.handleConfirmationDialogue(false);\n } else {\n this.props.handleConfirmationDialogue(false);\n deleteDocumentId ? this.props.deleteSupportingDocument(deleteDocumentId) : this.handleSubmitDealInformation(this.props.dealId, NEXT_ACTION_OWNER.CLIENT);\n }\n }\n\n handleDeleteConfirmationDialogue = (isOpen, deleteDealDocumentId) => {\n this.props.handleConfirmationDialogue(isOpen, deleteDealDocumentId);\n }\n\n enableSubmitForReviewButton = (selectedDealData) => {\n return selectedDealData && selectedDealData.isClientSubmit && selectedDealData.status && selectedDealData.status.nextAction === NEXT_ACTION_OWNER.CLIENT && !selectedDealData.status.ecB2ReturnStatus;\n }\n\n areAllFinalDocsUploaded = (selectedDealData) => {\n let isdocsUploaded = false\n if(selectedDealData.isFinalSubmission) {\n isdocsUploaded = selectedDealData.clientDocumentFile.some((document) => document.fileUploadWorkflow !== \"final\")\n }\n return isdocsUploaded\n }\n\n isRejectButtonEnabled = (selectedDealData, approver, rejectUser) => {\n let count = 0;\n const documentCount = selectedDealData && selectedDealData.clientDocumentFile;\n documentCount && documentCount.length && \n documentCount.forEach(doc => {\n doc[approver] === null && count++;\n });\n return Boolean(count) || !(selectedDealData.status && selectedDealData.status.nextAction === rejectUser)\n }\n\n enableClientUploadButton = (selectedDealData) => {\n return selectedDealData && selectedDealData.status && selectedDealData.status.nextAction === NEXT_ACTION_OWNER.CLIENT;\n }\n\n handleRejectInformation = (dealId, rejectLabel) => {\n this.props.handleSubmitDealInformation(dealId, rejectLabel);\n }\n\n handeFinalSubmission = (dealId, isFinalSubmission, finalReview) => {\n if (finalReview) {\n this.props.handleConfirmationDialogue(true);\n this.setState({ isFinalReviewCompleted: true })\n } else this.props.handeFinalSubmission(dealId, isFinalSubmission);\n }\n\n checkIsFinalReviewCompleted = (selectedDealData) => {\n return selectedDealData && (selectedDealData.status && selectedDealData.status.statusName === ISV_DOCUMENT_REVIEW_STATUS.SUBMITTED_TO_RBI && selectedDealData.status.nextAction === NEXT_ACTION_OWNER.RR_TEAM)\n }\n\n getConfirmationDialogueSubheader = (deleteDocumentId, isFinalReviewCompleted, isFinalSubmission, selectedDealData) => {\n const subHeader = deleteDocumentId ?\n 'Are you sure you want to delete this information?' :\n isFinalReviewCompleted ?\n 'Final review completed. Please download all information using the Download All button and submit to RBI.' :\n isFinalSubmission ?\n (selectedDealData.status.workflowName === WORKFLOW_STATUS.FINAL_ECB_SUBMISSION && selectedDealData.status.statusName === ISV_DOCUMENT_REVIEW_STATUS.PENDING_FIRST_REVIEW) ?\n 'You are sending this deal to Draft ECB Submission workflow. You will need to complete Draft ECB Submission workflow before performing Final ECB Submission workflow again.' :\n 'Information will be submitted for review. Do you want to continue?' :\n 'Information has now been submitted for 1st internal review.'\n return subHeader;\n }\n\n render() {\n\n const {\n dealId,\n isOpen,\n selectedDealData,\n handleCloseBanner,\n isDealInformationBannerOpen,\n handleOpenUploadOverlay,\n isIsvExternalUser,\n handleConfirmationDialogue,\n deleteDocumentId,\n isIsvCsmUser,\n isIsvRRTeamUser,\n latestCommentsDataForCurrentDeal,\n downloadAllDocuments,\n titleTableColumnWidth,\n handleReferenceInformationStatus\n } = this.props;\n handleReferenceInformationStatus(false);\n const { isFinalReviewCompleted } = this.state;\n const lastComment =\n latestCommentsDataForCurrentDeal &&\n latestCommentsDataForCurrentDeal.length > 0 &&\n latestCommentsDataForCurrentDeal.find(\n (item) => item.title === 'Additional Comment' && item.dealId === selectedDealData.dealId\n );\n const isFinalSubmission = selectedDealData && selectedDealData.isFinalSubmission;\n const isFinalCSMSubmission = selectedDealData && selectedDealData.status && selectedDealData.status.nextAction === NEXT_ACTION_OWNER.CSM && selectedDealData.status.workflowName === WORKFLOW_STATUS.FINAL_ECB_SUBMISSION && selectedDealData.status.statusName === ISV_DOCUMENT_REVIEW_STATUS.PENDING_FIRST_REVIEW;\n return (\n <>\n {this.props.loading ? (\n \n \n
\n
\n );\n};\n\nexport default compose(\n connect(\n (state) => ({\n isIsvExternalUser: isIsvExternalUser(state),\n isIsvCsmUser: isIsvCsmUser(state),\n isIsvRRTeamUser: isIsvRRTeamUser(state),\n dealId: getIsvCurrentDealId(state),\n selectedReferenceData: selectedReferenceInformationDataForCurrentDeal(state),\n }),\n (dispatch) => ({\n setTitleColumnWidth: (width) => {\n dispatch(setTitleColumnWidth(width))\n },\n getReferenceDataForCurrentDeal: (dealId, isIsvRRTeamUser) => {\n dispatch(getReferenceDataForCurrentDeal(dealId, isIsvRRTeamUser))\n },\n handleReferenceInformationDataForCurrentDeal: (data) => {\n dispatch(handleReferenceInformationDataForCurrentDeal(data))\n }\n })\n )\n)(ReferenceInformationTable);","import React, { PureComponent } from \"react\";\nimport styled from \"styled-components\";\nimport { compose } from 'recompose';\nimport { connect } from 'react-redux';\nimport { fontColors } from \"shared/styles/variables/theme\";\nimport { applyIsvCloseBanner, handleConfirmationDialogue } from \"Isv/actions/IsvInformationBannerAction\";\nimport RefFileUploadOverlay from 'Isv/components/FileUpload/FileUploadOverlays/RefFileUploadOverlay';\nimport { isIsvRRTeamUser, isIsvCsmUser } from \"selectors\";\nimport IsvInformationBanner from \"Isv/components/InformationBanner/InformationBanner\"\nimport ReferenceInformationTable from '../ReferenceInformation/ReferenceInformationTable'\nimport ConfirmationDialog from 'Isv/components/common/ConfirmationDialog';\nimport {\n viewReferenceDocument,\n handleOpenUploadOverlay,\n deleteReferenceDocument,\n handleReferenceInformationStatus\n} from 'Isv/actions/IsvDocumentsAction';\nimport {\n getIsvCurrentDealId,\n selectedReferenceInformationDataForCurrentDeal,\n referenceInformationBannerReducer,\n isIsvExternalUser,\n selectConfirmationBannerStatus,\n selectDocumentDeleteId,\n selectIsvTableColumnWidth,\n dataFetching\n} from \"Isv/selectors\";\nimport { PrimaryButton } from 'mk-pattern-library-react';\nimport { primaryBtnStyle } from 'Isv/styles/buttonStyle';\nimport Loading from 'shared/components/Loading';\n\nconst Header = styled.h2`\n font-size: 26px;\n color: ${fontColors.black};\n font-weight: 600;\n`;\n\nconst InformationButtonContainer = styled.div`\n margin: 20px 0;\n display: flex;\n justify-content : flex-end;\n width: 100%\n button {\n &:not(:first-child) {\n margin-left: 20px;\n }\n }\n`\nconst DocumentActionContainer = styled.div`\n display: flex;\n align-items: center;\n width: 100%;\n`\n\nconst LoadingContainer = styled.div`\n position: fixed;\n top: 0px;\n left: 0px;\n z-index: 999;\n height: 100%;\n width: 100%;\n`;\n\nconst LoadingWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%,-50%);\n`;\n\nclass ReferenceInformation extends PureComponent {\n \n viewDocument = (docRefId, title, fileName) => {\n this.props.viewReferenceDocument(docRefId, title, fileName);\n }\n\n enableDisableInformationBanner = () => {\n return this.props.isIsvCsmUser||this.props.isIsvRRTeamUser; \n }\n\n CheckInformationBannerText = () => {\n if (this.props.isIsvCsmUser || this.props.isIsvRRTeamUser){\n return \"You can upload reference information or documents of this deal here. Please use New Reference Document button to add new information. You can click on uploaded document title to download the document.\"\n }\n }\n\n handleDeleteReferenceDocument = (deleteDocumentId) => {\n this.props.handleConfirmationDialogue(false);\n if(deleteDocumentId ) \n this.props.deleteReferenceDocument(deleteDocumentId);\n }\n\n handleDeleteConfirmationDialogue = (value, deleteDocRefId) => {\n this.props.handleConfirmationDialogue(value, deleteDocRefId);\n }\n\n getConfirmationDialogueSubheader = (deleteDocumentId) => {\n if(deleteDocumentId)\n return 'Are you sure you want to delete this information?';\n }\n\n handleReferenceDocUpload = (isOpen, document, title) => {\n this.props.handleOpenUploadOverlay(isOpen, document, title, false, true)\n this.setState({ isReviewSubmitted: false })\n }\n\n render() {\n const {\n isOpen,\n handleCloseBanner,\n isReferenceInformationBannerOpen,\n handleOpenUploadOverlay,\n handleConfirmationDialogue,\n deleteDocumentId,\n isIsvCsmUser,\n isIsvRRTeamUser,\n handleReferenceInformationStatus\n } = this.props;\n handleReferenceInformationStatus(true);\n return (\n <>\n {this.props.loading ? (\n \n \n
\n
\n );\n};\n\nexport default compose(\n connect(\n (state) => ({\n selectedDealData: getIsvCurrentDeal(state),\n isIsvExternalUser: isIsvExternalUser(state),\n isIsvCsmUser: isIsvCsmUser(state),\n isIsvRRTeamUser: isIsvRRTeamUser(state),\n dealId: getIsvCurrentDealId(state),\n latestCommentsDataForCurrentDeal: selectLatestCommentsDataForCurrentDeal(state), \n selectedEcb2ReturnDataForCurrentDeal: selectedEcb2ReturnDataForCurrentDeal(state),\n }),\n (dispatch) => ({\n getLatestCommentsByDealId: (dealId, isClientScreen, IsECBReturnVisible) => {\n dispatch(getLatestCommentsByDealId(dealId, isClientScreen, IsECBReturnVisible));\n },\n setTitleColumnWidth: (width) => {\n dispatch(setTitleColumnWidth(width))\n },\n getECB2ReturnDataForCurrentDeal: (dealId) => {\n dispatch(getECB2ReturnDataForCurrentDeal(dealId))\n },\n handleDocumentApproveReject: (data) => {\n dispatch(handleDocumentApproveReject(data));\n },\n getLatestCommentsByCommentId: (commentId, isClientScreen, IsECBReturnVisible) => {\n dispatch(getLatestCommentsByCommentId(commentId, isClientScreen, IsECBReturnVisible));\n },\n handleGetLatestCommentsByCommentsId: (data) => {\n dispatch(handleGetLatestCommentsByCommentsId(data))\n },\n handleECB2ReturnDataForCurrentDeal: (data) => {\n dispatch(handleECB2ReturnDataForCurrentDeal(data))\n },\n handleGetLatestCommentsByDealIdResponse: (data) => {\n dispatch(handleGetLatestCommentsByDealIdResponse(data))\n },\n })\n )\n)(ECB2ReturnTable);","import React, { PureComponent } from \"react\";\nimport styled from \"styled-components\";\nimport { compose } from 'recompose';\nimport { connect } from 'react-redux';\nimport { fontColors } from \"shared/styles/variables/theme\";\nimport { primaryBtnStyle } from 'Isv/styles/buttonStyle';\nimport FileUploadOverlay from 'Isv/components/FileUpload/FileUploadOverlays/FileUploadOverlay';\nimport EcbToReturnTable from \"./EcbToReturnTable\";\nimport { isIsvRRTeamUser } from \"selectors\";\nimport { PrimaryButton, SecondarySlateButton } from 'mk-pattern-library-react';\nimport {\n getIsvCurrentDeal,\n selectIsvTableColumnWidth,\n selectLatestCommentsDataForCurrentDeal,\n isIsvExternalUser,\n getIsvCurrentDealId,\n selectedEcb2ReturnDataForCurrentDeal,\n dataFetching,\n dealInformationBannerReducer\n} from \"Isv/selectors\";\nimport { applyIsvCloseBanner } from \"Isv/actions/IsvInformationBannerAction\";\nimport IsvInformationBanner from \"Isv/components/InformationBanner/InformationBanner\";\nimport DealInformationCommentBoxContainer from '../DealInformation/DealInformationCommentBoxContainer'\nimport { viewDocument, handleOpenUploadOverlay, handleECBSubmit } from 'Isv/actions/IsvDocumentsAction';\nimport Loading from 'shared/components/Loading';\nimport {\n NEXT_ACTION_OWNER,\n REJECTED_STATUS,\n SUBMIT_TO_RBI\n} from 'Isv/constants/isvDocumentReviewStatus'\n\nconst Header = styled.h2`\n font-size: 26px;\n color: ${fontColors.black};\n font-weight: 600;\n`;\n\nconst InformationButtonContainer = styled.div`\n margin: 20px 0;\n display: flex;\n justify-content : flex-end;\n width: 100%\n button {\n &:not(:first-child) {\n margin-left: 20px;\n } \n }\n`\n\nconst DocumentActionContainer = styled.div`\n display: flex;\n align-items: center;\n width: 100%;\n margin: 20px 0px;\n`;\n\nconst AdditionalCommentContainer = styled.div`\n max-width: ${(props) => (props.isClientData ? props.width - 14 : props.width) + 'px'};\n width: 100%;\n`;\n\nconst AdditonalCommentHeader = styled.span`\n font-weight: 600;\n font-size: 12px;\n`;\n\nconst CommentStyle = styled.div`\n border: 1px solid #d8d8d8;\n border-radius: 2px;\n padding: 5px;\n width: 100%;\n font-size: 12px;\n margin-top: 5px;\n`;\n\nconst LoadingContainer = styled.div`\n position: fixed;\n top: 0px;\n left: 0px;\n z-index: 999;\n height: 100%;\n width: 100%;\n`;\n\nconst LoadingWrapper = styled.div`\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%,-50%);\n`;\n\nclass EcbToReturn extends PureComponent {\n\n state = {\n isReviewSubmitted: false\n }\n \n enableSubmitForReviewButton = (selectedEcb2ReturnDataForCurrentDeal) => {\n const { selectedDealData } = this.props;\n let count = 0;\n const documentCount = selectedEcb2ReturnDataForCurrentDeal && selectedEcb2ReturnDataForCurrentDeal.clientDocumentFile;\n documentCount && documentCount.length && \n documentCount.forEach(doc => {\n doc.ecbReturnStatus && doc.isClientDocReviewed === null && count++;\n });\n\n return (\n Boolean(count) &&\n selectedDealData &&\n selectedDealData.status &&\n selectedDealData.status.ecB2ReturnStatus\n );\n };\n\n checkSubmitDisabled = (dealDocuments) => {\n let count = 0, isSubmitButtonEnabled;\n if (dealDocuments && dealDocuments.clientDocumentFile) {\n dealDocuments.clientDocumentFile.forEach(doc => {\n doc.isRrApproved === true && doc.ecbReturnStatus && doc.isRrDocReviewed === null && count++;\n });\n isSubmitButtonEnabled = count >= 1;\n }\n this.setState({ isReviewSubmitted: false });\n return isSubmitButtonEnabled;\n }\n\n checkRejectToClientDisabled = (dealDocuments) => {\n let count = 0;\n if (dealDocuments && dealDocuments.clientDocumentFile) {\n dealDocuments.clientDocumentFile.forEach(doc => {\n doc.isRrApproved === false && doc.ecbReturnStatus === false && doc.isRrDocReviewed === null && count++;\n })\n }\n this.setState({ isReviewSubmitted: false });\n return !(Boolean(count));\n }\n\n handleECBSubmit = (dealId, userAction) => {\n this.setState({ isReviewSubmitted : true })\n this.props.handleECBSubmit(dealId, userAction);\n }\n\n handleECbDocUpload = (isOpen, document, title) => {\n this.props.handleOpenUploadOverlay(isOpen, document, title, true)\n this.setState({ isReviewSubmitted: false })\n }\n\n render() {\n const {\n dealId,\n selectedDealData,\n titleTableColumnWidth,\n latestCommentsDataForCurrentDeal,\n viewDocument,\n isIsvExternalUser,\n isIsvRRTeamUser, \n selectedEcb2ReturnDataForCurrentDeal,\n isDealInformationBannerOpen,\n handleCloseBanner,\n } = this.props;\n const lastComment =\n latestCommentsDataForCurrentDeal &&\n latestCommentsDataForCurrentDeal.length > 0 &&\n latestCommentsDataForCurrentDeal.find(\n (item) =>\n item.title === \"Additional Comment\" &&\n item.dealId === selectedDealData.dealId\n );\n\n return (\n <>\n {this.props.loading ? (\n \n \n
\n
\n \n \n \n {feedback.companyName}\n \n {\n feedback.keyInvestor && (\n
\n \n {\n feedback.investorType && ({feedback.investorType} )\n }\n {\n feedback.investorName && ({feedback.investorName})\n }\n
\n \n\n \n
\n \n \n
\n )\n }\n \n \n {\n `${tranche.priceDemand.min ? tranche.priceDemand.min : ''}${\n tranche.priceDemand.min && tranche.priceDemand.max ? ' - ' : ''}${\n tranche.priceDemand.max || ''} ${tranche.priceDemand.valuation && (tranche.priceDemand.min || tranche.priceDemand.max) ? '@ ' : ''}\n ${tranche.priceDemand.valuation ? tranche.priceDemand.valuation : ''}`\n }\n
\n {tranche.trancheShortName}
\n \n
\n \n
\n \n \n {this.props.details.companyName}\n \n {\n this.props.details.keyInvestor && (\n
\n \n {\n this.props.details.investorType && (\n {this.props.details.investorType} \n )\n }\n {\n this.props.details.investorName && (\n {this.props.details.investorName}\n )\n }\n
\n\n \n
\n \n \n
\n\n {\n !!this.props.themes.positive.length && (\n \n
\n )\n }\n\n {\n !!this.props.themes.negative.length && (\n \n
\n )\n }\n\n {\n !!this.props.themes.valuation.length && (\n \n
\n )\n }\n \n
\n \n {feedbackTranchePriceDemand[0].priceDemand.valuation}\n
\n \n \n
\n \n {\n beautifyPriceDemand(feedbackTranchePriceDemand[0])\n }\n
\n \n \n
\n \n {\n this.props.comment.trim()\n }\n
\n \n
\n \n
\n \n
\n
\n );\n\n return ReactDOM.createPortal(\n result,\n document.querySelector('#legendTitle')\n );\n};\n\nconst topBarLegend = (index, height, marginTop, props) => {\n const { x, payload, width } = props;\n if (index === 0) {\n const xCoord = x - (width / 2);\n return (\n \n \", translationString(mapThemeTypeOrSentimentToKey(keyTitle), props.language, keyTitle)]\n ]}\n defaultText={`Distribution of ${translationString(mapThemeTypeOrSentimentToKey(keyTitle), props.language, keyTitle)} Themes by Date`}\n />\n
\n - \n {\n payload.reverse().map((entry, index) => {\n if (!entry.color) {\n const targetColor = colors[(index) % colors.length];\n entry.color = targetColor;\n }\n return (\n
\n
\n \n \n
\n
\n );\n }\n}\n\nexport default compose(\n withModals(\n null,\n (__, open) => ({\n openModal: modalId => open(modalId),\n }),\n )\n)(FeedbackHighlightContainer);\n","import React, { PureComponent } from 'react';\nimport { connect } from 'react-redux';\nimport { compose } from 'recompose';\nimport TranslationText, { translationString } from 'translations/TranslationText';\nimport withLanguage from 'translations/withLanguage';\nimport { mapThemeTypeOrSentimentToKey } from 'util/translationMappings';\n\nimport ChartTableContainer from 'shared/components/ChartTableContainer';\n\nimport {\n getInvestorFeedbackChartDataByChart,\n getInvestorFeedbackHighlightsByTheme,\n getSelectedChartSubTab\n} from 'selectors';\nimport { selectChartSubTab } from 'actions/InvestorFeedbackActions';\n\nimport withAnalytics from 'shared/hoc/withAnalytics';\nimport { events } from 'constants/analytics';\n\n// import { featurePageIds } from 'constants/featurePages';\n\nimport Buttons from './shared/Buttons';\nimport NoContent from './shared/NoContent';\n\nimport ThemeDistributionTable from './tables/ThemeDistributionTable';\nimport ThemeDistributionChart from './charts/ThemeDistributionChart';\nimport FeedbackHighlightContainer from './charts/ThemeDistributionChart/FeedbackHighlightContainer';\n\nclass ThemeDistributionTabContent extends PureComponent {\n buttonClicked = (index, name) => {\n this.props.selectChartSubTab(index, name);\n\n this.props.themeDistributionTabEvent(name);\n }\n\n render() {\n const { chartData } = this.props;\n\n const renderChart = (chartData[this.props.activeIndex] && chartData[this.props.activeIndex].series) || false;\n const themeTypeId = this.props.activeIndex + 1;\n\n const highlightData = this.props.getHighlightData(themeTypeId); // Related to order of pages\n const theme = this.props.themeTypes\n .filter((themeType) => themeType.themeTypeId === themeTypeId)[0];\n\n const barHeight = window.innerWidth >= 1024 ? 450 : 545;\n\n let dataSetChart;\n let dataKeys;\n\n if (renderChart) {\n const dataSet = chartData[this.props.activeIndex].categoryAxis.categoryLabel\n .map((label) => {\n const splitLabel = label.split('-');\n return {\n name: splitLabel[0],\n bottomText: splitLabel[1] || '',\n };\n });\n\n dataKeys = [];\n dataSetChart = dataSet.map((dataObj, ind) => {\n const chartObj = {};\n // Always put category summary first to prevent additional loops through series\n chartData[this.props.activeIndex].series.sort((a, b) => {\n if (a.seriesType === 'CategorySummary') {\n return -1;\n } else if (b.seriesType === 'CategorySummary') {\n return 1;\n } else {\n const aVal = a.data[0] ? a.data[0].value : 0;\n const bVal = b.data[0] ? b.data[0].value : 0;\n if (aVal > bVal) {\n return -1;\n } else if (aVal < bVal) {\n return 1;\n } else {\n return 0;\n }\n }\n });\n\n chartData[this.props.activeIndex].series.forEach((series) => {\n if (series.seriesType === 'CategorySummary') {\n // Top Labels\n chartObj.topText = series.data[ind] ? series.data[ind].value : null;\n } else {\n // Find total for each index\n let total = 0;\n chartData[this.props.activeIndex].series.forEach((seriesForTotal) => {\n if (seriesForTotal.seriesType !== 'CategorySummary') {\n total += seriesForTotal.data[ind] ? seriesForTotal.data[ind].value : 0;\n }\n });\n\n // convert to %\n chartObj[series.seriesTitle] = series.data[ind] ? ((series.data[ind].value / total) * 100) : null;\n\n if (ind === 0) {\n dataKeys.push({\n key: series.seriesTitle,\n value: series.seriesTitle\n });\n }\n }\n });\n\n return {\n ...dataObj,\n ...chartObj\n };\n });\n }\n\n if (renderChart) {\n return (\n \n
\n \n \n {\n this.props.highlightData\n .filter(feedback => feedback.text)\n .map(feedback => (\n
\n \n {\n this.props.highlightData\n .filter(feedback => feedback.text)\n .map(feedback => (\n this.navigateToFeedback(e, feedback)}\n role=\"button\"\n onKeyDown={e => buttonKeyHandler(e, () => this.navigateToFeedback(e, feedback))}\n tabIndex={0}\n >\n {feedback.investor}\n
\n
\n \n
\n \n \n {\n series.data.map((dataSeries, index) => {\n const lastIndex = index === series.data.length - 1;\n\n return (\n \n
\n );\n },\n )\n }\n \n \n \n {dataSeries.label}\n
\n \n {\n series.data.map((dataSeries) => {\n const barStyle = {\n height: rowHeight,\n width: `${(dataSeries.value / (niceScale.ticks[niceScale.ticks.length - 1])) * 100}%`,\n backgroundColor: highlightColor,\n position: 'absolute',\n left: 0,\n top: '50%',\n transform: 'translateY(-50%)',\n WebkitTransform: 'translateY(-50%)',\n borderTop: `solid ${0.1 * rowHeight}px #fff`,\n borderBottom: `solid ${0.1 * rowHeight}px #fff`,\n };\n\n return (\n \n \n
\n );\n },\n )\n }\n \n \n \n \", translationString(mapThemeTypeOrSentimentToKey(this.props.chartNames[this.props.activeIndex]), this.props.language, mapThemeTypeOrSentimentToKey(this.props.chartNames[this.props.activeIndex]))]\n ]}\n defaultText={`Number of Investors For Theme where Investor Sentiment is ${translationString(mapThemeTypeOrSentimentToKey(this.props.chartNames[this.props.activeIndex]), this.props.language, mapThemeTypeOrSentimentToKey(this.props.chartNames[this.props.activeIndex]))}`}\n />\n\n
\n \n {\n !!targetSize && (\n \n {props.tableTitle(targetSize, trancheCurrency, demandUnit)}\n \n )\n }\n\n
\n )\n}\n\nexport default compose(\n withTranslate((translate, props) => ({\n tableCaption: translate('', `Price demand data for ${props.series.pageTitle}`),\n tableTitle: (targetSize, currency, unit) => translate(\n 'investor_feedback.target_size_text',\n `Tranche Target Size ${targetSize || ''}${unit || ''} ${currency || ''}`,\n [\n ['\n {this.props.chartTitle()}\n
\n\n
\n \n
\n
\n {this.props.btnText}\n \n }\n />\n )\n }\n}\n\nexport default compose(\n connect(\n state => ({\n modalId: modalIds.TERMS_AND_CONDITIONS_MODAL_ID,\n content: getTermsAndConditionsText(state),\n langCode: getSelectedLanguage(state),\n isModalOpen: isModalOpen(state, modalIds.TERMS_AND_CONDITIONS_MODAL_ID),\n }),\n dispatch => ({\n openModal: (modalId, langCode) => {\n dispatch(requestTermsAndConditions(langCode));\n dispatch(openModal(modalId));\n },\n closeModal: modalId => dispatch(closeModal(modalId)),\n }),\n ),\n /*withModals(\n selection => ({\n modalId: modalIds.TERMS_AND_CONDITIONS_MODAL_ID,\n isModalOpen: selection(modalIds.TERMS_AND_CONDITIONS_MODAL_ID),\n }),\n (close, open, props) => ({\n openModal: () => {\n open(modalIds.TERMS_AND_CONDITIONS_MODAL_ID);\n props.dispatch(requestTermsAndConditions(props.langCode))\n\n },\n closeModal: () => close(modalIds.TERMS_AND_CONDITIONS_MODAL_ID),\n }),\n ),*/\n withTranslate(translate => ({\n btnText: translate('common.terms_and_conditions', 'Terms and Conditions')\n }))\n)(TermsAndConditionsLink);\n","import React, { Component } from 'react';\nimport { connect } from 'react-redux';\n\nimport styled from 'styled-components';\nimport PopupSystem from 'shared/components/PopupSystem';\nimport Popup, { Divider } from 'shared/components/Popup';\nimport Scrollable from 'shared/components/Scrollable';\n\nimport { getSelectedLanguage, isModalOpen, makeGetSiteTextSelector } from 'selectors'\nimport { openModal, closeModal } from 'actions/UtilityActions';\nimport { openSiteText } from 'actions/LoginActions';\nimport { SvgIcon } from 'shared/components/Icon';\nimport HsbcLink from 'shared/accessibility/components/Link';\n\nconst ModalContent = styled.div`\n display: flex;\n flex-direction: column;\n padding-top: 20px;\n\n ${Divider} {\n display: block;\n margin: 1rem 0;\n }\n`;\n\nconst ScrollableContent = styled.div`\n display: flex;\n flex-direction: column;\n padding: 0px 20px;\n`;\n\nconst ModalIcon = props => (\n \n \n
\n
\n \n }\n />\n )\n }\n \n \n
\n \n
\n \"}\n replace={[\n [\"\", this.secondsToMinutes(this.state.timeLeft)]\n ]}\n defaultText={`You will be logged out in ${this.secondsToMinutes(this.state.timeLeft)}`}\n />\n
\n {\n this.props.pulseMessage && (\n \n {\n this.props.pulseMessage === \"Your session can not be extended further. Please logon again!\"\n ?
\n \n )\n }\n}\n\nexport default compose(\n withAnalytics((ev, viewChange) => ({\n logoutEvent: () => ev(events.SESSION_EXPIRY_LOGOUT),\n continueEvent: () => ev(events.SESSION_EXPIRY_CONTINUE),\n viewChange: () => viewChange(overlayIds.SESSION_EXPIRY_OVERLAY),\n }))\n)(AlertModal);\n","import React from 'react';\nimport { connect } from 'react-redux';\nimport { renewToken, logOff } from '../actions/HeartBeatActions';\nimport AlertModal from './AlertModal';\nimport * as modalIds from 'constants/modalIds';\nimport PopupSystem from 'shared/components/PopupSystem';\n\nclass SessionTimer extends React.PureComponent {\n render() {\n return (\n \n {\n this.props.pulseMessage && (\n \n {\n this.props.pulseMessage === \"Your session can not be extended further. Please logon again!\"\n ?
Support Information
\n- \n
\n
\n \n { this.props.authenticationResponse\n ? this.props.authenticationResponse\n : null\n }\n
\n \n
\n \n
\n \n
\n
\n \n
\n
\n \n \n
\n \n \n
\n
\n
\n \n \n \n \n \n \n \n
\n \n \n
\n \n \n
\n \n
\n \n }\n />\n \n Unable to login, Please try again\n
\n\n
\n \n \n \n \n \n \n \n
\n \n \n
\n \n
\n {\n this.props.userName && \n \n Not received the notification on your mobile device? Click 'Cancel' below.\n
\n\n
\n \n }\n />\n \n Unable to login, Please try again\n
\n\n
HSBC
\n \n\n {\n !this.props.isISVUser ? \n
\n );\n }\n}\n\nconst mapStateToProps = (state) => ({\n login: state.login,\n currentDealInfo: getCurrentDealInfo(state),\n navigationFeatures: getAllowedNavigationFeatures(state),\n languageCode: getSelectedLanguage(state),\n baseFetchCompleted: isBaseFetchCompleted(state),\n isvBaseFetchCompleted: isIsvBaseFetchCompleted(state),\n initializing: state.login.initializing,\n isAnyModalOpened: isAnyModalOpened(state),\n dealSwitch:state.isvUtility.dealSwitch,\n isISVUser: isISVUser(state),\n isvDealData:getIsvCurrentDeal(state),\n isIsvExternalUser:isIsvExternalUser(state)\n});\n\nconst mapDispatchToProps = dispatch => ({\n initialize: (token, expiration, isInternal) => {\n dispatch(initialize(token, expiration, isInternal));\n },\n detectUserInteraction: () => {\n dispatch(detectUserInteraction());\n },\n logOff: () => {\n dispatch(logOff());\n },\n setupDeal: (dealId) => {\n dispatch(dealSetup(dealId, true));\n },\n isvSwitchDeal: (dealId) => {\n dispatch(isvSwitchDeal(dealId))\n },\n setupIsvDeal: (dealId) => {\n dispatch(setupIsvDeal(dealId, true));\n },\n requestIsvDealClick:(dealId , loader)=>{\n dispatch(requestIsvDealClick(dealId,loader))\n }\n})\n\nexport default compose(\n withAnalytics(event => ({\n logoutEvent: () => event(events.LOGOUT),\n })),\n connect(mapStateToProps, mapDispatchToProps)\n)(App);\n","import React from 'react';\n\nfunction manageCookieSettingClick() {\n if (window.utag) {\n window.utag.gdpr.showConsentPreferences()\n }\n}\n\nfunction topFunction() {\n window.location.hash = '';\n document.body.scrollTop = 0;\n document.documentElement.scrollTop = 0;\n}\n\nwindow.onscroll = function() {onScrollEvent()};\n function onScrollEvent() {\n var mybutton = document.getElementById(\"moveToTopBtn\");\n if(mybutton){\n if (window.pageYOffset > 20) {\n mybutton.style.display=\"block\"\n } else {\n mybutton.style.display=\"none\"\n }\n }\n}\n\nconst CookiePolicy = () => (\n <>\n \n Cookie notice\nCookies on this website\nOn this page:\n
This Cookie notice provides you with information about the cookies we use and the purposes for which we use\n them. \nYou can manage your cookie preferences at any time: \n \nWhat are cookies?\nCookies are small pieces of data that websites store on your browser when you visit them. Cookies are\n useful because they allow a website to recognise your visit and collect information about how you use that\n website \nThe cookies we use\nThe cookies we use are either strictly necessary or optional. \nStrictly necessary cookies\nStrictly necessary cookies ensure that our website is able to function properly. We don't have to ask for\n your consent to store these cookies on your browser. We've listed the categories of these strictly necessary\n cookies below. \nCookies that help you log on\nWe use these cookies to remember who you are when you log on to secure areas of our website. You won't be\n able to log on without them. \nCookies that help us provide core services and features\nWe use these cookies to provide core services and features on our website. These services and features\n won't work without them. \nWe work with service providers and third parties who also set these cookies on this website. \n | \n |||||
\n Who else sets these cookies?\n | \n \n For what purpose?\n | \n
| \n Tealium Tag Management \n | \n \n To allow us to control the deployment of tags (software that enhances our website) and also to enable\n the capture and respect of consent preferences obtained from our users \n | \n
Cookies that help keep our website secure
\nWe use these cookies to protect the security of our website, for example, to make sure the website is only\n accessed by genuine users. This helps us to keep you safe.
\nCookies that help us detect fraud or crime
\nWe use these cookies to help us identify suspicious behaviour on our website so we can protect both you and\n us from fraud.
\nOptional cookies
\nWe'd also like to use cookies to provide optional features, improve our website and support advertising and\n social media.
\nWe understand that not everyone likes data to be collected about them when it's not strictly necessary, and\n so we'll ask you to set your preferences when you first visit our website. To make it easier to choose which\n optional cookies to accept, we've organised these cookies by category. These are set out below. Where\n relevant, we've also explained which of our trusted partners helps us make use of these optional cookies.\n
\nYou can choose which categories you'd be happy for us to use in your cookie settings and make changes at\n any time by selecting 'Manage cookie settings' at the top of this page.
\nCookies that we use to make your visit more personal
\nWe use these cookies to ensure our optional features and services work. Our website will still work without\n them.
\nThis category may also include:
\n- \n
- cookies that allow us to customise what you see on our website and where, based on what we know about\n you \n
- cookies that help prevent fraud on other websites or services that you haven't asked to use when you're\n on our website \n
- cookies that help keep secure other websites or services that you haven't asked to use when you're on\n our website \n
Cookies that help us improve our website
\nWe use these cookies to help us understand how people use our website. We can then use this data to improve\n how our website works. For instance, we may use analytics providers to identify and count visits to our\n website and to see which pages people go to and what they do there.
\nWe work with service providers and third parties who also set these cookies on this website.
\n\n Who else sets these cookies?\n | \n \n For what purpose?\n | \n
| \n Adobe Analytics \n | \n \n To enable us to understand how you use and engage with our website \n | \n
Cookies that support marketing
\nWe and our partners use these cookies to understand what you're interested in on our website and on social\n media. These cookies may also identify which other websites may have directed you to our website. This is so\n we or our partners can personalise our marketing to you, including online advertising and through post,\n email, telephone, text, secure message or social media. You can change your mind on how you receive certain\n types of marketing message or choose to stop receiving them at any time. You can find more details about\n this in our Privacy notice.
\nWe work with service providers and third parties who also set these cookies on this website.
\n\n Who else sets these cookies?\n | \n \n For what purpose?\n | \n
| \n Adobe (Audience Manager) \n | \n \n To help us deliver personalisation (including advertising) based on segmentation informed by your\n browsing behaviour and to measure the performance of our digital advertising \n | \n
| \n Adobe (Experience Cloud) \n | \n \n To connect various Adobe Suite technologies together in order to profile audiences and use that\n segmentation in delivering targeted user experiences including advertising both on our own and third\n party sites \n | \n
How we remember your cookie preferences
\nYour preferences are stored in cookies stored on your browser. If you switch off a category of cookies that\n you've previously accepted, then for technical reasons those cookies will not be deleted.
\nTo delete cookies from your browser, we recommend that you clear your browser data. If you do this, or change\n browser, we'll ask for your preferences again when you next visit our website.
\nCookie duration and your browser settings
\nThe length of time for which cookies are stored on your browser varies depending on the cookie. Some cookies\n only last for your online session, whereas others will stay on your browser for a reasonable time afterwards.\n Unless we’ve given a specific time in the list of cookies above, the cookies set via our website will usually\n last up to 13 months after your most recent visit to our site.
\nSome of our partners in the list above also use the same cookies to collect information about the use of\n their own or other websites. In these cases the cookie can remain on your device, usually for up to 13 months\n from your last visit to the site that accessed that cookie
\nYou can use your browser settings to delete cookies that have already been set at any time. You can also use\n your browser settings to manage cookies, for example, to switch off a cookie altogether. If you do this, it\n could mean that we can't use strictly necessary cookies properly and so parts of our website may not work\n correctly. For more information about how to use your browser settings to clear your browser data or to manage\n cookies, check your browser 'Help' function.
\nOur websites
\nWe're changing the way we set cookies on the websites we manage. This means that some of our websites may ask\n you to accept cookies again, or they may not yet be able to fully respect your preferences. We're working on\n this. Please contact us if you have any questions.
\nCookies and your privacy
\nThe information cookies collect, and how we use that information, may count as personal data. We may also be\n able to identify you by name, IP address or session ID. You have rights regarding how we collect, store and\n use your personal data
\nYou can learn more about how we use your personal data in our Privacy\n notice.
\nThe MyDeal Privacy Notice as at 17/Sep/2019
\nOn this Page
\n- \n
- About this notice \n
- Who this Notice applies to \n
- Contact Details \n
- What information we collect \n
- How we’ll use your information \n
- Lawful basis for processing your information \n
- Who we might share your information with \n
- How long we’ll keep your information \n
- Transferring your information overseas \n
- Your rights \n
- How we keep your information secure \n
- Further information about your data \n
- Processing by another HSBC Group controller \n
- Cookies \n
1. About this notice
\nThis Privacy Notice applies to personal information held by members of the HSBC Group as data controllers, or the\n organisation responsible for personal information under our control. It only applies for the purposes of operating\n the MyDeal website and mobile application. For all products, services and processes other than MyDeal, please refer\n to the data controller’s other relevant privacy notice.
\nThis Privacy Notice explains what information we collect about you, how we’ll use that information, who we’ll share\n it with, the circumstances when we’ll share it and what steps we’ll take to make sure it stays private and secure.\n It will continue to apply even if your use of or agreement for MyDeal ends. This Privacy Notice may be updated from\n time to time and the most recent version can be found at https://mydeal.gbm.hsbc.com/.
\n2. Who this Notice applies to
\nThis Privacy Notice applies to your use of the MyDeal website and mobile application. When we say ‘we’, we mean\n HSBC Bank plc and any other HSBC Group companies which act as a data controller in respect of your personal data.\n For the purposes of this notice, the relevant data controller is:
\n(a) HSBC Bank plc, as the operator of the MyDeal website and mobile application, in connection with the provision\n of these services; and
\n(b) the HSBC Group company that the entity you are acting on behalf of has a relationship with (as defined in the\n MyDeal terms and conditions).
\n3. Contact Details
\nYou can find the contact details of the data controllers and their data protection officers (where relevant) by\n clicking on the Customer Support link on https://mydeal.gbm.hsbc.com/ and selecting the relevant\n country/territory.
\n4. What information we collect
\nThe information we collect is required to provide you with access to our services, to fulfil our agreement with the\n entity you are acting on behalf of, to enable us to fulfil our legal and regulatory compliance obligations, and to\n address our legitimate business interests, as described below. Failure to provide your information (or if all\n personal data submitted to us is not complete, accurate, true and correct) may mean it is not possible to provide\n you with access to certain products or services which you or the entity you are acting on behalf of have\n requested.
\nWe’ll only collect your information in line with relevant regulations and law. The information we collect may\n include:
\n4.1 Information that you, or your employer / the profile owner you represent /corporate representative, provide to\n us, e.g.:
\n- \n
- personal details, e.g. name, gender, date of birth, role/occupation; \n
- contact details, e.g. home and work postal addresses, email addresses and phone numbers; \n
- meeting details, e.g. start and end times, location and attendance; \n
- logistic details, e.g. flight numbers, flight times, transportation details and accommodation arrangements; \n
- your feedback about products and services presented on the MyDeal website and mobile application; \n
- authentication information, e.g. integrated login credentials from HSBCnet for access to the MyDeal website and\n mobile application; \n
- other information about you that you give us by filling in forms, surveys, or by communicating with us, whether\n face-to-face, by phone, email, online, or otherwise. \n
4.2 Information we collect or generate about you, e.g.:
\n- \n
- information about you or those you represent and their relationship with us, including the channels you use and\n your ways of interacting with us and the MyDeal website / application, as well information concerning complaints\n and disputes; \n
- information included in customer documentation (e.g. a record of advice that we may have given you); \n
- cookies, and similar technologies we use to make our website operational - our cookie policy available at\n https://mydeal.gbm.hsbc.com/ contains more details about how we use cookies; \n
- records of correspondence and other communications between us, including email, telephone conversations, live\n chat, instant messages and social media communications; \n
- information that we need to support our regulatory obligations, e.g. information about transaction details,\n purpose of payment, ordering customer information, counterparty/beneficiary information, identification documents,\n detection of any suspicious and unusual activity and information about parties connected to you or these\n activities; \n
- information about the devices you use to access MyDeal, e.g. software and IP address. \n
5. How we’ll use your information
\nThe reasons we use your information include to:
\n- \n
- provide you with access to MyDeal (including our mobile app), including identifying you and carrying out your\n instructions, sending alerts, service messaging and notification of activities; \n
- manage our relationship with you or the profile owner you represent (as part of our provision of its MyDeal\n services); \n
- fulfil our contractual arrangements with third party information providers operating in financial markets (e.g.\n Bloomberg). This can include sharing our customer’s identity with those third party providers, including contact\n details of our customer’s representatives, when our customers use that service; \n
- prevent or detect crime including fraud and financial crime, e.g. financing for terrorism and human trafficking;\n \n
- ensure security and business continuity and risk management; \n
- improve products and services, including performance of data analytics to better understand how you or the\n company you represent use our services, and to respond to any service issues you may have; \n
- protect our legal rights and comply with our legal obligations; \n
- carry out marketing activities in relation to our products and services, where permitted; \n
- develop systems or products ; \n
- carry out planning, audit and administrative activities. \n
We do not carry out automated decision making which might produce legal effects and/or otherwise affects you.
\n5.1 Specific use - Tracking or recording what you say or do
\nWe may record details of your interactions with us, including emails, telephone conversations, live chats, video\n chats and any other kinds of communication that you may have with us regarding MyDeal. We may use these recordings\n to check your instructions to us, assess, analyse and improve our service, train our people, manage risk or to\n prevent and detect fraud and other crimes. We may also capture additional information about these interactions, such\n as information about the devices or software that you use.
\n5.2 Specific use - Compliance with laws and regulatory compliance obligations
\nWe’ll use your information to meet our compliance obligations, to comply with other laws and regulations and to\n share with regulators and other authorities that HSBC Group companies are subject to. This may include using it to\n help detect or prevent crime (including terrorism financing, money laundering and other financial crimes). We’ll\n only do this on the basis that it’s needed to comply with a legal obligation or it’s in our legitimate interests and\n that of others.
\n6. Lawful basis for processing your information
\nWe’ll only use your information where we have identified a lawful basis for processing it. These reasons include\n where we:
\n- \n
- need to pursue our legitimate interests or that of the profile owner you represent (for example, as part of our\n provision of its MyDeal services); \n
- need to process the information to carry out an agreement we have with you or the profile owner you represent\n (as part of our provision of its MyDeal services) or a third party information provider operating in financial\n markets (e.g. Bloomberg); \n
- need to process the information to comply with a legal obligation; \n
- believe the use of your information as described is in the public interest e.g. for the purpose of preventing or\n detecting crime; \n
- have obtained your consent in those jurisdictions that mandate it, or consent is the most appropriate basis for\n processing it. \n
7. Who we might share your information with
\nWe may share your information with others where lawful to do so including where we or they:
\n- \n
- need to in order to provide you with products or services you’ve requested, e.g. fulfilling a payment request,\n sharing information with third party vendors who we may utilise; \n
- have a public or legal duty to do so, e.g. to assist with detecting and preventing fraud, tax evasion and\n financial crime; \n
- need to in connection with regulatory reporting, litigation or asserting or defending legal rights and\n interests; \n
- have a legitimate business reason for doing so, e.g. sharing your information and information about your use of\n your account with the profile owner you represent as part of our provision of its MyDeal services, tracking usage,\n performing data analysis to identify market/industry trends and pursuing other business interests; \n
- intend to manage risk, verify your identity, enable another company to provide you with services you’ve\n requested, or assess your suitability for products and services; \n
- have asked you for your permission to share it, and you’ve agreed. \n
We may share your information for these purposes with others including the profile owner you represent, any other\n HSBC group companies and any sub-contractors, agents or service providers who work for us or provide services to us\n or other HSBC Group companies (including their employees, sub-contractors, service providers, directors and\n officers). This includes sharing your information with third party information providers operating in financial\n markets where required in connection with their services.
\n8. How long we’ll keep your information
\nWe keep your information in line with our data retention policy (for example, in some countries/territories we will\n retain information from MyDeal for a minimum 5 year period). This enables us to comply with legal and regulatory\n requirements or use it where we need to for our legitimate purposes such as managing your account and dealing with\n any disputes or concerns that may arise.
\nWe may need to retain your information for a longer period where we need the information to comply with regulatory\n or legal requirements or where we may need it for our legitimate purposes e.g. to help us respond to queries or\n complaints, fighting fraud and financial crime, responding to requests from regulators, etc. If we don’t need to\n retain information for this period of time, we may destroy, delete or anonymise it more promptly.
\n9. Transferring your information overseas
\nYour information may be transferred to and stored in locations outside your home jurisdiction, including\n countries/territories that may not have the same level of protection for personal information. When we do this,\n we’ll ensure they have an appropriate level of protection and that the transfer is lawful. We may need to transfer\n your information in this way to carry out our contract with you, to fulfil a legal obligation, to protect the public\n interest and / or for our legitimate interests. In some countries/territories the law might compel us to share\n information with certain persons (e.g. with tax authorities). Even in these cases, we’ll only share your information\n with people who have the right to see it. You can obtain more details of the protection given to your information\n when it is transferred outside your home jurisdiction by contacting us using the details in the ‘More details about\n your information’ section below.
\n10. Your rights
\nYou have a number of rights in relation to the information that we hold about you. These rights include:
\n- \n
- the right to access information we hold about you and to obtain information about how we process it, save where\n such disclosure would be prohibited by law; \n
- in some circumstances, the right to withdraw your consent to our processing of your information, which you can\n do at any time. We may continue to process your information if we have another legitimate reason for doing so,\n although this may impact your ability to continue to have access to our products and services; \n
- in some circumstances, the right to receive certain information in an electronic format and/or request we\n transmit it to a third party where this is technically feasible. The right only applies to information provided to\n us. \n
- the right to request that we rectify your information if it’s inaccurate or incomplete; \n
- in some circumstances, the right to request that we erase your information. We may continue to retain your\n information if we are entitled or required to retain it; and \n
- the right to object to, and to request that we restrict, our processing of your information in some\n circumstances. Again, there may be situations where you object to, or ask us to restrict, our processing of your\n information but we are entitled to continue processing your information and / or to refuse that request. \n
You can exercise your rights by contacting us using the details set out below. You may also have a right to\n complain to the relevant data protection regulator in the country/territory in which you live or work.
\n11. How we keep your information secure
\nWe use a range of measures to keep your information safe and secure which may include encryption and other forms of\n security. We require our staff and any third parties who carry out any work on our behalf to comply with appropriate\n compliance standards including obligations to protect any information and applying appropriate measures for the use\n and transfer of information.
\n12. Further information about your data
\nIf you’d like further information on your data, or to contact our Data Protection Officer where applicable, please\n contact your usual HSBC representative, or use the Customer Support option on the https://mydeal.gbm.hsbc.com/\n homepage, which sets out our contact details in applicable jurisdictions.
\n13. Processing by another HSBC Group controller
\nWhere you are acting on behalf of an entity that has a relationship with a company of the HSBC Group (as defined in\n the MyDeal terms and conditions), you should read this document in conjunction with the Privacy Notice issued by\n that entity and available at:
\n- \n
- HSBC Bank Australia Limited and The Hongkong and Shanghai Banking Corporation Limited, Sydney Branch in\n Australia: www.hsbc.com.au\n \n
- HSBC Bangladesh:
- HSBC Bank (China) Company Limited:
- The Hongkong and Shanghai Banking Corporation Limited in Hong Kong SAR:
- The Hongkong and Shanghai Banking Corporation Limited in India:
- PT Bank HSBC Indonesia:
- The Hongkong and Shanghai Banking Corporation Limited in Japan:
- The Hongkong and Shanghai Banking Corporation Limited, Seoul Branch in Korea:
- The Hongkong and Shanghai Banking Corporation Limited, Macau Branch in Macau SAR:
- HSBC Bank Malaysia Berhad and HSBC Amanah Malaysia Berhad in Malaysia:
- The Hongkong and Shanghai Banking Corporation Limited Maldives Branch in Maldives:
- The Hongkong and Shanghai Banking Corporation Limited, incorporated in the Hong Kong SAR, acting through its New\n Zealand branch:
- The Hongkong and Shanghai Banking Corporation Limited, Singapore Branch in Singapore:
- The Hongkong and Shanghai Banking Corporation Limited Sri Lanka Branch in Sri Lanka:
- HSBC Bank (Taiwan) Limited and The Hongkong and Shanghai Banking Corporation Limited, Taipei Branch in Taiwan:\n www.hsbc.com.tw \n
- The Hongkong and Shanghai Banking Corporation Limited, Philippines branch in Philippines:
- Hang Seng Bank Limited in Hong Kong SAR:
Where the local notice conflicts with this Privacy Notice, the former shall apply.
\n14. Cookies
\nYou should also read our Cookie Policy at https://mydeal.gbm.hsbc.com/\n to find out more about how HSBC and our trusted partners use cookies, which is relevant to your online security. We\n use cookies to make our website and mobile devices more secure and easier to use.
\n \n \n)\n\nexport default PrivacyPolicy;\n","import React, { Component } from \"react\";\nimport { connect } from \"react-redux\";\nimport styled from \"styled-components\";\nimport {\n getSelectedLanguage,\n makeGetSiteTextSelector,\n getSiteTextValue \n} from \"selectors\";\nimport { openSiteText } from \"actions/LoginActions\";\nimport { Navbar } from \"react-bootstrap\";\nimport logo from \"mk-pattern-library-react/images/HSBC_Logo.svg\";\nimport {\n Logo,\n} from './styles/Login';\nimport CookiePolicy from './CookiePolicy';\nimport PrivacyPolicy from \"./PrivacyPolicy\";\n\nconst InnerContainer = styled.div`\n display: flex;\n flex-direction: row;\n width: 800px;\n margin: 20px auto;\n`;\nconst ContentStyle = {\n marginLeft:\"-177px\"\n};\n\nclass DataPrivacy extends Component {\n\n componentDidMount() {\n this.props.openSiteText(this.props.langCode, this.props.siteTextType ? this.props.siteTextType : getSiteTextValue(this.props.routeParams.routeValue));\n // this.props.navigateEvent(this.props.url ? this.props.url : this.props.location )\n }\n \n\n render() {\n return (\n <>\n\n
\n \n }\n { \n (window.location.pathname === '/privacynotice' || window.location.pathname === '/settings/privacynotice') &&\n <>\n \n
\n {/* \n {props.children}\n
\n)}\n/**\n * A color chip for easy reference.\n */\nconst ColorChip = (props) => {\n const { size, description, colorHex, opacity, fullChip } = props;\n const chipStyle = {\n backgroundColor: colorHex,\n opacity: opacity,\n display: 'inline-block',\n width: size,\n height: size,\n minWidth: size,\n marginRight: 10,\n verticalAlign:'middle'\n };\n return (\n \n \n {`${dateFormatter('', date)} ${moment().isSame(date, 'day') ? timeZone : ''}`}\n \n
\n\nexport const teamColor = i => colors(i);\nexport const findTeamColor = (teamNames, teamName) => colors(teamNames.indexOf(teamName));\n","import Types, { UtilityTypes } from 'actions/Types';\nimport { loginFailure } from 'actions/LoginActions';\n\nconst apiFailure = (message) => ({\n type: Types.API_FAILURE,\n message,\n});\n\nconst apiRequest = (isFetching) => ({\n type: Types.API_REQUEST,\n isFetching,\n});\n\nconst killActiveSagaWorkers = (actionType) => ({\n type: Types.KILL_ACTIVE_SAGA_WORKERS,\n actionType,\n});\n\nconst detectUserInteraction = () => ({\n type: Types.USER_INTERACTION,\n});\n\nconst baseFetchCompleted = dealId => ({\n type: UtilityTypes.BASE_FETCH_COMPLETED,\n dealId\n});\n\n// @effect saga handler\nconst appSetup = (unique_name, isISVUser) => ({\n type: UtilityTypes.APP_SETUP,\n unique_name,\n isISVUser\n});\n\nconst requestAcceptTerms = termsAndConditionsId => ({\n type: Types.API_GET_ACCEPT_TERMS_REQUEST,\n endPoint: `/v1/TermsAndConditions?termsAndConditionsId=${termsAndConditionsId}&accepted=true`,\n ajaxType: 'PATCH',\n onSuccess: receiveTermsAccepted,\n onFailure: loginFailure\n});\n\nconst receiveTermsAccepted = () => ({\n type: Types.API_GET_ACCEPT_TERMS_RESPONSE,\n accepted: true,\n});\n\nconst purge = () => ({ type: UtilityTypes.PURGE });\n\n// @effect saga handler\nconst dealSetup = (dealId, redirect) => ({\n type: UtilityTypes.DEAL_SETUP,\n dealId,\n redirect,\n});\n\nconst dealPurge = () => ({ type: UtilityTypes.DEAL_PURGE });\n\nconst markFeature = (dealFeature, dirty) => ({\n type: UtilityTypes.MARK_FEATURE,\n dealFeature,\n dirty,\n});\n\nconst receiveDeal = dealsData => ({\n type: UtilityTypes.API_GET_DEAL_RESPONSE,\n dealsData,\n})\nconst requestDeal = (dealId, loader) => ({\n type: UtilityTypes.API_GET_DEAL_REQUEST,\n endPoint: `/v1/deals/${dealId}`,\n params: {},\n ajaxType: 'GET',\n onSuccess: receiveDeal,\n loader,\n});\n\nconst receiveDealInfo = response => ({\n type: UtilityTypes.API_GET_DEAL_INFO_RESPONSE,\n dealInfo: response.data[0],\n});\n\nconst requestDealInfo = (dealId, loader) => ({\n type: UtilityTypes.API_GET_DEAL_INFO_REQUEST,\n endPoint: `/v1/dealInfo/${dealId}`,\n params: {},\n ajaxType: 'GET',\n onSuccess: receiveDealInfo,\n loader,\n});\n\nconst tileModuleFetched = tile => ({\n type: UtilityTypes.TILE_MODULE_FETCHED,\n tile,\n});\n\nconst receiveDeals = allDeals => ({\n type: UtilityTypes.API_GET_DEALS_RESPONSE,\n allDeals,\n})\nconst requestDeals = (loader) => ({\n type: UtilityTypes.API_GET_DEALS_REQUEST,\n endPoint: '/v2/deals',\n params: {},\n ajaxType: 'GET',\n onSuccess: receiveDeals,\n loader,\n});\n\nconst receiveNavigationFeatures = ({ data }) => ({\n type: UtilityTypes.API_GET_NAV_FEATURES_RESPONSE,\n navigationFeatures: data,\n});\nconst requestNavigationFeatures = loader => ({\n type: Types.API_GET_NAV_FEATURES_REQUEST,\n endPoint: '/v1/StaticData/NavigationFeature',\n params: {},\n ajaxType: 'GET',\n onSuccess: receiveNavigationFeatures,\n loader,\n});\n\nconst startEventNotificationSaga = () => ({\n type: UtilityTypes.START_EVENT_NOTIFICATION_SAGA,\n});\nconst stopEventNotificationSaga = () => ({\n type: UtilityTypes.STOP_EVENT_NOTIFICATION_SAGA,\n});\n\nconst receivePollingInterval = response => ({\n type: UtilityTypes.API_GET_POLLING_FREQUENCY_RESPONSE,\n pollingFrequency: response.data[0].pollingFrequency,\n});\nconst requestPollingInterval = loader => ({\n type: UtilityTypes.API_GET_POLLING_FREQUENCY_REQUEST,\n endPoint: '/v1/ServiceConfiguration',\n params: {},\n ajaxType: 'GET',\n onSuccess: receivePollingInterval,\n loader, // v 1.7\n});\n\nconst checkFeature = dealFeature => ({\n type: UtilityTypes.CHECK_FEATURE,\n dealFeature,\n});\n\nconst handleHomeFeature = (dealFeature, dealId) => ({\n type: UtilityTypes.EFFECT_HANDLE_HOME_FEATURE_SETUP,\n dealFeature,\n dealId,\n});\n\nconst setHomeFeatureStatus = (dealFeature, status) => ({\n type: UtilityTypes.SET_HOME_FEATURE_FETCH_STATUS,\n dealFeature,\n status,\n});\n\nconst addCalledEndpoint = (dealFeature, endPoint) => ({\n type: UtilityTypes.ADD_CALLED_ENDPOINT_FROM_NOTIFICATION_CYCLE,\n dealFeature,\n endPoint,\n});\n\nconst unauthorizedResponseEffect = dealFeature => ({\n type: UtilityTypes.UNAUTHORIZED_EFFECT_RESPONSE_FEATURE,\n dealFeature,\n});\n\nconst requestFeatureData = (dealFeature, dealId) => ({\n type: UtilityTypes.EFFECT_REQUEST_FEATURE_DATA,\n dealFeature,\n dealId,\n});\n\nconst openModal = modalId => ({\n type: UtilityTypes.OPEN_MODAL,\n modalId,\n});\n\nconst closeModal = modalId => ({\n type: UtilityTypes.CLOSE_MODAL,\n modalId,\n})\nconst changeTab = (tabsId, tabId) => ({\n type: UtilityTypes.CHANGE_TAB,\n tabsId,\n tabId,\n});\n\n// NOTE: All site text is for en-gb at the moment so the language is hard coded\nconst requestSiteText = (languageCode, siteTextType) => ({\n type: UtilityTypes.API_GET_SITE_TEXT_REQUEST,\n endPoint: `../../en-gb/${siteTextType}`,\n ajaxType: 'GET',\n});\n\nconst requestManageDevice = () => ({\n type: UtilityTypes.API_REQUEST_MANAGE_DEVICE,\n endPoint: `/v1/managedevice`,\n ajaxType: 'GET',\n});\n\nconst receiveManageDevice = response => ({\n type: UtilityTypes.API_RECEIVE_MANAGE_DEVICE,\n devices: response.data,\n});\n\nconst deactivateDevice = deviceId => ({\n type: UtilityTypes.API_DEACTIVATE_DEVICE,\n endPoint: `/v1/managedevice/DeactivateUserDevice?userRegisteredDeviceId=${deviceId}`,\n ajaxType: 'PATCH',\n});\n\nexport {\n apiRequest,\n apiFailure,\n killActiveSagaWorkers,\n detectUserInteraction,\n appSetup,\n purge,\n dealSetup,\n dealPurge,\n tileModuleFetched,\n markFeature,\n requestDeal,\n requestDealInfo,\n requestDeals,\n requestNavigationFeatures,\n startEventNotificationSaga,\n stopEventNotificationSaga,\n requestPollingInterval,\n checkFeature,\n handleHomeFeature,\n setHomeFeatureStatus,\n addCalledEndpoint,\n unauthorizedResponseEffect,\n requestFeatureData,\n // fetching\n baseFetchCompleted,\n // modal\n openModal,\n closeModal,\n // tabs\n changeTab,\n requestAcceptTerms,\n requestSiteText,\n requestManageDevice,\n receiveManageDevice,\n deactivateDevice,\n\n};\n","export const ALL_TRANCHES_RECORD = {\n title: 'Book Evolution',\n id: 'aT'\n};\n\nexport const ORDER_STATUS = {\n DELETED: 'Deleted',\n CANCELLED: 'Cancelled',\n INACTIVE: 'InActive',\n ACTIVE: 'Active',\n}\n\nexport const ORDER_SUMMARY_TABS = {\n FULLORDERBOOK: 'FullOrderBook',\n ORDERBOOKSUMMARY: 'OrderBookSummary',\n AMENDEDORDERSUMMARY:'AmendedOrderSummary',\n ORDEREVOLUTION:'OrderEvolution'\n}\n\nexport const ALL_TRANCHES = { key: 0, value: 'ALL', label: 'ALL' }\nexport const ALL_INVESTORS = { key: 0, value: 'ALL', label: 'ALL' }\nexport const DEFAULT_TIME_INTERVAL = { key: 15, value: '15 Min' };\nexport const DEFAULT_ALL = { value: 'ALL', label: 'ALL' };\nexport const DEFAULT_ALL_DAY = {key:81, value: 'ALL DAY', label: 'ALL DAY' };\nexport const DEFAULT_MIN = { key: 0, value: \"00\", label: \"00\" };\nexport const TIME_INTERVALS = [\n { key: 15, value: '15 Min', label: '15 Min' },\n { key: 30, value: '30 Min', label: '30 Min' },\n { key: 60, value: '60 Min', label: '60 Min' },\n];\n\nexport const TIME_RANGES = [\n DEFAULT_ALL_DAY,\n { key: 8, value: '00:00 to 08:00', label: '00:00 to 08:00' },\n { key: 16,value: '08:00 to 16:00', label: '08:00 to 16:00' },\n { key: 0, value: '16:00 to 23:59', label: '16:00 to 00:00' },\n { key: 1, value: 'From specific time', label: ' From specific time' },\n];\n\nexport const STATIC_MINUTES = [\n DEFAULT_MIN,\n { key: 15, value: '15', label: '15' },\n { key: 30, value: '30', label: '30' },\n { key: 45, value: '45', label: '45' },\n];","import { createSelector } from \"reselect\";\nimport { isInternalUser, getUniqueName } from \"selectors\";\n\nconst selectUtilityReducer = (state) => state.isvUtility;\n\nexport const getIsvDeals = (state) => selectUtilityReducer(state).allDeals;\nexport const getIsvCurrentDeal = (state) =>\n selectUtilityReducer(state).dealsData;\n\nexport const getLatestIsvCurrentDeal = (state) => {\n return state.isvInformationBanner.latestIsvCurrentDealData;\n}\nexport const getIsvUniqueProductType = createSelector(\n [getIsvDeals],\n (isvDeals) => {\n const uniqueProductType = [\n ...new Map(\n isvDeals.map((item) => [item[\"productType.productTypeName\"], item])\n ).values(),\n ];\n return uniqueProductType;\n }\n);\n\nexport const selectInformationBannerReducer = (state) => \n state.isvInformationBanner.isDashboardBannerOpen;\n\nexport const dealInformationBannerReducer = (state) =>\n state.isvInformationBanner.isDealInformationBannerOpen;\n\nexport const isIsvExternalUser = createSelector(\n [\n getIsvCurrentDeal,\n (state) => isInternalUser(state),\n (state) => getUniqueName(state),\n ],\n (isvDeal, isInternalUser, userId) => {\n if (!isvDeal || !isvDeal.dealUserMapping || !isvDeal.dealUserMapping.length)\n return false;\n return (\n isvDeal.dealUserMapping.some((ele) => ele.userId === Number(userId)) &&\n (!isInternalUser || isInternalUser === 'false')\n );\n }\n);\n\nexport const referenceInformationBannerReducer = (state) =>\n state.isvInformationBanner.isReferenceInformationBannerOpen;\n\nexport const selectConfirmationBannerStatus = (state) => state.isvInformationBanner.isConfirmationDialogueOpen;\nexport const getIsvCurrentDealId = state => selectUtilityReducer(state).dealsData.dealId;\nexport const selectUploadedFile = state => state.isvDocuments.file;\nexport const selectUploadedOverlayStatus = state => state.isvDocuments.isOverlayOpen;\nexport const selectUploadedTitle = state => state.isvDocuments.title;\nexport const selectIsEcbClientUploaded = state => state.isvDocuments.isEcbClientDocUploaded;\nexport const selectedDocument = state => state.isvDocuments.selectedDocument;\nexport const selectSnackBarStatus = state => state.isvSnackBar.showSnackbar;\nexport const selectSnackBarMessage = state => state.isvSnackBar.snackBarMessage;\nexport const isIsvBaseFetchCompleted = state => selectUtilityReducer(state).isvBaseFetchCompleted;\nexport const dataFetching = state => selectUtilityReducer(state).dataFetching;\nexport const selectDocumentDeleteId = (state) => state.isvInformationBanner.deleteDealDocumentId;\nexport const selectClientDocumentData = state => state.isvDocuments.clientDocumentData;\nexport const selectLatestCommentsDataForCurrentDeal = state => state.isvDocuments.latestCommentsDataForCurrentDeal;\nexport const selectLatestCommentsDataForCurrentComment = state => state.isvDocuments.latestCommentsDataForCurrentComment;\nexport const selectIsCommentPopUpOpen = state => state.isvDocuments.isCommentsPopupOpen;\nexport const selectIsvRejectButtonLabel = state => state.isvDocuments.rejectLabel;\nexport const selectIsvIsAdditionalComment = state => state.isvDocuments.isAdditionalComment;\nexport const selectIsvTableColumnWidth = state => state.isvDocuments.titleTableColumnWidth;\nexport const selectedEcb2ReturnDataForCurrentDeal = state => state.isvDocuments.ecb2ReturnDataForCurrentDeal;\nexport const selectedEcb2ReturnStatus = state => state.isvDocuments.isECBStatusEnabled;\nexport const selectIsRefDocumentUploaded = state => state.isvDocuments.isReferenceDocUploaded;\nexport const selectedReferenceInformationDataForCurrentDeal = state => state.isvDocuments.referenceInformationDataForCurrentDeal;\nexport const selectIsReferenceInformationEnabled = state => state.isvDocuments.isReferenceInformationEnabled;","import Types from 'actions/Types';\n\nconst attemptAuthentication = (response) => ({\n type: Types.ATTEMPT_AUTHENTICATION,\n userData: response,\n});\n\nconst setAuthentication = (status, context) => ({\n type: Types.SET_AUTHENTICATION,\n status,\n context,\n});\n\nconst loginFailure = (message) => ({\n type: Types.LOGIN_FAILURE,\n message\n});\n\nconst logout = (preventSSO) => ({\n type: Types.LOGOUT,\n preventSSO : !preventSSO ? false : true\n});\n\nconst requestAuthTokenGet = (loader) => ({\n type: Types.API_ATTEMPT_SSO,\n endPoint: '/v1/auth2/internal',\n params: {},\n ajaxType: 'GETCREDS',\n onSuccess: attemptAuthentication,\n onFailure: loginFailure,\n loader,\n});\n\nconst requestAuthTokenPost = (username, pdword, loader) => ({\n type: Types.API_ATTEMPT_LOGIN,\n endPoint: '/v1/auth/loginAs',\n params: {\n username,\n pdword,\n },\n ajaxType: 'POST',\n onSuccess: attemptAuthentication,\n onFailure: loginFailure,\n loader,\n});\n\nconst requestPreAuthErrLogPost = (username, request, response, errorCode, errorDescription, loader) => ({\n type: Types.API_PRE_AUTH_ERR_LOG,\n endPoint: '/v1/preauth/error',\n params: {\n username,\n request,\n response,\n errorCode, \n errorDescription,\n },\n ajaxType: 'POST',\n onSuccess: loginFailure,\n onFailure: loginFailure,\n loader,\n});\n\nconst requestExtAuthTokenPost = (username, pdword, aT, loader) => ({\n type: Types.API_ATTEMPT_LOGIN,\n endPoint: '/v1/auth/loginAs',\n params: {\n username,\n pdword,\n aT,\n },\n ajaxType: 'POST',\n onSuccess: attemptAuthentication,\n onFailure: loginFailure,\n loader,\n})\n\nconst loginFormChanged = (fieldName, fieldValue) => ({\n type: Types.LOGIN_FORM_CHANGE,\n fieldName,\n fieldValue,\n});\n\nconst loginFormSubmit = (userNameField, passwordField) => ({\n type: Types.LOGIN_FORM_SUBMIT,\n userNameField,\n passwordField,\n})\n\nconst setInvalidFields = (fields) => ({\n type: Types.SET_INVALID_FIELDS,\n fields,\n})\n\nconst loginFormExtSubmit = (userNameField, authTypeField) => ({\n type: Types.LOGIN_FORM_EXT_SUBMIT,\n userNameField,\n authTypeField\n})\n\nconst loginFormTotpSubmit = ( userNameField, passwordField, aT ) => ({\n type: Types.LOGIN_FORM_TOTP_SUBMIT,\n userNameField,\n passwordField,\n aT,\n})\n\nconst loginFormPnSubmit = ( userNameField, aT ) => ({\n type: Types.LOGIN_FORM_PN_SUBMIT,\n userNameField,\n aT\n})\n\nconst cancelLoginFormPnSubmit = () => ({\n type: Types.CANCEL_LOGIN_FORM_PN_SUBMIT\n})\n\nconst setAuthType = ( authType ) => ({\n type: Types.SET_AUTH_TYPE,\n authType,\n})\n\nconst setLoginError = ( e ) => ({\n type: Types.SET_LOGIN_ERROR,\n e,\n})\n\nconst setIsIsvUser = (e) => ({\n type: Types.SET_IS_ISV_USER,\n e,\n})\n\nconst setUsername = ( userName ) => ({\n type: Types.SET_USERNAME,\n userName,\n})\n\nconst setLoginModal = ( showLoginModal ) => ({\n type: Types.SET_LOGIN_MODAL,\n showLoginModal,\n})\n\nconst loginFormInvalid = (fieldName) => ({\n type: Types.LOGIN_FORM_INVALID,\n fieldName,\n})\n\nconst loginFormValid = (fieldName) => ({\n type: Types.LOGIN_FORM_VALID,\n fieldName,\n})\n\nconst initialize = (token, expiration, isInternal) => ({\n type: Types.INITIALIZE,\n token,\n expiration,\n isInternal,\n})\n\nconst initializing = (initializing) => ({\n type: Types.INITIALIZING,\n initializing,\n});\n\nconst setPendingAuthentication = pending => ({\n type: Types.SET_PENDING_AUTHENTICATION,\n pending,\n});\n\nconst setAuthenticationResponse = message => ({\n type: Types.SET_AUTHENTICATION_RESPONSE,\n message,\n});\n\nconst requestTermsAndConditions = langCode => ({\n type: Types.API_GET_TERMS_AND_CONDITIONS,\n endPoint: `/v1/TermsAndConditions?langCode=${langCode.toLowerCase()}`,\n ajaxType: 'GET',\n onSuccess: receiveTermsAndConditions,\n});\n\nconst receiveTermsAndConditions = response => ({\n type: Types.RECEIVE_TERMS_AND_CONDITIONS,\n data: response.data[0],\n})\n\nconst showTermsAndConditions = () => ({\n type: Types.SHOW_TERMS_AND_CONDITIONS,\n});\n\nconst acceptTermsAndConditions = (accepted, termsAndConditionsId) => ({\n type: Types.ACCEPT_TERMS_CONDITIONS,\n accepted,\n termsAndConditionsId,\n});\n\nconst onTermsCheckedChange = (checked) => ({\n type: Types.ON_TERMS_CHECKED_CHANGE,\n checked,\n});\n\nconst receiveTermsAccepted = () => ({\n type: Types.TERMS_AND_CONDITIONS_ACCEPTED\n});\n\nconst openSiteText = (langCode, siteTextType) => ({\n type: Types.OPEN_SITE_TEXT,\n langCode,\n siteTextType,\n});\n\nconst setSiteText = (langCode, siteTextType, text) => ({\n type: Types.SET_SITE_TEXT,\n langCode,\n siteTextType,\n text,\n});\n\nconst deactivateDevice = deviceId => ({\n type: Types.DEACTIVE_BIOMETRICS_DEVICE,\n deviceId,\n})\n\nconst viewDeviceBiometrics = () => ({\n type: Types.VIEW_DEVICE_BIOMETRICS,\n})\n\nconst setManageDevices = devices => ({\n type: Types.SET_MANAGE_DEVICES,\n devices,\n})\n\nconst clearDeviceDeactivationMessages = () => ({\n type: Types.CLEAR_DEVICE_DEACTIVATE_MESSAGES,\n})\n\nconst setDeviceDeactivationMessages = (response) => ({\n type: Types.SET_DEVICE_DEACTIVATE_MESSAGES,\n response,\n})\n\nexport {\n attemptAuthentication,\n setAuthType,\n setLoginError,\n setIsIsvUser,\n setUsername,\n setAuthentication,\n loginFailure,\n logout,\n requestPreAuthErrLogPost,\n setLoginModal,\n requestAuthTokenPost,\n requestExtAuthTokenPost,\n requestAuthTokenGet,\n loginFormChanged,\n loginFormSubmit,\n setInvalidFields,\n loginFormExtSubmit,\n loginFormTotpSubmit,\n loginFormPnSubmit,\n cancelLoginFormPnSubmit,\n loginFormInvalid,\n loginFormValid,\n initialize,\n initializing,\n setPendingAuthentication,\n setAuthenticationResponse,\n showTermsAndConditions,\n acceptTermsAndConditions,\n onTermsCheckedChange,\n receiveTermsAccepted,\n requestTermsAndConditions,\n receiveTermsAndConditions,\n openSiteText,\n setSiteText,\n deactivateDevice,\n viewDeviceBiometrics,\n setManageDevices,\n clearDeviceDeactivationMessages,\n setDeviceDeactivationMessages,\n};\n","import React, { PureComponent } from 'react';\nimport PropTypes from 'prop-types';\nimport FocusTrap from 'focus-trap-react';\nimport styled from 'styled-components';\n\nimport * as zIndexes from 'shared/styles/variables/indexes';\nimport { ModalContainer } from 'shared/components/Popup';\n\nconst ContainerWrapper = styled.div`\n display: inline-block;\n height: 100%;\n`;\n\nconst ContentWrapper = styled.div`\n ${ModalContainer} {\n width: ${props => props.width}px;\n min-width: ${props => props.width}px;\n padding: 0;\n border: 1px solid #333;\n }\n`;\n\nconst dropdownInlineStyles = {\n boxShadow: '0 5px 10px rgba(0,0,0,.2)',\n position: 'absolute',\n top: -1,\n left: 0,\n zIndex: zIndexes.dropdown,\n}\n\nclass PopupSystem extends PureComponent {\n fallbackFocus = () => {\n const id = this.props.modalID;\n\n setTimeout(() => {\n const clickableElement = document.getElementById(`${id}-btn`);\n\n if (this && this.props && this.props.closeModal) {\n this.props.closeModal();\n }\n\n if (clickableElement) {\n clickableElement.focus();\n }\n }, 100);\n }\n\n render() {\n return (\n \n \n \n {\n this.props.content\n }\n \n \n
\n )\n }\n