X-Git-Url: https://gerrit.onap.org/r/gitweb?p=aai%2Fsparky-fe.git;a=blobdiff_plain;f=src%2Fapp%2Fbyoq%2FCustomDSLSaveLoad.jsx;fp=src%2Fapp%2Fbyoq%2FCustomDSLSaveLoad.jsx;h=e106e4a345cb0f16fcdade088498e195739d8784;hp=0000000000000000000000000000000000000000;hb=5ee7367a101143715c2869d72ea4a6fbf55f5af6;hpb=ddc05d4ea0254b427fea6ec80e2b03950eeca4ce diff --git a/src/app/byoq/CustomDSLSaveLoad.jsx b/src/app/byoq/CustomDSLSaveLoad.jsx new file mode 100644 index 0000000..e106e4a --- /dev/null +++ b/src/app/byoq/CustomDSLSaveLoad.jsx @@ -0,0 +1,842 @@ +/* + * ============LICENSE_START======================================================= + * org.onap.aai + * ================================================================================ + * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved. + * ================================================================================ + * 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========================================================= + */ + +import React, { Component } from 'react'; + +import commonApi from 'utils/CommonAPIService.js'; +import {GlobalExtConstants} from 'utils/GlobalExtConstants.js'; +import Spinner from 'utils/SpinnerContainer.jsx'; +import Grid from 'react-bootstrap/lib/Grid'; +import Row from 'react-bootstrap/lib/Row'; +import Col from 'react-bootstrap/lib/Col'; +import Button from 'react-bootstrap/lib/Button'; +import Modal from 'react-bootstrap/lib/Modal'; +import Tabs from 'react-bootstrap/lib/Tabs'; +import Tab from 'react-bootstrap/lib/Tab'; +import Pagination from 'react-js-pagination'; +import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger'; +import Tooltip from 'react-bootstrap/lib/Tooltip'; +import Panel from 'react-bootstrap/lib/Panel'; +import {GeneralCommonFunctions} from 'utils/GeneralCommonFunctions.js'; +import Alert from 'react-bootstrap/lib/Alert'; +import MultiSelectDropDown from 'generic-components/MultiSelectDropDown.jsx'; +let ENVIRONMENT = GlobalExtConstants.ENVIRONMENT; +let APERTURE_SERVICE = JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE')); + +let INVLIST = GlobalExtConstants.INVLIST; + +const settings = { + 'NODESERVER': INVLIST.NODESERVER, + 'PROXY': INVLIST.PROXY, + 'PREFIX': INVLIST.PREFIX, + 'VERSION': INVLIST.VERSION, + 'USESTUBS': INVLIST.useStubs, + 'TABULAR': INVLIST.TABULAR, + 'APERTURE': INVLIST.APERTURE, + 'TABULARVERSION': INVLIST.TABULARVERSION +}; + +/** + * This class is used to handle any saving or loading of dsl queries + */ + +class CustomDSLSaveLoad extends Component { + + constructor(props) { + console.log(props); + super(props); + APERTURE_SERVICE=JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE')); + this.state = { + enablePublicQueriesBusyFeedback: false, + enableCommunityQueriesBusyFeedback: false, + enablePersonalQueriesBusyFeedback: false, + enableDeleteBusyFeedback: false, + loadedPublicQueries: [], + loadedCommunityQueries: [], + loadedPersonalQueries: [], + filteredPublicEntries: [], + filteredCommunityEntries: [], + filteredPersonalEntries: [], + initialFilteredPublicEntries: [], + initialFilteredCommunityEntries: [], + initialFilteredPersonalEntries:[], + totalPublicResults: 0, + totalCommunityResults: 0, + totalPersonalResults: 0, + queriesPublicErrMsg: false, + queriesCommunityErrMsg: false, + queriesPersonalErrMsg: false, + deleteErrMsg: false, + deleteSuccessfulMsg: false, + focusedEntryName: '', + focusedEntryType: false, + showDeleteModal: false, + filterPublicCriteria: '', + filterCommunityCriteria: '', + filterPersonalCriteria: '', + displayValue:'Category', + selectedOption:{"public":[],"community":[],"personal":[]}, + filterText:'', + activeType:'public', + queryId:'', + loadQueryList:[], + publicLoadQueryList:[], + personalLoadQueryList:[], + communityLoadQueryList:[], + loadQueryLimit:parseInt(sessionStorage.getItem(ENVIRONMENT + 'LOADTEMPLATE_MAX_COUNT')), + loadQueryFlag:true, + selectedCount:0 + }; + settings['ISAPERTURE']=APERTURE_SERVICE; + } + componentDidMount = () => { + this.setState({enablePersonalQueriesBusyFeedback:true,enablePublicQueriesBusyFeedback:true,enableCommunityQueriesBusyFeedback:true}); + this.getQueries(); + }; + componentWillUnmount = () => {}; + + filterPublicList = (event) =>{ + this.filterPublicListWithCategory(event.target.value); + } + filterPublicListWithCategory = (value) =>{ + var updatedList = this.state.loadedPublicQueries; + updatedList = Object.keys(updatedList).filter(key => { + return JSON.stringify(updatedList[key]).toLowerCase().search(value.toLowerCase()) !== -1; + }).reduce( (res, key) => Object.assign(res, { [key]: updatedList[key] }), {} ); + let filterList=this.filterUpdatedList(updatedList, "public"); + console.log('filterPublicListWithCategory filterList>>>>>',filterList); + this.setState({filteredPublicEntries: filterList, totalPublicResults: Object.keys(filterList).length, filterPublicCriteria: value,filterText: value.toLowerCase()}); + } + filterCommunityList = (event) =>{ + this.filterCommunityListWithCategory(event.target.value); + } + filterCommunityListWithCategory = (value) =>{ + var updatedList = this.state.loadedCommunityQueries; + updatedList = Object.keys(updatedList).filter(key => { + return JSON.stringify(updatedList[key]).toLowerCase().search(value.toLowerCase()) !== -1; + }).reduce( (res, key) => Object.assign(res, { [key]: updatedList[key] }), {} ); + let filterList=this.filterUpdatedList(updatedList, "community"); + console.log('filterCommunityListWithCategory filterList>>>>>',filterList); + this.setState({filteredCommunityEntries: filterList, totalCommunityResults: Object.keys(filterList).length, filterCommunityCriteria: value,filterText: value.toLowerCase()}); + } + filterPersonalList = (event) =>{ + this.filterPersonalListWithCategory(event.target.value); + } + filterPersonalListWithCategory =(value) =>{ + var updatedList = this.state.loadedPersonalQueries; + updatedList = Object.keys(updatedList).filter(key => { + return JSON.stringify(updatedList[key]).toLowerCase().search(value.toLowerCase()) !== -1; + }).reduce( (res, key) => Object.assign(res, { [key]: updatedList[key] }), {} ); + let filterList=this.filterUpdatedList(updatedList, "personal"); + console.log('filterPersonalListWithCategory filterList>>>>>',filterList); + this.setState({filteredPersonalEntries: filterList, totalPersonalResults: Object.keys(filterList).length, filterPersonalCriteria: value,filterText: value.toLowerCase()}); + } + filterUpdatedList = (updatedList, type) =>{ + let selectedCategory = this.state.selectedOption[type]; + let filterList = []; + let selectedOption = []; + if(selectedCategory.length > 0){ + selectedOption = Object.keys(selectedCategory).map((index)=>{ + return selectedCategory[index].value; + }); + Object.keys(updatedList).map((key) => { + Object.keys(updatedList[key]).map((entry) => { + if(entry === 'category' && selectedOption.indexOf(updatedList[key][entry]) !==-1){ + filterList[key]=updatedList[key]; + } + }) + }); + }else{ + filterList=updatedList; + } + return filterList; + } + processQueryResponse = (res) => { + var formattedList = []; + for(var i = 0; i < res.length; i++){ + var newQueryObj = {}; + var requiredFieldCount = 0; + if(res[i]){ + newQueryObj.isSelect=false; + newQueryObj.id = res[i].id; + newQueryObj['is_aggregate'] = false; + newQueryObj['is_public'] = false; + newQueryObj['community_shared'] = false; + newQueryObj['template_details'] = []; + for(var j = 0; j < res[i].cols.length; j++){ + if(res[i].cols[j].name){ + if(res[i].cols[j].name === 'query_name'){ + requiredFieldCount++; + newQueryObj.name = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'creator'){ + requiredFieldCount++; + newQueryObj.creator = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'dsl'){ + requiredFieldCount++; + newQueryObj.dsl = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'description'){ + newQueryObj.description = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'is_aggregate'){ + newQueryObj['is_aggregate'] = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'is_public'){ + newQueryObj['is_public'] = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'community_shared'){ + newQueryObj['community_shared'] = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'template_details'){ + newQueryObj['template_details'] = res[i].cols[j].value; + } + if(res[i].cols[j].name === 'category'){ + newQueryObj['category'] = res[i].cols[j].value; + } + } + } + newQueryObj.version = res[i].version; + } + if(requiredFieldCount === 3){ + formattedList[res[i].id] = newQueryObj; + }else{ + console.log('Issue occurred on query list processing for the following element: ' + JSON.stringify(newQueryObj)); + } + } + return formattedList; + } + + getPublicQueries = () => { + settings['ISTABULAR'] = true; + return new Promise((resolve, reject) => { + commonApi(settings, 'queries/is_public=true', 'GET', null, 'BYOQPublicQueries', GlobalExtConstants.OVERRIDE_DOMAIN) + .then(res => { + console.log('res:' + res.data, 'load'); + if(res.status === 200 || res.status === 404){ + if(res.data.status && (res.data.status !== 200 && res.data.status !== 201 && res.data.status !== 404)){ + this.triggerError(res.data); + }else{ + var list = this.processQueryResponse(res.data); + this.setState({ + enablePublicQueriesBusyFeedback:false, + filteredPublicEntries: list, + initialFilteredPublicEntries: list, + totalPublicResults: Object.keys(list).length, + loadedPublicQueries: list + }); + this.runPublicFilter(); + resolve(list); + } + }else{ + this.triggerError(res.data, 'public_load'); + } + resolve([]); + }, error=>{ + if(error.response.status === 404){ + this.setState({ + enablePublicQueriesBusyFeedback:false, + filteredPublicEntries: [], + totalPublicResults: 0, + initialFilteredPublicEntries:[], + loadedPublicQueries: [] + }); + }else{ + this.triggerError(error.response.data, 'public_load'); + } + resolve([]); + }).catch(error => { + this.triggerError(error, 'public_load'); + resolve([]); + }) + }) + } + getCommunityQueries = () => { + settings['ISTABULAR'] = true; + return new Promise((resolve, reject) => { + commonApi(settings, 'queries/community_shared=true', 'GET', null, 'BYOQCommunityQueries', GlobalExtConstants.OVERRIDE_DOMAIN) + .then(res => { + console.log('res:' + res.data, 'load'); + if(res.status === 200 || res.status === 404){ + if(res.data.status && (res.data.status !== 200 && res.data.status !== 201 && res.data.status !== 404)){ + this.triggerError(res.data); + }else{ + var list = this.processQueryResponse(res.data); + this.setState({ + enableCommunityQueriesBusyFeedback:false, + filteredCommunityEntries: list, + initialFilteredCommunityEntries: list, + totalCommunityResults: Object.keys(list).length, + loadedCommunityQueries: list + }); + this.runCommunityFilter(); + resolve(list); + } + }else{ + this.triggerError(res.data, 'community_load'); + } + resolve([]); + }, error=>{ + if(error.response.status === 404){ + this.setState({ + enableCommunityQueriesBusyFeedback:false, + filteredCommunityEntries: [], + totalCommunityResults: 0, + initialFilteredCommunityEntries:[], + loadedCommunityQueries: [] + }); + }else{ + this.triggerError(error.response.data, 'community_load'); + } + resolve([]); + }).catch(error => { + this.triggerError(error, 'community_load'); + resolve([]); + }) + }) + } + getPrivateQueries = () => { + settings['ISTABULAR'] = true; + let query='queries/is_public=false'; + if(sessionStorage.getItem(GlobalExtConstants.ENVIRONMENT + 'userId')){ + query+='&creator=' + sessionStorage.getItem(GlobalExtConstants.ENVIRONMENT + 'userId'); + } + return new Promise((resolve, reject) => { + commonApi(settings, 'queries/is_public=false&creator=' + sessionStorage.getItem(GlobalExtConstants.ENVIRONMENT + 'userId'), 'GET', null, 'BYOQPersonalQueries', GlobalExtConstants.OVERRIDE_DOMAIN) + .then(res => { + console.log('res:' + res.data, 'load'); + if(res.status === 200 || res.status === 404){ + if(res.data.status && (res.data.status !== 200 && res.data.status !== 201 && res.data.status !== 404)){ + this.triggerError(res.data); + }else{ + var list = this.processQueryResponse(res.data); + this.setState({ + enablePersonalQueriesBusyFeedback:false, + filteredPersonalEntries: list, + initialFilteredPersonalEntries: list, + totalPersonalResults: Object.keys(list).length, + loadedPersonalQueries: list + }); + this.runPersonalFilter(); + resolve(list); + } + }else{ + this.triggerError(res.data, 'personal_load'); + } + resolve([]); + }, error=>{ + if(error.response.status === 404){ + this.setState({ + enablePersonalQueriesBusyFeedback:false, + filteredPersonalEntries: [], + initialFilteredPersonalEntries: [], + totalPersonalResults: 0, + loadedPersonalQueries: [] + }); + }else{ + this.triggerError(error.response.data, 'personal_load'); + } + resolve([]); + }).catch(error => { + this.triggerError(error, 'personal_load'); + resolve([]); + }) + }) + } + getQueries = () =>{ + var state = this; + this.getCommunityQueries(); + Promise.all([ + this.getPublicQueries(), + this.getPrivateQueries() + ]) + .then(function (responses) { + var result = Object.assign({}, responses[0], responses[1]); + state.props.setQueriesState(result); + state.setState({loadQueryList:[],publicLoadQueryList:[],personalLoadQueryList:[],communityLoadQueryList:[],selectedCount:0}); + }).catch(function (error) { + console.log(error); + }); + }; + triggerError = (error, type) => { + console.error('[CustomDslSaveLoad.jsx] error : ', JSON.stringify(error)); + let errMsg = ''; + if(error.status && error.message){ + errMsg += "Error Occurred: " + error.status + ' - ' +error.message; + }else{ + errMsg += "Error Occurred: " + JSON.stringify(error); + } + console.log(errMsg); + if(type === 'public_load'){ + this.setState({queriesPublicErrMsg:errMsg, + enablePublicQueriesBusyFeedback:false, + filteredPublicEntries: [], + totalPublicResults: 0, + loadedPublicQueries: []}); + var result = Object.assign({}, [], this.state.loadedPersonalQueries); + this.props.setQueriesState(result); + }else if(type === 'personal_load'){ + this.setState({queriesPersonalErrMsg:errMsg, + enablePersonalQueriesBusyFeedback:false, + filteredPersonalEntries: [], + totalPersonalResults: 0, + loadedPersonalQueries: []}); + var result = Object.assign({}, this.state.loadedPublicQueries, []); + this.props.setQueriesState(result); + }else if(type === 'community_load'){ + this.setState({queriesCommunityErrMsg:errMsg, + enableCommunityQueriesBusyFeedback:false, + filteredCommunityEntries: [], + totalCommunityResults: 0, + loadedCommunityQueries: []}); + var result = Object.assign({}, this.state.loadedCommunityQueries, []); + this.props.setQueriesState(result); + }else if (type === 'delete'){ + this.setState({deleteErrMsg: errMsg + " - Failed to delete query : " + this.state.focusedEntryName, enableDeleteBusyFeedback:false}); + GeneralCommonFunctions.scrollTo("deleteError"); + }else{ + console.log('[CustomDslSaveLoad.jsx] :: triggerError invoked with invalid type : ' + type); + } + } + + runPublicFilter = () =>{ + var updatedList = this.state.loadedPublicQueries; + updatedList = Object.keys(updatedList).filter(key => { + return JSON.stringify(updatedList[key]).toLowerCase().search(this.state.filterPublicCriteria.toLowerCase()) !== -1; + }).reduce( (res, key) => Object.assign(res, { [key]: updatedList[key] }), {} ); + this.setState({filteredPublicEntries: updatedList, totalPublicResults: Object.keys(updatedList).length},()=>{if(this.state.selectedOption["public"].length>0){this.filterPublicListWithCategory(this.state.filterPublicCriteria)}}); + } + runCommunityFilter = () =>{ + var updatedList = this.state.loadedCommunityQueries; + updatedList = Object.keys(updatedList).filter(key => { + return JSON.stringify(updatedList[key]).toLowerCase().search(this.state.filterCommunityCriteria.toLowerCase()) !== -1; + }).reduce( (res, key) => Object.assign(res, { [key]: updatedList[key] }), {} ); + this.setState({filteredCommunityEntries: updatedList, totalCommunityResults: Object.keys(updatedList).length},()=>{if(this.state.selectedOption["community"].length>0){this.filterCommunityListWithCategory(this.state.filterCommunityCriteria)}}); + } + runPersonalFilter = () =>{ + var updatedList = this.state.loadedPersonalQueries; + updatedList = Object.keys(updatedList).filter(key => { + return JSON.stringify(updatedList[key]).toLowerCase().search(this.state.filterPersonalCriteria.toLowerCase()) !== -1; + }).reduce( (res, key) => Object.assign(res, { [key]: updatedList[key] }), {} ); + this.setState({filteredPersonalEntries: updatedList, totalPersonalResults: Object.keys(updatedList).length},()=>{if(this.state.selectedOption["personal"].length>0){this.filterPersonalListWithCategory(this.state.filterPersonalCriteria)}}); + } + + addElement = (element) =>{ + var updatedList = this.state.loadedPublicQueries; + updatedList[element.id] = element[0]; + this.setState({loadedPublicQueries: updatedList}); + this.props.setQueriesState(updatedList); + this.runPublicFilter(); + } + + submitDelete = () =>{ + var loadedQueries = []; + if(this.state.focusedEntryType === "personal"){ + loadedQueries = this.state.loadedPersonalQueries; + }else{ + loadedQueries = this.state.loadedPublicQueries; + } + this.setState({enableDeleteBusyFeedback:true}); + settings['ISTABULAR'] = true; + commonApi(settings, 'queries/' + encodeURIComponent(this.state.queryId), 'DELETE', '{\"id\":\"' + + encodeURIComponent(this.state.queryId) + '\"}', 'BYOQDeleteQuery', GlobalExtConstants.OVERRIDE_DOMAIN, null, + [{ + "name":"If-Match", + "value": loadedQueries[this.state.queryId].version + }]) + .then(res => { + console.log('res:' + res.data); + if(res.status === 200){ + if(res.data.status && (res.data.status !== 200 && res.data.status !== 201)){ + this.triggerError(res.data, 'delete'); + }else{ + var updatedList = loadedQueries; + //remove the entry from the list + updatedList = Object.keys(updatedList).filter(key => { + return key !== this.state.queryId; + }).reduce( (res, key) => Object.assign(res, { [key]: updatedList[key] }), {} ); + this.setState({showDeleteModal:false, + focusedEntryName: '', + enableDeleteBusyFeedback:false, + deleteSuccessfulMsg: "Successfully deleted query : " + this.state.focusedEntryName}); + GeneralCommonFunctions.scrollTo("deleteSuccess"); + if(this.state.focusedEntryType === "personal"){ + this.getCommunityQueries(); + this.setState({loadedPersonalQueries: updatedList}); + var result = Object.assign({}, this.state.loadedPublicQueries, updatedList); + this.props.setQueriesState(result); + }else{ + this.setState({loadedPublicQueries: updatedList}); + var result = Object.assign({}, updatedList, this.state.loadedPersonalQueries); + this.props.setQueriesState(result); + } + this.runPublicFilter(); + this.runCommunityFilter(); + this.runPersonalFilter(); + } + }else{ + this.triggerError(res.data, 'delete'); + } + }, error=>{ + this.triggerError(error.response.data, 'delete'); + }).catch(error => { + this.triggerError(error, 'delete'); + }); + }; + + openDeleteModal = (id,name, isPublic) =>{ + var focusedEntryType = "public"; + if(isPublic === "true"){ + focusedEntryType = "public"; + }else{ + focusedEntryType = "personal"; + } + this.setState({showDeleteModal:true, focusedEntryName: name, focusedEntryType: focusedEntryType, deleteSuccessfulMsg:false, deleteErrMsg:false, queryId:id}); + }; + + closeDeleteModal = () =>{ + this.setState({showDeleteModal:false, focusedEntryName: '', focusedEntryType: false, deleteSuccessfulMsg:false, deleteErrMsg:false, queryId:''}); + }; + + loadQuery = (e) =>{ + this.loadQueryData(e.target.value,0); + }; + loadQueryData=(queryTemp, id)=>{ + let splitString = queryTemp.split('||'); + let name = splitString[0]; + let description = splitString[1]; + let category=(splitString[2] !== 'undefined')? splitString[2]:''; + let dsl = splitString[3]; + let isAggregate = splitString[4]; + let type = splitString[5]; + let queryId = splitString[6]; + let isCommunityShared = splitString[7]; + let templateDetails = splitString[8]; + this.props.loadCallback(name, description, category, dsl, isAggregate, type, queryId, isCommunityShared, id, templateDetails, false); + }; + loadBulkCallback =() =>{ + this.props.loadBulkCallback(this.state.loadQueryList); + } + loadAndRunQuery = (e) =>{ + let splitString = (e.target.value).split('||'); + let dsl = splitString[0]; + let isAggregate = splitString[1]; + this.props.loadCallback('', '', '', dsl, isAggregate, null, '', null, 0, [], true); + }; + onMultiSelectPublicDropdownSelect = (selectedOption) =>{ + console.log('onMultiSelectPublicDropdownSelect selectedList',selectedOption); + var tempSelection = this.state.selectedOption; + tempSelection["public"] = selectedOption; + this.setState({selectedOption:tempSelection},()=>{this.filterPublicListWithCategory(this.state.filterPublicCriteria)}); + }; + onMultiSelectCommunityDropdownSelect = (selectedOption) =>{ + console.log('onMultiSelectCommunityDropdownSelect selectedList',selectedOption); + var tempSelection = this.state.selectedOption; + tempSelection["community"] = selectedOption; + this.setState({selectedOption:tempSelection},()=>{this.filterCommunityListWithCategory(this.state.filterCommunityCriteria)}); + }; + onMultiSelectPersonalDropdownSelect = (selectedOption) =>{ + console.log('onMultiSelectPersonalDropdownSelect selectedList',selectedOption); + var tempSelection = this.state.selectedOption; + tempSelection["personal"] = selectedOption; + this.setState({selectedOption:tempSelection},()=>{this.filterPersonalListWithCategory(this.state.filterPersonalCriteria)}); + }; + prepareMultiOptions = (type) => { + //this.setState({activeType:type}); + let filteredEntries=[]; + if(type==='public'){ + filteredEntries=this.state.initialFilteredPublicEntries; + }else if(type==='community'){ + filteredEntries=this.state.initialFilteredCommunityEntries; + }else{ + filteredEntries=this.state.initialFilteredPersonalEntries; + } + let dupArray=[]; + let multiOption=Object.keys(filteredEntries).map((entry, idx) => { + let obj ={}; + if(filteredEntries[entry]['category'] && dupArray.indexOf(filteredEntries[entry]['category']) === -1){ + obj['value']=filteredEntries[entry]['category']; + obj['label']= filteredEntries[entry]['category']; + dupArray.push(filteredEntries[entry]['category']); + }else{ + obj=''; + } + return obj; + }); + let filterMultiOption = multiOption.filter((entry) => { + if(entry !== '') return entry; + }); + console.log('filterMultiOption>>>>>',filterMultiOption); + return filterMultiOption; + }; + editSavedQuery = (e) =>{ + let splitString = (e.target.value).split('||'); + let name = splitString[0]; + let description = splitString[1]; + let category = (splitString[2] !== 'undefined')? splitString[2]:''; + let dsl = atob(splitString[3]).replace('
','').replace('
',''); + let isAggregate = splitString[4]; + let type = splitString[5]; + let queryId= splitString[6]; + let isCommunityShared = splitString[7]; + let templateDetails = splitString[8]; + this.props.editCallback(name, description, category, dsl, isAggregate, type, queryId, isCommunityShared, templateDetails); + }; + loadAllQueries = () =>{ + console.log('this.state.loadQueryList>>>>',this.state.loadQueryList); + let loadQueryList=this.state.loadQueryList; + for(var l=0;l{ + let splitString = (e.target.value).split('||'); + let type = splitString[5]; + let queryId=splitString[6]; + let queryList=''; + let loadQuery=''; + if(type =='public'){ + queryList=this.state.filteredPublicEntries; + loadQuery= this.state.publicLoadQueryList; + }else if (type == 'personal'){ + queryList=this.state.filteredPersonalEntries; + loadQuery= this.state.personalLoadQueryList; + }else{ + queryList=this.state.filteredCommunityEntries; + loadQuery= this.state.communityLoadQueryList; + } + let flag= true; + if (e.target.checked) { + if(loadQuery.length<10){ + loadQuery.push(e.target.value); + queryList[queryId].isSelect=true; + } + }else{ + let index=loadQuery.indexOf(e.target.value); + loadQuery.splice(index,1); + queryList[queryId].isSelect=false; + } + flag=(loadQuery.length<=10)?true:false; + if(type=='public'){ + this.setState({loadQueryList:loadQuery,publicLoadQueryList:loadQuery,personalLoadQueryList:[],communityLoadQueryList:[],filteredPublicEntries:queryList,loadQueryFlag:flag,selectedCount:loadQuery.length}); + }else if(type=='personal'){ + this.setState({loadQueryList:loadQuery,personalLoadQueryList:loadQuery,publicLoadQueryList:[],communityLoadQueryList:[],filteredPersonalEntries:queryList,loadQueryFlag:flag,selectedCount:loadQuery.length}); + } else{ + this.setState({loadQueryList:loadQuery,communityLoadQueryList:loadQuery,publicLoadQueryList:[],personalLoadQueryList:[],filteredCommunityEntries:queryList,loadQueryFlag:flag,selectedCount:loadQuery.length}); + } + } + render() { + let savedQueryCard = (type, totalCount, filterList, filteredEntries) =>{ + let onMultiSelectDropdownSelect= (type==='public') ? this.onMultiSelectPublicDropdownSelect : (type==='community') ? this.onMultiSelectCommunityDropdownSelect : this.onMultiSelectPersonalDropdownSelect; + return
+
+
+

