diff options
author | Shawn Severin <shawn.severin@amdocs.com> | 2017-12-20 16:27:35 -0500 |
---|---|---|
committer | Shawn Severin <shawn.severin@amdocs.com> | 2017-12-21 15:29:08 -0500 |
commit | bca1bdc7d52b01ede5c0e85f06cd6c64e5aaab57 (patch) | |
tree | 846b787ece0982ebc2419e4600e6ecd3329a625a /src/generic-components | |
parent | d4fd54113808e9efa637719719b2831e0597996e (diff) |
Updating versions of Sparky FE files
Updating versions of Sparky FE files as previous ones were out-dated
Issue-ID: AAI-543
Change-Id: Idc7d09e0efabaa5ef82db126cf7563fc8370f4f9
Signed-off-by: Shawn Severin <shawn.severin@amdocs.com>
Diffstat (limited to 'src/generic-components')
17 files changed, 0 insertions, 1953 deletions
diff --git a/src/generic-components/dateRange/DateRange.jsx b/src/generic-components/dateRange/DateRange.jsx deleted file mode 100644 index d0f481f..0000000 --- a/src/generic-components/dateRange/DateRange.jsx +++ /dev/null @@ -1,91 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import React, {Component} from 'react'; -import {connect} from 'react-redux'; -import DatePicker from 'react-datepicker'; -import Moment from 'moment-timezone'; -import i18n from 'utils/i18n/i18n'; -import { - LABEL_START_DATE, - LABEL_END_DATE, - DATE_PICKER_PLACEHOLDER -} from 'generic-components/dateRange/DateRangeConstants'; -import DateRangeActions from 'generic-components/dateRange/DateRangeActions'; - -let mapStateToProps = ({dataIntegrity: {dateRangeData}}) => { - let {dateRangeStart, dateRangeEnd, dateRangeError} = dateRangeData; - - return { - dateRangeStart, - dateRangeEnd, - dateRangeError - }; -}; - -let mapActionToProps = (dispatch) => { - return { - startDateChange: (startDate, endDate) => { - dispatch(DateRangeActions.onStartDateChange(startDate, endDate)); - }, - endDateChange: (endDate, startDate) => { - dispatch(DateRangeActions.onEndDateChange(startDate, endDate)); - } - }; -}; - -export class DateRange extends Component { - static propTypes = { - dateRangeStart: React.PropTypes.instanceOf(Moment), - dateRangeEnd: React.PropTypes.instanceOf(Moment), - dateRangeError: React.PropTypes.string - }; - - render() { - let {startDateChange, endDateChange, - dateRangeStart, dateRangeEnd} = this.props; - - return ( - <div className='date-range'> - <span className='date-input'> - <label>{i18n(LABEL_START_DATE) }: </label> - <DatePicker - className='start-date-picker' - selected={dateRangeStart} - onChange={(dateValue) => startDateChange(dateValue, dateRangeEnd) } - placeholderText={i18n(DATE_PICKER_PLACEHOLDER) } - showYearDropdown/> - </span> - <span className='date-input'> - <label>{i18n(LABEL_END_DATE) }: </label> - <DatePicker - className='end-date-picker' - selected={dateRangeEnd} - onChange={(dateValue) => endDateChange(dateValue, dateRangeStart) } - placeholderText={i18n(DATE_PICKER_PLACEHOLDER) } - showYearDropdown/> - </span> - </div> - ); - } -} -export default connect(mapStateToProps, mapActionToProps)(DateRange); diff --git a/src/generic-components/dateRange/DateRangeActions.js b/src/generic-components/dateRange/DateRangeActions.js deleted file mode 100644 index cc2e3fb..0000000 --- a/src/generic-components/dateRange/DateRangeActions.js +++ /dev/null @@ -1,85 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import i18n from 'utils/i18n/i18n'; -import moment from 'moment'; - -import { - dateRangeActionTypes, - DATE_PICKER_PLACEHOLDER, - START_DATE, - END_DATE, - IS_AFTER_END_DATE, - IS_BEFORE_START_DATE -} from 'generic-components/dateRange/DateRangeConstants'; - -function buildInvalidDateRangeAction(startDate, endDate, errorMessage) { - return { - type: dateRangeActionTypes.INVALID_DATE_RANGE, - data: { - dateRange: { - startDate: startDate, - endDate: endDate - }, - errorMsg: errorMessage - } - }; -} - -function buildDateRangeAction(startDate, endDate) { - return { - type: dateRangeActionTypes.DATE_RANGE_CHANGE, - data: { - dateRange: { - startDate: startDate, - endDate: endDate - } - } - }; -} - -export default { - onStartDateChange(startDate, endDate) { - if (endDate && endDate.isBefore(startDate)) { - var errorMessage = i18n(START_DATE) + - ': ' + - moment(new Date(startDate)).format(DATE_PICKER_PLACEHOLDER) + - ' ' + - i18n(IS_AFTER_END_DATE); - return buildInvalidDateRangeAction(startDate, endDate, errorMessage); - } else { - return buildDateRangeAction(startDate, endDate); - } - }, - onEndDateChange(startDate, endDate) { - if (startDate && startDate.isAfter(endDate)) { - var errorMessage = i18n(END_DATE) + - ': ' + - moment(new Date(endDate)).format(DATE_PICKER_PLACEHOLDER) + - ' ' + - i18n(IS_BEFORE_START_DATE); - return buildInvalidDateRangeAction(startDate, endDate, errorMessage); - } else { - return buildDateRangeAction(startDate, endDate); - } - } -}; diff --git a/src/generic-components/dateRange/DateRangeConstants.js b/src/generic-components/dateRange/DateRangeConstants.js deleted file mode 100644 index b59d926..0000000 --- a/src/generic-components/dateRange/DateRangeConstants.js +++ /dev/null @@ -1,37 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import keyMirror from 'utils/KeyMirror.js'; - -export const dateRangeActionTypes = keyMirror({ - DATE_RANGE_CHANGE: null, - INVALID_DATE_RANGE: null -}); - -export const LABEL_START_DATE = 'Start Date'; -export const LABEL_END_DATE = 'End Date'; -export const DATE_PICKER_PLACEHOLDER = 'MM/DD/YYYY'; -export const START_DATE = 'Start date'; -export const END_DATE = 'End date'; - -export const IS_AFTER_END_DATE = 'is after end date'; -export const IS_BEFORE_START_DATE = 'is before start date'; diff --git a/src/generic-components/dateRange/DateRangeReducer.js b/src/generic-components/dateRange/DateRangeReducer.js deleted file mode 100644 index 7fc573c..0000000 --- a/src/generic-components/dateRange/DateRangeReducer.js +++ /dev/null @@ -1,46 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import {dateRangeActionTypes} from 'generic-components/dateRange/DateRangeConstants'; - -export default (state = {}, action) => { - - switch (action.type) { - case dateRangeActionTypes.DATE_RANGE_CHANGE: - return { - ...state, - dateRangeStart: action.data.dateRange.startDate, - dateRangeEnd: action.data.dateRange.endDate, - dateRangeError: '' - }; - - case dateRangeActionTypes.INVALID_DATE_RANGE: - return { - ...state, - dateRangeStart: action.data.dateRange.startDate, - dateRangeEnd: action.data.dateRange.endDate, - dateRangeError: action.data.errorMsg - }; - - } - return state; -}; diff --git a/src/generic-components/dateRangeSelector/DateRangeSelector.jsx b/src/generic-components/dateRangeSelector/DateRangeSelector.jsx deleted file mode 100644 index 9253271..0000000 --- a/src/generic-components/dateRangeSelector/DateRangeSelector.jsx +++ /dev/null @@ -1,159 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import React, {Component} from 'react'; -import {connect} from 'react-redux'; -import moment from 'moment-timezone'; - -import Button from 'react-bootstrap/lib/Button.js'; -import MenuItem from 'react-bootstrap/lib/MenuItem.js'; -import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js'; -import Popover from 'react-bootstrap/lib/Popover.js'; - -import DateRange from 'generic-components/dateRange/DateRange.jsx'; -import {DATE_PICKER_PLACEHOLDER} from 'generic-components/dateRange/DateRangeConstants.js'; -import DateRangeActions from 'generic-components/dateRange/DateRangeActions.js'; -import { - TODAY, - YESTERDAY, - LAST_WEEK, - LAST_MONTH, - CUSTOM, - LABEL_TODAY, - LABEL_YESTERDAY, - LABEL_LAST_WEEK, - LABEL_LAST_MONTH, - LABEL_CUSTOM_SEARCH, - SEARCH_BUTTON_TEXT, - ICON_CLASS_CALENDAR, - ICON_CLASS_DOWN_CARET -} from 'generic-components/dateRangeSelector/DateRangeSelectorConstants.js'; -import DateRangeSelectorActions from 'generic-components/dateRangeSelector/DateRangeSelectorActions.js'; -import InlineMessage from 'generic-components/InlineMessage/InlineMessage.jsx'; - -import i18n from 'utils/i18n/i18n'; - -let currentDayWithTimeZone = moment(new Date()).tz(moment.tz.guess()); -let mapStateToProps = ({dataIntegrity: {dateRangeSelectorData}}) => { - - let { - startDate = currentDayWithTimeZone, - endDate = currentDayWithTimeZone, - period = TODAY, - periodErrText, - periodErrSev - } = dateRangeSelectorData; - - return { - startDate, - endDate, - period, - periodErrText, - periodErrSev - }; -}; - -let mapActionToProps = (dispatch) => { - return { - onNewDateSelection: (startMoment, endMoment, period) => { - let periodChangeAction = DateRangeSelectorActions.onPeriodChange( - startMoment, endMoment, period); - // notify all listeners that the period has changed - dispatch(periodChangeAction); - // update the DateRange component with the newly selected dates - dispatch(DateRangeActions.onStartDateChange( - periodChangeAction.data.dateRange.startDate, - periodChangeAction.data.dateRange.endDate)); - } - }; -}; - -export class DateRangeSelector extends Component { - static propTypes = { - startDate: React.PropTypes.instanceOf(moment), - endDate: React.PropTypes.instanceOf(moment), - period: React.PropTypes.string, - periodErrText: React.PropTypes.string, - periodErrSev: React.PropTypes.string - }; - - newDateSelection(period) { - this.props.onNewDateSelection(this.props.startDate, this.props.endDate, - period); - this.refs.dateRangePopover.hide(); - } - - componentDidMount() { - let {startDate, endDate, period, onNewDateSelection} = this.props; - // whenever the DateRangeSelector is first mounted, want it - // initialized to today's date - startDate = currentDayWithTimeZone; - endDate = currentDayWithTimeZone; - onNewDateSelection(startDate, endDate, period); - } - - render() { - let {period, periodErrSev, periodErrText} = this.props; - let displayDateRange = (this.props.startDate).format( - DATE_PICKER_PLACEHOLDER) + ' - ' + - (this.props.endDate).format(DATE_PICKER_PLACEHOLDER); - return ( - <div className='dateRangeSelector'> - <OverlayTrigger trigger='click' ref='dateRangePopover' - placement='bottom' overlay={ - <Popover id='dateRangeSelectorPopover'> - <MenuItem active={period === TODAY ? true : false} onSelect={() => - this.newDateSelection(TODAY)}>{i18n(LABEL_TODAY)}</MenuItem> - <MenuItem active={period === YESTERDAY ? true : false} onSelect={() => - this.newDateSelection(YESTERDAY)}>{i18n(LABEL_YESTERDAY)}</MenuItem> - <MenuItem active={period === LAST_WEEK ? true : false} onSelect={() => - this.newDateSelection(LAST_WEEK)}>{i18n(LABEL_LAST_WEEK)}</MenuItem> - <MenuItem active={period === LAST_MONTH ? true : false} onSelect={() => - this.newDateSelection(LAST_MONTH)}>{i18n(LABEL_LAST_MONTH)}</MenuItem> - <OverlayTrigger trigger='click' placement='right' overlay={ - <Popover id='customSearchPopover'> - <InlineMessage level={periodErrSev} messageTxt={periodErrText} /> - <DateRange /> - <Button className='dateRangeSearchButton' bsSize='xsmall' - bsStyle='primary' - disabled={periodErrText !== '' ? true : false} - onClick={() => this.newDateSelection(CUSTOM)}> - {i18n(SEARCH_BUTTON_TEXT)} - </Button> - </Popover> - }> - <MenuItem active={period === CUSTOM ? true : false} > - {i18n(LABEL_CUSTOM_SEARCH)} - </MenuItem> - </OverlayTrigger> - </Popover>}> - <Button className='dateRangeSelectorSearchButton' bsStyle='default'> - <i className={ICON_CLASS_CALENDAR} aria-hidden='true'></i> - <span>{displayDateRange} </span> - <i className={ICON_CLASS_DOWN_CARET} aria-hidden='true'></i> - </Button> - </OverlayTrigger> - </div> - ); - } -} -export default connect(mapStateToProps, mapActionToProps)(DateRangeSelector); diff --git a/src/generic-components/dateRangeSelector/DateRangeSelectorActions.js b/src/generic-components/dateRangeSelector/DateRangeSelectorActions.js deleted file mode 100644 index 9579bb6..0000000 --- a/src/generic-components/dateRangeSelector/DateRangeSelectorActions.js +++ /dev/null @@ -1,115 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import { - dateRangeSelectorActionTypes, - ERROR_UNKNOWN_PERIOD, - TODAY, - YESTERDAY, - LAST_WEEK, - LAST_MONTH, - CUSTOM -} from 'generic-components/dateRangeSelector/DateRangeSelectorConstants.js'; - -function buildPeriodChangeAction(startMoment, endMoment, period) { - return { - type: dateRangeSelectorActionTypes.EVENT_PERIOD_CHANGE, - data: { - dateRange: { - startDate: startMoment, - endDate: endMoment - }, - period: period - } - }; -} - -function buildUnknownPeriodAction(startMoment, endMoment, period, errorMsg) { - return { - type: dateRangeSelectorActionTypes.EVENT_PERIOD_ERROR, - data: { - dateRange: { - startDate: startMoment, - endDate: endMoment - }, - period: period, - errorMsg: errorMsg - } - }; -} - -export default { - onPeriodChange(startMoment, endMoment, period) { - var moment = require('moment'); - let startPeriod = moment(new Date()); - let endPeriod = moment(new Date()); - let unknownPeriod = false; - - switch (period) { - case TODAY: - // already have today's date set - break; - case YESTERDAY: - startPeriod = moment(startPeriod).subtract(1, 'days'); - break; - case LAST_WEEK: - startPeriod = moment(startPeriod).subtract(7, 'days'); - break; - case LAST_MONTH: - startPeriod = moment(startPeriod).subtract(1, 'months'); - break; - case CUSTOM: - startPeriod = startMoment; - endPeriod = endMoment; - break; - default: - unknownPeriod = true; - break; - } - - if (unknownPeriod) { - let errorMsg = ERROR_UNKNOWN_PERIOD + ': ' + period; - return buildUnknownPeriodAction(startMoment, endMoment, period, errorMsg); - } else { - /* - Temp fix until we support time ... - - set start date time to 00:00:00 - - set end date time to 23:59:59 - this is to ensure we cover an entire day - (ex: start day May 26, end day May 26 ... expect to cover - 0:00:00 to 23:59:59 for that day) - */ - startPeriod.toDate(); - startPeriod.hour(0); - startPeriod.minute(0); - startPeriod.second(0); - - endPeriod.toDate(); - endPeriod.hour(23); - endPeriod.minute(59); - endPeriod.second(59); - - return buildPeriodChangeAction(startPeriod, endPeriod, period); - } - - } -}; diff --git a/src/generic-components/dateRangeSelector/DateRangeSelectorConstants.js b/src/generic-components/dateRangeSelector/DateRangeSelectorConstants.js deleted file mode 100644 index d231393..0000000 --- a/src/generic-components/dateRangeSelector/DateRangeSelectorConstants.js +++ /dev/null @@ -1,50 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import keyMirror from 'utils/KeyMirror.js'; - -export const dateRangeSelectorActionTypes = keyMirror({ - EVENT_PERIOD_CHANGE: null, - EVENT_PERIOD_ERROR: null, -}); - -// labels -export const LABEL_TODAY = 'Today'; -export const LABEL_YESTERDAY = 'Since Yesterday'; -export const LABEL_LAST_WEEK = 'Since Last Week'; -export const LABEL_LAST_MONTH = 'Since Last Month'; -export const LABEL_CUSTOM_SEARCH = 'Custom'; -export const SEARCH_BUTTON_TEXT = 'Search'; - -// Periods -export const TODAY = 'today'; -export const YESTERDAY = 'yesterday'; -export const LAST_WEEK = 'lastWeek'; -export const LAST_MONTH = 'lastMonth'; -export const CUSTOM = 'custom'; - -// classes -export const ICON_CLASS_CALENDAR = 'fa fa-calendar fa-lg'; -export const ICON_CLASS_DOWN_CARET = 'fa fa-caret-down fa-lg'; - -// errors -export const ERROR_UNKNOWN_PERIOD = 'The specified period is unknown'; diff --git a/src/generic-components/dateRangeSelector/DateRangeSelectorReducer.js b/src/generic-components/dateRangeSelector/DateRangeSelectorReducer.js deleted file mode 100644 index b8b46b1..0000000 --- a/src/generic-components/dateRangeSelector/DateRangeSelectorReducer.js +++ /dev/null @@ -1,60 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import {dateRangeActionTypes} from 'generic-components/dateRange/DateRangeConstants.js'; -import {dateRangeSelectorActionTypes} from 'generic-components/dateRangeSelector/DateRangeSelectorConstants.js'; -import {MESSAGE_LEVEL_DANGER} from 'utils/GlobalConstants.js'; - -export default (state = {}, action) => { - - switch (action.type) { - - case dateRangeActionTypes.DATE_RANGE_CHANGE: - return { - ...state, - startDate: action.data.dateRange.startDate, - endDate: action.data.dateRange.endDate, - periodErrText: '', - periodErrSev: '' - }; - - case dateRangeActionTypes.INVALID_DATE_RANGE: - return { - ...state, - startDate: action.data.dateRange.startDate, - endDate: action.data.dateRange.endDate, - periodErrText: action.data.errorMsg, - periodErrSev: MESSAGE_LEVEL_DANGER - }; - - case dateRangeSelectorActionTypes.EVENT_PERIOD_CHANGE: - return { - ...state, - startDate: action.data.dateRange.startDate, - endDate: action.data.dateRange.endDate, - period: action.data.period, - periodErrText: '', - periodErrSev: '' - }; - } - return state; -}; diff --git a/src/generic-components/dynamicViewLoader/VisualizationProvider.js b/src/generic-components/dynamicViewLoader/VisualizationProvider.js deleted file mode 100644 index 35f4b75..0000000 --- a/src/generic-components/dynamicViewLoader/VisualizationProvider.js +++ /dev/null @@ -1,30 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -/** - * NOTE: the following components have 'props' attributes associated with them, - * these are currently not used but have been left here incase the - * application moves towards a true dashboard layout and thus will allow - * users to customize attribute values per component - */ - -export const visualizationProviderProperties = {}; diff --git a/src/generic-components/filterBar/FilterBarConstants.js b/src/generic-components/filterBar/FilterBarConstants.js deleted file mode 100644 index 51fd1a8..0000000 --- a/src/generic-components/filterBar/FilterBarConstants.js +++ /dev/null @@ -1,55 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import keyMirror from 'utils/KeyMirror.js'; -import {BASE_URL} from 'app/networking/NetworkConstants.js'; - -export const filterBarActionTypes = keyMirror({ - SET_FILTERS: null, - SET_FILTER_VALUES: null, - CLEAR_FILTERS: null, - FILTER_VALUE_CHANGE: null, - NEW_SELECTIONS: null, - SET_NON_CONVERTED_VALUES: null, - SET_CONVERTED_VALUES: null, - SET_UNIFIED_VALUES: null -}); - -export const UNIFIED_FILTERS_URL = BASE_URL + '/rest/search/unifiedFilterRequest'; - -export const DISCOVER_FILTERS_ERROR_MSG = 'There was an error retrieving the' + - ' list of available filters'; - -export const FILTER_BAR_TITLE = 'FILTER BY'; -export const DATE_TIME_ZONE = 'Z'; - -export const FILTER_TYPE_ENUM = { - LIST: 'dropDown', - DATE: 'date' -}; - -export const FILTER_ATTRIBUTE_DEFAULT_VALUE = 'defaultValue'; -export const FILTER_ATTRIBUTE_CONTROLS = 'controls'; -export const FILTER_ATTRIBUTE_CODE = 'code'; -export const FILTER_ATTRIBUTE_VALUES = 'values'; -export const FILTER_ATTRIBUTE_TO = 'to'; -export const FILTER_ATTRIBUTE_FROM = 'from'; diff --git a/src/generic-components/filterBar/FilterBarUtils.js b/src/generic-components/filterBar/FilterBarUtils.js deleted file mode 100644 index 101a66b..0000000 --- a/src/generic-components/filterBar/FilterBarUtils.js +++ /dev/null @@ -1,350 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import isEmpty from 'lodash/isEmpty'; -import moment from 'moment-timezone'; -import { - POST, - POST_HEADER -} from 'app/networking/NetworkConstants.js'; -import { - UNIFIED_FILTERS_URL, - DISCOVER_FILTERS_ERROR_MSG, - DATE_TIME_ZONE, - FILTER_ATTRIBUTE_TO, - FILTER_ATTRIBUTE_FROM, - FILTER_ATTRIBUTE_CODE, - FILTER_ATTRIBUTE_VALUES, - FILTER_ATTRIBUTE_CONTROLS, - FILTER_ATTRIBUTE_DEFAULT_VALUE, - FILTER_TYPE_ENUM, - filterBarActionTypes -} from 'generic-components/filterBar/FilterBarConstants.js'; -import { - MESSAGE_LEVEL_WARNING -} from 'utils/GlobalConstants.js'; -import { - getSetGlobalMessageEvent -} from 'app/globalInlineMessageBar/GlobalInlineMessageBarActions.js'; - -export function buildFilterValueMap(filterValueString) { - let filterValueObj = {}; - let filters = filterValueString.split(','); - - for (let filterIndex in filters) { - let filterStringParts = filters[filterIndex].split('='); - - filterValueObj[filterStringParts[0]] = filterStringParts[1]; - } - - return filterValueObj; -} - -export function buildFilterValueMapFromObj(filterValues) { - let filterValueObj = {}; - - for (let filterIndex in filterValues) { - filterValueObj[filterValues[filterIndex].filterId] = filterValues[filterIndex].filterValue; - } - - return filterValueObj; -} - -export function getFilterListQueryString(filterValueList) { - let filterQueryList = []; - - for (let filter in filterValueList) { - if (filterValueList[filter]) { - filterQueryList.push( - { - 'filterId': filter, - 'filterValue': filterValueList[filter] - } - ); - } - } - - return filterQueryList; -} - -function getFilterSearchURL() { - return UNIFIED_FILTERS_URL.replace('@@IP-ADDRESS@@', document.location.hostname); -} - -function getFiltersQueryObject(viewName) { - return { - 'viewName': viewName - }; -} - -function getFiltersEvent(actionType, filterList) { - return { - type: actionType, - data: filterList - }; -} - -export function getUnifiedFilters(viewName, actionType) { - return dispatch => { - return fetch(getFilterSearchURL(), { - credentials: 'same-origin', - method: POST, - headers: POST_HEADER, - body: JSON.stringify(getFiltersQueryObject(viewName)) - }).then( - (response) => response.json() - ).then( - (responseJson) => { - dispatch( - getFiltersEvent(actionType, responseJson.filters) - ); - } - ).catch( - () => { - dispatch(getSetGlobalMessageEvent(DISCOVER_FILTERS_ERROR_MSG, MESSAGE_LEVEL_WARNING)); - } - ); - }; -} - -function extractConvertedDateValues(dateValues) { - let convertedValues = {}; - if (dateValues.from) { - let startMoment = moment(dateValues.from); - convertedValues.startDate = startMoment.toDate(); - convertedValues.time_zone = startMoment.format(DATE_TIME_ZONE); - } - - if (dateValues.to) { - let endMoment = moment(dateValues.to); - convertedValues.endDate = endMoment.toDate(); - convertedValues.time_zone = endMoment.format(DATE_TIME_ZONE); - } - - convertedValues.code = dateValues.code; - - return convertedValues; -} - -function convertFilterValues(filterValues) { - let convertedFilterValues = {}; - - for (let filterId in filterValues) { - if (filterValues.hasOwnProperty(filterId) && - !isEmpty(filterValues[filterId]) && !isEmpty(filterValues[filterId].controls)) { - let controls = filterValues[filterId].controls; - let firstControlKey = Object.keys(controls)[0]; - if (controls[firstControlKey][FILTER_ATTRIBUTE_VALUES][FILTER_ATTRIBUTE_FROM] || - controls[firstControlKey][FILTER_ATTRIBUTE_VALUES][FILTER_ATTRIBUTE_TO]) { - // TODO should check against filter type (ex: dropdown or date) - // rather than assuming value attributes (ex: 'to' or 'from') - convertedFilterValues[filterId] = - extractConvertedDateValues(controls[firstControlKey][FILTER_ATTRIBUTE_VALUES]); - } else { - let codeValue = controls[firstControlKey][FILTER_ATTRIBUTE_VALUES][FILTER_ATTRIBUTE_CODE]; - convertedFilterValues[filterId] = codeValue; - } - } - } - - return convertedFilterValues; -} - -function combineMissingFilters(filterValues, allFilters) { - let allFilterIds = Object.keys(allFilters); - - for (let id in allFilterIds) { - if (!filterValues.hasOwnProperty(allFilterIds[id])) { - filterValues[allFilterIds[id]] = ''; - } - } - - return filterValues; -} - -function getFilterSelectionEvent(selectedValuesMap, convertedValues) { - return { - type: filterBarActionTypes.NEW_SELECTIONS, - data: { - selectedValuesMap: convertedValues, - unifiedValues: selectedValuesMap - } - }; -} - -export function processFilterSelection(filterValues, allFilters) { - let convertedFilterValues = convertFilterValues(filterValues); - let combinedFilterValues = combineMissingFilters(convertedFilterValues, allFilters); - - // dispatch NEW_SELECTION event type with converted values as the data - return getFilterSelectionEvent(filterValues, combinedFilterValues); -} - -export function setNonConvertedFilterValues(nonConvertedValues) { - return { - type: filterBarActionTypes.SET_NON_CONVERTED_VALUES, - data: nonConvertedValues - }; -} - -function convertedFilterValuesEvent(nonConvertedValues, convertedValues) { - return { - type: filterBarActionTypes.SET_CONVERTED_VALUES, - data: { - nonConvertedValues: nonConvertedValues, - convertedValues: convertedValues - } - }; -} - -function mapValuesToOption(filterOptions, nonConvertedValue) { - let mappedValues = {}; - - // loop over options to find match for value - for (let i in filterOptions) { - if (filterOptions[i].code === nonConvertedValue) { - // found the matching - mappedValues = filterOptions[i]; - break; - } - } - - return mappedValues; -} - -function mapValuesToDateOption(nonConvertedValue) { - let mappedValues = {}; - - if (nonConvertedValue.startDate) { - mappedValues.from = new Date(nonConvertedValue.startDate); - } else { - mappedValues.from = null; - } - - if (nonConvertedValue.endDate) { - mappedValues.to = new Date(nonConvertedValue.endDate); - } else { - mappedValues.to = null; - } - - mappedValues.code = nonConvertedValue.code; - - return mappedValues; -} - -function mapValuesToFilter(nonConvertedValues, allFilters, currentlySetFilterValues) { - let convertedValues = {}; - - for (let nonConvertedId in nonConvertedValues) { - if (nonConvertedValues[nonConvertedId] !== '') { - let matchingFilterObj = allFilters[nonConvertedId]; - let filterControlId = Object.keys(matchingFilterObj.controls)[0]; - let mappedValue = {}; - - if (matchingFilterObj[FILTER_ATTRIBUTE_CONTROLS][filterControlId].type === FILTER_TYPE_ENUM.DATE) { - mappedValue = mapValuesToDateOption(nonConvertedValues[nonConvertedId]); - } else { - mappedValue = mapValuesToOption(matchingFilterObj[FILTER_ATTRIBUTE_CONTROLS][filterControlId].options, - nonConvertedValues[nonConvertedId]); - } - - let values = {}; - values[FILTER_ATTRIBUTE_VALUES] = mappedValue; - let filterControlers = {}; - filterControlers[filterControlId] = values; - let filter = {}; - filter[FILTER_ATTRIBUTE_CONTROLS] = filterControlers; - convertedValues[nonConvertedId] = filter; - } else if (!isEmpty(currentlySetFilterValues[nonConvertedId])) { - // currently a value is set for this filter, need to ensure we map this filter - // to an empty value so that it is cleared/reset - let matchingFilterObj = allFilters[nonConvertedId]; - let filterControlId = Object.keys(matchingFilterObj.controls)[0]; - let mappedValue = {}; - let values = {}; - values[FILTER_ATTRIBUTE_VALUES] = mappedValue; - let filterControlers = {}; - filterControlers[filterControlId] = values; - let filter = {}; - filter[FILTER_ATTRIBUTE_CONTROLS] = filterControlers; - convertedValues[nonConvertedId] = filter; - } - } - - return convertedValues; -} - -export function convertNonConvertedValues(nonConvertedValues, allFilters, currentlySetFilterValues) { - let convertedValues = mapValuesToFilter(nonConvertedValues, allFilters, currentlySetFilterValues); - return convertedFilterValuesEvent(nonConvertedValues, convertedValues); -} - -export function clearFilters() { - return { - type: filterBarActionTypes.CLEAR_FILTERS - }; -} - -function getSetUnifiedFilterValuesEvent(unifiedValues) { - return { - type: filterBarActionTypes.SET_UNIFIED_VALUES, - data: unifiedValues - }; -} - -function getFilterDefault(filters, filterId) { - let filterControlId = Object.keys(filters[filterId][FILTER_ATTRIBUTE_CONTROLS])[0]; - let defaultValue = filters[filterId][FILTER_ATTRIBUTE_CONTROLS][filterControlId][FILTER_ATTRIBUTE_DEFAULT_VALUE]; - if (!defaultValue) { - defaultValue = {}; - } - return defaultValue; -} - -export function setFilterSelectionsToDefaults(filters, filterValues) { - let defaultFilterMap = {}; - - for (let filterId in filters) { - let filterDefaultValue = getFilterDefault(filters, filterId); - if (!isEmpty(filterDefaultValue) || (filterValues && filterValues[filterId])) { - let filterControlId = Object.keys(filters[filterId][FILTER_ATTRIBUTE_CONTROLS])[0]; - let controller = {}; - controller.values = filterDefaultValue; - let controllers = {}; - controllers[filterControlId] = controller; - let controls = {}; - controls.controls = controllers; - defaultFilterMap[filterId] = controls; - } - } - - if (isEmpty(defaultFilterMap)) { - // there are no default values, so need to ensure all filters get cleared, - // but just incase this 'clearing' - let combinedValues = combineMissingFilters(defaultFilterMap, filters); - return setNonConvertedFilterValues(combinedValues); - } else { - // jsut set the Unified Filter Value which will be sent down to the filter (filter - // will set itself to the default value and then send notification back up of the selection - return getSetUnifiedFilterValuesEvent(defaultFilterMap); - } -} diff --git a/src/generic-components/input/validation/ValidationButtons.jsx b/src/generic-components/input/validation/ValidationButtons.jsx deleted file mode 100644 index 1568a57..0000000 --- a/src/generic-components/input/validation/ValidationButtons.jsx +++ /dev/null @@ -1,66 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -/** - * Holds the buttons for save/reset for forms. - * Used by the ValidationForm that changes the state of the buttons according - * to its own state. - * - * properties: - * labledButtons - whether or not to use labeled buttons or icons only - */ -import React from 'react'; -import i18n from 'utils/i18n/i18n.js'; -import Button from 'react-bootstrap/lib/Button.js'; -import FontAwesome from 'react-fontawesome'; - -class ValidationButtons extends React.Component { - - static propTypes = { - labledButtons: React.PropTypes.bool.isRequired, - isReadOnlyMode: React.PropTypes.bool - }; - - state = { - isValid: this.props.formValid - }; - - render() { - var submitBtn = this.props.labledButtons ? i18n('Save') : - <FontAwesome className='check' name='check'/>; - var closeBtn = this.props.labledButtons ? i18n('Cancel') : - <FontAwesome className='close' name='close'/>; - return ( - <div className='validation-buttons'> - {!this.props.isReadOnlyMode ? - <div> - <Button bsStyle='primary' ref='submitbutton' type='submit' - disabled={!this.state.isValid}>{submitBtn}</Button> - <Button type='reset'>{closeBtn}</Button> - </div> - : <Button type='reset'>{i18n('Close')}</Button> - } - </div> - ); - } -} -export default ValidationButtons; diff --git a/src/generic-components/input/validation/ValidationForm.jsx b/src/generic-components/input/validation/ValidationForm.jsx deleted file mode 100644 index af4001e..0000000 --- a/src/generic-components/input/validation/ValidationForm.jsx +++ /dev/null @@ -1,170 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -/** - * ValidationForm should be used in order to have a form that handles it's - * internal validation state. All ValidationInputs inside the form are checked - * for validity and the styling and submit buttons are updated accordingly. - * - * The properties that ahould be given to the form: - * labledButtons - whether or not use icons only as the form default buttons or - * use buttons with labels onSubmit - function for click on the submit button - * onReset - function for click on the reset button - */ -import React from 'react'; -import ValidationButtons from './ValidationButtons.jsx'; - -class ValidationForm extends React.Component { - - static childContextTypes = { - validationParent: React.PropTypes.any, - isReadOnlyMode: React.PropTypes.bool - }; - - static defaultProps = { - hasButtons: true, - onSubmit: null, - onReset: null, - labledButtons: true, - onValidChange: null, - isValid: true - }; - - static propTypes = { - isValid: React.PropTypes.bool, - hasButtons: React.PropTypes.bool, - onSubmit: React.PropTypes.func, - onReset: React.PropTypes.func, - labledButtons: React.PropTypes.bool, - onValidChange: React.PropTypes.func - }; - - state = { - isValid: this.props.isValid - }; - - constructor(props) { - super(props); - this.validationComponents = []; - } - - render() { - var buttons = (this.props.hasButtons) ? - <ValidationButtons labledButtons={this.props.labledButtons} - ref='buttons' - isReadOnlyMode={this.props.isReadOnlyMode}/> - : null; - return ( - <form {...this.props} onSubmit={event => this.handleFormSubmit(event)}> - <div className='validation-form-content'>{this.props.children}</div> - {buttons} - </form> - ); - } - - handleFormSubmit(event) { - event.preventDefault(); - let isFormValid = true; - this.validationComponents.forEach(validationComponent => { - const isInputValid = validationComponent.validate().isValid; - isFormValid = isInputValid && isFormValid; - }); - if (isFormValid && this.props.onSubmit) { - this.props.onSubmit(event); - } else if (!isFormValid) { - this.setState({isValid: false}); - } - }; - - componentDidUpdate(prevProps, prevState) { - // only handling this programatically if the validation of the form is done - // outside of the view (example with a form that is dependent on the state - // of other forms) - if (prevProps.isValid !== this.props.isValid) { - if (this.props.hasButtons) { - this.refs.buttons.setState({isValid: this.state.isValid}); - } - } else if (this.state.isValid !== prevState.isValid) { - if (this.props.hasButtons) { - this.refs.buttons.setState({isValid: this.state.isValid}); - } - // callback in case form is part of bigger picture in view - if (this.props.onValidChange) { - this.props.onValidChange(this.state.isValid); - } - } - } - - componentDidMount() { - if (this.props.hasButtons) { - this.refs.buttons.setState({isValid: this.state.isValid}); - } - } - - - getChildContext() { - return { - validationParent: this, - isReadOnlyMode: this.props.isReadOnlyMode - }; - } - - - /*** - * Used by ValidationInput in order to let the (parent) form know - * the valid state. If there is a change in the state of the form, - * the buttons will be updated. - * - * @param validationComponent - * @param isValid - */ - childValidStateChanged(validationComponent, isValid) { - if (isValid !== this.state.isValid) { - let oldState = this.state.isValid; - let newState = isValid && - this.validationComponents.filter( - otherValidationComponent => validationComponent !== - otherValidationComponent).every(otherValidationComponent => { - return otherValidationComponent.isValid(); - }); - - if (oldState !== newState) { - this.setState({isValid: newState}); - } - } - } - - register(validationComponent) { - this.validationComponents.push(validationComponent); - } - - unregister(validationComponent) { - this.childValidStateChanged(validationComponent, true); - this.validationComponents = - this.validationComponents.filter( - otherValidationComponent => validationComponent !== - otherValidationComponent); - } -} - - -export default ValidationForm; diff --git a/src/generic-components/input/validation/ValidationInput.jsx b/src/generic-components/input/validation/ValidationInput.jsx deleted file mode 100644 index 7c3c2a8..0000000 --- a/src/generic-components/input/validation/ValidationInput.jsx +++ /dev/null @@ -1,351 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -/** - * Used for inputs on a validation form. - * All properties will be passed on to the input element. - * - * The following properties can be set for OOB validations and callbacks: - - required: Boolean: Should be set to true if the input must have a value - - numeric: Boolean : Should be set to true id the input should be an integer - - onChange : Function : Will be called to validate the value if the default validations are not sufficient, should return a boolean value - indicating whether the value is valid - - didUpdateCallback :Function: Will be called after the state has been updated and the component has rerendered. This can be used if - there are dependencies between inputs in a form. - * - * The following properties of the state can be set to determine - * the state of the input from outside components: - - isValid : Boolean - whether the value is valid - - value : value for the input field, - - disabled : Boolean, - - required : Boolean - whether the input value must be filled out. - */ -import React from 'react'; -import ReactDOM from 'react-dom'; -import Validator from 'validator'; -import Input from 'react-bootstrap/lib/Input.js'; -import Overlay from 'react-bootstrap/lib/Overlay.js'; -import Tooltip from 'react-bootstrap/lib/Tooltip.js'; -import isEqual from 'lodash/lang/isEqual.js'; -import i18n from 'utils/i18n/i18n.js'; - -import InputOptions from '../inputOptions/InputOptions.jsx'; - -const globalValidationFunctions = { - required: value => value !== '', - maxLength: (value, length) => Validator.isLength(value, {max: length}), - minLength: (value, length) => Validator.isLength(value, {min: length}), - pattern: (value, pattern) => Validator.matches(value, pattern), - numeric: value => Validator.isNumeric(value), - maxValue: (value, maxValue) => value < maxValue, - alphanumeric: value => Validator.isAlphanumeric(value), - alphanumericWithSpaces: value => Validator.isAlphanumeric( - value.replace(/ /g, '')), - validateName: value => Validator.isAlphanumeric( - value.replace(/\s|\.|\_|\-/g, ''), 'en-US'), - validateVendorName: value => Validator.isAlphanumeric( - value.replace(/[\x7F-\xFF]|\s/g, ''), 'en-US'), - freeEnglishText: value => Validator.isAlphanumeric( - value.replace(/\s|\.|\_|\-|\,|\(|\)|\?/g, ''), 'en-US'), - email: value => Validator.isEmail(value), - ip: value => Validator.isIP(value), - url: value => Validator.isURL(value) -}; - -const globalValidationMessagingFunctions = { - required: () => i18n('Field is required'), - maxLength: (value, maxLength) => i18n( - 'Field value has exceeded it\'s limit, {maxLength}. current length: {length}', - { - length: value.length, - maxLength - }), - minLength: (value, minLength) => i18n( - 'Field value should contain at least {minLength} characters.', {minLength}), - pattern: (value, pattern) => i18n( - 'Field value should match the pattern: {pattern}.', {pattern}), - numeric: () => i18n('Field value should contain numbers only.'), - maxValue: (value, maxValue) => i18n( - 'Field value should be less then: {maxValue}.', {maxValue}), - alphanumeric: () => i18n( - 'Field value should contain letters or digits only.'), - alphanumericWithSpaces: () => i18n( - 'Field value should contain letters, digits or spaces only.'), - validateName: ()=> i18n( - 'Field value should contain English letters, digits , spaces, underscores, dashes and dots only.'), - validateVendorName: ()=> i18n( - 'Field value should contain English letters digits and spaces only.'), - freeEnglishText: ()=> i18n( - 'Field value should contain English letters, digits , spaces, underscores, dashes and dots only.'), - email: () => i18n('Field value should be a valid email address.'), - ip: () => i18n('Field value should be a valid ip address.'), - url: () => i18n('Field value should be a valid url address.'), - general: () => i18n('Field value is invalid.') -}; - -class ValidationInput extends React.Component { - - static contextTypes = { - validationParent: React.PropTypes.any, - isReadOnlyMode: React.PropTypes.bool - }; - - static defaultProps = { - onChange: null, - disabled: null, - didUpdateCallback: null, - validations: {}, - value: '' - }; - - static propTypes = { - onChange: React.PropTypes.func, - disabled: React.PropTypes.bool, - didUpdateCallback: React.PropTypes.func, - validations: React.PropTypes.object - }; - - - state = { - isValid: true, - style: null, - value: this.props.value, - error: {}, - previousErrorMessage: '', - wasInvalid: false - }; - - componentWillReceiveProps({value: nextValue, validations: nextValidaions}) { - if (this.state.wasInvalid) { - const {validations, value} = this.props; - if (value !== nextValue || !isEqual(validations, nextValidaions)) { - this.validate(nextValue, nextValidaions); - } - } else if (this.props.value !== nextValue) { - this.setState({value: nextValue}); - } - } - - render() { - let {isMultiSelect, onOtherChange, type} = this.props; - - let groupClasses = this.props.groupClassName || ''; - if (this.props.validations.required) { - groupClasses += ' required'; - } - let isReadOnlyMode = this.context.isReadOnlyMode; - - return ( - <div className='validation-input-wrapper'> - { - !isMultiSelect && !onOtherChange && type !== 'select' - && <Input - {...this.props} - groupClassName={groupClasses} - ref={'_myInput'} - value={this.state.value} - disabled={isReadOnlyMode || Boolean(this.props.disabled)} - bsStyle={this.state.style} - onChange={() => this.changedInput()} - onBlur={() => this.blurInput()}> - {this.props.children} - </Input> - } - { - (isMultiSelect || onOtherChange || type === 'select') - && <InputOptions onInputChange={() => this.changedInput()} - onBlur={() => this.blurInput()} - hasError={!this.state.isValid} - ref={'_myInput'} {...this.props} /> - } - {this.renderOverlay()} - </div> - ); - } - - renderOverlay() { - let position = 'right'; - if (this.props.type === 'text' - || this.props.type === 'email' - || this.props.type === 'number' - || this.props.type === 'password' - - ) { - position = 'bottom'; - } - - let validationMessage = this.state.error.message || - this.state.previousErrorMessage; - return ( - <Overlay - show={!this.state.isValid} - placement={position} - target={() => {let target = ReactDOM.findDOMNode(this.refs._myInput); return target.offsetParent ? target : undefined;}} - container={this}> - <Tooltip - id={`error-${validationMessage.replace(' ','-')}`} - className='validation-error-message'> - {validationMessage} - </Tooltip> - </Overlay> - ); - } - - componentDidMount() { - if (this.context.validationParent) { - this.context.validationParent.register(this); - } - } - - componentDidUpdate(prevProps, prevState) { - if (this.context.validationParent) { - if (prevState.isValid !== this.state.isValid) { - this.context.validationParent.childValidStateChanged(this, - this.state.isValid); - } - } - if (this.props.didUpdateCallback) { - this.props.didUpdateCallback(); - } - - } - - componentWillUnmount() { - if (this.context.validationParent) { - this.context.validationParent.unregister(this); - } - } - - /*** - * Adding same method as the actual input component - * @returns {*} - */ - getValue() { - if (this.props.type === 'checkbox') { - return this.refs._myInput.getChecked(); - } - return this.refs._myInput.getValue(); - } - - resetValue() { - this.setState({value: this.props.value}); - } - - - /*** - * internal method that validated the value. includes callback to the - * onChange method - * @param value - * @param validations - map containing validation id and the limitation - * describing the validation. - * @returns {object} - */ - validateValue = (value, validations) => { - let {customValidationFunction} = validations; - let error = {}; - let isValid = true; - for (let validation in validations) { - if ('customValidationFunction' !== validation) { - if (validations[validation]) { - if (!globalValidationFunctions[validation](value, - validations[validation])) { - error.id = validation; - error.message = - globalValidationMessagingFunctions[validation](value, - validations[validation]); - isValid = false; - break; - } - } - } else { - let customValidationResult = customValidationFunction(value); - - if (customValidationResult !== true) { - error.id = 'custom'; - isValid = false; - if (typeof customValidationResult === 'string') {//custom validation error message supplied. - error.message = customValidationResult; - } else { - error.message = globalValidationMessagingFunctions.general(); - } - break; - } - - - } - } - - return { - isValid, - error - }; - }; - - /*** - * Internal method that handles the change event of the input. validates and - * updates the state. - */ - changedInput() { - - let {isValid, error} = this.state.wasInvalid ? this.validate() : this.state; - let onChange = this.props.onChange; - if (onChange) { - onChange(this.getValue(), isValid, error); - } - }; - - blurInput() { - if (!this.state.wasInvalid) { - this.setState({wasInvalid: true}); - } - - let {isValid, error} = !this.state.wasInvalid - ? this.validate() - : this.state; - let onBlur = this.props.onBlur; - if (onBlur) { - onBlur(this.getValue(), isValid, error); - } - }; - - validate(value = this.getValue(), validations = this.props.validations) { - let validationStatus = this.validateValue(value, validations); - let {isValid, error} = validationStatus; - let _style = isValid ? null : 'error'; - this.setState({ - isValid, - error, - value, - previousErrorMessage: this.state.error.message || '', - style: _style, - wasInvalid: !isValid || this.state.wasInvalid - }); - - return validationStatus; - } - - isValid() { - return this.state.isValid; - } - -} -export default ValidationInput; diff --git a/src/generic-components/input/validation/ValidationTab.jsx b/src/generic-components/input/validation/ValidationTab.jsx deleted file mode 100644 index 385d585..0000000 --- a/src/generic-components/input/validation/ValidationTab.jsx +++ /dev/null @@ -1,141 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import React from 'react'; -import Tab from 'react-bootstrap/lib/Tab.js'; - -export default -class ValidationTab extends React.Component { - - static propTypes = { - children: React.PropTypes.node, - eventKey: React.PropTypes.any.isRequired, - onValidationStateChange: React.PropTypes.func //This property is assigned - // dynamically via - // React.cloneElement. lookup - // ValidationTabs.jsx. - // therefore it cannot be - // stated as required! - }; - - constructor(props) { - super(props); - this.validationComponents = []; - } - - static childContextTypes = { - validationParent: React.PropTypes.any - }; - - static contextTypes = { - validationParent: React.PropTypes.any - }; - - getChildContext() { - return {validationParent: this}; - } - - state = { - isValid: true, - notifyParent: false - }; - - componentDidMount() { - let validationParent = this.context.validationParent; - if (validationParent) { - validationParent.register(this); - } - } - - componentWillUnmount() { - let validationParent = this.context.validationParent; - if (validationParent) { - validationParent.unregister(this); - } - } - - register(validationComponent) { - this.validationComponents.push(validationComponent); - } - - unregister(validationComponent) { - this.childValidStateChanged(validationComponent, true); - this.validationComponents = - this.validationComponents.filter( - otherValidationComponent => validationComponent !== - otherValidationComponent); - } - - notifyValidStateChangedToParent(isValid) { - - let validationParent = this.context.validationParent; - if (validationParent) { - validationParent.childValidStateChanged(this, isValid); - } - } - - childValidStateChanged(validationComponent, isValid) { - - const currentValidState = this.state.isValid; - if (isValid !== currentValidState) { - let filteredValidationComponents = this.validationComponents.filter( - otherValidationComponent => validationComponent !== - otherValidationComponent); - let newValidState = isValid && - filteredValidationComponents.every(otherValidationComponent => { - return otherValidationComponent.isValid(); - }); - this.setState({isValid: newValidState, notifyParent: true}); - } - } - - validate() { - let isValid = true; - this.validationComponents.forEach(validationComponent => { - const isValidationComponentValid = validationComponent.validate().isValid; - isValid = isValidationComponentValid && isValid; - }); - this.setState({isValid, notifyParent: false}); - return {isValid}; - } - - componentDidUpdate(prevProps, prevState) { - if (prevState.isValid !== this.state.isValid) { - if (this.state.notifyParent) { - this.notifyValidStateChangedToParent(this.state.isValid); - } - this.props.onValidationStateChange(this.props.eventKey, - this.state.isValid); - } - } - - isValid() { - return this.state.isValid; - } - - render() { - let {children, ...tabProps} = this.props; - return ( - <Tab {...tabProps}>{children}</Tab> - ); - } -} diff --git a/src/generic-components/input/validation/ValidationTabs.jsx b/src/generic-components/input/validation/ValidationTabs.jsx deleted file mode 100644 index 64dd365..0000000 --- a/src/generic-components/input/validation/ValidationTabs.jsx +++ /dev/null @@ -1,102 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import React from 'react'; -import ReactDOM from 'react-dom'; -import Tabs from 'react-bootstrap/lib/Tabs.js'; -import Overlay from 'react-bootstrap/lib/Overlay.js'; -import Tooltip from 'react-bootstrap/lib/Tooltip.js'; - -import i18n from 'utils/i18n/i18n.js'; - -export default -class ValidationTab extends React.Component { - - static propTypes = { - children: React.PropTypes.node - }; - - state = { - invalidTabs: [] - }; - - cloneTab(element) { - const {invalidTabs} = this.state; - return React.cloneElement( - element, - { - key: element.props.eventKey, - tabClassName: invalidTabs.indexOf(element.props.eventKey) > -1 - ? 'invalid-tab' - : 'valid-tab', - onValidationStateChange: ( - eventKey, isValid) => this.validTabStateChanged(eventKey, isValid) - } - ); - } - - validTabStateChanged(eventKey, isValid) { - let {invalidTabs} = this.state; - let invalidTabIndex = invalidTabs.indexOf(eventKey); - if (isValid && invalidTabIndex > -1) { - this.setState({ - invalidTabs: invalidTabs.filter( - otherEventKey => eventKey !== otherEventKey) - }); - } else if (!isValid && invalidTabIndex === -1) { - this.setState({invalidTabs: [...invalidTabs, eventKey]}); - } - } - - showTabsError() { - const {invalidTabs} = this.state; - return invalidTabs.length > - 0 && - (invalidTabs.length > 1 || invalidTabs[0] !== this.props.activeKey); - } - - render() { - return ( - <div> - <Tabs {...this.props} ref='tabsList'> - {this.props.children.map(element => this.cloneTab(element))} - </Tabs> - <Overlay - animation={false} - show={this.showTabsError()} - placement='bottom' - target={() => { - let target = ReactDOM.findDOMNode(this.refs.tabsList).querySelector('ul > li.invalid-tab:not(.active):nth-of-type(n)'); - return target && target.offsetParent ? target : undefined; - } - } - container={this}> - <Tooltip - id='error-some-tabs-contain-errors' - className='validation-error-message'> - {i18n('One or more tabs are invalid')} - </Tooltip> - </Overlay> - </div> - ); - } -} diff --git a/src/generic-components/progressBar/ProgressBar.jsx b/src/generic-components/progressBar/ProgressBar.jsx deleted file mode 100644 index adf5b5f..0000000 --- a/src/generic-components/progressBar/ProgressBar.jsx +++ /dev/null @@ -1,45 +0,0 @@ -/* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. - */ -import React from 'react'; - -class ProgressBar extends React.Component { - static propTypes = { - label: React.PropTypes.string, - now: React.PropTypes.string.isRequired - } - - render() { - let {label, now} = this.props; - - return ( - <div className='progress-bar-view'> - <div className='progress-bar-outside'> - <div style={{width: now + '%'}} className='progress-bar-inside'></div> - </div> - <div className='progress-bar-view-label'>{label}</div> - </div> - ); - } -} - -export default ProgressBar; |