Find A Query

+
+
+
+
+
+
Total Saved Queries: {totalCount}
+
+
+ {'Enabled for up to '+this.state.loadQueryLimit+' Queries'}}> + + + + +
+
+
+
+
+
+ +
+
+
+
+ +
+
+
+
+
+
+ + + + + + + + + + + + + + + {Object.keys(filteredEntries).sort(function(a, b) { + var compareA = a.toUpperCase(); + var compareB = b.toUpperCase(); + if(compareA < compareB) return -1; + if(compareA > compareB) return 1; + return 0; + }).map((entry, idx) => { + return ( + + + + + + + + + + + ); + })} + +
SelectNameDescriptionCategoryCreatorAggregateSharedActions
+
+ {(this.state.selectedCount===this.state.loadQueryLimit)?'Reached Maximun Template Count '+this.state.loadQueryLimit:(this.state.loadQueryLimit-this.state.selectedCount)+' More Selectable'}}> + + + + +
+ 		{filteredEntries[entry].name}{filteredEntries[entry].description}{(filteredEntries[entry].category)?filteredEntries[entry].category:''}{filteredEntries[entry].creator}{filteredEntries[entry]['is_aggregate']}{filteredEntries[entry]['community_shared']} +
+ + + + +
+
+
+
}; + let savedQueryMessaging = (type, loadedQueries, queryErrMsg) => { return + + {type === 'public' &&

No Saved Public Queries Loaded

} + {type === 'community' &&

No Saved Community Shared Queries Loaded

} + {type === 'personal' &&

No Saved Personal Queries Loaded

} + + { + if(type==='public'){ + this.setState({queriesPublicErrMsg: false}); + }else if (type === 'community'){ + this.setState({queriesCommunityErrMsg: false}); + }else{ + this.setState({queriesPersonalErrMsg: false}); + }}}> +

An error occurred

+

+ {queryErrMsg} +

+ + + } + let savedQueryTabs = () => { return + + + {Object.keys(this.state.loadedPublicQueries).length <= 0 && (
{savedQueryMessaging('public', this.state.loadedPublicQueries, this.state.queriesPublicErrMsg)}
)} + {Object.keys(this.state.loadedPublicQueries).length > 0 && (
{savedQueryCard('public', this.state.totalPublicResults, this.filterPublicList, this.state.filteredPublicEntries)}
)} + + + + + {Object.keys(this.state.loadedCommunityQueries).length <= 0 && (
{savedQueryMessaging('community', this.state.loadedCommunityQueries, this.state.queriesCommunityErrMsg)}
)} + {Object.keys(this.state.loadedCommunityQueries).length > 0 && (
{savedQueryCard('community', this.state.totalCommunityResults, this.filterCommunityList, this.state.filteredCommunityEntries)}
)} + + + + + {Object.keys(this.state.loadedPersonalQueries).length <= 0 &&(
{savedQueryMessaging('personal', this.state.loadedPersonalQueries, this.state.queriesPersonalErrMsg)}
)} + {Object.keys(this.state.loadedPersonalQueries).length > 0 && (
{savedQueryCard('personal', this.state.totalPersonalResults, this.filterPersonalList, this.state.filteredPersonalEntries)}
)} + + + + }; + if (!GlobalExtConstants.INVLIST.IS_ONAP){ + return (
+
+ + + + Delete DSL Query + + + this.setState({deleteErrMsg: false})}> +

An error occurred

+

+ {this.state.deleteErrMsg} +

+ +

Are you sure you want to delete the following query?: {this.state.focusedEntryName}

+ + + + + + + +
+ + + + this.setState({deleteSuccessfulMsg: false})}> +

Delete Successful

+

+ {this.state.deleteSuccessfulMsg} +

+ + {!this.props.isSavedQueryFlow && ( + + +
+

Saved Queries

+
+ + + + + {savedQueryTabs()} + + + )} + {this.props.isSavedQueryFlow && savedQueryTabs()} + + +
); + }else{ + return (); + } + } +} + +export default CustomDSLSaveLoad;