{getStart(this.props)} {getChange(this.props)} {getPriority(this.props)}
\r\n \r\n {this.props.reactions != null && this.props.reactions.map((item, i) => {\r\n //default emojis from reactions are not recognized in the backend and I recieve them as text\r\n //I did a mapping only for those 4 values that are not displayed correct\r\n const emoji = this.emojiMap[item.reactionType] || item.reactionType; // Use the emoji from the map, or the original value\r\n\r\n return (\r\n
\r\n );\r\n })}\r\n \r\n\r\n \r\n } else if (props.type === \"attach\" && props.url != null) {\r\n return <>\r\n {props.text}\r\n \r\n \r\n
\r\n } closeDelay={100}\r\n >\r\n \r\n {emoji}\r\n \r\n \r\n \r\n {this.props.reactions != null && this.props.reactions.map((item, i) => {\r\n //default emojis from reactions are not recognized in the backend and I recieve them as text\r\n //I did a mapping only for those 4 values that are not displayed correct\r\n const emoji = this.emojiMap[item.reactionType] || item.reactionType; // Use the emoji from the map, or the original value\r\n\r\n return (\r\n
\r\n );\r\n })}\r\n \r\n \r\n } else if (props.keyWords != null && undefined !== props.keyWords && !props.translated) {\r\n if (props.keyWords.length > 0) {\r\n let tmp, tmptime;\r\n var regex = /(<([^>]+)>)/ig;\r\n let result = props.text.replace(regex, \"\").replace(/&[^;]+;/g, \" \");\r\n tmp = splitWithPunctuation(result);\r\n if (tmp.length == 0) {\r\n out = this.getOutObject(props.text, props.keyWords);\r\n } else {\r\n //union of words from policy and keywordspotting\r\n let keys = props.keyWords.map(k => {\r\n let keyword = k.name ? k.name.split('_')[0].toLowerCase() : \"keyword\";\r\n return keyword;\r\n });\r\n let uniqueChars = [...new Set(keys)];\r\n let collectKeywords = uniqueChars.map(uniqueKey => {\r\n let filterSameKeyword = props.keyWords.filter(k => {\r\n let keyword = k.name ? k.name.split('_')[0].toLowerCase() : \"keyword\";\r\n return uniqueKey === keyword;\r\n });\r\n let filterPolicyResult = filterSameKeyword.filter(k => k.fromPolicy)\r\n if (filterSameKeyword.length > 1 && filterPolicyResult.length > 0) {\r\n return ({\r\n ...filterSameKeyword[0],\r\n fromPolicy: true,\r\n policy: filterPolicyResult[0].policy\r\n })\r\n } else {\r\n return filterSameKeyword[0]\r\n }\r\n })\r\n //end union of words from policy and keywordspotting\r\n for (let x = 0; x < tmp.length; x++) {\r\n if (tmp[x] !== \" \" && tmp[x] !== \",\" && tmp[x] !== \".\") {\r\n let isKeyword = false;\r\n let item = null\r\n\r\n for (let y = 0; y < collectKeywords.length; y++) {\r\n tmptime = null;\r\n let keyword = \"\";\r\n let soundlike = undefined;\r\n let keywordAndSoundslikeList = (collectKeywords[y].name ? collectKeywords[y].name : \"keyword\").split('_'); //split keyword by keyword and soundlike\r\n keyword = keywordAndSoundslikeList[0].toLowerCase();\r\n if (keywordAndSoundslikeList[1]) {\r\n soundlike = keywordAndSoundslikeList[1].toLowerCase();\r\n }\r\n //split the word\r\n let keywordSplit = keyword.split(' ')\r\n keywordSplit.forEach(k => {\r\n if (collectKeywords[y].hasSearchExactKeywords) {\r\n if (tmp[x].toLowerCase() === k || tmp[x].toLowerCase() === soundlike) {\r\n isKeyword = true;\r\n tmptime = collectKeywords[y].betterTime;\r\n }\r\n } else {\r\n var word = tmp[x].toLowerCase();\r\n if (this.similarityPercentage(word, k) >= 70 || this.similarityPercentage(word, soundlike) >= 70) {\r\n isKeyword = true;\r\n tmptime = collectKeywords[y].betterTime;\r\n }\r\n\r\n //if (tmp[x].toLowerCase().includes(k) || tmp[x].toLowerCase().includes(soundlike)) {\r\n // isKeyword = true;\r\n // tmptime = collectKeywords[y].betterTime;\r\n //}\r\n }\r\n })\r\n\r\n if (isKeyword) {\r\n item = collectKeywords[y]\r\n break\r\n }\r\n }\r\n\r\n if (isKeyword) {\r\n out.push({ src: tmp[x] + \" \", sec: tmptime, fromPolicy: item.fromPolicy, policy: item.policy, categorie: item.categorie })\r\n } else {\r\n out.push({ src: tmp[x] + \" \" })\r\n }\r\n }\r\n }\r\n\r\n }\r\n\r\n let blockStart = this.SimpleTimeParser(this.props.instances[0].start)\r\n let blockEnd = this.SimpleTimeParser(this.props.instances[0].end)\r\n let highlight = false\r\n this.props.policyResultAdherence.forEach(pr => {\r\n let app = pr.appearances[0]\r\n if (pr.name != \"notMentioned\" && (blockStart >= this.SimpleTimeParser(app.startTime) && blockEnd <= this.SimpleTimeParser(app.endTime))) {\r\n highlight = true\r\n }\r\n })\r\n\r\n return \r\n \r\n
\r\n } closeDelay={100}\r\n >\r\n \r\n {emoji}\r\n \r\n \r\n \r\n {out.map(({ src, sec, categorie, policy, fromPolicy }, i) => {\r\n return (\r\n
\r\n }\r\n //Adherence and pattern case\r\n else if (props.policyResultAdherence != null && undefined !== props.policyResultAdherence && props.policyResultAdherence.length > 0) {\r\n let regex = /(<([^>]+)>)/ig\r\n let result = props.text.replace(regex, \"\").replace(/&[^;]+;/g, \" \");\r\n let tmp = splitWithPunctuation(result);\r\n\r\n let blockStart = this.SimpleTimeParser(props.instances[0].start)\r\n let blockEnd = this.SimpleTimeParser(props.instances[0].end)\r\n\r\n let highlight, fromPolicy = false\r\n let policy = \"\"\r\n\r\n props.policyResultAdherence.forEach(pr => {\r\n let app = pr.appearances[0]\r\n if (Math.floor(blockStart) >= Math.floor(app.startSeconds) && Math.floor(blockEnd) <= Math.floor(app.endSeconds)) {\r\n highlight = true\r\n fromPolicy = true\r\n policy = pr.policy\r\n }\r\n })\r\n return \r\n {tmp.map((text, i) => {\r\n return (\r\n
\r\n }\r\n else {\r\n return {props.text}
\r\n }\r\n }\r\n else {\r\n if (props.type === \"chat\") {\r\n return <>\r\n \r\n\r\n \r\n {this.props.reactions != null && this.props.reactions.map((item, i) => {\r\n //default emojis from reactions are not recognized in the backend and I recieve them as text\r\n //I did a mapping only for those 4 values that are not displayed correct\r\n const emoji = this.emojiMap[item.reactionType] || item.reactionType; // Use the emoji from the map, or the original value\r\n\r\n return (\r\n
\r\n );\r\n })}\r\n \r\n \r\n } else if (props.type === \"attach\") {\r\n return <>\r\n \r\n \r\n
\r\n } closeDelay={100}\r\n >\r\n \r\n {emoji}\r\n \r\n \r\n {props.text}{props.url != null ? props.url : \"\"}
\r\n \r\n {this.props.reactions != null && this.props.reactions.map((item, i) => {\r\n //default emojis from reactions are not recognized in the backend and I recieve them as text\r\n //I did a mapping only for those 4 values that are not displayed correct\r\n const emoji = this.emojiMap[item.reactionType] || item.reactionType; // Use the emoji from the map, or the original value\r\n\r\n return (\r\n
\r\n );\r\n })}\r\n \r\n \r\n } else {\r\n return \r\n \r\n
\r\n } closeDelay={100}\r\n >\r\n \r\n {emoji}\r\n \r\n \r\n {props.text}
\r\n }\r\n }\r\n\r\n };\r\n\r\n //translate text comming from graph for info headers like \"call started, call ended, etc.\"\r\n translateInformationText = (context, text, translated) => {\r\n let translatedText = \"\";\r\n\r\n // Check if text is empty\r\n if (!text) {\r\n return translatedText;\r\n }\r\n\r\n //return original text if already translated from translation option\r\n if (translated) {\r\n return text;\r\n } else { //translate to be displayed in teams language by default\r\n\r\n //text should came in format \"CallStarted CallKeep\" or \"Stop�:�my reason\". What cand be translated like callStarted or Stop, will show translated\r\n //and personalized text like \"my reason\" will be shown as it is since we don't have control over it\r\n const values = text.split(\" \");\r\n\r\n for (var i = 0; i < values.length; i++) {\r\n if (values.length <= 1) {\r\n translatedText = context.getTranslation(\"detailContainer\", values[i]);\r\n } else {\r\n const translatedValue = context.getTranslation(\"detailContainer\", values[i]);\r\n translatedText += ` ${translatedValue}`;\r\n }\r\n }\r\n }\r\n\r\n\r\n\r\n return translatedText;\r\n }\r\n\r\n render(): React.ReactNode {\r\n if (this.props.type === \"rec\" && this.props.viewType === \"liveView\") {\r\n return (\r\n {this.props.viewType === \"liveView\" ? \"\" : this.props.speakerId} {getStart(this.props)} {this.translateInformationText(context, this.props.text, this.props.translated)}
\r\n {this.props.viewType === \"liveView\" ? \"\" : this.props.speakerId} {getStart(this.props)} {this.translateInformationText(context, this.props.text, this.props.translated)}
\r\n {this.props.speakerId} {getStart(this.props)} {getChange(this.props)} {getPriority(this.props)}
\r\n \r\n 600 ? (this.state.languageToText !== \"\" ?\r\n context.getTranslation(\"detailContainer\", \"translateTo\") + this.state.languageToText : context.getTranslation(\"detailContainer\", \"translate\"))\r\n : context.getTranslation(\"detailContainer\", \"translateShort\")}\r\n menuProps={{\r\n onRenderMenuList: this._renderMenuList,\r\n onItemClick: this._onItemClick,\r\n title: 'Language',\r\n shouldFocusOnMount: true,\r\n items: this.state.items\r\n }}\r\n />\r\n
)}\r\n \r\n
\r\n );\r\n }\r\n}","import gql from 'graphql-tag';\r\n\r\n\r\n// queryName:saveFoldersInConversation, params: conversationId, conversationFolders\r\nexport const saveFoldersInConversation = gql`mutation saveFoldersInConversation($auth: AuthInput, $conversationId: String!, $folders:[String]!){\r\n saveFoldersInConversation(input: $auth, conversationId:$conversationId, selectedFolders:$folders)\r\n {\r\n id\r\n text\r\n status\r\n }\r\n}`\r\n\r\nexport const bulkFoldersMutation = gql`\r\n mutation bulkFoldersMutation($auth: AuthInput, $conversationId:[String], $selectedFolders:[String], $action:String){\r\n bulkCoversationSafe(input: $auth,conversationId:$conversationId,selectedFolders:$selectedFolders, action:$action){\r\n status\r\n }\r\n }\r\n`\r\n\r\nexport const getFilterRecordings = gql`\r\n query getFilterRecordings ($val : String!, $filter: RecordingFilterInputType, $withSave: Boolean, $auth:AuthInput, $path: String){\r\n getFilterRecordings(search:$val, filter:$filter, withSave:$withSave, input:$auth, path:$path)\r\n {\r\n userRules\r\n {\r\n defaultFilter {\r\n id\r\n type\r\n cycle\r\n startDate\r\n endDate\r\n categories\r\n policies\r\n persons\r\n }\r\n recordingFilter\r\n {\r\n id\r\n type\r\n cycle\r\n startDate\r\n endDate\r\n persons\r\n defaultFilter\r\n userFilter\r\n categories\r\n integrations\r\n policies\r\n folders\r\n }\r\n }\r\n statistics\r\n {\r\n count\r\n }\r\n days\r\n {\r\n date\r\n content\r\n {\r\n day\r\n timein\r\n timeout\r\n topic\r\n id\r\n conversationId\r\n policies{\r\n policyId\r\n monitoredBy\r\n riskRating\r\n }\r\n recordingType\r\n duration\r\n thumbnail\r\n speech2Text\r\n notes\r\n isVideo\r\n hasVideo\r\n hasAudio\r\n hasChat\r\n hasFiles\r\n hasScreenSharing\r\n replayAllowed\r\n archiveAllowed\r\n archiveAccessType\r\n isRestoreApproved\r\n isApprover\r\n linkedUser\r\n {\r\n id\r\n userId\r\n tenantId\r\n name\r\n }\r\n callStartMs\r\n ownerDisplayName\r\n userId\r\n archiveStatus\r\n hasRestoreStarted\r\n customFields\r\n conversationSafe\r\n conversationSafeFolders{\r\n id\r\n name\r\n }\r\n ttl\r\n }\r\n }\r\n }\r\n }\r\n`\r\n\r\nexport const getAllFolders = gql`query ent($auth: AuthInput){\r\n getConversationSafeFolders(input: $auth){\r\n id\r\n name\r\n tenantId\r\n description\r\n visibilityDetails{\r\n visibilityDetailsActive\r\n visibilityDetailsNotes\r\n visibilityDetailsTranscript\r\n visibilityDetailsTTL\r\n visibilityDetailsAnalytics\r\n visibilityDetailsAnalyticsChange\r\n visibilityDetailsCustomFields\r\n visibilityDetailsMetadata\r\n visibilityDetailsReplay\r\n visibilityDetailsQM\r\n }\r\n userId\r\n ownerName\r\n addConversations\r\n removeConversations\r\n exportFolders\r\n supervisors{\r\n name\r\n mail\r\n userId\r\n }\r\n attentionRequired\r\n allowedInPolicy\r\n conversations {\r\n day\r\n timein\r\n timeout\r\n topic\r\n id\r\n conversationId\r\n recordingType\r\n duration\r\n thumbnail\r\n notes\r\n isVideo\r\n hasVideo\r\n hasAudio\r\n hasChat\r\n hasFiles\r\n hasScreenSharing\r\n hasUserScreen\r\n replayAllowed\r\n archiveAllowed\r\n archiveAccessType\r\n isRestoreApproved\r\n isApprover\r\n linkedUser\r\n {\r\n id\r\n userId\r\n tenantId\r\n name\r\n }\r\n callStartMs\r\n ownerDisplayName\r\n userId\r\n archiveStatus\r\n hasRestoreStarted\r\n customFields\r\n conversationSafe\r\n ttl\r\n }\r\n }\r\n }`\r\n\r\n//query to retrieve list of folders flagged with\r\nexport const getFoldersAllowedForPolicies = gql`query getFoldersAllowedForPolicies($auth: AuthInput){\r\n getConversationSafeFolderLabelsPolicy(input: $auth){\r\n id\r\n name\r\n }\r\n}`\r\n\r\n// Variation to getAllFolders query to retrieve not all fields but only id and name. to populate dropdown input in ttl\r\n// pivot.\r\nexport const getAllFoldersShrinked = gql`query getAllFoldersShrinked($auth: AuthInput){\r\n getConversationSafeFolders(input: $auth){\r\n id\r\n name \r\n addConversations\r\n removeConversations\r\n userId\r\n }\r\n }`\r\n\r\nexport const getConversationSafeFolder = gql`query getConversationSafeFolder ($id: String, $auth: AuthInput){\r\n getConversationSafeFolder(id: $id, input: $auth){\r\n id\r\n name\r\n description\r\n addConversations\r\n removeConversations\r\n exportFolders\r\n supervisors {\r\n userId\r\n }\r\n visibilityDetails{\r\n visibilityDetailsActive\r\n visibilityDetailsNotes\r\n visibilityDetailsTranscript\r\n visibilityDetailsTTL\r\n visibilityDetailsAnalytics\r\n visibilityDetailsAnalyticsChange\r\n visibilityDetailsCustomFields\r\n visibilityDetailsMetadata\r\n visibilityDetailsReplay\r\n visibilityDetailsQM\r\n }\r\n attentionRequired\r\n conversations{\r\n id\r\n conversationId\r\n }\r\n ownerName\r\n userId\r\n tenantId\r\n allowedInPolicy\r\n allowedToEditFlagAllowedInPolicy\r\n }\r\n}`\r\n\r\n\r\nexport const upsertConversationSafe = gql`mutation ent($auth: AuthInput, $conversationSafeFolder: ConversationSafeFolderInputType){\r\n createConversationSafeFolder(input: $auth, conversationSafeFolder:$conversationSafeFolder)\r\n {\r\n id\r\n text\r\n status\r\n }\r\n}`\r\n\r\nexport const deleteConversationSafeFolder = gql`mutation deleteCSFolder($conversationSafeFolder: String){\r\n deleteConversationSafeFolder(id:$conversationSafeFolder)\r\n {\r\n status\r\n }\r\n}`\r\n\r\n\r\n\r\n","import * as React from 'react';\r\nimport { Dialog, DialogType, DialogFooter, TextField, Stack, Dropdown, ChoiceGroup, Spinner, FontSizes, ComboBox, SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib';\r\nimport { CommandBarButton, PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { Label } from 'office-ui-fabric-react/lib/Label';\r\nimport { getId } from 'office-ui-fabric-react/lib/Utilities';\r\nimport { hiddenContentStyle, mergeStyles } from 'office-ui-fabric-react/lib/Styling';\r\nimport { ContextualMenu } from 'office-ui-fabric-react/lib/ContextualMenu';\r\nimport * as Azure from \"@azure/storage-blob\";\r\nimport { saveAs } from 'file-saver';\r\nimport gql from \"graphql-tag\";\r\nimport { MyContext } from '../../../../../context';\r\nimport { toast } from 'react-toastify';\r\nimport 'react-toastify/dist/ReactToastify.css';\r\nimport { Query } from 'react-apollo'\r\nimport { getAllFoldersShrinked, bulkFoldersMutation } from '../../../../ConversationSafe/ConversationSafeQuery'\r\nimport { queryGetFilterRecordings } from '../../../../../queries/queryRecordings'\r\nimport _ from 'lodash'\r\n\r\nconst screenReaderOnly = mergeStyles(hiddenContentStyle);\r\n\r\nexport default class DownloadDialog extends React.Component {\r\n\r\n constructor(props) {\r\n\r\n super(props);\r\n this.state = {\r\n hideDialog: true,\r\n isDraggable: true,\r\n subTitle: \r\n
\r\n {defaultRender(menuListProps)}\r\n \r\n {this.props.bulkOperation ? 200\r\n },\r\n {\r\n key: 'bulkExportTranscript',\r\n text: context.getTranslation('configuration', 'bulkExportTranscript'),\r\n hidden: !this.props.userRules.ruleAccess.userBulkExport,\r\n disabled: this.props.count > 800\r\n },\r\n {\r\n key: 'bulkExportMetadata',\r\n text: context.getTranslation(\"configuration\", \"bulkExportMetadata\"),\r\n hidden: !this.props.userRules.ruleAccess.userBulkExport,\r\n disabled: this.props.count > 800\r\n },\r\n {\r\n key: 'bulkTranscript',\r\n text: context.getTranslation(\"configuration\", \"bulkTranscript\"),\r\n hidden: !this.props.userRules.ruleAccess.userBulkTranscript,\r\n disabled: this.props.count > 800\r\n },\r\n {\r\n key: 'bulkDelete',\r\n text: context.getTranslation('configuration', 'bulkDelete'),\r\n hidden: !this.props.userRules.ruleAccess.userBulkDelete || this.props.userRules.blockDeletion,\r\n disabled: this.props.count > 800\r\n },\r\n {\r\n key: 'addToFolders',\r\n text: context.getTranslation(\"configuration\", \"addToFoldersBulk\"),\r\n hidden: this.props.userRules.ruleAccess.userSafe === \"No\" || !this.props.userRules.ruleAccess.userBulkSafeAdd,\r\n disabled: this.props.count > 800\r\n },\r\n {\r\n key: 'removeToFolders',\r\n text: context.getTranslation(\"configuration\", \"removeToFoldersBulk\"),\r\n hidden: this.props.userRules.ruleAccess.userSafe === \"No\" || !this.props.userRules.ruleAccess.userBulkSafeRemove,\r\n disabled: this.props.count > 800\r\n },\r\n {\r\n key: 'bulkRestoreArchive',\r\n text: context.getTranslation(\"configuration\", \"bulkRestoreArchive\"),\r\n hidden: !this.props.userRules.ruleAccess.userBulkRestoreArchive,\r\n disabled: this.props.count > 800\r\n }\r\n\r\n ]}\r\n /> :\r\n\r\n \r\n {this.state.downloadActive && {\r\n this.setState({\r\n downloadType: newValue.key,\r\n downloadTypeChoiceMade: true,\r\n })\r\n }}\r\n />}\r\n {(this.props.bulkOperation || this.props.renderFromCompliance) &&\r\n \r\n {(this.state.bulkOperationType === \"bulkExport\" || this.state.bulkOperationType === \"bulkRestoreArchive\") && {(context) => (\r\n \r\n {this.state.streamCount > 0 && }\r\n {this.state.archiveCount > 0 && }\r\n {this.state.archivePercentage > 0.1 && }\r\n {(this.state.bulkOperationType === \"bulkRestoreArchive\" && this.state.archiveCount === 0) && }\r\n )} }\r\n {(this.state.bulkOperationType === \"bulkExport\"\r\n || this.state.bulkOperationType === \"bulkExportTranscript\"\r\n || this.state.bulkOperationType === \"bulkExportMetadata\"\r\n || (this.props.renderFromCompliance && this.state.step2))\r\n &&\r\n \r\n {\r\n if (event.target.value.length < this.props.passwordLength) {\r\n this.setState({\r\n buttonDisabled: true,\r\n zipPassword: event.target.value\r\n })\r\n } else {\r\n this.setState({\r\n buttonDisabled: this.state.zipPasswordDuplicate !== event.target.value\r\n ? true\r\n : false,\r\n zipPassword: event.target.value\r\n })\r\n }\r\n }}\r\n errorMessage={\r\n this.state.zipPassword.length < this.props.passwordLength\r\n ? context.getTranslation(\"detailContainer\", \"zipPasswordMinimalLength\") + this.props.passwordLength\r\n : \"\"}\r\n />\r\n {\r\n if (event.target.value !== this.state.zipPassword) {\r\n this.setState({\r\n buttonDisabled: true,\r\n zipPasswordDuplicate: event.target.value\r\n })\r\n }\r\n else {\r\n this.setState({\r\n buttonDisabled: this.state.zipPassword.length < this.props.passwordLength ? true : false,\r\n zipPasswordDuplicate: event.target.value\r\n })\r\n }\r\n }}\r\n errorMessage={this.state.zipPasswordDuplicate !== this.state.zipPassword ? \"Password not matching\" : \"\"}\r\n />\r\n {\r\n this.setState({\r\n bulkName: event.target.value\r\n }\r\n )\r\n }}\r\n />\r\n }\r\n {(this.state.bulkOperationType === \"addToFolders\" || this.state.bulkOperationType === \"removeToFolders\") &&\r\n \r\n {!this.state.csRemoveConfirmationStep && \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n }\r\n \r\n }\r\n \r\n {this.props.renderFromCompliance && this.state.step1 &&\r\n \r\n \r\n
)}\r\n \r\n \r\n
\r\n )\r\n }\r\n if (error) return Failed to connect
\r\n \r\n let foldersOptionHeader = [\r\n {\r\n key: 'Header1',\r\n text: `${context.getTranslation('filterPanel', 'convSafe')}`,\r\n itemType: SelectableOptionMenuItemType.Header\r\n },\r\n {\r\n key: 'selectAll',\r\n text: `${context.getTranslation('filterPanel', 'selectAll')}`\r\n },\r\n {\r\n key: 'divider',\r\n text: '-',\r\n itemType: SelectableOptionMenuItemType.Divider\r\n }\r\n ]\r\n \r\n let availableFolders = this.filterFolderRights(\r\n data.getConversationSafeFolders,\r\n this.state.bulkOperationType === 'addToFolders'\r\n ? 'addConversations'\r\n : 'removeConversations')\r\n \r\n let options = _.concat(\r\n foldersOptionHeader,\r\n availableFolders.map(f => {\r\n return ({\r\n key: f.id,\r\n text: f.name,\r\n itemType: SelectableOptionMenuItemType.Normal\r\n })\r\n }))\r\n this.foldersOption = availableFolders\r\n\r\n return (\r\n{context.getTranslation('detailContainer', 'warningDeleteFromFolders')}
\r\n }\r\n \r\n\r\n \r\n
)}\r\n \r\n
\r\n );\r\n }\r\n}","import { MessageBar, Stack, MessageBarType } from 'office-ui-fabric-react'\r\nimport React, { Component } from 'react'\r\nimport { MyContext } from '../../context';\r\n\r\nexport default class AlertBar extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n {defaultRender(menuListProps)}\r\n \r\n {\r\n this.props.message !== \"\" && \r\n \r\n {this.props.message}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n}","import React from 'react'\r\nimport './Transscript.scss'\r\nimport TranscriptLine from './TranscriptLine/TranscriptLine'\r\nimport LanguageSelect from '../../../../LanguageSelect/LanguageSelect'\r\nimport { SearchBox, TextField } from 'office-ui-fabric-react/lib';\r\nimport DownloadDialog from './DownloadDialog'\r\nimport { CommandBarButton, Dropdown, DefaultButton, Label } from 'office-ui-fabric-react/lib/';\r\nimport { Icon, FontSizes, Text, ScrollablePane, mergeStyleSets, TooltipHost, TooltipDelay, Spinner } from 'office-ui-fabric-react/lib';\r\nimport { Stack } from 'office-ui-fabric-react/lib/Stack';\r\nimport { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';\r\nimport gql from \"graphql-tag\";\r\nimport zipcelx from 'zipcelx';\r\nimport Utils from \"./../../../../common/Utils\";\r\nimport { mutationWriteAuditEvent, getCognitiveServicesLocalesTranslation, getCognitiveServicesLocalesTranscription } from \"../../../../../queries/querySettings\";\r\nimport TranscriptSelect from './../../../../LanguageSelect/TranscriptSelect'\r\nimport { MyContext } from '../../../../../context';\r\nimport { Query } from \"@apollo/react-components\";\r\nimport AlertBar from '../../../../CustomComponents/AlertBar';\r\n\r\n\r\nconst config = {\r\n filename: 'conversationExport',\r\n sheet: {\r\n data: [\r\n [{\r\n value: 'id',\r\n type: 'string'\r\n },\r\n {\r\n value: \"time\",\r\n type: 'string'\r\n },\r\n {\r\n value: \"speaker\",\r\n type: 'string'\r\n },\r\n {\r\n value: \"speakerId\",\r\n type: 'string'\r\n },\r\n {\r\n value: \"text\",\r\n type: 'string'\r\n }]\r\n ]\r\n }\r\n};\r\n\r\nexport default class Transscript extends React.Component {\r\n static contextType = MyContext;\r\n\r\n constructor(props) {\r\n super(props);\r\n this.findKeywordsInTranscript = this.findKeywordsInTranscript.bind(this);\r\n this.sortArr = this.sortArr.bind(this);\r\n this.convertArr = this.convertArr.bind(this);\r\n console.log(\"Height: \" + this.props.height)\r\n }\r\n\r\n state = {\r\n id: \"0\",\r\n val: \"\",\r\n transcript: null,\r\n translationActive: false,\r\n translated: false,\r\n language: null,\r\n languageCode: \"\",\r\n audioActive: this.props.onlyTag === true ? false : true,\r\n chatActive: this.props.onlyTag === true ? false : true,\r\n tagActive: true,\r\n attachActive: true,\r\n one2oneView: (this.props.user != null && this.props.user.filter(user => user.type !== \"Bot\").length == 2) ? true : false,\r\n exportDialogOpen: false\r\n };\r\n\r\n lastSpeaker = \"\";\r\n handler(input) {\r\n console.log(\"Handler Triger\");\r\n this.setState({ id: \"1\", val: input })\r\n }\r\n\r\n onTranslate = async (language, languageText) => {\r\n this.setState({ translationActive: true });\r\n this.setState({ language: languageText });\r\n this.setState({ languageCode: language });\r\n\r\n var data = await this.props.client\r\n .query({\r\n query: gql`\r\n query ent ($input: AuthInput, $id : ID!, $language: String) {\r\n getTranslation (input: $input, id: $id, language: $language) \r\n {\r\n id \r\n unifiedTranscript\r\n \t {\r\n language\r\n transcript\r\n \t {\r\n text\r\n type\r\n speakerId\r\n speakerUserId \r\n url\r\n instances\r\n \t {\r\n start\r\n end\r\n adjustedStart\r\n adjustedEnd\r\n }\r\n }\r\n speakers {\r\n name\r\n }\r\n}\r\n }\r\n }\r\n `,\r\n fetchPolicy: \"network-only\",\r\n variables: {\r\n id: this.props.id, language: language, input: this.props.authorization\r\n }\r\n });\r\n this.setState({ translationActive: false });\r\n this.setState({ translated: true });\r\n this.setState({ transcript: data.data.getTranslation.unifiedTranscript.transcript });\r\n }\r\n\r\n\r\n findKeywords = () => {//TestFunction\r\n if (this.props.data != null && this.props.data.transcript !== undefined) {\r\n let out = [];\r\n for (let xx = 0; xx < this.props.data.transcript.length; xx++) {\r\n\r\n out.push(this.findKeywordsInTranscript(this.props.data.transcript[xx].text, this.props.data.transcript[xx].instances, this.sortArr(this.convertArr(this.props.sum.keywords))));\r\n }\r\n }\r\n };\r\n\r\n convertArr = (arr) =>//SummarizedInsight\r\n {\r\n let outPut = [];\r\n let tmpKey;\r\n\r\n for (let i = 0; i < arr.length; i++) {\r\n tmpKey = arr[i];\r\n let keywordCategory = arr[i].categorie;\r\n for (let j = 0; j < tmpKey.appearances.length; j++) {\r\n outPut.push({\r\n name: tmpKey.name,\r\n time: tmpKey.appearances[j].startSeconds,\r\n betterTime: tmpKey.appearances[j].startTime,\r\n trans: tmpKey.isTranscript,\r\n categorie: keywordCategory,\r\n hasSearchExactKeywords: tmpKey.hasSearchExactKeywords,\r\n fromPolicy: tmpKey.fromPolicy,\r\n policy: tmpKey.policy\r\n });\r\n }\r\n }\r\n\r\n return outPut;\r\n };\r\n\r\n SimpleTimeParser = (input) => {\r\n // changes in this method has been done for wrong conversion when receiving timestamp like 02:22 instead of 02:22.11223344 for ticket RI-12043\r\n\r\n let out = 0;\r\n let tmp = input.split(\":\");\r\n let tmp2 = [tmp[2], \"0\"];\r\n\r\n if (tmp[2].indexOf(\".\") !== -1) {\r\n tmp2 = tmp[2].split(\".\");\r\n }\r\n\r\n out = tmp[0] * 60 * 60 + tmp[1] * 60 + tmp2[0] * 1;\r\n\r\n if (tmp2.length > 1 && tmp2[1] !== \"0\") { \r\n out += (tmp2[1] / 10000000) - 0.01;\r\n }\r\n\r\n return out;\r\n };\r\n sortArr = (arr) => {\r\n return arr.sort((a, b) => { return a.time - b.time });\r\n };\r\n\r\n getKeysForTranscript = (timeIn, timeOut, arr) => {\r\n\r\n return arr.filter((el) => {\r\n return Math.floor(el.time) >= Math.floor(timeIn) && (Math.floor(el.time) <= Math.floor(timeOut) || Math.floor(timeOut) < 0) && el.trans === true\r\n });\r\n };\r\n\r\n findKeywordsInTranscript = (text, instances, arr) => {\r\n //text is the block, instances time of the block, arr is array of keywords\r\n let out = [], tmp;\r\n // console.log(this.SimpleTimeParser(instances[0].adjustedStart)+\" \"+this.SimpleTimeParser(instances[0].adjustedEnd));\r\n //seacrh for keywords in the time of the block\r\n tmp = this.getKeysForTranscript(this.SimpleTimeParser(instances[0].adjustedStart), this.SimpleTimeParser(instances[0].adjustedEnd), arr);\r\n for (let i = 0; i < tmp.length; i++) {\r\n var keyword = \"\";\r\n var soundlike = \"^\";\r\n var keywordAndSoundlike = tmp[i].name?.split('_') ?? [''];\r\n keyword = keywordAndSoundlike[0];\r\n if (keywordAndSoundlike[1]) {\r\n soundlike = keywordAndSoundlike[1];\r\n }\r\n if ((text.toLowerCase().includes(keyword.toLowerCase())) || (text.toLowerCase().includes(soundlike.toLowerCase()))) {\r\n out.push(tmp[i]);\r\n }\r\n else {//console.log(\"#\"+tmp[i].name)\r\n }\r\n\r\n }\r\n // console.log(tracscript.text);\r\n return out;\r\n\r\n\r\n }\r\n\r\n renderLines = (props) => {\r\n this.lastSpeaker = \"\";\r\n if ((this.state.transcript != null && this.state.transcript !== undefined)) {\r\n let languageDirection = \"ltl\";\r\n if (this.state.languageCode === \"he\" || this.state.languageCode === \"ar\") {\r\n languageDirection = \"rtl\";\r\n }\r\n return this.state.transcript.map(({ text, speakerId, speakerUserId, instances, type, url, changedNote, changedTime, priority, reactions }, i) =>\r\n (\r\n this.getTranscriptLine(i, text, speakerId, speakerUserId, this.lastSpeaker, instances, this.state.languageCode, languageDirection, type, url, changedNote, changedTime, priority, reactions)\r\n ));\r\n }\r\n else if ((this.props.data != null && this.props.data.transcript != null && this.props.data.transcript !== undefined)) {\r\n let languageDirection = \"ltl\";\r\n if (((this.props.data.language != null) && this.props.data.language.split(\"-\")[0] === \"he\") || ((this.props.data != null && this.props.data.language != null && this.props.data.language.split(\"-\")[0]) === \"ar\")) {\r\n languageDirection = \"rtl\";\r\n }\r\n return this.props.data.transcript.map(({ text, speakerId, speakerUserId, instances, type, url, changedNote, changedTime, priority, reactions }, i) =>\r\n (\r\n this.getTranscriptLine(i, text, speakerId, speakerUserId, this.lastSpeaker, instances, this.props.data.language, languageDirection, type, url, changedNote, changedTime, priority, reactions)\r\n ));\r\n }\r\n else if (this.props.data != null) {\r\n return {context.getTranslation(\"detailContainer\", \"transcriptNotPossible\")}
\r\n )\r\n }\r\n{context.getTranslation(\"detailContainer\", \"noTranscriptData\")}
\r\n )\r\n }\r\n\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n if (data.getTranscriptionLocales == null) {\r\n return ;\r\n }\r\n let transcriptLanguageList = [];\r\n\r\n if (data.getTranscriptionLocales != null) {\r\n\r\n let languageNames = new Intl.DisplayNames(['en'], { type: 'language' });\r\n for (var i = 0; i < data.getTranscriptionLocales.length; i++) {\r\n var countryName = languageNames.of(data.getTranscriptionLocales[i]);\r\n transcriptLanguageList.push({\r\n key: data.getTranscriptionLocales[i],\r\n text: countryName\r\n });\r\n }\r\n }\r\n\r\n return\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n if (data.getTranslatorLocales == null) {\r\n return ;\r\n }\r\n\r\n let translateLanguageList = [];\r\n\r\n if (data.getTranslatorLocales != null) {\r\n\r\n for (var i = 0; i < data.getTranslatorLocales.length; i++) {\r\n let translateLanguageData = JSON.parse(data.getTranslatorLocales[i]);\r\n\r\n translateLanguageList.push({\r\n key: translateLanguageData.key,\r\n text: translateLanguageData.text\r\n });\r\n }\r\n }\r\n\r\n return\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n onTranscript = async (language, languageText) => {\r\n\r\n this.props.client\r\n .mutate({\r\n mutation: gql`\r\n mutation ent ($uri: String, $id: String, $language: String, $type: String) {\r\n analyzeConversation (uri: $uri, id: $id, language: $language, type: $type)\r\n }\r\n `,\r\n variables: {\r\n uri: this.props.metadata.entryContent,\r\n id: this.props.metadata.conversationId,\r\n language: language,\r\n type: (this.props.userRules != null && this.props.userRules.ruleAnalytics != null && this.props.userRules.ruleAnalytics.withTranscription) ? \"SpeechToText\" : \"Indexer\"\r\n }\r\n });\r\n }\r\n\r\n\r\n render() {\r\n var classNames = mergeStyleSets({\r\n wrapper: {\r\n height: this.props.height - 35,\r\n position: 'relative',\r\n minHeight: '200px'\r\n },\r\n pane: {\r\n }\r\n });\r\n\r\n if (this.props.viewType === \"liveView\" || this.props.viewType === \"attachView\") {\r\n return \r\n \r\n {this.renderLines(this.props)}\r\n \r\n
\r\n :\r\n \r\n {this.renderLines(this.props)}\r\n
\r\n }\r\n \r\n \r\n {this.renderLines(this.props)}\r\n \r\n
:\r\n \r\n {this.renderLines(this.props)}\r\n
}\r\n \r\n {this.renderHeader()}\r\n {window.innerWidth > 600 ?\r\n
\r\n }\r\n }\r\n\r\n _onExport = async (ev) => {\r\n await this.props.client\r\n .mutate({\r\n mutation: mutationWriteAuditEvent,\r\n variables: {\r\n key: \"RECORDING_EXPORT\",\r\n id: this.props.export.conversationId,\r\n text: \"\"\r\n }\r\n });\r\n var itemList = [];\r\n // Header\r\n itemList.push(config.sheet.data[0].slice());\r\n // Title\r\n itemList.push([\r\n {\r\n value: \"title\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: this.props.export.topic,\r\n type: 'string'\r\n }]);\r\n // Date\r\n itemList.push([\r\n {\r\n value: \"date\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: this.props.export.day,\r\n type: 'string'\r\n }]);\r\n // Time\r\n itemList.push([\r\n {\r\n value: \"time\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: this.props.export.timein,\r\n type: 'string'\r\n }]);\r\n // Duration\r\n itemList.push([\r\n {\r\n value: \"duration\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: this.props.export.duration,\r\n type: 'string'\r\n }]);\r\n // Conversation Id\r\n itemList.push([\r\n {\r\n value: \"conversationid\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: this.props.export.conversationId,\r\n type: 'string'\r\n }]);\r\n // Language\r\n itemList.push([\r\n {\r\n value: \"language\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: \"\",\r\n type: 'string'\r\n }, {\r\n value: this.state.languageCode != null ? this.state.languageCode : this.props.data.language,\r\n type: 'string'\r\n }]);\r\n var i = 0;\r\n if (this.state.transcript != null) {\r\n this.state.transcript.forEach((anItem) => {\r\n var speakerIdVersion = anItem.speakerId;\r\n var speakerIsUserId = false;\r\n if (this.props.metadata.versionId >= \"1.2\" || (anItem.speakerUserId != undefined && anItem.speakerUserId != null && anItem.speakerUserId != \"\")) { //check if metadata version ahs unmixed audio and use speakerUserId. to make sure old version will work\r\n speakerIdVersion = anItem.speakerUserId;\r\n speakerIsUserId = true;\r\n }\r\n let speakerName = getSpeakerName(speakerIdVersion, this.props.user, this.props.metadata.versionId, speakerIsUserId);\r\n itemList.push([\r\n {\r\n value: i.toString(),\r\n type: 'string'\r\n }, {\r\n value: anItem.instances[0].start,\r\n type: 'string'\r\n }, {\r\n value: speakerName,\r\n type: 'string'\r\n }, {\r\n value: speakerIdVersion,\r\n type: 'string'\r\n }, {\r\n value: anItem.text,\r\n type: 'string'\r\n }]);\r\n i++;\r\n });\r\n } else {\r\n this.props.data.transcript.forEach((anItem) => {\r\n var speakerIdVersion = anItem.speakerId;\r\n var speakerIsUserId = false;\r\n if (this.props.metadata.versionId >= \"1.2\" || (anItem.speakerUserId != undefined && anItem.speakerUserId != null && anItem.speakerUserId != \"\")) { //check if metadata version ahs unmixed audio and use speakerUserId. to make sure old version will work\r\n speakerIdVersion = anItem.speakerUserId;\r\n speakerIsUserId = true;\r\n }\r\n let speakerName = getSpeakerName(speakerIdVersion, this.props.user, this.props.metadata.versionId, speakerIsUserId);\r\n itemList.push([\r\n {\r\n value: i.toString(),\r\n type: 'string'\r\n }, {\r\n value: anItem.instances[0].start,\r\n type: 'string'\r\n }, {\r\n value: speakerName,\r\n type: 'string'\r\n }, {\r\n value: speakerIdVersion,\r\n type: 'string'\r\n }, {\r\n value: anItem.text,\r\n type: 'string'\r\n }]);\r\n i++;\r\n });\r\n }\r\n config.sheet.data = itemList;\r\n zipcelx(config)\r\n this.setState({ isDialogOpen: true });\r\n }\r\n}\r\n\r\n\r\n\r\nfunction getSpeakerName(speakerId, userlist, metadataVersion, speakerIsUserId) {\r\n if (speakerIsUserId) {\r\n let filteredUser = userlist.find(user => user.userId === speakerId);\r\n\r\n if (filteredUser !== undefined && filteredUser !== null) {\r\n return filteredUser.name;\r\n\r\n } else {\r\n return \"Speaker\"\r\n }\r\n\r\n } else {\r\n if (userlist !== undefined && userlist[speakerId] !== undefined) {\r\n return userlist[speakerId].name;\r\n }\r\n else {\r\n return \"Speaker #\" + speakerId;\r\n }\r\n }\r\n\r\n}\r\n\r\nfunction getSpeakerPhoto(speakerId, userlist, metadataVersion, speakerIsUserId) {\r\n if (speakerIsUserId) {\r\n\r\n let filteredUser = userlist.find(user => user.userId === speakerId);\r\n\r\n if (filteredUser !== undefined && filteredUser !== null) {\r\n return filteredUser.photo;\r\n\r\n } else {\r\n return null;\r\n }\r\n\r\n } else {\r\n if (userlist !== undefined && userlist[speakerId] !== undefined) {\r\n return userlist[speakerId].photo;\r\n }\r\n else {\r\n return null;\r\n }\r\n }\r\n}\r\n\r\n","import React, { Component } from 'react';\r\nimport \"./Category.scss\"\r\nimport { ScrollablePane, mergeStyleSets } from 'office-ui-fabric-react/lib';\r\nimport { MyContext } from '../../../../../context';\r\n\r\nexport default class CategoryContainer extends Component {\r\n\r\n\r\n renderElements = () => {\r\n if (this.props.data.summarizedInsights != null && this.props.data.summarizedInsights.categories) {\r\n return this.props.data.summarizedInsights.categories.map((categorie, i) => (\r\n \r\n \r\n {this.renderLines(this.props)}\r\n \r\n
:\r\n \r\n {this.renderLines(this.props)}\r\n
}\r\n {context.getTranslation(\"detailContainer\", \"categoryMessage\")}
\r\n )\r\n }\r\n\r\n \r\n {this.renderElements()}\r\n \r\n
:\r\n \r\n {this.renderElements()}\r\n
);\r\n }\r\n}\r\n\r\nclass CategoryElement extends Component {\r\n state =\r\n {\r\n categorie: this.props.categories\r\n };\r\n\r\n getKeywordsByCategories = (category) => {\r\n let keywordsList = [];\r\n\r\n if (this.props.summarizedInsights != null && this.props.summarizedInsights.keywords != null && this.state.categorie != null) {\r\n let keywords = this.props.summarizedInsights.keywords;\r\n for (var i = 0; i < keywords.length; i++) {\r\n if (keywords[i].categorie === category) {\r\n keywordsList.push(keywords[i]);\r\n }\r\n }\r\n }\r\n\r\n if (keywordsList) {\r\n return keywordsList.map(({ name, appearances, categorie }, i) => (\r\n {this.state.categorie}:
{this.getKeywordsByCategories(this.state.categorie)}\r\n {this.helpRenderKeywordsName()}\r\n {this.helpRenderTimestamps()}\r\n
;\r\n }\r\n}\r\n\r\nclass LabelLink extends Component {\r\n seek = () => {\r\n if (this.props.listener !== undefined && this.props.listener != null) {\r\n let seconds = this.convertToSeconds(this.props.time);\r\n this.props.listener(seconds);\r\n }\r\n };\r\n removeLastDigitsOfTime = (time) => {\r\n console.log(\"Keyword: \", time)\r\n var tmp = time.split(\":\");\r\n var result = \"\";\r\n if (tmp[2]) {\r\n var tmp1 = tmp[2].split(\".\");\r\n result = tmp[0] + \":\" + tmp[1] + \":\" + tmp1[0];\r\n } else {\r\n result = tmp[0] + \":\" + tmp[1];\r\n\r\n }\r\n \r\n\r\n return result;\r\n };\r\n convertToSeconds = (time) => {\r\n var tmp = time.split(\":\");\r\n var result = 0;\r\n if (tmp[2]) {\r\n var tmp1 = tmp[2].split(\".\");\r\n result = parseInt(tmp[0]) * 3600 + parseInt(tmp[1]) * 60 + parseInt(tmp1[0]);\r\n } else {\r\n result = parseInt(tmp[0]) * 60 + parseInt(tmp[1]);\r\n }\r\n return result;\r\n }\r\n render(): React.ReactNode {\r\n return (\r\n (this.seek())}>\r\n {this.removeLastDigitsOfTime(this.props.time)}\r\n );\r\n }\r\n}","import React, { Component } from 'react';\r\nimport \"./Keyword.scss\"\r\nimport { ScrollablePane, mergeStyleSets } from 'office-ui-fabric-react/lib';\r\nimport { MyContext } from '../../../../../context';\r\n\r\n\r\n\r\nexport default class KeywordContainer extends Component {\r\n\r\n\r\n renderElements = () => {\r\n if (this.props.data.summarizedInsights != null && this.props.data.summarizedInsights.keywords != null) {\r\n return this.props.data.summarizedInsights.keywords.map(({ name, appearances, categorie }, i) => (\r\n{context.getTranslation(\"detailContainer\", \"keywordsMessage\")}
\r\n )\r\n }\r\n\r\n \r\n {this.renderElements()}\r\n \r\n
:\r\n \r\n {this.renderElements()}\r\n
);\r\n }\r\n}\r\n\r\nclass KeywordElement extends Component {\r\n\r\n\r\n state =\r\n {\r\n keyword: this.props.name,\r\n appearances: this.props.appearances,\r\n referenceUrl: this.props.referenceUrl,\r\n categorie: this.props.categorie\r\n };\r\n helpRender = () => {\r\n // console.log(\" Element Länge\"+this.state.appearances.length);\r\n // console.log(\" Element 0\"+this.state.appearances[0].startTime);\r\n return this.state.appearances.map((\r\n { startTime, startSeconds }, i) => ({this.state.keyword}\r\n ({this.state.categorie})\r\n : {this.helpRender()}\r\n
\r\n ;\r\n }\r\n}\r\n\r\nclass KeywordLink extends Component {\r\n\r\n seek = () => {\r\n if (this.props.listener !== undefined && this.props.listener != null) {\r\n let seconds = this.convertToSeconds(this.props.time);\r\n this.props.listener(seconds);\r\n }\r\n };\r\n removeLastDigitsOfTime = (time)=>{\r\n var tmp = time.split(\":\");\r\n var result = \"\";\r\n if (tmp[2]) {\r\n var tmp1 = tmp[2].split(\".\");\r\n result = tmp[0] + \":\" + tmp[1] + \":\" + tmp1[0];\r\n } else {\r\n result = tmp[0] + \":\" + tmp[1];\r\n\r\n }\r\n\r\n return result;\r\n }\r\n\r\n convertToSeconds = (time) => { \r\n var tmp = time.split(\":\");\r\n var result = 0;\r\n if (tmp[2]) {\r\n var tmp1 = tmp[2].split(\".\");\r\n result = parseInt(tmp[0]) * 3600 + parseInt(tmp[1]) * 60 + parseInt(tmp1[0]);\r\n } else {\r\n result = parseInt(tmp[0]) * 60 + parseInt(tmp[1]);\r\n }\r\n return result;\r\n }\r\n\r\n render(): React.ReactNode {\r\n return (this.seek())}>{this.removeLastDigitsOfTime(this.props.time)};\r\n }\r\n}","import React from 'react';\r\nimport { TextField } from 'office-ui-fabric-react/lib/TextField';\r\nimport { Button } from 'office-ui-fabric-react/lib/Button';\r\nimport { Spinner } from 'office-ui-fabric-react/lib/Spinner';\r\nimport \"./Notes.scss\"\r\nimport gql from \"graphql-tag\";\r\nimport { queryGetEntry } from \"./../../../../../queries/queryRecordings\";\r\nimport { MyContext } from '../../../../../context';\r\n\r\n\r\nexport default class NotesContainer extends React.Component {\r\n\r\n noteField = React.createRef();\r\n\r\n\r\n state = {\r\n isChanged: false,\r\n text: (this.props.data.notes != null) ? this.props.data.notes : \"\",\r\n saveActive: false\r\n };\r\n\r\n\r\n textChanged = () => {\r\n this.setState({ isChanged: true });\r\n }\r\n\r\n submit = () => {\r\n this.setState({ saveActive: true, isChanged: false });\r\n this.props.client\r\n .mutate({\r\n mutation: gql`\r\n mutation ent ($id : String!, $message: String) {\r\n setEntryNotes (id: $id, message: $message)\r\n }\r\n `,\r\n refetchQueries: [{\r\n query: queryGetEntry,\r\n variables: { id: this.props.data.conversationId, auth: this.props.data.authorization, callStartMs: this.props.data.callStartMs }\r\n\r\n }],\r\n variables: {\r\n id: this.props.data.conversationId, message: this.noteField.current.value\r\n }\r\n })\r\n .then(result => this.setState({ saveActive: false }));\r\n }\r\n\r\n\r\n render(): React.ReactNode {\r\n return (\r\n\r\n
\r\n )\r\n }\r\n \r\n
\r\n \r\n { this.setState({ text: newValue, isChanged: true }); }} />\r\n
\r\n {!this.props.isShared &&\r\n \r\n {this.state.saveActive ?
\r\n }\r\n \r\n \r\n \r\n {`${this.context.getTranslation(\"detailContainer\", \"selectFolderInConversation\")}`}\r\n \r\n \r\n {this.state.alertMessagePanel !== \"\" &&\r\n \r\n \r\n {this.state.alertMessagePanel}\r\n \r\n \r\n }\r\n \r\n \r\n {this.state.availableFolders === null &&\r\n No folder available! \r\n }\r\n {this.state.availableFolders !== null && this.state.availableFolders.length > 0 &&\r\n \r\n \r\n \r\n \r\n {/*DIALOG WARNING DELETE LAST FOLDER*/}\r\n { this.setState({ isOpenWarningLastFolder: false }) }}\r\n title={this.context.getTranslation(\"compliance\", \"riskRatingAdherence\")}\r\n subText={this.context.getTranslation(\"conversationSafe\", \"teachingBubbleTextLastFolder\")}\r\n isBlocking={false}\r\n closeButtonAriaLabel='Close'\r\n >\r\n \r\n {\r\n this.setState({ isOpenWarningLastFolder: false })\r\n this.save()\r\n }}\r\n text={this.context.getTranslation(\"common\", \"remove\")} />\r\n { this.setState({ isOpenWarningLastFolder: false }) }} text={this.context.getTranslation(\"common\", \"cancel\")} />\r\n \r\n \r\n
\r\n )\r\n }\r\n}","import React from 'react';\r\nimport { TextField } from 'office-ui-fabric-react/lib/TextField';\r\nimport { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';\r\nimport \"./Ttl.scss\"\r\nimport gql from \"graphql-tag\";\r\nimport { Dialog, DialogType } from 'office-ui-fabric-react/lib/Dialog';\r\nimport { Stack, Spinner, Text } from 'office-ui-fabric-react/lib';\r\nimport { toast } from \"react-toastify\";\r\nimport { MyContext } from '../../../../../context';\r\nimport { mergeStyleSets } from '@uifabric/merge-styles';\r\nimport { queryGetEntry } from \"../../../../../queries/queryRecordings\";\r\nimport FormConversationSafeFolders from \"./FormConversationSafeFolders\";\r\n\r\nconst dialogButtonStyles = mergeStyleSets({\r\n buttons: {\r\n marginRight: '5px',\r\n },\r\n display: {\r\n margin: \"0px\"\r\n },\r\n allign: {\r\n display: \"flex\",\r\n float: \"right\"\r\n },\r\n size: {\r\n padding: \"1px\",\r\n \"margin-right\": \"8px\"\r\n }\r\n\r\n});\r\nexport default class TtlContainer extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isDialogOpen: false,\r\n reasoningText: this.props.data.deleteReasoningText,\r\n graphqlRequestPending: false,\r\n };\r\n }\r\n\r\n deletion = false;\r\n deletionRequest = false;\r\n conversationSafe = false;\r\n actiontype = \"\";\r\n titleDialog = \"\";\r\n textDialog = \"\"\r\n\r\n deleteConversation = () => {\r\n this.setState({ graphqlRequestPending: true })\r\n\r\n this.props.client\r\n .mutate({\r\n mutation: gql`\r\n mutation ent ($input: AuthInput, $id : String!) {\r\n deleteConversation (input: $input, id: $id) {\r\n id\r\n }\r\n }\r\n `,\r\n variables: { id: this.props.data.conversationId, input: this.props.authorization }\r\n })\r\n .then(result => {\r\n console.log(result);\r\n this.setState({\r\n graphqlRequestPending: false,\r\n isDialogOpen: false\r\n });\r\n this._dialogClose();\r\n });\r\n };\r\n\r\n\r\n requestDeleteConversation = () => {\r\n this.props.client\r\n .mutate({\r\n mutation: gql`\r\n mutation ent ($id : String!, $reasoning : String) {\r\n requestDelete (id: $id, reasoning: $reasoning) {\r\n id\r\n }\r\n }\r\n `,\r\n variables: { id: this.props.data.conversationId, reasoning: this.state.reasoningText }\r\n })\r\n .then(result => {\r\n console.log(result);\r\n this.setState({ isDialogOpen: true });\r\n\r\n\r\n });\r\n };\r\n\r\n _dialogClose = () => {\r\n window.location.href = \"/\";\r\n };\r\n\r\n _dialogExit = () => {\r\n this.setState({ isDialogOpen: false });\r\n };\r\n\r\n onRestoreArchivedConversation = () => {\r\n var answer = window.confirm(\"Do you really want to retrieve the conversation from archive storage ?\");\r\n if (answer) {\r\n this.restoreArchivedConversation();\r\n }\r\n\r\n };\r\n restoreArchivedConversation = () => {\r\n this.props.client\r\n .mutate({\r\n mutation: gql`\r\n mutation ent ($id : String!, $input:AuthInput) {\r\n restoreFromArchive (id: $id, input: $input){valid}\r\n }\r\n `,\r\n refetchQueries: [{\r\n query: queryGetEntry,\r\n variables: { id: this.props.data.conversationId, auth: this.props.authorization, callStartMs: this.props.data.callStartMs }\r\n }],\r\n variables: {\r\n id: this.props.data.conversationId,\r\n input: this.props.authorization\r\n }\r\n })\r\n .then(result => console.log(result));\r\n\r\n }\r\n\r\n render(): React.ReactNode {\r\n return (\r\n
\r\n )\r\n }\r\n \r\n
\r\n \r\n {context.getTranslation(\"detailContainer\", \"timeToLive\")}: {this.props.data.ttl === \"0\" ? \"infinite\" : this.props.data.ttl}\r\n
\r\n \r\n {/*DIALOG TO CONFIRM DELETE CONVERSATION*/}\r\n \r\n {this.state.graphqlRequestPending\r\n ? \r\n {this.props.userRules?.ruleAccess?.userSafe !== \"No\" && \r\n
\r\n \r\n \r\n { e.preventDefault(); this.deleteConversation() }} />\r\n \r\n
\r\n }\r\n \r\n\r\n \r\n
}\r\n\r\n {(this.props.data.deleteAllowance !== \"No\" || this.props.data.deletePropose) && \r\n {this.props.data.deletePropose && this.props.data.deleteRequestUser == null &&\r\n
\r\n }\r\n {/*ARCHIVED CONVERSATION*/}\r\n {(this.props.data.archiveStatus != 0) &&\r\n \r\n {context.getTranslation(\"detailContainer\", \"deleteProposal\")}\r\n {this.props.data.deleteRequestUserName} \r\n
}\r\n\r\n {((this.props.data.deleteReasoning || this.props.data.deleteReasoningText) && this.props.data.isDeleteApproverUser == true) && \r\n {context.getTranslation(\"detailContainer\", \"reasonDeleteProposal\")}: {this.state.reasoningText}\r\n
}\r\n\r\n {((this.props.data.deleteReasoning || this.props.data.deleteReasoningText) && this.props.data.deleteAllowance !== \"Yes\") && \r\n {\r\n this.setState({\r\n reasoningText: newValue,\r\n });\r\n }}\r\n />
}\r\n\r\n\r\n \r\n
\r\n\r\n }\r\n {(((this.props.data.archiveAccessType === 1) || ((this.props.data.archiveAccessType === 3) && this.props.data.isRestoreApproved)) && this.props.data.archiveStatus == 1) &&\r\n \r\n {/*Restore button*/}\r\n < PrimaryButton text={context.getTranslation(\"detailContainer\", \"restore\")}\r\n style={{ backgroundColor: 'green' }}\r\n onClick={this.onRestoreArchivedConversation} />\r\n
\r\n }\r\n {context.getTranslation(\"detailContainer\", \"undoDeletionRequestMessage\")}
\r\n{context.getTranslation(\"detailContainer\", \"requestDeletionConfirmationMessage\")}
)}{context.getTranslation(\"detailContainer\", \"deletionSuccessfullyUndoneMessage\")}
)}{context.getTranslation(\"detailContainer\", \"deletionRequestSuccessfullyUndoneMessage\")}
)}\r\n \r\n
\r\n );\r\n }\r\n case 'results':\r\n //in case we have policy results we render them otherwise, if we are dealing with AICAT based policies, we show an information note\r\n return (\r\n item.policyResult.length > 0\r\n ? item.policyResult.map((item, i) => {\r\n if (item.type === \"AICategorizationItem\") {\r\n return {this.context.getTranslation(\"detailContainer\", \"noResultsAICatBasedPolicyNotice\")}
\r\n : \r\n )\r\n )\r\n default:\r\n return {fieldContent !== null ? fieldContent : \"\"};\r\n }\r\n }\r\n\r\n render() {\r\n var classNames = mergeStyleSets({\r\n wrapper: {\r\n height: this.props.height,\r\n position: 'relative',\r\n minHeight: '100px'\r\n },\r\n pane: {\r\n }\r\n });\r\n\r\n const columns = [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"policy\"), minWidth: 100, maxWidth: 150, isResizable: true },\r\n { key: 'version', name: this.context.getTranslation(\"compliance\", \"policyVersion\"), maxWidth: 50, isResizable: true },\r\n { key: 'selected', name: this.context.getTranslation(\"compliance\", \"selectedVersion\"), maxWidth: 50 },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"policyDescription\"), minWidth: 100, maxWidth: 200 },\r\n { key: 'policyRuleName', name: this.context.getTranslation(\"compliance\", \"basedOn\"), minWidth: 100, maxWidth: 150 },\r\n { key: 'riskRating', styles: this.headerStyle, name: this.context.getTranslation(\"compliance\", \"detailPolicyRiskRating\"), minWidth: 50, maxWidth: 100 },\r\n { key: 'results', name: this.context.getTranslation(\"compliance\", \"policyResult\"), minWidth: 200, maxWidth: 400 },\r\n ]\r\n\r\n return (window.innerWidth > 600 ?\r\n \r\n \r\n {this.state.isLoading &&
}\r\n {this.state.data === null && !this.state.isLoading && {this.context.getTranslation(\"detailContainer\", \"policyMessage\")}
\r\n {this.state.isLoading &&
}\r\n {this.state.data === null && !this.state.isLoading && {this.context.getTranslation(\"detailContainer\", \"policyMessage\")}
\r\n {this.props.time !== \"0\" &&\r\n
;\r\n }\r\n}","import { Checkbox, PrimaryButton, Stack } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react'\r\nimport { MyContext } from '../../../context';\r\n\r\nclass CustomFieldTypeCheckbox extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n changeCheckbox = (value) => {\r\n this.props.changeCheckbox(this.props.customFieldDefinition.id, [value])\r\n }\r\n\r\n render() {\r\n let value = this.props.customFieldConversation !== undefined ? this.props.customFieldConversation.fieldValues[0] : null\r\n return (\r\n \r\n {this.props.words.join(\", \")}\r\n (this.seek())}>{this.removeLastDigitsOfTime(this.props.time)}\r\n \r\n
}\r\n {this.props.time === \"0\" &&\r\n \r\n {\"- \" + this.context.getTranslation(\"compliance\", \"notMentioned\")}\r\n \r\n }\r\n \r\n \r\n \r\n {this.props.updatedFields.includes(this.props.customFieldDefinition.id) &&\r\n \r\n this.props.save(\"\")} disabled={!this.props.isValid() || this.props.processing || this.props.userRules.ruleAccess.customFieldsAccessType !== \"FullAccess\" || this.props.disabled} />\r\n \r\n }\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default CustomFieldTypeCheckbox","import { CommandBarButton, PrimaryButton, Stack, TextField } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react'\r\nimport { MyContext } from '../../../context';\r\n\r\nclass CustomFieldTypeText extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n error: \"\"\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n if (this.props.customFieldConversation === undefined || this.props.customFieldConversation.fieldValues.length === 0) {\r\n this.addNewField()\r\n }\r\n }\r\n\r\n componentDidUpdate() {\r\n if (this.props.customFieldConversation === undefined || this.props.customFieldConversation.fieldValues.length === 0) {\r\n this.addNewField()\r\n }\r\n }\r\n\r\n addNewField = () => {\r\n let error = \"\"\r\n let newFieldValues = [\"\"]\r\n if (this.props.customFieldConversation !== undefined) {\r\n if ((this.props.customFieldDefinition.maxNumberOfFields == 0 && this.props.customFieldConversation.fieldValues.length == 0) || this.props.customFieldDefinition.maxNumberOfFields > this.props.customFieldConversation.fieldValues.length) {\r\n newFieldValues = [...this.props.customFieldConversation.fieldValues, \"\"]\r\n } else {\r\n error = \"error\"\r\n }\r\n }\r\n if (error === \"\")\r\n this.props.changeFieldText(this.props.customFieldDefinition.id, newFieldValues)\r\n else {\r\n error = this.context.getTranslation(\"configuration\", \"errorNumberOfFields\")\r\n }\r\n this.setState({\r\n error\r\n })\r\n }\r\n\r\n changeField = (e, i) => {\r\n e.target.style.border = \"\";\r\n let error = \"\"\r\n let newValue = e.target.value\r\n let regexNumeric = /^[0-9\\b]+$/\r\n let validationLength = newValue.length <= this.props.customFieldDefinition.fieldLength;\r\n let validationType = (this.props.customFieldDefinition.isNumeric && regexNumeric.test(newValue)) || !this.props.customFieldDefinition.isNumeric\r\n \r\n if (validationType && validationLength) {\r\n let newFieldValues = this.props.customFieldConversation.fieldValues.map((v, k) => { \r\n if (k === i) {\r\n return newValue\r\n } else {\r\n return v\r\n }\r\n })\r\n this.props.changeFieldText(this.props.customFieldDefinition.id, newFieldValues)\r\n } else if (newValue == \"\") {//to be able to delete everything in the field\r\n let newFieldValues = this.props.customFieldConversation.fieldValues.map((v, k) => {\r\n if (k === i) {\r\n return newValue\r\n } else {\r\n return v\r\n }\r\n })\r\n this.props.changeFieldText(this.props.customFieldDefinition.id, newFieldValues)\r\n\r\n error = this.context.getTranslation(\"configuration\", \"errorValidationFieldEmpty\")\r\n } else {\r\n error = !validationLength ? this.context.getTranslation(\"configuration\", \"errorValidationFieldLength\") : this.context.getTranslation(\"configuration\", \"errorValidationFieldType\")\r\n }\r\n this.setState({\r\n error\r\n })\r\n }\r\n\r\n deleteField = (e, i) => {\r\n this.setState({\r\n error: \"\"\r\n })\r\n this.props.customFieldConversation.fieldValues.splice(i, 1);\r\n this.props.changeFieldText(this.props.customFieldDefinition.id, this.props.customFieldConversation.fieldValues)\r\n }\r\n\r\n save = () => {\r\n this.setState({\r\n error: \"\"\r\n })\r\n\r\n if (this.props.customFieldConversation.customFieldDefinition.hasAdditionalNumberCheck) {\r\n this.props.save(this.props.customFieldConversation.fieldId);\r\n } else {\r\n this.props.save(\"\");\r\n }\r\n }\r\n\r\n\r\n render() {\r\n return (\r\n {this.props.customFieldDefinition.fieldName}
\r\n\r\n this.changeCheckbox(\"yes\")} disabled={this.props.userRules.ruleAccess.customFieldsAccessType !== \"FullAccess\" || this.props.disabled} />\r\n
\r\n \r\n this.changeCheckbox(\"no\")} disabled={this.props.userRules.ruleAccess.customFieldsAccessType !== \"FullAccess\" || this.props.disabled} />\r\n
\r\n \r\n \r\n \r\n {this.state.error}\r\n \r\n \r\n \r\n {this.props.customFieldConversation !== undefined &&\r\n this.props.customFieldConversation.fieldValues.map((f, i) => {\r\n let errorExactLength = this.props.customFieldDefinition.hasExactLength && f.length !== this.props.customFieldDefinition.fieldLength && f != \"\"\r\n return (\r\n \r\n \r\n this.changeField(e, i)} disabled={this.props.userRules.ruleAccess.customFieldsAccessType !== \"FullAccess\" || this.props.disabled} />\r\n this.deleteField(e, i)}\r\n />\r\n \r\n \r\n )\r\n })}\r\n \r\n \r\n \r\n {this.props.updatedFields.includes(this.props.customFieldDefinition.id) &&\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default CustomFieldTypeText","import { MessageBar, MessageBarType } from '@fluentui/react';\r\nimport { Spinner, Stack } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react'\r\nimport { MyContext } from '../../../context';\r\nimport { getAllCustomFields, updateCallCustomField } from '../../../queries/querySettings';\r\nimport CustomFieldTypeCheckbox from './CustomFieldTypeCheckbox';\r\nimport CustomFieldTypeText from './CustomFieldTypeText';\r\n\r\n\r\nclass CustomFieldsConversation extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n let customFieldConversation = this.props.data.customFields !== null ? JSON.parse(this.props.data.customFields).customFields : []\r\n //check for action TTL\r\n let customFieldChangeDisable = this.getCustomFieldChangeDisable(customFieldConversation)\r\n //saving custom fileds with already one or more value\r\n //to know what custom fields are not empty when the user open the page (for show or not save button)\r\n let alreadyUsedFields = this.getAlreadyUsedFields(customFieldConversation)\r\n this.state = {\r\n error: \"\",\r\n processing: false,\r\n allCustomFields: null,\r\n customFieldConversation,\r\n customFieldChangeDisable,\r\n alreadyUsedFields,\r\n updatedFields: [],\r\n disableEditCustomFieldTime: this.props.userRules.ruleAccess.editableTimeCustomFields && !this.isTimeToEditOk()\r\n };\r\n }\r\n componentDidUpdate(prevProps) {\r\n // Check if props.data.customFields has changed\r\n if (this.props.data.customFields !== prevProps.data.customFields) {\r\n // Parse customFields and update state\r\n let customFieldConversation = this.props.data.customFields !== null ? JSON.parse(this.props.data.customFields).customFields : [];\r\n this.setState({ customFieldConversation });\r\n }\r\n }\r\n componentDidMount() {\r\n this.props.client\r\n .query({\r\n query: getAllCustomFields,\r\n variables: { auth: this.props.authorization }\r\n })\r\n .then((res) => {\r\n var allCustomFields = res.data.getAllCustomFieldDefinitions.filter(cf => {\r\n return this.props.userRules.ruleAccess.accesibleCustomFields.includes(cf.id) || this.props.userRules.ruleAccess.accesibleCustomFields.includes(cf.fieldName);\r\n });\r\n //sort the list by accesibleCustomFields\r\n var sortCustomFields = (a, b) => {\r\n let indexA = this.props.userRules.ruleAccess.accesibleCustomFields.indexOf(a.fieldName) !== undefined ? this.props.userRules.ruleAccess.accesibleCustomFields.indexOf(a.fieldName) : this.props.userRules.ruleAccess.accesibleCustomFields.indexOf(a.id)\r\n let indexB = this.props.userRules.ruleAccess.accesibleCustomFields.indexOf(b.fieldName) !== undefined ? this.props.userRules.ruleAccess.accesibleCustomFields.indexOf(b.fieldName) : this.props.userRules.ruleAccess.accesibleCustomFields.indexOf(b.id)\r\n return indexA - indexB;\r\n }\r\n allCustomFields.sort(sortCustomFields);\r\n\r\n this.setState({\r\n allCustomFields\r\n })\r\n });\r\n }\r\n\r\n getCustomFieldChangeDisable = (customFieldConversation) => {\r\n return customFieldConversation.map(cf => {\r\n if (cf.customFieldDefinition.isCheckbox && cf.customFieldDefinition.actionType == \"SetTTl\" && cf.fieldValues[0] == \"yes\") {\r\n return cf.fieldId\r\n }\r\n }).filter(element => { return element != undefined; })\r\n }\r\n\r\n getAlreadyUsedFields = (customFieldConversation) => {\r\n return customFieldConversation.map(cf => {\r\n if (cf.fieldValues.length > 0) {\r\n return cf.fieldId\r\n }\r\n }).filter(element => { return element != undefined; })\r\n }\r\n\r\n isTimeToEditOk = () => {\r\n try {\r\n let startDate = new Date(parseInt(this.props.data.callStartMs))\r\n let timeEditableDays = this.props.userRules.ruleAccess.customFieldsEditableTime\r\n let timeEditable = this.addDays(startDate, timeEditableDays)\r\n let today = new Date()\r\n //console.log(startDate)\r\n //console.log(timeEditable)\r\n return timeEditable.getTime() >= today.getTime()\r\n } catch (error) {\r\n console.log(error)\r\n return false\r\n }\r\n }\r\n\r\n addDays = (date, days) => {\r\n var result = new Date(date);\r\n result.setDate(result.getDate() + days);\r\n return result;\r\n }\r\n\r\n\r\n changeFieldValue = (fieldId, value) => {\r\n //console.log(fieldName + \": -\" + value + \"-\")\r\n let newCustomFieldConversation = []\r\n let isUpdate = this.state.customFieldConversation.map(cf => { return cf.fieldId }).includes(fieldId)\r\n if (isUpdate) {\r\n if (value.length > 0) {\r\n newCustomFieldConversation = this.state.customFieldConversation.map(cf => {\r\n if (cf.fieldId == fieldId) {\r\n return ({\r\n ...cf,\r\n fieldValues: value\r\n })\r\n } else {\r\n return cf\r\n }\r\n })\r\n } else {\r\n newCustomFieldConversation = this.state.customFieldConversation.filter(cf => { return cf.fieldId !== fieldId })\r\n }\r\n } else {\r\n let customFieldDefinition = this.state.allCustomFields.filter(cf => { return cf.id === fieldId })[0]\r\n let newField = {\r\n fieldId: fieldId,\r\n fieldName: customFieldDefinition.fieldName,\r\n fieldValues: value,\r\n customFieldDefinition: customFieldDefinition\r\n }\r\n newCustomFieldConversation = [...this.state.customFieldConversation, newField]\r\n }\r\n let updatedFields = this.state.updatedFields;\r\n //for showing save button and update custom field: if value is not empty and is not already in the list of updated OR if the value is empty but are some old value in the system\r\n if ((value != '' && !this.state.updatedFields.includes(fieldId)) || (value == '' && this.state.alreadyUsedFields.includes(fieldId))) {\r\n updatedFields.push(fieldId)\r\n }\r\n //for hiding save button if value is empty and it was in the list of updated and there are not old value in the system\r\n if (value == '' && this.state.updatedFields.includes(fieldId) && !this.state.alreadyUsedFields.includes(fieldId)) {\r\n updatedFields = updatedFields.filter(f => f !== fieldId)\r\n }\r\n this.setState({\r\n customFieldConversation: newCustomFieldConversation,\r\n error: \"\",\r\n updatedFields\r\n })\r\n }\r\n\r\n\r\n getCustomFieldItems = () => {\r\n let fields = this.state.customFieldConversation.map(cf => { return cf.fieldId })\r\n let result = this.state.allCustomFields.map(customField => {\r\n if (fields.includes(customField.id)) {\r\n var customFieldsConversation = this.state.customFieldConversation.filter(cf => { return cf.fieldId === customField.id })[0]\r\n if (customField.isCheckbox) {\r\n return ({this.props.customFieldDefinition.fieldName}
\r\n\r\n {this.state.error !== \"\" && \r\n {this.context.getTranslation(\"settings\", this.state.error)}\r\n }\r\n {this.state.allCustomFields === null && \r\n {this.getCustomFieldItems()}\r\n }\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default CustomFieldsConversation","import React, { Component } from 'react'\r\nimport { MyContext } from '../../../../../context';\r\nimport CustomFieldsConversation from '../../../CustomFields/CustomFieldsConversation';\r\n\r\nclass FieldsContainer extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n\r\n };\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {this.context.getTranslation(\"common\", \"noData\")}\r\n
}\r\n {this.state.allCustomFields !== null && this.state.allCustomFields.length > 0 && \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default FieldsContainer","import { SelectionMode } from '@fluentui/react';\r\nimport { DetailsList, Stack, ScrollablePane, ScrollbarVisibility } from 'office-ui-fabric-react';\r\nimport { mergeStyleSets } from 'office-ui-fabric-react/lib/Styling';\r\nimport React, { Component } from 'react'\r\nimport { MyContext } from '../../../../../context';\r\nimport { getAllCustomFields } from '../../../../../queries/querySettings'\r\n\r\nconst classNames = mergeStyleSets({\r\n wrapper: {\r\n height: '80vh',\r\n position: 'relative',\r\n backgroundColor: 'white',\r\n }\r\n});\r\n\r\nexport default class MetadataList extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n items: [],\r\n columns: []\r\n };\r\n }\r\n\r\n addDurationToDate = (date, duration) => {\r\n let splitDuration = duration.split(\":\")\r\n var result = new Date(date.getTime())\r\n result.setHours(date.getHours() + parseInt(splitDuration[0]));\r\n result.setMinutes(date.getMinutes() + parseInt(splitDuration[1]));\r\n result.setSeconds(date.getSeconds() + parseInt(splitDuration[2]))\r\n return result;\r\n }\r\n\r\n\r\n getMaxDatesFromParticipants = (participants) => {\r\n var initialValue = 1;\r\n participants.map(o1 => {\r\n var max = o1.joinDateTime.split(\";\").length > o1.leftDateTime.split(\";\").length ? o1.joinDateTime.split(\";\").length : o1.leftDateTime.split(\";\").length\r\n initialValue = initialValue > max ? initialValue : max\r\n })\r\n return initialValue;\r\n }\r\n\r\n async componentDidMount() {\r\n //console.log(this.props.data)\r\n //create items for table\r\n let items = []\r\n let transcript = this.props.data.unifiedTranscript\r\n let participant = this.props.data.linkedUser || [];\r\n let startDate = new Date(parseInt(this.props.data.callStartMs))\r\n let stopDate = new Date(parseInt(this.props.data.callEndMs))\r\n let recordingStart = this.props.data.recordingStarts;\r\n let recordingStop = this.props.data.recordingStops;\r\n let mediaType = \"\";\r\n if (this.props.data.hasAudio) {\r\n mediaType = \"Voice\";\r\n }\r\n if (this.props.data.hasVideo) {\r\n mediaType = mediaType == \"\" ? \"Video\" : mediaType + \", Video \"\r\n }\r\n if (this.props.data.hasScreenSharing) {\r\n mediaType = mediaType == \"\" ? \"Screenshare\" : mediaType + \", Screenshare \"\r\n }\r\n if (this.props.data.hasChat) {\r\n mediaType = mediaType == \"\" ? \"Chat\" : mediaType + \", Chat \"\r\n }\r\n if (this.props.data.hasFiles) {\r\n mediaType = mediaType == \"\" ? \"Files\" : mediaType + \", Files \"\r\n }\r\n if (this.props.data.hasUserScreen) {\r\n mediaType = mediaType == \"\" ? \"User Screen\" : mediaType + \", User Screen \"\r\n }\r\n\r\n items.push({\r\n value: this.context.getTranslation(\"configuration\", \"mediaType\"),\r\n content: mediaType\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"callStartTime\"),\r\n content: startDate.toISOString()\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"callEndTime\"),\r\n content: stopDate.toISOString()\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"duration\"),\r\n content: this.props.data.duration\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"conversationsPage\", \"conversationId\"),\r\n content: this.props.data.conversationId\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"ScenarioID\"),\r\n content: this.props.data.scenarioId\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"MicrosoftCallID\"),\r\n content: this.props.data.callId\r\n })\r\n\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"RecordingOwnerID\"),\r\n content: participant.filter(p => p.isRecordingOwner)[0]?.userId || \"\"\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"RecordingOwnerName\"),\r\n content: participant.filter(p => p.isRecordingOwner)[0]?.name || \"\"\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"configuration\", \"recordingType\"),\r\n content: participant.filter(p => p.isRecordingOwner)[0]?.recordingType || \"\"\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"RecorderIDBotID\"),\r\n content: this.props.data.botAppId\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"HeaderText\"),\r\n content: this.props.data.topic\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"configuration\", \"tenantId\"),\r\n content: this.props.data.tenantId\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"conversationsPage\", \"conversationType\"),\r\n content: this.props.data.recordingType\r\n })\r\n if (this.props.data.engagementId != null) {\r\n items.push({\r\n value: this.context.getTranslation(\"conversationsPage\", \"engagementId\"),\r\n content: this.props.data.engagementId\r\n })\r\n }\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"RecordingStartedTimes\"),\r\n content: recordingStart\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"RecordingStoppedTimes\"),\r\n content: recordingStop\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"configuration\", \"retentionTime\"),\r\n content: this.props.data.ttl\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"detailContainer\", \"ParticipantCount\"),\r\n content: this.props.data.participantCount\r\n })\r\n items.push({\r\n value: this.context.getTranslation(\"conversationsPage\", \"participants\"),\r\n content: \r\n \r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nclass HorizontalTable extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n render() {\r\n return (\r\n \r\n \r\n {this.props.data.map((d, i) => {\r\n return (\r\n )\r\n })}\r\n \r\n
\r\n )\r\n }\r\n}","import gql from 'graphql-tag';\r\n\r\nexport const queryAllScorecards = gql`query {\r\n getScorecards {\r\n id\r\n name\r\n description\r\n automatedEvaluation\r\n settingItems{\r\n name\r\n maxRange\r\n minRange\r\n color\r\n }\r\n sections{\r\n name\r\n evaluationItems{\r\n name\r\n itemType\r\n itemId\r\n itemValue\r\n points\r\n awareOfPoints\r\n }\r\n }\r\n tenantId\r\n userId\r\n version\r\n masterItemId\r\n selected\r\n creator\r\n creationDate\r\n lastUpdateDate\r\n scorecardGroup{\r\n id\r\n name\r\n generalGroup\r\n }\r\n }\r\n }`\r\n\r\nexport const queryScorecard = gql`query ent ($id: String) {\r\n getScorecard (id: $id) {\r\n id\r\n name\r\n description\r\n automatedEvaluation\r\n settingItems{\r\n name\r\n maxRange\r\n minRange\r\n color\r\n }\r\n sections{\r\n name\r\n evaluationItems{\r\n name\r\n itemType\r\n itemId\r\n itemValue\r\n points\r\n awareOfPoints\r\n }\r\n }\r\n tenantId\r\n userId\r\n version\r\n masterItemId\r\n selected\r\n creationDate\r\n }\r\n }`\r\n\r\nexport const queryScorecardsLabels = gql`query {\r\n getScorecards {\r\n id\r\n name\r\n description\r\n masterItemId\r\n }\r\n }`\r\n\r\nexport const updateScorecard = gql`mutation \r\n ent($scorecard: ScorecardInputType, $upsertToTemplate: Boolean){\r\n upsertScorecard(scorecard: $scorecard, upsertToTemplate: $upsertToTemplate ) {\r\n text\r\n status\r\n id\r\n }\r\n }`\r\n\r\nexport const deleteScorecardQuery = gql`mutation \r\n ent ( $id: String) {\r\n deleteScorecard ( id: $id)\r\n {\r\n text\r\n status\r\n id\r\n }\r\n }`\r\n\r\nexport const getAllVersionOfScorecard = gql`query ent ($masterItemId: String) {\r\n getAllVersionOfScorecard(masterItemId: $masterItemId) {\r\n id\r\n version\r\n }\r\n }`\r\n\r\nexport const restoreScorecard = gql`mutation ent ($id: String) {\r\n restoreScorecard(id: $id) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n\r\nexport const getScorecardResults = gql`query GetScorecardResults($conversationId: String!) {\r\n getScorecardResults(conversationId: $conversationId) {\r\n id\r\n policyId\r\n conversationId\r\n sections {\r\n name\r\n evaluationItems {\r\n points\r\n comment\r\n name\r\n itemValue\r\n itemId\r\n itemName\r\n itemType\r\n score\r\n editedBy\r\n awareOfPoints\r\n }\r\n }\r\n tenantId\r\n userId\r\n assessorComment\r\n scorecardName\r\n automatedEvaluation\r\n supervisors\r\n settingItems{\r\n name\r\n maxRange\r\n minRange\r\n color\r\n }\r\n }\r\n }`\r\n\r\nexport const upsertScorecardResult = gql`mutation ent($scorecardResult: ScorecardResultInputType) {\r\n upsertScorecardResult(scorecardResult: $scorecardResult) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n\r\nexport const deleteScorecardResult = gql`mutation ent($id: String) {\r\n deleteScorecardResult(id: $id) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n\r\nexport const getGroupListForLoggedUser = gql`query getGroupListForLoggedUser {\r\n getGroupListForLoggedUser\r\n }`;","import { DefaultButton, Dialog, DialogFooter, DialogType, PrimaryButton } from 'office-ui-fabric-react'\r\nimport React, { Component } from 'react'\r\nimport { MyContext } from '../../context';\r\n\r\nexport default class SafetyDialog extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n render() {\r\n const dialogContentProps = {\r\n type: DialogType.normal,\r\n title: this.props.title,\r\n closeButtonAriaLabel: 'Close',\r\n subText: this.props.subText,\r\n };\r\n return (\r\n {d}
\r\n {this.context.getTranslation(\"compliance\", \"totalScore\")}: {`${label} (${totalScore}/${totalPoints})`}
\r\n\r\n {this.state.isProcessing && \r\n \r\n \r\n \r\n \r\n {!this.state.editMode &&\r\n !this.state.editModeComment &&\r\n (this.state.scorecardResult.supervisors.includes(this.props.userRules.userId)\r\n || (this.props.userGroups && this.state.scorecardResult.supervisors.some(s => this.props.userGroups.includes(s)))) &&\r\n {\r\n this.setState({\r\n editMode: true,\r\n })\r\n }}\r\n />\r\n }\r\n {(this.state.editMode || this.state.editModeComment) &&\r\n {\r\n this.setState({\r\n editMode: false,\r\n editModeComment: false,\r\n scorecardResult: this.cleanScorecardResult(this.props.scorecardResult)\r\n })\r\n }}\r\n />\r\n }\r\n {(this.state.editMode || this.state.editModeComment) &&\r\n { this.setState({ hideDialogDelete: false }) }}\r\n />\r\n */}\r\n {this.props.showButtonCancel && !this.state.editMode && !this.state.editModeComment &&\r\n \r\n {/*SafetyDialog for delete\r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deleteScorecardResult}\r\n />*/}\r\n \r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n {this.state.scorecardResult.sections.map((section) => {\r\n let totalScore = parseFloat(section.evaluationItems.reduce((acc, item) => acc + (item.score !== \"\" && item.score !== -1 && item.score !== -2 ? parseFloat(item.score) : 0), 0).toFixed(2))\r\n let totalPoints = parseFloat(section.evaluationItems.reduce((acc, item) => acc + (item.score !== \"\" && item.score !== -1 && item.score !== -2 ? parseFloat(item.points) : 0), 0).toFixed(2))\r\n let rangeEvaluation = utils.getRangeEvaluation(this.state.scorecardResult, totalScore, totalPoints)\r\n let color = rangeEvaluation !== undefined ? rangeEvaluation.color : \"trasparent\"\r\n let evaluationItems = [\r\n ...section.evaluationItems,\r\n {\r\n itemName: this.context.getTranslation(\"compliance\", \"totalEvaluationScorecard\"),\r\n score: totalScore,\r\n points: totalPoints,\r\n color\r\n }\r\n ]\r\n let columns =\r\n [\r\n /*{\r\n key: 'itemType',\r\n name: section.name,\r\n fieldName: 'itemType',\r\n minWidth: 100,\r\n maxWidth: 120,\r\n isResizable: true,\r\n onRender: (item) => {\r\n return {this.context.getTranslation(\"compliance\", item.itemType)}\r\n }\r\n },*/\r\n {\r\n key: 'item',\r\n fieldName: 'item',\r\n name: section.name, //+ \" (\" + totalScore + \"/\" + totalPoints + \")\",\r\n minWidth: 500,\r\n maxWidth: 500,\r\n isResizable: true,\r\n isMultiline: true,\r\n onRender: (item) => {\r\n let style = item.score === \"\" || item.score === -1 || item.score === -2 ? { color: \"grey\" } : {}\r\n if (item.itemName === \"Section total\") {\r\n return {item.itemName}\r\n } else if (item.itemType === \"QMQuestions\" || item.itemType === \"ManualQMQuestions\") {\r\n return {item.itemValue}\r\n } else {\r\n return {item.itemName}\r\n }\r\n }\r\n },\r\n {\r\n key: 'points',\r\n name: this.context.getTranslation(\"compliance\", \"points\"),\r\n fieldName: 'points',\r\n minWidth: 50,\r\n maxWidth: 50,\r\n isResizable: true,\r\n onRender: (item) => {\r\n let style = item.score === \"\" || item.score === -1 || item.score === -2 ? { color: \"grey\" } : {}\r\n if (item.itemName === \"Section total\") {\r\n return {item.points}\r\n } else if (!this.state.editMode) {\r\n return {item.points}\r\n } else {\r\n return this.change(section.name, item, \"score\", e.target.value)}\r\n description={value === \"\" ? `N/A` : \"\"}\r\n />\r\n } else {\r\n return this.change(section.name, item, \"score\", e.target.value)}\r\n description={value === \"\" ? `N/A` : `${this.context.getTranslation(\"compliance\", \"yesno\")}`}\r\n />\r\n }\r\n\r\n }\r\n }\r\n },\r\n {\r\n key: 'comment',\r\n name: this.context.getTranslation(\"settings\", \"ticketComment\"),\r\n fieldName: 'comment',\r\n minWidth: 900,\r\n maxWidth: 900,\r\n isResizable: true,\r\n isMultiline: true,\r\n onRender: (item) => {\r\n let style = item.score === \"\" || item.score === -1 || item.score === -2 ? { color: \"grey\" } : {}\r\n //\"___ManualQMLabel___\" This comment was created by the compliance engine, and it serves to notify the user that the topic is about Manual Question.\r\n let comment = item.comment == \"___ManualQMLabel___\" ? this.context.getTranslation(\"compliance\", item.comment) : item.comment\r\n if (!this.state.editMode || item.itemName === \"Section total\") {\r\n return {comment}\r\n } else {\r\n return this.change(section.name, item, \"comment\", e.target.value)}\r\n />\r\n }\r\n }\r\n }\r\n\r\n ]\r\n\r\n return (\r\n \r\n \r\n {\r\n this.setState({\r\n selectedKey: [...this.state.selectedKey, section.name]\r\n })\r\n }}\r\n close={() => {\r\n this.setState({\r\n selectedKey: this.state.selectedKey.filter(s => s !== section.name)\r\n })\r\n }}\r\n />\r\n \r\n {!this.state.selectedKey.includes(section.name) &&\r\n \r\n \r\n {section.name + \" (\" + totalScore + \"/\" + totalPoints + \")\"}\r\n
\r\n \r\n \r\n }\r\n {this.state.selectedKey.includes(section.name) &&\r\n {this.state.scorecardResult.scorecardName}
\r\n{item.points}
\r\n }\r\n }\r\n },\r\n {\r\n key: 'score',\r\n name: this.context.getTranslation(\"compliance\", \"scoring\"),\r\n fieldName: 'score',\r\n minWidth: 50,\r\n maxWidth: 50,\r\n isResizable: true,\r\n onRender: (item) => {\r\n let style = item.score === \"\" || item.score === -1 || item.score === -2 ? { color: \"grey\" } : {}\r\n if (item.itemName === \"Section total\") {\r\n return {item.score}\r\n } else if (!this.state.editMode) {\r\n return {item.score === -1 || item.score === -2 ? \"N/A\" : item.score}\r\n } else {\r\n let value = item.score === -1 || item.score === -2 ? \"\" : item.score\r\n if (item.awareOfPoints) {\r\n return \r\n \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryScorecardsResult = refetch;\r\n if (loading) { return { this.refetchQueryScorecardsResult() }}\r\n userRules={this.props.userRules}\r\n />\r\n )\r\n } else {\r\n var columns = [\r\n {\r\n key: 'scorecardName',\r\n name: this.context.getTranslation(\"compliance\", \"name\"),\r\n fieldName: 'scorecardName',\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n },\r\n {\r\n key: \"automatedEvaluation\",\r\n name: this.context.getTranslation(\"compliance\", \"evaluationType\"),\r\n fieldName: \"automatedEvaluation\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n },\r\n {\r\n key: \"assessment\",\r\n name: this.context.getTranslation(\"compliance\", \"assessment\"),\r\n fieldName: \"assessment\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n },\r\n {\r\n key: \"evaluationKey\",\r\n name: this.context.getTranslation(\"compliance\", \"evaluationKey\"),\r\n fieldName: \"evaluationKey\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n }\r\n ]\r\n // Add warning icon if there are manual QM questions with score -2\r\n let warningIconRes = data.getScorecardResults.filter(s => s.automatedEvaluation).some(s => s.sections.some(section => section.evaluationItems.some(el => el.itemType === \"ManualQMQuestions\" && el.score === -2)))\r\n if (warningIconRes) {\r\n columns = [...columns,\r\n {\r\n key: \"WarningManualQM\",\r\n fieldName: \"WarningManualQM\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true,\r\n onRender: (item, i) => {\r\n const ret =\r\n item.automatedEvaluation && \r\n item.sections.some(section => \r\n section.evaluationItems.some(el => \r\n el.itemType === \"ManualQMQuestions\" && el.score === -2\r\n )\r\n );\r\n if (ret) {\r\n return {
\r\n }\r\n}","import gql from 'graphql-tag';\r\n\r\n\r\nexport const queryAllAIQuestions = gql`query {\r\n getAIQuestions {\r\n id\r\n masterItemId\r\n name\r\n description\r\n question\r\n tenantId\r\n matchAbsence\r\n aiQuestionGroup{\r\n id\r\n name\r\n generalGroup\r\n }\r\n }\r\n }`\r\n\r\nexport const queryAllAIAssistantQuestions = gql`query ent($aIQuestionType: String) {\r\n getAIQuestionNames (aIQuestionType: $aIQuestionType) {\r\n id\r\n aIQuestionType\r\n masterItemId\r\n name\r\n active\r\n automated\r\n }\r\n }`\r\nexport const queryAllAIQuestionsFiltered = gql`query ent($aIQuestionType: String, $filterTemplateQuestions: Boolean,\r\n $automatedOnDemand: Boolean, $fromDetailView: Boolean) {\r\n getAllAIQuestionsFiltered (aIQuestionType:$aIQuestionType, filterTemplateQuestions: $filterTemplateQuestions,\r\n automatedOnDemand:\r\n $automatedOnDemand, fromDetailView:$fromDetailView) {\r\n id\r\n aIQuestionType\r\n masterItemId\r\n name\r\n active\r\n automated\r\n version\r\n question\r\n }\r\n }`\r\n\r\nexport const queryAllAIAssistantResults = gql`query ent($conversationId: String) {\r\n getAllAIAssistantResults (conversationId: $conversationId) {\r\n id\r\n conversationId\r\n answer\r\n answerDate\r\n question\r\n automated\r\n }\r\n }`\r\n\r\nexport const queryGetAIQuestion = gql`query ent ($id: String) {\r\n getAIQuestion (id: $id) {\r\n id\r\n name\r\n description\r\n question\r\n tenantId\r\n version\r\n masterItemId\r\n selected\r\n matchAbsence\r\n aiQuestionGroup{\r\n id\r\n generalGroup\r\n }\r\n }\r\n }`\r\n\r\nexport const createAIQuestion = gql`mutation ent($aiQuestion: AIQuestionInputType){\r\n upsertAIQuestion(aiQuestion: $aiQuestion) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n\r\nexport const createAIQuestionAsTemplate = gql`mutation ent($aiQuestion: AIQuestionInputType){\r\n upsertAIQuestionAsTemplate(aiQuestion: $aiQuestion) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n\r\nexport const deleteAIQuestion = gql`mutation ent ($id: String) {\r\n deleteAIQuestion(id: $id) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n\r\nexport const getAllVersionOfAIQuestion = gql`query ent ($masterItemId: String) {\r\n getAllVersionOfAIQuestion(masterItemId: $masterItemId) {\r\n id\r\n version\r\n }\r\n }`\r\n\r\nexport const restoreAIQuestion = gql`mutation ent ($id: String) {\r\n restoreAIQuestion(id: $id) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n","import React, { Component } from 'react';\r\nimport * as QueryAI from '../../../../ComplianceView/AIQuestion/AIQuestionQuery';\r\nimport { MyContext } from '../../../../../context';\r\nimport AlertBar from '../../../../CustomComponents/AlertBar';\r\nimport { Query } from 'react-apollo';\r\nimport { DocumentCard, DocumentCardTitle, DocumentCardDetails, DocumentCardActivity, Stack,Spinner, Text} from 'office-ui-fabric-react';\r\n\r\nexport default class AIAssistantResults extends Component {\r\n\r\n static contextType = MyContext\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n aIAssistantQuestions: [],\r\n aIAssistantResults:[]\r\n };\r\n }\r\n\r\n render() {\r\n let aIResultHistory;\r\n //let conversationId = \"25c6b095-2360-4a2d-ad31-15cd9cc74af2\";\r\n let conversationId = this.props.metadata.conversationId;\r\n return (\r\n \r\n {!this.state.showDetail &&\r\n { this.setState({ showDetail: false }) }}\r\n scorecardResult={data.getScorecardResults.filter(s => s.id === this.state.scorecardResultId)[0]}\r\n refreshResult={() => { this.refetchQueryScorecardsResult() }}\r\n userRules={this.props.userRules}\r\n userGroups={this.state.userGroups}\r\n />\r\n }\r\n
\r\n )\r\n }\r\n\r\n }}\r\n \r\n \r\n {aIResultHistory.length > 0 && (\r\n \r\n {aIResultHistory.map((item, index) => (\r\n \r\n \r\n \r\n \r\n \r\n {item.question} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {item.answer}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n ))}\r\n \r\n )}\r\n {aIResultHistory.length === 0 && (
\r\n )\r\n }}\r\n )\r\n }\r\n}","export default __webpack_public_path__ + \"static/media/asc-ai-assistant-icon-blue.12fbf5f2.svg\";","export default __webpack_public_path__ + \"static/media/asc-ai-assistant-icon-black.e8d82a2e.svg\";","export default __webpack_public_path__ + \"static/media/asc-ai-assistant-icon-white.722c545a.svg\";","export default __webpack_public_path__ + \"static/media/asc-ai-assistant-icon-dark-blue.9b442986.svg\";","import React, { Component } from 'react';\r\nimport aiIconBlue from '../../../styles/images/asc-ai-assistant-icon-blue.svg';\r\nimport aiIconBlack from '../../../styles/images/asc-ai-assistant-icon-black.svg';\r\nimport aiIconWhite from '../../../styles/images/asc-ai-assistant-icon-white.svg';\r\nimport aiIconDarkBlue from '../../../styles/images/asc-ai-assistant-icon-dark-blue.svg';\r\n\r\n\r\nexport default class AIAssistantIcon extends Component {\r\n\r\n render() {\r\n\r\n let src = \"\"\r\n\r\n if (this.props.color === \"blue\") {\r\n if (this.props.theme.type === \"normal\")\r\n src = aiIconDarkBlue\r\n else\r\n src = aiIconBlue\r\n } else {\r\n if (this.props.theme.type === \"normal\")\r\n src = aiIconBlack\r\n else\r\n src = aiIconWhite\r\n }\r\n\r\n return (\r\n \r\n \r\n {item.automated == true ? \"Automated\" : \"On Demand\"}\r\n \r\n
\r\n \r\n {`${new Date(item.answerDate).toISOString().replace('T', ' ').slice(0, 19)} UTC`} \r\n
\r\n \r\n \r\n No history found\r\n \r\n
)}\r\n \r\n
\r\n )\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n \r\n {!this.props.isOpen && \r\n \r\n \r\n {this.props.isOpen &&
\r\n )\r\n }\r\n\r\n {this.context.getTranslation(\"settings\", \"ticketDetails\")}
\r\n\r\n {\r\n !this.state.loadingPolicy && \r\n {/*TRANSCRIPT*/}\r\n \r\n \r\n \r\n\r\n {this.props.data.analyticRemark == \"AnalyticLimitReached\" &&\r\n No Analytics processed. Maximum Analytics hours reached! }\r\n }\r\n\r\n {/*POLICY*/}\r\n {this.props.userRules?.addOnCompliance && (!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsAnalytics) &&\r\n (this.props.userRules?.ruleAccess?.complianceResultsAccess) &&\r\n \r\n }\r\n {(!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsQM && this.props.userRules?.addOnQualityManagement) &&\r\n this.props.userRules?.ruleAccess?.complianceQMResultsAccess && this.props.userRules?.addOnQualityManagement &&\r\n \r\n \r\n \r\n\r\n }\r\n\r\n {(!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsNotes) &&\r\n ((this.props.isShared && this.props.data.hasNotes) || !this.props.isShared) &&\r\n \r\n\r\n\r\n }\r\n\r\n {this.props.userRules?.ruleAccess?.hasCustomFieldsAccess && (!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsCustomFields) &&\r\n < PivotItem linkText={window.innerWidth < 1200 ? \"\" : context.getTranslation(\"detailContainer\", \"fields\")} itemIcon=\"ClipboardList\" itemKey=\"8\"\r\n headerButtonProps={{\r\n 'disabled': this.state.processing,\r\n 'style': this.state.processing ? { color: \"grey\" } : {}\r\n }}\r\n >\r\n \r\n\r\n\r\n }\r\n\r\n {(!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsMetadata) &&\r\n ((this.props.isShared && this.props.data.hasMetadata) || !this.props.isShared) &&\r\n \r\n }\r\n {this.props.userRules?.ruleAccess?.userComplianceAIAssistant && (!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsAIAssistantHistory) && (\r\n \r\n \r\n }\r\n {this.state.loadingPolicy &&
}\r\n \r\n
\r\n \r\n {(!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsTranscript) &&\r\n \r\n {this.props.data.analyticRemark == \"AnalyticLimitReached\" &&\r\n No Analytics processed. Maximum Analytics hours reached! }\r\n {this.props.data.analyticRemark == \"TranslateLimitReached\" &&\r\n No Translation processed. Maximum Translate hours reached! }\r\n
\r\n \r\n
\r\n \r\n
\r\n }\r\n {(!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsAnalytics) &&\r\n \r\n
\r\n }\r\n\r\n {(!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsAnalytics) &&\r\n ((this.props.isShared && this.props.data.summarizedInsights !== null) || !this.props.isShared) &&\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n }\r\n\r\n {((!this.props.userRules?.visibilityDetails || this.props.userRules?.visibilityDetailsTTL) && !this.props.isShared) && \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n )\r\n }\r\n\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n } else if (i < 5 || this.state.isExpanded) {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n else {\r\n return;\r\n }\r\n }\r\n\r\n moreClicked = () => {\r\n this.setState({ isExpanded: !this.state.isExpanded })\r\n }\r\n\r\n f(props, gross) {\r\n if (props.person != null) {\r\n return props.person.map(({ name, detail, photo, userId, tenantId, isRecordingOwner, userPrincipal, joinDateTime, leftDateTime, application, email, isCallOwner }, i) => (\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {tmp.map(({ x, y, h, w, color, time, sec }, i) =>\r\n (\r\n \r\n \r\n\r\n
\r\n \r\n\r\n }\r\n\r\n };\r\n\r\n render(): React.ReactNode {\r\n return \r\n \r\n
\r\n }\r\n}\r\n\r\n\r\n\r\nclass ColoredRect extends React.Component {\r\n\r\n state =\r\n {\r\n shadow: this.props.shadowBlur\r\n };\r\n\r\n f = (props) => {\r\n if (props.handleMouseOver !== undefined && props.handleMouseOver != null) {\r\n props.handleMouseOver(props.time);\r\n this.setState({ shadow: 3 });\r\n }\r\n\r\n };\r\n g = (props) => {\r\n if (props.handleMouseOver !== undefined && props.handleMouseOver != null) {\r\n this.setState({ shadow: 0 });\r\n }\r\n };\r\n\r\n y = (props) => {\r\n if (props.handleClick !== undefined && props.handleClick != null) {\r\n props.handleClick(props.sec);\r\n }\r\n\r\n };\r\n render() {\r\n return (\r\n \r\n {this.convertToDiagram()}\r\n
\r\n \r\n Media Asset not playable\r\n
\r\n );\r\n } else {\r\n return (\r\n \r\n \r\n\r\n\r\n );\r\n }\r\n } else {\r\n return (\r\n \r\n Media Asset will shortly be playable,\r\n please refresh the page\r\n
\r\n );\r\n }\r\n }\r\n\r\n jumpTo(timestamp) {\r\n if (this.mPlayer!==undefined && this.mPlayer!=null)\r\n {\r\n console.log(`Jumping to ${timestamp}`);\r\n this.mPlayer.currentTime(this.state.offset + timestamp);\r\n }\r\n }\r\n\r\n play() {\r\n if (this.mPlayer!==undefined && this.mPlayer!=null)\r\n {\r\n this.mPlayer.play();\r\n this.mPlayer.removeEventListener(\"loadeddata\", this.props.callbackPlayerLoaded);\r\n }\r\n }\r\n\r\n isRunning() {\r\n if (this.mPlayer!==undefined && this.mPlayer!=null)\r\n {\r\n return !this.mPlayer.paused();\r\n }\r\n else\r\n {\r\n return null;\r\n }\r\n }\r\n\r\n pause() {\r\n if (this.mPlayer!==undefined && this.mPlayer!=null)\r\n {\r\n this.mPlayer.pause();\r\n }\r\n }\r\n\r\n getCurrentTime() {\r\n return this.mPlayer.currentTime()-this.state.offset;\r\n }\r\n\r\n getWidth() {\r\n if (this.mPlayer!==undefined && this.mPlayer!=null)\r\n {\r\n return this.mPlayer.width();\r\n }\r\n else return null\r\n }\r\n\r\n changeSource(val) {\r\n this.mPlayer.addEventListener(\"loadeddata\", this.props.callbackPlayerLoaded);\r\n var encodedList = val.split(\"|\");\r\n if (encodedList.length > 1) {\r\n // Encoded stream\r\n this.mPlayer.src([\r\n {\r\n \"src\": encodedList[0],\r\n \"type\": \"application/vnd.ms-sstr+xml\",\r\n \"protectionInfo\": [{ \"type\": \"AES\", \"authenticationToken\": encodedList[1] }]\r\n }\r\n ]);\r\n } else if (val.search(\".mp3\") != -1) {\r\n // then sas token\r\n this.mPlayer.src([\r\n {\r\n \"src\": val,\r\n \"type\": \"audio/mp3\"\r\n }\r\n ]);\r\n } else if (val.search(/\\.wav/i) != -1) {\r\n // then sas token\r\n this.mPlayer.src([\r\n {\r\n \"src\": val,\r\n \"type\": \"audio/wav\"\r\n }\r\n ]);\r\n } else if (val.search(\".mp4\") != -1) {\r\n // then sas token\r\n this.mPlayer.src([\r\n {\r\n \"src\": val,\r\n \"type\": \"video/mp4\"\r\n }\r\n ]);\r\n } else {\r\n this.mPlayer.src([\r\n {\r\n \"src\": val,\r\n \"type\": \"application/vnd.ms-sstr+xml\",\r\n }\r\n ]);\r\n }\r\n this.mPlayer.play();\r\n this.mPlayer.pause();\r\n }\r\n\r\n getHeight() {\r\n return this.mPlayer.height();\r\n }\r\n\r\n resize(width, height) {\r\n if (this.mPlayer) {\r\n if (width !== undefined)\r\n this.mPlayer.width(width);\r\n else\r\n this.mPlayer.width(\"auto\");\r\n\r\n if (height !== undefined)\r\n this.mPlayer.height(height);\r\n else\r\n this.mPlayer.height(\"auto\");\r\n }\r\n }\r\n\r\n setPlaybackRate(rate) {\r\n if (this.mPlayer !== undefined && this.mPlayer != null) {\r\n this.mPlayer.playbackRate(rate);\r\n }\r\n }\r\n}","import { HoverCard } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\nimport { FontIcon } from \"office-ui-fabric-react/lib\";\r\n\r\nexport default class HoverCardFolders extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n folders: props.foldersData == undefined ? null : props.foldersData\r\n }\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n if (prevProps.foldersData != this.props.foldersData) {\r\n this.setState({\r\n folders: this.props.foldersData\r\n })\r\n }\r\n }\r\n\r\n plainCardProps = {\r\n onRenderPlainCard: () => {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n \r\n {this.state.folders != null\r\n ? (this.state.folders\r\n .map((folder, item) =>
\r\n {folder.name}
))\r\n : {this.context.getTranslation(\"common\", \"loading\")}
\r\n }\r\n {\r\n (this.state.folders != null && this.state.folders.length == 0) && {this.context.getTranslation(\"detailContainer\", \"notInSafeFolder\")}
\r\n }\r\n \r\n\r\n
\r\n \r\n {this.state.folders != null ?\r\n (
\r\n\r\n \r\n
\r\n )\r\n : \r\n }\r\n \r\n \r\n\r\n {/*THIS IS THE LAYER WHERE THE WAVE IS DISPLAYED*/}\r\n\r\n {tmp.length > 0 && <>\r\n \r\n {tmp.map(({ x, y, h, w, color }, i) =>\r\n (<>\r\n \r\n }\r\n\r\n \r\n \r\n \r\n\r\n\r\n\r\n\r\n\r\n {/* THIS LAYER CONTAINES TRIANGLES FOR KEYWORDS*/}\r\n {policyKeyworsArray.length > 0 && \r\n {policyKeyworsArray.map(({ x, color, name, time, sec, text, type }, i) => {\r\n\r\n if ((this.state.displayPolicies && type == \"p\") || (this.state.displayKeywords && type == \"k\")) {\r\n return (<>\r\n }\r\n\r\n {/*THIS IS THE LAYER FOR SELECTING IF KEYWORDS/OR ANY OTHER ELEMENTS ADDED ARE VISIBLE(LIKE POLICY)*/}\r\n {keywordsArray.length > 0 && \r\n \r\n } \r\n\r\n {policyArray.length > 0 && \r\n \r\n\r\n }\r\n\r\n \r\n\r\n
\r\n \r\n\r\n\r\n };\r\n\r\n render(): React.ReactNode {\r\n return \r\n {\r\n this.setState({ displayKeywords: newValue })\r\n }\r\n }\r\n color=\"blue\"\r\n />\r\n\r\n
\r\n\r\n\r\n \r\n \r\n {\r\n this.setState({ displayPolicies: newValue })\r\n }}\r\n color=\"#F9C642\"\r\n />\r\n\r\n
\r\n \r\n \r\n\r\n
\r\n }\r\n}\r\n\r\n//WAVE LINE\r\nclass ColoredRect extends React.Component {\r\n\r\n\r\n render() {\r\n return (\r\n \r\n {this.convertToDiagram()}\r\n
\r\n \r\n \r\n \r\n \r\n {!this.props.isOpen && \r\n \r\n {!this.props.isOpen &&\r\n \r\n {this.props.isOpen &&
\r\n\r\n )\r\n }\r\n}","import React from 'react';\r\nimport { useState } from 'react';\r\nimport { Stack, IconButton } from 'office-ui-fabric-react';\r\nimport { MyContext } from '../../../context';\r\n\r\n/*\r\ninterface ContentUnderstandingResultProps {\r\n\tloading: boolean;\r\n\tcuData: string;\r\n }\r\n*/\r\n\r\nexport default function ContentUnderstandingResult({ loading, cuData }/*:ContentUnderstandingResultProps*/) {\r\n\r\n\tconst [expanded, setExpanded] = useState(false);\r\n\tif (!cuData || loading) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\tlet fields/*:Record{this.context.getTranslation(\"compliance\", \"aIAssistant\")}
\r\n\r\n \r\n {!this.state.loadingOpenAI && \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {this.state.aIAssistantSelectedQuestions == \"-1\" && (\r\n \r\n {\r\n this.setState({\r\n openQuestion: event.target.value,\r\n aiAssistantAnswer: \"\"\r\n })\r\n }} />\r\n \r\n\r\n )}\r\n\r\n \r\n \r\n\r\n \r\n }\r\n {this.state.loadingOpenAI && (\r\n \r\n \r\n )}\r\n\r\n \r\n {/*Result AIAssistant*/}\r\n {this.state.aiAssistantAnswer !== \"\" && \r\n \r\n \r\n }\r\n \r\n \r\n \r\n \r\n
\r\n\r\n }\r\n {this.context.getTranslation(\"compliance\", \"aIAssistantCardTitle\")}
\r\n{this.context.getTranslation(\"compliance\", \"aIAssistantCardDescription1\")}
\r\n{this.context.getTranslation(\"compliance\", \"aIAssistantCardDescription2\")}
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n {\"Q: \" + (this.state.openQuestion == \"\" ? this.state.aIAssistantQuestion : this.state.openQuestion)}
{this.state.aiAssistantAnswer}
\r\n\r\n
\r\n \r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t{renderExpander(expanded, setExpanded)}\r\n\t\t\t\t \r\n\t\t\t\t{expanded &&\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t \r\n\t\t\t\t}\r\n\t\t\t \r\n\t\t
\r\n\t)\r\n}\r\n\r\nfunction translate(prefix/*:string*/, rs/*:string*/){\r\n\treturn \r\n\t\t\t\t\t\t\t{translate(\"compliance\",\"contentUnderstandingTableHeadlineKey\")}\r\n\t\t\t\t\t\t\t{translate(\"compliance\",\"contentUnderstandingTableHeadlineValue\")}\r\n\t\t\t\t\t\t\t{Object.keys(fields).flatMap(e => renderEntry(e,fields[e]))}\r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\r\n\t\t{renderTableHead(key,columns)}\r\n\t\t{renderTableEntries(key,value,columns)}\r\n\t
\r\n}\r\n\r\nfunction discoverTableColumns(value/*:Record\r\n\t\t{ value.map((e,index) => {e})}\r\n\t\t\r\n\t
\r\n}\r\n\r\nfunction renderPrimitiveValue(key, value){\r\n\tconst itemKey = \"\"+ key + \"_value\" \r\n\treturn {value}\r\n}\r\n\r\nfunction renderUnknownValue(key){\r\n\tconst itemKey = \"\"+ key + \"_value\" \r\n\treturn Unsupported construct\r\n}\r\n\r\nfunction renderExpander(expanded/*:boolean*/, setExpanded/*:(e:boolean)=>void*/) {\r\n\treturn (\r\n\r\n\t\t{translate(\"compliance\" , \"contentUnderstandingCardTitle\")}
\r\n\t\t\r\n 
\r\n
\r\n \r\n ![]({\"data:image/jpeg;base64,\")
\r\n
\r\n );\r\n }}\r\n \r\n\r\n );\r\n }\r\n\r\n playerLoadedCallbackTimeUpdate = () => {\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.setState({ playerValue: Math.trunc(this.azurePlayerRefAudio.current.getCurrentTime()) });\r\n console.log(\"currentTime: \" + this.state.playerValue);\r\n }\r\n }\r\n\r\n playerLoadedCallback1 = () => {\r\n\r\n };\r\n\r\n playerLoadedCallback2 = () => {\r\n // Jump to the actual Position and play\r\n var time = this.azurePlayerRefAudio.current.getCurrentTime();\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRef2.current.isRunning()) {\r\n this.azurePlayerRef2.current.play();\r\n }\r\n };\r\n\r\n playerLoadedCallback3 = () => {\r\n // Jump to the actual Position and play\r\n var time = this.azurePlayerRefAudio.current.getCurrentTime();\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.jumpTo(time);\r\n }\r\n if (this.azurePlayerRef3.current.isRunning()) {\r\n this.azurePlayerRef3.current.play();\r\n }\r\n };\r\n\r\n\r\n playerLoadedCallbackAudio = () => {\r\n\r\n };\r\n\r\n togleEmotion = () => {\r\n let tmp = this.state.emotion;\r\n tmp = !tmp;\r\n\r\n this.setState({ emotion: tmp })\r\n };\r\n\r\n\r\n togleEmotion = () => {\r\n let tmp = this.state.emotion;\r\n tmp = !tmp;\r\n\r\n this.setState({ emotion: tmp })\r\n };\r\n\r\n hidePanel = () => {\r\n this.setState({ isOpen: false })\r\n };\r\n\r\n changeCurrentTime = (val) => {\r\n console.log(\"Seconds: \" + val);\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.jumpTo(val)\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.jumpTo(val)\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.jumpTo(val)\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.jumpTo(val)\r\n }\r\n if (!this.state.isPlaying) {\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.pause();\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.pause();\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.pause();\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.pause();\r\n }\r\n } else {\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.play();\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.play();\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.play();\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.play();\r\n }\r\n }\r\n };\r\n\r\n playerBeginning = () => {\r\n this.playerPause();\r\n this.setState({ isPlaying: false });\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.jumpTo(0);\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.jumpTo(0);\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.jumpTo(0);\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.jumpTo(0);\r\n }\r\n };\r\n\r\n playerPause = () => {\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.pause()\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.pause()\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.pause()\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.pause()\r\n }\r\n }\r\n\r\n playerPlay = () => {\r\n var time = this.azurePlayerRefAudio.current.getCurrentTime();\r\n if (this.azurePlayerRef1.current != null) {\r\n this.azurePlayerRef1.current.jumpTo(time);\r\n this.azurePlayerRef1.current.play();\r\n }\r\n if (this.azurePlayerRef2.current != null) {\r\n this.azurePlayerRef2.current.jumpTo(time);\r\n this.azurePlayerRef2.current.play();\r\n }\r\n if (this.azurePlayerRef3.current != null) {\r\n this.azurePlayerRef3.current.jumpTo(time);\r\n this.azurePlayerRef3.current.play();\r\n }\r\n if (this.azurePlayerRefAudio.current != null) {\r\n this.azurePlayerRefAudio.current.play();\r\n }\r\n }\r\n\r\n changeSource2 = (val) => {\r\n if (this.state.isPlaying) {\r\n this.playerPause();\r\n }\r\n this.setState({ stream2: val, isPlaying: false });\r\n this.azurePlayerRef2.current.changeSource(val);\r\n }\r\n\r\n changeSource3 = (val) => {\r\n if (this.state.isPlaying) {\r\n this.playerPause();\r\n }\r\n this.setState({ stream3: val, isPlaying: false });\r\n this.azurePlayerRef3.current.changeSource(val);\r\n }\r\n\r\n getDurationInSeconds = () => {\r\n\r\n var t = this.props.data.duration;\r\n if (t === \"\")\r\n return 0;\r\n\r\n //seconds miliseconds and days are divided by dots (d.hh:mm:ss.ml)\r\n //if there are more dots in string will split by them and divide into time(tmp) and days \r\n //if only one dot detected there is no day so will be only tmp\r\n let tmp = t, d = 0;\r\n if (t.indexOf(\".\") !== -1) {\r\n if (t.split('.').length > 1) {\r\n tmp = t.split('.')[1];\r\n d = t.split('.')[0];\r\n } else {\r\n tmp = t.split('.')[0];\r\n }\r\n\r\n }\r\n\r\n let out, s, m, h;\r\n tmp = tmp.split(':');\r\n\r\n s = Number(tmp[2]);\r\n m = Number(tmp[1]) * 60;\r\n h = Number(tmp[0]) * 60 * 60;\r\n d = Number(d) * 24 * 60 * 60;\r\n\r\n out = s + m + h + d;\r\n\r\n return out;\r\n }\r\n\r\n \r\n showAnalyticsStatus = () => {\r\n var status = \r\n \r\n {\r\n this.setState({ heightTop: height });\r\n }}>\r\n {\r\n this.rendHeader()\r\n }\r\n\r\n \r\n {this.rendPivot()}\r\n {this.props.loading === true && \r\n
\r\n )\r\n }\r\n \r\n {this.props.data.isVideoProcessing &&\r\n \r\n
\r\n \r\n \r\n {(context) => (\r\n {context.getTranslation(\"detailContainer\", \"videoStillProcessing\")}\r\n )\r\n }\r\n \r\n
\r\n }\r\n {!this.props.data.isVideoProcessing && !this.props.loading === true && this.props.data.replayAllowed === true && this.props.data.archiveStatus === 0 && this.canReplayByFolder() && this.videoStream1()}\r\n {!this.props.data.isVideoProcessing && !this.props.loading === true && this.props.data.replayAllowed === true && this.props.data.archiveStatus === 0 && this.canReplayByFolder() && this.props.loading == null && this.videoStream2()}\r\n {!this.props.data.isVideoProcessing && !this.props.loading === true && this.props.data.replayAllowed === true && this.props.data.archiveStatus === 0 && this.canReplayByFolder() && this.props.loading == null && this.videoStream3()}\r\n {!this.props.loading === true && this.props.data.replayAllowed === true && this.props.data.archiveStatus === 0 && this.canReplayByFolder() && this.videoStreamAudio()}\r\n {this.videoMetadata(this.props.data.replayAllowed && this.canReplayByFolder())}\r\n {this.personaContainer()}\r\n\r\n \r\n \r\n {!this.props.loading === true && this.props.data.replayAllowed === true && this.props.data.archiveStatus === 0 && this.canReplayByFolder() && this.playerControls(context)}\r\n {/* {!this.props.loading === true && this.props.data.replayAllowed === true && this.props.loading == null && this.rendEmote()}*/}\r\n
\r\n {!this.props.loading === true &&\r\n this.props.userRules != null &&\r\n this.props.userRules.ruleAccess != null &&\r\n this.props.userRules.ruleAccess.userComplianceAIAssistant &&\r\n (!this.props.userRules.visibilityDetails || this.props.userRules.visibilityDetailsAIAssistant) && (\r\n \r\n {this.renderAIAssistant()}\r\n
\r\n )}\r\n \r\n
}\r\n \r\n\r\n {this.state.graphqlRequestPending\r\n ? {\r\n this.setState({\r\n requestReason: newValue,\r\n });\r\n }}\r\n value={this.state.requestReason}\r\n required />\r\n {this.state.requestReason\r\n ? \r\n : \r\n }\r\n \r\n }\r\n\r\n\r\n
\r\n )\r\n }\r\n \r\n\r\n {context.getTranslation(\"detailContainer\", \"replayRequestFromUser\")} \r\n {this.props.data.replayRequestUserName} \r\n
\r\n{context.getTranslation(\"detailContainer\", \"requestReplayReason\")}: {this.props.data.requestReplayReasoningText} \r\n
\r\n {this.state.graphqlRequestPending\r\n ?
\r\n )\r\n }\r\n \r\n
\r\n {this.state.graphqlRequestPending\r\n ?
\r\n {context.getTranslation(\"detailContainer\", \"replayRequestApprovedBy\")} \r\n {this.props.data.approvedUserName} \r\n\r\n
\r\n )\r\n }\r\n \r\n \r\n
)\r\n }\r\n \r\n \r\n
)\r\n }\r\n \r\n\r\n {this.state.graphqlRequestPending\r\n ?
\r\n )\r\n }\r\n \r\n \r\n
)\r\n }\r\n \r\n\r\n {context.getTranslation(\"detailContainer\", \"restoreRequestFromUser\")} \r\n {this.props.data.replayRequestUserName} \r\n
\r\n{context.getTranslation(\"detailContainer\", \"requestRestoreArchiveReason\")}: {this.props.data.requestRestoreArchiveReasoningText} \r\n
\r\n {this.state.graphqlRequestPending\r\n ?
\r\n )\r\n }\r\n \r\n
\r\n {this.state.graphqlRequestPending\r\n ?
\r\n {context.getTranslation(\"detailContainer\", \"restoreRequestApprovedBy\")} \r\n {this.props.data.approvedUserName} \r\n\r\n
\r\n )\r\n }\r\n \r\n \r\n
)\r\n }\r\n \r\n \r\n
)\r\n }\r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n \r\n {(!this.props.isShared && this.props.userRules?.ruleAccess?.allowConvSharing) && <>\r\n this.setState({ isDialogOpen: true })}\r\n style={{ position: 'absolute', top: 0, right: 0 }}\r\n ariaLabel=\"Share conversation\"\r\n />\r\n this.setState({ isDialogOpen: false })}\r\n dialogContentProps={{\r\n type: DialogType.largeHeader,\r\n title: context.getTranslation(\"detailContainer\", \"shareConversation\"),\r\n subText: context.getTranslation(\"detailContainer\", \"selectSharingOptions\")\r\n }}\r\n modalProps={{\r\n isBlocking: false,\r\n styles: { main: { maxWidth: 450 } }\r\n }}\r\n >\r\n {this.state.generatedLink && (<>\r\n
\r\n
\r\n \r\n )}\r\n this.setState({ expirationDate: date })}\r\n disableAutoFocus={true}\r\n minDate={minDate}\r\n maxDate={maxDate}\r\n />\r\n
\r\n this.setState({ withAudio: checked })}\r\n />\r\n this.setState({ withVideo: checked })}\r\n />\r\n this.setState({ withChat: checked })}\r\n />\r\n this.setState({ withTranscript: checked })}\r\n />\r\n this.setState({ withMetadata: checked })}\r\n />\r\n this.setState({ withNotes: checked })}\r\n />\r\n \r\n this.setState({ isDialogOpen: false })} text={context.getTranslation(\"common\", \"cancel\")} />\r\n\r\n\r\n \r\n\r\n\r\n \r\n }\r\n\r\n \r\n {this.props.data.archiveStatus != 0 && this.displayArchiveStatus()}\r\n {(this.props.data.archiveStatus != 0)\r\n ? this.requestReplayFromArchive()\r\n : this.requestReplay(replayAllowed)\r\n }\r\n\r\n {this.keepOrDelete()}\r\n \r\n \r\n {context.getTranslation(\"detailContainer\", \"date\")}: {this.props.data.day}\r\n \r\n \r\n\r\n \r\n \r\n {context.getTranslation(\"detailContainer\", \"start\")}: {this.props.data.recordingStart}\r\n \r\n \r\n\r\n \r\n \r\n {context.getTranslation(\"detailContainer\", \"duration\")}: {this.props.data.duration}\r\n \r\n \r\n\r\n {this.props.data.recordingType != null && this.props.data.recordingType !== \"Unknown\" && \r\n \r\n {context.getTranslation(\"detailContainer\", \"type\")}: {this.props.data.recordingType}\r\n \r\n }\r\n\r\n \r\n \r\n {this.showAnalyticsStatus()}\r\n \r\n \r\n {context.getTranslation(\"detailContainer\", \"id\")}: {this.props.data.conversationId} \r\n \r\n \r\n {this.props.data.unifiedTranscript != null ?\r\n (context.getTranslation(\"detailContainer\", \"language\") + ': ' + this.props.data.unifiedTranscript.language)\r\n : \"\"}\r\n \r\n \r\n\r\n {this.props.data.conversationSafe !== false && this.props.userRules.ruleAccess.userSafe !== \"No\" &&\r\n \r\n \r\n }\r\n\r\n {this.props.userRules != null && this.props.userRules.ruleAccess != null &&\r\n this.props.userRules.ruleAccess.tenantCreate &&\r\n this.props.data.tenantId != null &&\r\n this.props.data.callId != null &&\r\n this.props.data.conversationId != null &&\r\n this.props.data.userId != null &&\r\n \r\n \r\n \r\n }\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n \r\n )}\r\n
\r\n
\r\n \r\n \r\n
);\r\n\r\n }\r\n }\r\n moreClicked = () => {\r\n this.setState({ bigScreenSharing: !this.state.bigScreenSharing });\r\n this.setState({ bigVideo1: false });\r\n this.setState({ bigVideo2: false });\r\n }\r\n\r\n bigVideo1Clicked = () => {\r\n this.setState({ bigVideo1: !this.state.bigVideo1 });\r\n this.setState({ bigScreenSharing: false });\r\n this.setState({ bigVideo2: false });\r\n }\r\n\r\n bigVideo2Clicked = () => {\r\n this.setState({ bigVideo2: !this.state.bigVideo2 });\r\n this.setState({ bigScreenSharing: false });\r\n this.setState({ bigVideo1: false });\r\n\r\n }\r\n\r\n handlePlayerClick = () => {\r\n if (!this.state.isPlaying) {\r\n this.setState({ isPlaying: true });\r\n this.playerPlay();\r\n } else {\r\n this.setState({ isPlaying: false });\r\n this.playerPause();\r\n }\r\n }\r\n toggleDropdown = () => {\r\n this.setState((prevState) => ({ showDropdown: !prevState.showDropdown }));\r\n };\r\n\r\n playerControls = (context) => {\r\n let wavedata = this.props.data.waveFormAnalysis;\r\n let audioSegments = (wavedata === null || wavedata === undefined) ? \"\" : wavedata.rmsAudioSegments;\r\n const playbackRates = [0.75, 1, 1.5, 2];\r\n\r\n if ((this.props.data.mediaAssets != null && this.props.data.mediaAssets != \"\") || (this.props.data.mediaAssetVideo != null && this.props.mediaAssetVideo != \"\")) {\r\n return (\r\n \r\n
\r\n \r\n\r\n \r\n\r\n {(wavedata !== null || wavedata !== \"\") && (audioSegments !== null && audioSegments !== \"\")\r\n ? */}\r\n {/* {*/}\r\n {/* var h = Math.floor(value / 3600);*/}\r\n {/* var m = Math.floor((value % 3600) / 60);*/}\r\n {/* var s = (value % 3600) % 60;*/}\r\n {/* return h + \":\" + (m < 10 ? \"0\" + m : m) + \":\" + (s < 10 ? \"0\" + s : s);*/}\r\n {/* }}*/}\r\n {/* step={1}*/}\r\n {/* value={this.state.playerValue}*/}\r\n {/* showValue={true}*/}\r\n {/* onChange={(value) => this.changeCurrentTime(value)}*/}\r\n {/* />*/}\r\n {/* */}\r\n\r\n\r\n {/* : */}\r\n {/* {*/}\r\n {/* var h = Math.floor(value / 3600);*/}\r\n {/* var m = Math.floor((value % 3600) / 60);*/}\r\n {/* var s = (value % 3600) % 60;*/}\r\n {/* return h + \":\" + (m < 10 ? \"0\" + m : m) + \":\" + (s < 10 ? \"0\" + s : s);*/}\r\n {/* }}*/}\r\n {/* step={1}*/}\r\n {/* value={this.state.playerValue}*/}\r\n {/* showValue={true}*/}\r\n {/* onChange={(value) => this.changeCurrentTime(value)}*/}\r\n {/* />*/}\r\n\r\n {/* {this.rendEmote()}*/}\r\n {/* */}\r\n\r\n {/*}*/}\r\n\r\n {/*THIS COMMENTED PART IS USED FOR THE CUSTOM MADE SLIDER WHICH AT THE MOMENT IS REPLACED WITH THE OLD SLIDER*/}\r\n\r\n\r\n\r\n {/*THIS IS THE ORIGINAL PLAYER SLIDER*/}\r\n\r\n {/* {*/}\r\n {/* var h = Math.floor(value / 3600);*/}\r\n {/* var m = Math.floor((value % 3600) / 60);*/}\r\n {/* var s = (value % 3600) % 60;*/}\r\n {/* return h + \":\" + (m < 10 ? \"0\" + m : m) + \":\" + (s < 10 ? \"0\" + s : s);*/}\r\n {/* }}*/}\r\n {/* step={1}*/}\r\n {/* value={this.state.playerValue}*/}\r\n {/* showValue={true}*/}\r\n {/* onChange={(value) => this.changeCurrentTime(value)}*/}\r\n {/*/>*/}\r\n {(wavedata !== null && wavedata !== \"\") && (wavedata.rmsAudioSegments !== null && wavedata.rmsAudioSegments !== \"\")\r\n ? \r\n {\r\n { var h = Math.floor(value / 3600); }\r\n { var m = Math.floor((value % 3600) / 60); }\r\n { var s = (value % 3600) % 60; }\r\n { return h + \":\" + (m < 10 ? \"0\" + m : m) + \":\" + (s < 10 ? \"0\" + s : s); }\r\n\r\n }}\r\n duration={this.getDurationInSeconds()}\r\n step={this.props.data.waveFormAnalysis.stepCountAudioSegments}\r\n onChange={(value) => this.changeCurrentTime(value)}\r\n isPlaying={this.state.isPlaying}\r\n keywords={(this.props.data.summarizedInsights != null && this.props.data.summarizedInsights.keywords != null) ? this.props.data.summarizedInsights.keywords : []}\r\n stageHeight={100}\r\n sliderHeight={37}\r\n policiesData={this.state.policyDate}\r\n />\r\n \r\n\r\n : \r\n {\r\n { var h = Math.floor(value / 3600); }\r\n { var m = Math.floor((value % 3600) / 60); }\r\n { var s = (value % 3600) % 60; }\r\n { return h + \":\" + (m < 10 ? \"0\" + m : m) + \":\" + (s < 10 ? \"0\" + s : s); }\r\n\r\n }}\r\n duration={this.getDurationInSeconds()}\r\n step={\"\"}\r\n onChange={(value) => this.changeCurrentTime(value)}\r\n isPlaying={this.state.isPlaying}\r\n keywords={\"\"}\r\n stageHeight={50}\r\n sliderHeight={0}\r\n policiesData={\"\"}\r\n />\r\n {this.rendEmote()}\r\n\r\n \r\n }\r\n\r\n\r\n \r\n\r\n
\r\n );\r\n }\r\n }\r\n\r\n\r\n videoStream2 = () => {\r\n // Check videos from participants\r\n let videoFrame2User = -1;\r\n let videoFrame3User = -1;\r\n if (this.props.data.linkedUser != null && this.props.data.linkedUser.length > 0) {\r\n this.props.data.linkedUser.map(({ userId, name, detail, photo, type, videoAsset, audioAsset, screenAsset }, i) => {\r\n if ((videoAsset != null && videoAsset !== \"\") || (screenAsset != null && screenAsset !== \"\")) {\r\n if (videoFrame2User === -1) {\r\n videoFrame2User = i;\r\n } else if (videoFrame3User === -1) {\r\n videoFrame3User = i;\r\n }\r\n }\r\n });\r\n }\r\n if (this.props.data.participantStreams && videoFrame2User !== -1) {\r\n var owner2 = this.props.data.linkedUser[videoFrame2User];\r\n const videoAsset = owner2.videoAsset;\r\n const screenAsset = owner2.screenAsset ? owner2.screenAsset.split(\";\").filter(asset => asset.trim() !== \"\")[0] : null;\r\n const streamingUrl = videoAsset || screenAsset;\r\n\r\n return (\r\n */}\r\n {/* {*/}\r\n {/* { var h = Math.floor(value / 3600); }*/}\r\n {/* { var m = Math.floor((value % 3600) / 60); }*/}\r\n {/* { var s = (value % 3600) % 60; }*/}\r\n {/* { return h + \":\" + (m < 10 ? \"0\" + m : m) + \":\" + (s < 10 ? \"0\" + s : s); }*/}\r\n\r\n {/* }}*/}\r\n {/* duration={this.getDurationInSeconds()}*/}\r\n {/* step={this.props.data.waveFormAnalysis.stepCountAudioSegments}*/}\r\n {/* onChange={(value) => this.changeCurrentTime(value)}*/}\r\n {/* isPlaying={this.state.isPlaying}*/}\r\n {/* />*/}\r\n {/*
*/}\r\n\r\n {/* \r\n \r\n {this.state.showDropdown && (\r\n
\r\n )}\r\n \r\n {playbackRates.map((rate) => (\r\n this.handlePlaybackRateChange(rate)}\r\n style={{\r\n backgroundColor: this.props.theme.palette.white,\r\n color: this.props.theme.palette.neutralPrimary\r\n }}\r\n >\r\n {rate}x\r\n
\r\n ))}\r\n \r\n \r\n\r\n \r\n (\r\n\r\n this.getParticipant(i, userId, name, detail, photo, type, videoAsset, audioAsset, 2, screenAsset)\r\n\r\n ))}\r\n id=\"stream2\"\r\n theme={this.props.theme}\r\n defaultPlayer={this.getParticipant(0, owner2.userId, owner2.name, owner2.detail, owner2.photo, owner2.type, owner2.videoAsset, owner2.audioAsset, 2, owner2.screenAsset)[0]} />\r\n\r\n \r\n\r\n\r\n \r\n
);\r\n } else {\r\n return;\r\n }\r\n }\r\n\r\n getParticipant = (i, userId, name, detail, photo, type, videoAsset, audioAsset, cnt, screenAsset) => {\r\n const personas = [];\r\n\r\n if (videoAsset != null) {\r\n if (cnt === 2) {\r\n personas.push(\r\n \r\n \r\n\r\n \r\n (\r\n this.getParticipant(i, userId, name, detail, photo, type, videoAsset, audioAsset, 3, screenAsset)\r\n ))}\r\n defaultPlayer={this.getParticipant(0, owner3.userId, owner3.name, owner3.detail, owner3.photo, owner3.type, owner3.videoAsset, owner3.audioAsset, 3, owner3.screenAsset)[0]}\r\n />\r\n\r\n \r\n \r\n
);\r\n } else {\r\n return;\r\n }\r\n }\r\n\r\n\r\n videoStreamAudio = () => {\r\n let streamUrl = \"\";\r\n if (this.props.data.mediaAssets != null && this.props.data.mediaAssets !== \"\") {\r\n streamUrl = this.props.data.mediaAssets;\r\n } else if (this.props.data.mediaAssetVideo != null && this.props.data.mediaAssetVideo !== \"\") {\r\n streamUrl = this.props.data.mediaAssetVideo;\r\n } else if (this.props.data.linkedUser != null && this.props.data.linkedUser.length > 0) {\r\n this.props.data.linkedUser.forEach(({ videoAsset, screenAsset }) => {\r\n if (videoAsset != null && videoAsset !== \"\") {\r\n streamUrl = videoAsset;\r\n } else if (screenAsset != null && screenAsset !== \"\") {\r\n const screenAssets = screenAsset.split(\";\").filter(asset => asset.trim() !== \"\");\r\n if (screenAssets.length > 0) {\r\n streamUrl = screenAssets[0];\r\n }\r\n }\r\n });\r\n }\r\n return (\r\n \r\n\r\n
\r\n );\r\n }\r\n rendPivot = () => {\r\n if (this.props.loading != null) {\r\n return \r\n } else {\r\n return \r\n\r\n { this.setState({ open: \"pivot\" }) }}\r\n close={() => { this.setState({ open: \"\" }) }}\r\n />\r\n
\r\n }\r\n\r\n }\r\n\r\n renderAIAssistant = () => {\r\n if (this.props.loading != null) {\r\n return \r\n } else {\r\n return \r\n\r\n \r\n {this.showEmotion()}\r\n \r\n\r\n
\r\n )\r\n }\r\n \r\n {this.props.data.topic} \r\n
\r\n\r\n \r\n { this.sendKeepOrDelete(\"Keep\", \"Conversation Kept\") }} />\r\n
\r\n \r\n }\r\n \r\n )\r\n }\r\n \r\n
\r\n\r\n )\r\n\r\n}\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n//HOMEMADE SLIDER IN CASE IS NEEDED\r\n{/*{(wavedata !== null || wavedata !== \"\") && (audioSegments !== null && audioSegments !== \"\")*/ }\r\n{/* ? \r\n \r\n\r\n \r\n {defaultPlayer}\r\n \r\n\r\n
\r\n\r\n - \r\n {mappedDropdownOptions} \r\n
*/ }\r\n{/* {*/ }\r\n{/* { var h = Math.floor(value / 3600); }*/ }\r\n{/* { var m = Math.floor((value % 3600) / 60); }*/ }\r\n{/* { var s = (value % 3600) % 60; }*/ }\r\n{/* { return h + \":\" + (m < 10 ? \"0\" + m : m) + \":\" + (s < 10 ? \"0\" + s : s); }*/ }\r\n\r\n{/* }}*/ }\r\n{/* duration={this.getDurationInSeconds()}*/ }\r\n{/* step={this.props.data.waveFormAnalysis.stepCountAudioSegments}*/ }\r\n{/* onChange={(value) => this.changeCurrentTime(value)}*/ }\r\n{/* isPlaying={this.state.isPlaying}*/ }\r\n{/* />*/ }\r\n{/*
*/ }\r\n\r\n{/* \r\n {callSafe(this.props)}\r\n
}\r\n \r\n {data.getReplayAsset.length > 1 && data.getReplayAsset[1] != \"\" &&
\r\n )\r\n }}\r\n \r\n );\r\n\r\n }\r\n\r\n }\r\n\r\n getThumbnail = () => {\r\n if (this.props.item.thumbnail != null) {\r\n return { \"backgroundImage\": \"url(\" + this.props.item.thumbnail + \")\" }\r\n }\r\n };\r\n\r\n showArchivedCallOrPlayButton = () => {\r\n if (this.props.item.hasRestoreStarted) {\r\n return \r\n
\r\n }\r\n {data.getReplayAsset[0] != \"\" && \r\n
}\r\n \r\n
\r\n }\r\n }\r\n return;\r\n\r\n }\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n};\r\n\r\n\r\n// Shorten GridItem Title\r\n// usage: shortTitle(tileVar, maxLengh)\r\nlet shortTitle = (title, max = 18) => {\r\n\r\n const titleLength = title.length;\r\n const maxLength = max;\r\n // Replace _ or [\r\n var title_new = title.replace('_', \" \");\r\n title_new = title_new.replace(\"[\", \" \");\r\n title_new = title_new.replace(\"]\", \" \");\r\n if (titleLength > maxLength && maxLength > 20) {\r\n return title_new.slice(0, maxLength) + '...';\r\n } else if (titleLength > maxLength) {\r\n return title_new.slice(0, maxLength) + '..';\r\n } else {\r\n return title_new;\r\n }\r\n}\r\n\r\nlet callTypeIcon = (props) => {\r\n if (props.item.isVideo) {\r\n return (\r\n \r\n
\r\n \r\n
\r\n {this.getViewDocumentCard()}\r\n \r\n {this.showArchivedCallOrPlayButton()}\r\n
\r\n {this.props.timeS} (+{getLength(this.props) }min)
\r\n*\r\n*\r\n*\r\n*\r\n* */\r\n","import React, {Component} from 'react';\r\nimport './GridRow.scss'\r\nimport GridItem from '../GridElement/GridElement'\r\nexport default class gridRow extends Component {\r\n\r\n render() {\r\n let list = [];\r\n return (\r\n\r\n\r\n {\r\n this.props.rowContent.map((item, i) => {\r\n if (item.scenarioId != null && item.scenarioId !== \"\"){ // skip for empty Scenario, e.g. Chat messages\r\n let unique_id = item.scenarioId + item.userId;\r\n if (list.includes(unique_id)){\r\n item.isDuplicate = true;\r\n } else {\r\n list.push(unique_id);\r\n }\r\n }\r\n return (
\r\n\r\n );\r\n };\r\n}\r\n","var _desc, _defs, _g;\n\nvar _excluded = [\"title\", \"titleId\"];\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nfunction SvgAscLogo(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: \"106px\",\n height: \"59px\",\n viewBox: \"0 0 106 59\",\n xmlns: \"http://www.w3.org/2000/svg\",\n xmlnsXlink: \"http://www.w3.org/1999/xlink\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title === undefined ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, \"ASC-Logo\") : title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _desc || (_desc = /*#__PURE__*/React.createElement(\"desc\", null, \"Created with Sketch.\")), _defs || (_defs = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"polygon\", {\n id: \"path-1\",\n points: \"0 0.1779 55.2778 0.1779 55.2778 22 0 22\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n id: \"path-3\",\n points: \"0.269805082 0.556 16.7407 0.556 16.7407 50.7487 0.269805082 50.7487\"\n }))), _g || (_g = /*#__PURE__*/React.createElement(\"g\", {\n id: \"Wireframes\",\n stroke: \"none\",\n strokeWidth: 1,\n fill: \"none\",\n fillRule: \"evenodd\"\n }, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Common-UI-Setup---Desktop-HD\",\n transform: \"translate(-39.000000, -29.000000)\"\n }, /*#__PURE__*/React.createElement(\"g\", {\n id: \"ASC-Logo\",\n transform: \"translate(39.000000, 28.000000)\"\n }, /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-15\"\n }, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M46.7671,32.0284 L44.2851,32.0284 L45.3141,27.8404 C45.9561,25.5284 46.4401,23.6264 46.7671,22.1374 C46.8151,21.8714 46.8761,21.6164 46.9241,21.3744 L48.2441,27.6334 L49.2371,32.0284 L46.7671,32.0284 Z M52.7961,15.9644 L52.5181,15.7694 L46.7671,15.8304 L42.3721,15.8904 L42.1181,16.0844 L33.4021,44.7644 L33.5951,45.0424 L40.9681,45.0424 L41.2341,44.8854 L42.7961,37.9484 L46.7671,37.9484 L50.6171,37.9484 L52.1181,44.9584 L52.3971,45.1634 C53.7891,45.0794 55.1571,45.0424 56.5251,45.0424 L60.6411,45.0424 L60.9191,44.7164 L52.7961,15.9644 Z\",\n id: \"Fill-1\",\n fill: \"#00305D\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M62.3604,37.2471 C62.3604,39.4011 62.2634,41.6181 62.0824,43.9051 L62.3964,44.3041 C62.7234,44.3781 63.1114,44.4991 63.5344,44.6431 C63.9944,44.8021 64.5274,44.9701 65.1204,45.1281 C65.7504,45.2611 66.4764,45.3701 67.2874,45.4541 C68.0744,45.6011 68.9704,45.6731 69.9754,45.6731 C72.0944,45.6731 74.1034,45.3821 76.0044,44.8021 C77.8684,44.1961 79.4064,43.0201 80.6164,41.2901 C80.8714,40.9871 81.2104,40.3451 81.6214,39.3661 C82.0094,38.4091 82.2274,37.2471 82.2514,35.8541 C82.2754,35.0671 82.1664,34.1241 81.9004,33.0091 C81.6094,31.9441 80.9554,30.9021 79.9514,29.9221 C79.0914,29.0861 78.2444,28.4811 77.4574,28.0941 C76.6704,27.6941 76.0644,27.4281 75.6654,27.3071 L73.4494,26.3621 C72.9774,26.1691 72.4084,25.8661 71.8034,25.4551 C71.5254,25.2611 71.2824,25.0071 71.0774,24.6681 C70.8594,24.3651 70.7504,24.0391 70.7504,23.6751 C70.7864,22.8761 71.0774,22.2471 71.6464,21.7741 C71.7794,21.6411 72.0094,21.5081 72.3724,21.3751 C72.7114,21.2291 73.2444,21.1571 73.9584,21.1571 C75.3744,21.1571 76.8154,21.5681 78.2924,22.4041 C78.9344,22.7791 79.5154,23.2151 80.0604,23.6871 L80.4114,23.5181 L80.7984,17.1011 L80.6164,16.8351 C80.0114,16.5081 79.0914,16.1691 77.8564,15.8061 C76.6094,15.4421 74.9394,15.2491 72.8324,15.2251 C69.2734,15.2001 66.5614,16.0481 64.6844,17.7791 C64.2004,18.2751 63.7894,18.7841 63.4624,19.3171 C63.1114,19.8371 62.8324,20.3941 62.6384,20.9631 C62.2634,22.1251 62.0824,23.2881 62.0824,24.4381 C62.0824,25.8541 62.2994,27.0281 62.7234,27.9611 C63.1714,28.9291 63.7164,29.7401 64.3824,30.3941 C65.0724,31.0361 65.8104,31.5681 66.6214,32.0171 C67.3604,32.4521 68.0864,32.8271 68.8014,33.1541 L70.8714,33.9771 C71.5374,34.2201 72.1784,34.5461 72.8084,34.9701 C73.4374,35.4191 73.7644,36.0351 73.8014,36.8351 C73.8254,37.2221 73.6194,37.7431 73.1714,38.4091 C72.9054,38.7121 72.5054,38.9771 71.9854,39.1961 C71.4044,39.4501 70.6414,39.5831 69.7094,39.5831 C68.7764,39.5831 67.7474,39.4251 66.6214,39.1101 C65.5204,38.8451 64.5274,38.4211 63.6314,37.8391 C63.3164,37.6101 63.0144,37.3801 62.7234,37.1381 L62.3604,37.2471 Z\",\n id: \"Fill-3\",\n fill: \"#00305D\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M105.3379,44.1709 L105.6289,37.1979 L105.2899,37.0399 C105.1079,37.1499 104.8779,37.3079 104.5869,37.5249 C104.2609,37.7309 103.8729,37.9369 103.4129,38.1549 C102.5659,38.6259 101.4159,38.8679 99.9749,38.8919 C99.1759,38.8919 98.3649,38.7589 97.5289,38.4819 C96.6819,38.2039 95.8949,37.7679 95.1569,37.1609 C94.4419,36.5319 93.8489,35.6609 93.4009,34.5589 C92.9169,33.4819 92.6749,32.1259 92.6749,30.4799 C92.6749,28.8439 92.9049,27.4769 93.3529,26.3759 C93.7639,25.3209 94.3089,24.4629 94.9989,23.8199 C95.6889,23.1539 96.4399,22.6939 97.2509,22.4279 C98.0499,22.1629 98.8249,22.0409 99.6119,22.0409 C100.3259,22.0409 100.9679,22.1129 101.5239,22.2579 C102.0929,22.4039 102.5779,22.5729 102.9769,22.7789 C103.7759,23.2279 104.3569,23.6639 104.7329,24.0739 L105.0229,23.9049 C105.0719,21.5569 105.2049,19.2929 105.3859,17.1019 L105.2169,16.7979 C104.4539,16.4469 103.4859,16.1089 102.3479,15.7699 C101.1979,15.4799 99.7569,15.3099 98.0139,15.2609 C93.7159,15.2609 90.2529,16.5809 87.6629,19.1949 C85.0109,21.8479 83.6679,25.7339 83.6309,30.8549 C83.5949,32.7429 83.9219,34.7759 84.5879,36.9559 C85.2899,39.1239 86.5609,41.0479 88.4259,42.7179 C89.4179,43.5539 90.7009,44.2569 92.2869,44.8019 C93.8369,45.3579 95.7979,45.6499 98.1709,45.6729 C99.6119,45.6499 100.8709,45.5029 101.9719,45.2489 C102.5289,45.1399 103.0619,45.0069 103.5699,44.8489 C104.1029,44.7279 104.6239,44.5949 105.1319,44.4129 L105.3379,44.1709 Z\",\n id: \"Fill-5\",\n fill: \"#00305D\"\n }), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-9\",\n transform: \"translate(0.000000, 37.444100)\"\n }, /*#__PURE__*/React.createElement(\"mask\", {\n id: \"mask-2\",\n fill: \"white\"\n }, /*#__PURE__*/React.createElement(\"use\", {\n xlinkHref: \"#path-1\"\n })), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Clip-8\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M55.2778,17.1389 C54.9148,17.3319 54.5518,17.5259 54.1878,17.6959 C34.2368,27.1039 10.8108,21.0119 -0.0002,0.1779 L7.5298,0.1779 C17.1428,16.3169 37.8568,23.3009 55.2778,17.1389\",\n id: \"Fill-7\",\n fill: \"#00305D\",\n mask: \"url(#mask-2)\"\n })), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M13.5835,15.6968 C10.9445,34.0018 22.9175,51.2408 41.1745,55.9988 C40.7745,55.9638 40.3625,55.9268 39.9635,55.8778 C19.1045,53.3718 4.5885,35.3698 6.7315,15.7698 C6.7315,15.7698 6.7675,15.7448 6.8405,15.6968 L13.5835,15.6968 Z\",\n id: \"Fill-10\",\n fill: \"#A41223\"\n }), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Group-14\",\n transform: \"translate(17.000000, 0.444100)\"\n }, /*#__PURE__*/React.createElement(\"mask\", {\n id: \"mask-4\",\n fill: \"white\"\n }, /*#__PURE__*/React.createElement(\"use\", {\n xlinkHref: \"#path-3\"\n })), /*#__PURE__*/React.createElement(\"g\", {\n id: \"Clip-13\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M16.7407,0.5677 C16.6197,0.6887 15.5177,1.6577 15.3967,1.7907 C2.0797,16.1727 2.0917,37.1297 14.6097,50.7487 C14.2947,50.5197 13.9927,50.2777 13.6897,50.0237 C-1.7333,37.5047 -4.1303,16.1007 7.8907,0.5557 L16.7407,0.5677 Z\",\n id: \"Fill-12\",\n fill: \"#00305D\",\n mask: \"url(#mask-4)\"\n }))))))));\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgAscLogo);\nexport default __webpack_public_path__ + \"static/media/asc-logo.f94c0aa6.svg\";\nexport { ForwardRef as ReactComponent };","export default __webpack_public_path__ + \"static/media/ASC_Logo_Cloud-Solutions_700pxBreit.eb016ca7.jpg\";","export default __webpack_public_path__ + \"static/media/Mastercard-logo.3a55b547.svg\";","export default __webpack_public_path__ + \"static/media/Visa_logo.413182c7.svg\";","import React, { Component } from 'react';\r\nimport { ASCHeader } from \"../ASCHeader/ASCHeader\";\r\nimport ASCFooter from \"../ASCFooter/ASCFooter\";\r\nimport { Text } from 'office-ui-fabric-react';\r\n\r\nimport {\r\n // Checkbox,\r\n // DefaultButton,\r\n // PrimaryButton,\r\n Stack\r\n} from \"office-ui-fabric-react\";\r\nimport { MyContext } from '../../context';\r\n\r\n\r\n// Styles definition\r\nconst stackContainerStyles: IStackStyles = {\r\n root: {\r\n paddingTop: 50\r\n }\r\n};\r\n\r\n\r\nconst stackStyles: IStackStyles = {\r\n root: {\r\n maxWidth: 660,\r\n marginBottom: 50\r\n }\r\n};\r\n\r\n// Tokens definition\r\nconst stackTokens: IStackTokens = { childrenGap: 5 };\r\n\r\n\r\nexport default class Privacy extends Component {\r\n\r\n render() {\r\n return (\r\n \r\n 63768 Hösbach - Germany
\r\n {context.getTranslation(\"impressum\", \"phone\")}: +49 6021 5001 - 0
\r\n {context.getTranslation(\"impressum\", \"fax\")}: +49 6021 5001 - 310
\r\n {context.getTranslation(\"impressum\", \"email\")}: hq@asctechnologies.com
\r\n
\r\n {context.getTranslation(\"impressum\", \"executiveBoard\")}: Günter Müller, Marco Müller, Dr. Gerald Kromer
\r\n {context.getTranslation(\"impressum\", \"chairman\")}: Gisela Müller
\r\n
\r\n {context.getTranslation(\"impressum\", \"registrationNumber\")}: DE 812494216
\r\n {context.getTranslation(\"impressum\", \"courtOfJurisdiction\")}: Aschaffenburg HRB 6980
\r\n
\r\n {' '}\r\n Welcome @ ASC Recording Insights.\r\n {'\\n'}\r\n {' '}\r\n Please choose your country.\r\n
\r\n \r\n )}\r\n modalProps={{\r\n isBlocking: true,\r\n styles: { main: { maxWidth: 650 } },\r\n dragOptions: false,\r\n }}\r\n >\r\n\r\n- \r\n
- Contact \r\n
- Legal Statements \r\n {/*
- Privacy Policy */}\r\n
- Terms of Use \r\n
- Data Privacy \r\n
- {this.renderRegion()} \r\n
![](\"https://pci.usd.de/compliance/8090-068F-77D4-40D0-A5F4-8BE4/seal_80.png\")
\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n Packages\r\n \r\n \r\n \r\n {' '}\r\n {/* End of Row */}\r\n\r\n\r\n \r\n\r\n {this.complience()}\r\n {this.complieceAnalytics()}\r\n\r\n\r\n \r\n {' '}\r\n {/* End of Row */}\r\n\r\n\r\n \r\n\r\n {this.smartRecording()}\r\n\r\n {this.smartRecordingAnalytics()}\r\n\r\n \r\n {' '}\r\n {/* End of Row */}\r\n\r\n\r\n {/* Addon Section */}\r\n\r\n \r\n\r\n \r\n \r\n Storage Packages\r\n \r\n \r\n\r\n \r\n {' '}\r\n {/* End of Row */}\r\n\r\n \r\n\r\n \r\n \r\n Storage 500 GB – GRS (Region 1)\r\n \r\n \r\n \r\n {this.props.data.getShopData.storage[1].price.toFixed(2)}\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n Storage 500 GB – GRS (Region 2)\r\n \r\n \r\n \r\n {this.props.data.getShopData.storage[2].price.toFixed(2)}\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n Storage 500 GB - LRS\r\n \r\n \r\n \r\n {this.props.data.getShopData.storage[0].price.toFixed(2)}\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n {' '}\r\n\r\n {/* End of Row */}\r\n \r\n\r\n \r\n \r\n Analytics Packages*\r\n \r\n \r\n\r\n \r\n {' '}\r\n {/* End of Row */}\r\n\r\n \r\n\r\n \r\n \r\n Speech Analytics - 100h\r\n \r\n \r\n \r\n {this.props.data.getShopData.cognitive[0].price.toFixed(2)}\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n Video Indexer - 100h\r\n \r\n \r\n \r\n {this.props.data.getShopData.cognitive[1].price.toFixed(2)}\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n Translate - 100h\r\n \r\n \r\n \r\n {\r\n this.props.data.getShopData.cognitive[2].price.toFixed(2)\r\n }\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n \r\n Additional Packages\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n \r\n Recording Export 500 GB\r\n \r\n \r\n \r\n {\r\n this.props.data.getShopData.storage[2].price.toFixed(2)\r\n }\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n Training Package\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n \r\n Onboarding & Administration Training\r\n \r\n \r\n \r\n {\r\n this.props.data.getShopData.training.price.toFixed(2)\r\n }\r\n {' '}\r\n {this.props.currency}\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n \r\n {' '}\r\n\r\n {/* End of Row */}\r\n\r\n \r\n \r\n\r\n \r\n If you need help, please\r\n \r\n \r\n\r\n\r\n \r\n {\r\n this.props.caller({view:3});\r\n this.props.closeFunction();\r\n //window.open(`${window.origin}/contact`, '_blank');\r\n }}\r\n text=\"Contact Us\"\r\n className=\"buyButton\"\r\n />\r\n \r\n\r\n\r\n \r\n\r\n\r\n
\r\n );\r\n }\r\n\r\n smartRecordingAnalytics() {\r\n return (\r\n \r\n ASC`s Recording Insights for Microsoft Teams includes a variety of options that allow your\r\n organization to choose the right packages based on your specific needs. The packages are\r\n calculated on named user basis and include 5GB cloud storage each. It is necessary to add\r\n additional components for storage and, if required, for the use of Cognitive Services to complete\r\n the package. For more information on the available packages and prices, please see the\r\n following overview. Please note it is not possible to combine “Compliance and Smart” packages.\r\n
\r\n\r\n ASC`s Recording Insights for Microsoft Teams is a cloud-based solution and includes 5GB of\r\n storage per named user subscription. Additional storage needed for saving your data can be\r\n bought in 3 different packages explained below. All your data will be stored securely and reliable\r\n in Microsoft`s Azure Cloud. The storage options include 500GB per tenant and will be charged\r\n per month, if more than 500GB are required, please subscribe to the package in appropriate\r\n numbers.\r\n
\r\n\r\n This storage option includes the storage of up to 500GB in a Microsoft Azure block object Storage with geo redundancy in the chosen Microsoft Azure Region. Currently available options in Region 1 are Europe North, USA West and USA East. Other regions are available on request.\r\n
\r\n\r\n This storage option includes the storage of up to 500GB in a Microsoft Azure block object Storage with geo redundancy in the chosen Microsoft Azure Region. Currently available option in region 2 is Asia East. Other regions are available on request.\r\n
\r\n\r\n GRS storage is only available for Compliance Recording packages (Compliance Recording and Compliance\r\n Recording & Analytics)\r\n
\r\n\r\n This storage option includes the storage of up to 500GB in a Microsoft Azure block object Storage with local redundancy in the chosen Microsoft Azure Region. Currently available regions are Europe North, Asia East, USA West and USA East. Other regions are available on request.\r\n
\r\n\r\n *only needed if Analytics licenses were subscribed\r\n
\r\n\r\n After choosing one of our analytics packages (Smart Recording & Analytics or Compliance\r\n Recording & Analytics) you can integrate Microsoft Cognitive Services into ASC`s Recording\r\n Insights to analyze all communication across all Microsoft Teams channels. The Cognitive\r\n Services will be charged per tenant.\r\n
\r\n\r\n This package enables you to make use of the Cognitive Services, Speech to Text\r\n and Text Analytics. the analysis quota can be used within the tenant for\r\n which it has been activated. If more than 100h of analysis are required,\r\n please subscribe to the package in appropriate numbers. Please note that\r\n unused analysis capacities will not be transferred to the next accounting period.\r\n
\r\n\r\n The Video Indexer package contains the ability to do an analysis based on\r\n Microsoft Cognitive Services with Video Indexer for audio and video information\r\n within a month period; the analysis quota can be used within the tenant for\r\n which it has been activated. If more than 100 hours of analysis are required,\r\n please subscribe to the package in appropriate numbers. Please note that unused\r\n analysis capacities will not be transferred to the next accounting period.\r\n
\r\n\r\n The Translate package contains the ability to perform translation of transcribed information based\r\n on the Microsoft Translate service within a month period; the analysis quota can be used within\r\n the tenant for which it has been activated. If more than 100 hours of translations are required,\r\n please subscribe to the package in appropriate numbers. Please note that unused translation\r\n capacities will not be transferred to the next accounting period. Please also note that transcription\r\n via Speech Analytics package or Video Indexer package is required.\r\n
\r\n\r\n This package contains the ability to export/download an amount of 500 GB of recording data from ASC Recording Insights for archiving to an 3rd party system or simple retrieval purposes. If more than 500 GB are required, please subscribe to the package in appropriate numbers. Please note that unused export/download capacities will not be transferred to the next accounting period.\r\n {' '}\r\n
\r\n\r\n This package contains a 2h web-based training for onboarding and a 2h web-based training for\r\n user administration & configuration. The Onboarding & Administration Training package is\r\n mandatory for all first orders of ASC Recording Insights.\r\n {' '}\r\n
\r\n\r\n This package offers you the same features as Smart Recording, but with the possibility to add Microsoft Cognitive Services for analytics to gain deeper insights. It is featured with configurable analytics rule per user and specific analytics centric dashboards and reports.\r\n
\r\n- \r\n
- Recording \r\n
- Recording on demand \r\n
- Retention time \r\n
- Individual user rights & access management \r\n
- Search & replay \r\n
- Encryption with Microsoft Key Management \r\n
- Dashboards \r\n
- Reports \r\n
- Analytics reports \r\n
with cognitive services as add on
\r\n- \r\n
- Visualized transcript \r\n
- Highlight keywords \r\n
- Categorization on basis of keywords \r\n
- Speech translation \r\n
- Displaying sentiment \r\n
- Key phrase extraction \r\n
- Named entity recognition \r\n
\r\n The Smart Recording package offers you a solid basis for recording of conversations within\r\n Microsoft Teams. It features recording, conversation replay and more.\r\n
\r\n- \r\n
- Recording \r\n
- Recording on demand \r\n
- Retention time \r\n
- Individual user rights & access management \r\n
- Search & replay \r\n
- Encryption with Microsoft Key Management \r\n
- Dashboards \r\n
- Reports \r\n
\r\n The Compliance Recording package offers you an enhanced feature set that is especially\r\n designed for companies with regulated users. In addition to that, recording within the Compliance\r\n Recording package is especially secured with redundant recording capabilities and the option to\r\n use geo-redundant storage. It features parallel recording, role-dependent replay, audit logs,\r\n reporting, and much more.\r\n
\r\n- \r\n
- Parallel recording \r\n
- Recording on demand \r\n
- Retention time \r\n
- Individual user rights & access management \r\n
- Search & replay \r\n
- Replay authorization \r\n
- Conversation safe \r\n
- Encryption with Microsoft Key Management \r\n
- Audit logs \r\n
- Dashboards \r\n
- Reports \r\n
- Additional KPI‘s \r\n
- Geo-redundant storage \r\n
\r\n This package offers you the same features as Compliance Recording, but with the possibility to\r\n add Microsoft Cognitive Services for analytics to gain deeper insights. It is featured with\r\n configurable analytics rule per user and specific analytics centric dashboards and reports.\r\n {' '}\r\n
\r\n- \r\n
- Parallel recording \r\n
- Recording on demand \r\n
- Retention time \r\n
- Individual user rights & access management \r\n
- Search & replay \r\n
- Replay authorization \r\n
- Conversation safe \r\n
- Encryption with Microsoft Key Management \r\n
- Audit logs \r\n
- Dashboards \r\n
- Reports \r\n
- Analytics reports \r\n
- Additional KPI‘s \r\n
- Geo-redundant storage \r\n\r\n
with cognitive services as add on
\r\n- \r\n
- Visualized transcript \r\n
- Highlight keywords \r\n
- Categorization on basis of keywords \r\n
- Speech translation \r\n
- Displaying sentiment \r\n
- Key phrase extraction \r\n
- Named entity recognition \r\n
\r\n
\r\n );\r\n }\r\n\r\n return (\r\n \r\n 
\r\n
\r\n \r\n
\r\n\r\n {props.title}
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\n\r\nclass ASCHeaderBuyNow extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n panelOpen: false,\r\n };\r\n this.dismissPanel = this.dismissPanel.bind(this);\r\n this.openPanel = this.openPanel.bind(this);\r\n }\r\n\r\n dismissPanel = () => {\r\n this.setState({\r\n panelOpen: false,\r\n });\r\n }\r\n\r\n openPanel = () => {\r\n this.setState({\r\n panelOpen: true,\r\n });\r\n }\r\n\r\n render() {\r\n let currency = '';\r\n if (this.props.region !== undefined && this.props.region !== null) {\r\n switch (this.props.region.currency) {\r\n case 'EUR':\r\n currency = '€';\r\n break;\r\n case 'USD':\r\n currency = '$';\r\n break;\r\n case 'GBP':\r\n currency = '£';\r\n break;\r\n case 'YEN':\r\n currency = '¥';\r\n break;\r\n }\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n
\r\n {props.title}
\r\n \r\n {code}\r\n
\r\n \r\n
\r\n )}\r\n\r\n >\r\n {\r\n // TODO Replace fallback data with data from the backen product query\r\n }\r\n \r\n \r\n
\r\n \r\n\r\n
\r\n \r\n\r\n
\r\n\r\n \r\n\r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\n\r\nexport { ASCHeaderBuyNow, ASCHeader };\r\n","import React from 'react'\r\nimport { DefaultButton, PrimaryButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';\r\nimport { TextField } from 'office-ui-fabric-react/lib/TextField';\r\nimport { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';\r\nimport gql from \"graphql-tag\";\r\nimport \"./../ReportView/ReportConfiguration/ReportConfiguration.scss\"\r\nimport { MyContext } from '../../context';\r\n\r\nexport default class UploadMail extends React.Component {\r\n\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n isPanelOpen: false,\r\n isChanged: false,\r\n changedSubject: \"Interest in ASC Recording Insights\",\r\n changedRequest: \"Lead\",\r\n changedName: \"\",\r\n changedMailAddress: \"\",\r\n changedPhoneNumber: \"\",\r\n changedCompanyName: \"\",\r\n changedZipCode: \"\",\r\n changedCountry: \"\",\r\n changedNotes: \"\",\r\n changedCause: \"\",\r\n }\r\n }\r\n\r\n options: IDropdownOption[] = [\r\n\r\n { key: 'event', text: 'Fair/Event' },\r\n { key: 'social', text: 'Social Media' },\r\n { key: 'store', text: 'Microsoft Teams Store' },\r\n { key: 'asc', text: 'Contact person at ASC' },\r\n { key: 'partner', text: 'Partner/Microsoft' },\r\n { key: 'other', text: 'Other' },\r\n ];\r\n\r\n optionsRequest: IDropdownOption[] = [\r\n\r\n { key: 'Lead', text: 'Interest' },\r\n { key: 'Onboarding', text: 'Onboarding' }\r\n ];\r\n\r\n checkSave = () => {\r\n this.setState({\r\n isChanged: (\r\n this.state.changedSubject !== \"\"\r\n && this.state.changedRequest !== \"\"\r\n && this.state.changedName !== \"\"\r\n && this.state.changedMailAddress !== \"\"\r\n && this.state.changedPhoneNumber !== \"\"\r\n && this.state.changedCompanyName !== \"\"\r\n && this.state.changedZipCode !== \"\"\r\n && this.state.changedCountry !== \"\"\r\n )\r\n });\r\n }\r\n\r\n\r\n render() {\r\n return (\r\n \r\n {\r\n this.setState({\r\n changedRequest: item.key,\r\n changedSubject: item.key === \"Lead\" ? \"Interest in ASC Recording Insights\" : \"My Onboarding Information\"\r\n });\r\n }}\r\n label=\"Request Type\"\r\n options={this.optionsRequest}\r\n />\r\n {\r\n this.setState({\r\n changedSubject: newValue\r\n });\r\n this.checkSave();\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedName: newValue\r\n });\r\n this.checkSave();\r\n\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedMailAddress: newValue\r\n });\r\n if (/^\\w+([\\.-]?\\w+)*@\\w+([\\.-]?\\w+)*(\\.\\w{2,3})+$/.test(newValue)) {\r\n this.checkSave();\r\n } else {\r\n this.setState({ isChanged: false });\r\n }\r\n\r\n\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedPhoneNumber: newValue\r\n });\r\n this.checkSave();\r\n\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedCompanyName: newValue\r\n });\r\n this.checkSave();\r\n\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedZipCode: newValue\r\n });\r\n this.checkSave();\r\n\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedCountry: newValue\r\n });\r\n this.checkSave();\r\n\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedNotes: newValue\r\n });\r\n this.checkSave();\r\n\r\n }}\r\n />\r\n {\r\n this.setState({\r\n changedCause: item.key,\r\n });\r\n }}\r\n label={context.getTranslation(\"product\", \"howDidYouApplied\")}\r\n options={this.options}\r\n />\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n \r\n
\r\n \r\n\r\n\r\n {\r\n return (\r\n {\r\n return (\r\n {\r\n return (\r\n
\r\n );\r\n }\r\n }\r\n\r\n f=(props)=>\r\n {\r\n let windowsSize;\r\n if (this.state.showAll || (this.props.cntDays != null && this.props.cntDays < 3))\r\n {\r\n return props.dayContent;\r\n }\r\n else\r\n {\r\n if (this.state.width === undefined)\r\n windowsSize = window.innerWidth;\r\n else\r\n windowsSize = this.state.width;\r\n\r\n let bocCoutn = 10;\r\n if (windowsSize >= 0 && windowsSize <= 600) { bocCoutn = 4; }\r\n else if (windowsSize <= 844) { bocCoutn = 4; }\r\n else if (windowsSize <= 1120) { bocCoutn = 6; }\r\n else if (windowsSize <= 1396) { bocCoutn = 8; }\r\n else if (windowsSize <= 1672) { bocCoutn = 10; }\r\n else if (windowsSize <= 1948) { bocCoutn = 12; }\r\n else if (windowsSize <= 2224) { bocCoutn = 14; }\r\n else if (windowsSize <= 2500) { bocCoutn = 16; }\r\n else if (windowsSize <= 2776) { bocCoutn = 18; }\r\n else if (windowsSize <= 3052) { bocCoutn = 20; }\r\n else if (windowsSize <= 3328) { bocCoutn = 22; }\r\n else if (windowsSize <= 3604) { bocCoutn = 24; }\r\n else if (windowsSize <= 3880) { bocCoutn = 26; }\r\n else if (windowsSize <= 4156) { bocCoutn = 28; }\r\n else if (windowsSize <= 4432) { bocCoutn = 30; }\r\n const out = props.dayContent.slice(0, bocCoutn);\r\n return out;\r\n }\r\n };\r\n\r\n updateDimensions() {\r\n this.setState({ width: window.innerWidth });\r\n }\r\n UNSAFE_componentWillMount()\r\n {\r\n this.updateDimensions();\r\n }\r\n componentDidMount()\r\n {\r\n window.addEventListener(\"resize\", this.updateDimensions.bind(this));\r\n }\r\n componentWillUnmount()\r\n {\r\n window.removeEventListener(\"resize\", this.updateDimensions);\r\n }\r\n\r\n f1(props) {\r\n if (props.dayContent.length > this.state.bocCount && (this.props.cntDays == null || this.props.cntDays > 2)) {\r\n return ();\r\n }\r\n }\r\n\r\n moreClicked = () => {\r\n this.setState({ showAll: !this.state.showAll })\r\n }\r\n\r\n parseDate(date) {\r\n let tmp = date.split(\" \");\r\n if (tmp.length !== 3) {\r\n return date;\r\n }\r\n else {\r\n return tmp[0] + \"-\" + tmp[1].substring(0, 2) + \"-\" + tmp[2];\r\n }\r\n }\r\n}\r\n\r\n\r\n","\r\nimport { Checkbox, CommandBarButton, DefaultButton, FontSizes, IconButton, MessageBar, MessageBarType, Panel, PanelType, PrimaryButton, Separator, Stack } from 'office-ui-fabric-react'\r\nimport React, { Component } from 'react'\r\nimport { MyContext } from '../../context'\r\nimport { mutationSaveListViewSettings, queryGetLoggedUserData } from \"../../queries/querySettings\";\r\n\r\nexport default class SettingsColumnsRecording extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n let selected = this.props.settingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n let notSelected = this.props.allColumns.filter(col => !this.props.settingsColumns.includes(col.fieldName) && col !== undefined)\r\n this.state = {\r\n isPanelOpen: false,\r\n error: \"\",\r\n processing: false,\r\n settingsColumns: this.props.settingsColumns,\r\n selected,\r\n notSelected,\r\n };\r\n\r\n }\r\n\r\n\r\n getHeader = () => {\r\n return (\r\n \r\n
\r\n )\r\n }} />\r\n {this.props.dayTitle}
\r\n\r\n
\r\n )\r\n }} />\r\n {this.props.dayTitle}
\r\n {this.f1(this.props)}\r\n\r\n
\r\n )\r\n }} />\r\n \r\n {this.props.dayTitle}
\r\n {this.f1(this.props)}\r\n\r\n \r\n { this.setState({ error: \"\" }) }}\r\n >\r\n {this.state.error}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n\r\n\r\n save = () => {\r\n this.setState({ processing: true })\r\n let auth = this.props.auth;\r\n //save into db the settings\r\n let listViewSettings = this.state.settingsColumns\r\n this.props.apol\r\n .mutate({\r\n mutation: mutationSaveListViewSettings,\r\n refetchQueries: [{\r\n query: queryGetLoggedUserData,\r\n variables: { auth }\r\n }],\r\n variables: { listViewSettings }\r\n })\r\n .then((result) => {\r\n if (result.data.saveListViewSettings.status === \"ok\") {\r\n let resultColumns = this.state.settingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n this.props.updateColumnsSettings(resultColumns)\r\n this.setState({\r\n processing: false,\r\n isPanelOpen: false\r\n })\r\n } else {\r\n this.setState({\r\n processing: false,\r\n error: result.data.saveListViewSettings.text\r\n })\r\n }\r\n });\r\n }\r\n\r\n\r\n onChange = (name) => {\r\n let settingsColumns = []\r\n if (this.state.settingsColumns.includes(name)) {\r\n settingsColumns = this.state.settingsColumns.filter(c => c !== name)\r\n } else {\r\n settingsColumns = [...this.state.settingsColumns, name]\r\n }\r\n let selected = settingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n let notSelected = this.props.allColumns.filter(col => !settingsColumns.includes(col.fieldName) && col !== undefined)\r\n this.setState({\r\n settingsColumns,\r\n selected,\r\n notSelected\r\n })\r\n }\r\n\r\n up = (i) => {\r\n let newSettingsColumns = this.state.settingsColumns\r\n newSettingsColumns[i] = newSettingsColumns.splice(i - 1, 1, newSettingsColumns[i])[0];\r\n let selected = newSettingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n let notSelected = this.props.allColumns.filter(col => !newSettingsColumns.includes(col.fieldName) && col !== undefined)\r\n this.setState({\r\n settingsColumns: newSettingsColumns,\r\n selected,\r\n notSelected\r\n })\r\n }\r\n\r\n down = (i) => {\r\n let newSettingsColumns = this.state.settingsColumns\r\n newSettingsColumns[i] = newSettingsColumns.splice(i + 1, 1, newSettingsColumns[i])[0];\r\n let selected = newSettingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n let notSelected = this.props.allColumns.filter(col => !newSettingsColumns.includes(col.fieldName) && col !== undefined)\r\n this.setState({\r\n settingsColumns: newSettingsColumns,\r\n selected,\r\n notSelected\r\n })\r\n }\r\n\r\n\r\n render() {\r\n let lengthSelected = this.state.selected.length\r\n return (\r\n {this.context.getTranslation(\"settings\", \"settingsColumns\")}
\r\n {/*Alert*/}\r\n {this.state.error !== \"\" && \r\n {/*Wheel button for open settings panel*/}\r\n { this.setState({ isPanelOpen: true }) }} />\r\n {/*Settings panel*/}\r\n { this.setState({ isPanelOpen: false }) }}\r\n isFooterAtBottom={false}\r\n onRenderHeader={this.getHeader}\r\n type={PanelType.small}\r\n >\r\n
\r\n )\r\n }\r\n}","import * as React from 'react';\r\nimport { CommandBarButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { FontSizes } from 'office-ui-fabric-react/lib/';\r\nimport { MyContext } from '../../../../../context';\r\nimport zipcelx from 'zipcelx';\r\nimport { toast } from 'react-toastify';\r\nimport 'react-toastify/dist/ReactToastify.css';\r\nimport { getAllNameCustomFields} from '../../../../../queries/querySettings'\r\n\r\nconst config = \r\n [{\r\n value: \"Conversation ID\",\r\n type: 'string'\r\n }, {\r\n value: 'ConversationType',\r\n type: 'string'\r\n }, {\r\n value: \"Header\",\r\n type: 'string'\r\n }, {\r\n value: \"Date\",\r\n type: 'string'\r\n }, {\r\n value: \"Start\",\r\n type: 'string'\r\n }, {\r\n value: \"Duration\",\r\n type: 'string'\r\n }, {\r\n value: \"Participants\",\r\n type: 'string'\r\n }, {\r\n value: \"userLogin\",\r\n type: 'string'\r\n }, {\r\n value: \"userId\",\r\n type: 'string'\r\n }, {\r\n value: \"hasAudio\",\r\n type: 'string'\r\n }, {\r\n value: \"hasVideo\",\r\n type: 'string'\r\n }, {\r\n value: \"hasScreen\",\r\n type: 'string'\r\n }, {\r\n value: \"hasChat\",\r\n type: 'string'\r\n }, {\r\n value: \"hasFiles\",\r\n type: 'string'\r\n }\r\n , {\r\n value: \"note\",\r\n type: 'string'\r\n }, {\r\n value: \"toDo\",\r\n type: 'string'\r\n }, {\r\n value: \"scenarioId\",\r\n type: 'string'\r\n },{\r\n value: \"transferorName\",\r\n type: 'string'\r\n },\r\n {\r\n value: \"compliance\",\r\n type: 'string'\r\n }\r\n ]\r\n ;\r\n\r\nexport default class SearchExport extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {}\r\n }\r\n render = () => {\r\n const { hideDialog, isDraggable } = this.state;\r\n return (\r\n \r\n {this.state.selected.map((c, i) => {\r\n return (\r\n \r\n { this.setState({ isPanelOpen: false }) }} style={{ marginTop: \"30px\", marginLeft: \"15px\" }} disabled={this.state.processing} />\r\n \r\n
\r\n \r\n \r\n \r\n this.up(i)} disabled={i === 0} />\r\n this.down(i)} disabled={i === lengthSelected - 1} />\r\n \r\n
\r\n )\r\n })}\r\n {this.state.notSelected.length > 0 && \r\n { this.onChange(c.fieldName) }} disabled={c.fixed} />\r\n
\r\n \r\n { this.onChange(c.fieldName) }} disabled={c.fixed} />\r\n
\r\n )\r\n })}\r\n {/*FOOTER BUTTONS*/}\r\n \r\n
)}\r\n \r\n {this.props.hoverContent}\r\n
\r\n )\r\n }\r\n \r\n {this.props.children}\r\n
\r\n {e.name}
))}>\r\n {\r\n this.getGreatestRiskRating(resultRiskRatings)\r\n }\r\n
)\r\n } else {\r\n return NO;\r\n }\r\n }\r\n }\r\n columns.splice(10, 0, columnCompliance);\r\n }\r\n\r\n /* CUSTOM FIELDS COLUMNS */\r\n if (this.props.userRules.ruleAccess.hasCustomFieldsAccess) {\r\n this.props.apol\r\n .query({\r\n query: getAllNameCustomFields,\r\n variables: { auth: this.props.authorization }\r\n })\r\n .then(res => {\r\n let result = res.data.getAllCustomFieldDefinitions.map(cf => {\r\n if (this.props.userRules.ruleAccess.accesibleCustomFields.includes(cf.id) || this.props.userRules.ruleAccess.accesibleCustomFields.includes(cf.fieldName)) {\r\n return (\r\n {\r\n key: cf.id,\r\n name: cf.fieldName,\r\n fieldName: cf.id,\r\n minWidth: 70,\r\n maxWidth: 70,\r\n isResizable: true,\r\n data: 'string',\r\n onColumnClick: this._onColumnClick,\r\n onRender: (item: IDocument, index, column) => {\r\n let customFields = JSON.parse(item.data.customFields)\r\n if (customFields.customFields.length > 0) {\r\n let customField = customFields.customFields.filter(cf => {\r\n return cf.fieldId === column.fieldName\r\n })\r\n if (customField !== null && customField.length > 0) {\r\n return {customField[0].fieldValues.join(\",\")};\r\n } else {\r\n return ;\r\n }\r\n } else {\r\n return ;\r\n }\r\n },\r\n isPadded: true,\r\n customField: true\r\n }\r\n )\r\n }\r\n }).filter(cf => cf !== undefined)\r\n let resultColumns = [...columns, ...result]\r\n //remove from settingsColumns field what the user can't see anymore\r\n settingsColumns = settingsColumns.filter(sc => {\r\n return resultColumns.filter(rc => sc === rc.fieldName).length > 0\r\n })\r\n resultColumns = settingsColumns.map(c => {\r\n return resultColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n this.setState({\r\n columns: resultColumns,\r\n allColumns: [...columns, ...result],\r\n settingsColumns\r\n })\r\n })\r\n } else {\r\n let resultColumns = columns\r\n //remove from settingsColumns field what the user can't see anymore\r\n settingsColumns = settingsColumns.filter(sc => {\r\n return resultColumns.filter(rc => sc === rc.fieldName).length > 0\r\n })\r\n resultColumns = settingsColumns.map(c => {\r\n return resultColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n this.setState({\r\n columns: resultColumns,\r\n allColumns: columns,\r\n settingsColumns\r\n })\r\n }\r\n\r\n\r\n\r\n }\r\n\r\n getGreatestRiskRating = (risksArray) => {\r\n if (risksArray.includes(\"Warn\")) {\r\n return {context.getTranslation(\"conversationsPage\", \"undoDeltionMessage\")}
\r\n {item.conversationID} ?
{context.getTranslation(\"conversationsPage\", \"deletionConfirmationMessage\")}
)}{context.getTranslation(\"conversationsPage\", \"undoDeletionConfirmationMessage\")}
)}{(this.state.isBulkOperation ? this._selection.getSelectedCount() : this.props.count) + \" \" + context.getTranslation(\"common\", \"conversations\") + \" \" + this.props.inform}
\r\n \r\n {!this.state.isBulkOperation && defaultRender({\r\n ...props, onClick: (event) => {\r\n event.preventDefault(); this._onItemInvoked(props.item)\r\n }\r\n })\r\n }\r\n {this.state.isBulkOperation && defaultRender({\r\n ...props\r\n\r\n })\r\n }\r\n
\r\n )}\r\n onRenderDetailsFooter={this.onRenderDetailsFooter}\r\n styles={gridStyles}\r\n />\r\n }\r\n {(columns.length === 0 || settingsColumns.length === 0) && \r\n {isGrid && \r\n \r\n \r\n }\r\n {userRules.ruleAccess != null && !userRules.ruleAccess.userBulkExcel && \r\n }\r\n }\r\n\r\n {isGrid ? data.getFilterRecordings.days.map(\r\n ({ date, content }) => (\r\n
)}\r\n {data.getFilterRecordings.statistics.count + \" \" + context.getTranslation(\"common\", \"conversations\") + \" \" + data.getFilterRecordings.statistics.inform}
\r\n {bulkOperation && data.getFilterRecordings.statistics.count > 0 &&\r\n \r\n \r\n {!this.props.data.replayAllowed && \r\n { this.submit(\"StartStop\", \"Start\", \"\"); this.setState({ startButtonPressed: true, stopButtonPressed: false }); }}\r\n style={{ margin: \"15px\", padding: \"5px\" }}\r\n disabled={(this.props.data.keepDeleteAllowed && this.props.data.isWrapUpCall) ? true : this.state.startButtonPressed}\r\n />\r\n {context.getTranslation(\"liveViewPanel\", \"recordingOff\")} \r\n \r\n }\r\n {this.props.data.replayAllowed && <>\r\n {(this.props.data.rodReasons !== null && this.props.data.rodReasons !== \"\") &&\r\n {\r\n this.setState({\r\n stopReason: item.key\r\n });\r\n }}\r\n allowFreeform={false}\r\n label={context.getTranslation(\"liveViewPanel\", \"stopReason\")}\r\n />\r\n }\r\n \r\n { this.submit(\"StartStop\", \"Stop\", \"\"); this.setState({ stopButtonPressed: true, startButtonPressed: false }); }}\r\n style={{ margin: \"15px\", padding: \"5px\" }}\r\n disabled={this.disableStopRecButton()}\r\n />\r\n {context.getTranslation(\"liveViewPanel\", \"recordingOn\")} \r\n {!this.state.stopButtonPressed && \r\n \r\n }\r\n \r\n
}\r\n\r\n {/*keep delete*/}\r\n {this.props.data.conversationId !== \"noCall\" && this.props.userRules.ruleRecording != null && <>\r\n\r\n {this.props.data.keepDeleteAllowed && \r\n
\r\n \r\n {context.getTranslation(\"configuration\", \"recording\")} \r\n \r\n {this.props.userRules.ruleRecording.disableNextRecordingReasonRequired &&\r\n this.onSwitchRecording(ev, true, option.key)}\r\n\r\n allowFreeform={false}\r\n />\r\n }\r\n this.onSwitchRecording(ev, checked)}\r\n disabled={!(this.state.disableNextRecordingReason) &&\r\n this.props.userRules.ruleRecording != null &&\r\n this.props.userRules.ruleRecording !== \"undefined\" &&\r\n this.props.userRules.ruleRecording.disableNextRecordingReasonRequired\r\n }\r\n style={{ marginTop: \"5px\" }}\r\n />\r\n \r\n
}\r\n\r\n {/*CUSTOM FIELDS*/}\r\n {this.props.data.conversationId !== \"noCall\" && this.props.userRules.ruleAccess != null && this.props.userRules.ruleAccess.hasCustomFieldsAccess &&\r\n \r\n {this.f(this.props.data)}\r\n
\r\n \r\n {this.displayTimer()} \r\n
\r\n );\r\n }\r\n}","import React, { Component } from 'react'\r\nimport { Spinner } from 'office-ui-fabric-react/lib/Spinner';\r\nimport \"./DetailView.scss\"\r\nimport LiveContainer from './DetailContainer/LiveContainer'\r\nimport { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';\r\nimport { ApolloProvider } from \"react-apollo\";\r\nimport { Query } from \"react-apollo\";\r\nimport { queryGetLiveEntry } from \"./../../queries/queryRecordings\";\r\nimport { MyContext } from '../../context';\r\n\r\nexport default class LiveView extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n isPanelOpen: this.props.isPanelOpen != null ? this.props.isPanelOpen : false,\r\n id: this.props.id != null ? this.props.id : null\r\n }\r\n }\r\n\r\n renderData = (id, auth) => (\r\n \r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return (\r\n \r\n );\r\n if (error) return ;\r\n if (data.getLiveEntry == null) return ;\r\n return (\r\n \r\n );\r\n }}\r\n \r\n
\r\n )\r\n }\r\n \r\n \r\n {({ loading, error, data }) => {\r\n\r\n if (loading) return (\r\n
\r\n );\r\n\r\n if (jwtToken != null) {\r\n return (\r\n {context.getTranslation(\"common\", \"recordingNotAvailable\")}
;\r\n\r\n return (\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n \r\n
\r\n - \r\n
- {context.getTranslation(\"configuration\", \"email\")}: {item.username} \r\n
- \r\n
- {context.getTranslation(\"configuration\", \"id\")}: {item.userId} \r\n
\r\n \r\n \r\n {context.getTranslation(\"configuration\", \"assignedRules\")} \r\n \r\n \r\n
\r\n )\r\n }\r\n - \r\n
- {context.getTranslation(\"configuration\", \"recordingRules\")}: {nameRecordingRules} \r\n
- {context.getTranslation(\"configuration\", \"replayRules\")}: {nameReplayRules} \r\n
- {context.getTranslation(\"configuration\", \"accessRules\")}: {nameAccessRules} \r\n
- {context.getTranslation(\"configuration\", \"analyticsRules\")}: {nameAnalyticsRules} \r\n
\r\n
\r\n \r\n \r\n
\r\n );\r\n },\r\n onRenderExpandedCard: () => {\r\n var nameRecordingRules = \"\";\r\n var nameReplayRules = \"\";\r\n var nameAccessRules = \"\";\r\n var nameAnalyticsRules = \"\";\r\n this.props.ruleData.forEach(function (aRule) {\r\n if (aRule.id === item.analytics) {\r\n nameAnalyticsRules = aRule.name;\r\n } else if (aRule.id === item.access) {\r\n nameAccessRules = aRule.name;\r\n } else if (aRule.id === item.replay) {\r\n nameReplayRules = aRule.name;\r\n } else if (aRule.id === item.recordingRules) {\r\n nameRecordingRules = aRule.name;\r\n }\r\n });\r\n\r\n return (\r\n \r\n \r\n \r\n Assigned Rules \r\n \r\n \r\n
\r\n );\r\n },\r\n renderData: item\r\n };\r\n\r\n return - \r\n
- Recording Rules: {nameRecordingRules} \r\n
- Replay Rules: {nameReplayRules} \r\n
- Access Rules: {nameAccessRules} \r\n
- Analytics Rules: {nameAnalyticsRules} \r\n
\r\n
\r\n \r\n {assignmentPossible && this.props.userRules.ruleAccess.confAssignRecording && (this.state.license!== \"10\") &&
)}\r\n \r\n {this.showInfo(this.props.data.user)}\r\n
\r\n {this.renderLicense()}\r\n {this.renderRules()}\r\n {/*{this.props.userRules.ruleAccess != null && this.props.userRules.ruleAccess.confMapUser && this.renderUserMapping()}*/}\r\n {this.renderOptions()}\r\n
\r\n );\r\n\r\n };\r\n showInfo = (user) => {\r\n if (user.length === 1) {\r\n\r\n\r\n let userContent = {\r\n name: user[0].name,\r\n department: user[0].department,\r\n office: user[0].department,\r\n superviser: \"\",\r\n street: \"\",\r\n city: \"\",\r\n zip: \"\",\r\n country: \"\"\r\n };\r\n\r\n\r\n return (\r\n \r\n {this.renderLicense()}\r\n {this.renderRules()}\r\n {/*{this.props.userRules.ruleAccess != null && this.props.userRules.ruleAccess.confMapUser && this.renderUserMapping()}*/}\r\n {this.renderOptions()}\r\n
\r\n Member of group {user[0].groupName} }\r\n
\r\n );\r\n\r\n } else {\r\n\r\n return (\r\n \r\n {user.map(({ name }, i) => {\r\n return (\r\n
\r\n );\r\n\r\n }\r\n }\r\n\r\n toggleSaveButton = (newRules) => {\r\n if (this.state.changed === false) {\r\n this.setState({ changed: true });\r\n }\r\n this.setState(newRules);\r\n };\r\n _closeModal = () => {\r\n this.setState({ showModal: false });\r\n }\r\n\r\n _openModal = () => {\r\n this.setState({ showModal: true });\r\n }\r\n\r\n\r\n renderRules = () => {\r\n return \r\n
\r\n\r\n\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n {\r\n this.setState({\r\n storageId: newValue.key,\r\n changed: true\r\n })\r\n }}\r\n\r\n defaultSelectedKey={this.state.storageId}\r\n options={storagesList}\r\n />\r\n\r\n }}\r\n\r\n \r\n {(this.props.data.user.length > 0 && this.state.regionalStorageLocation && !this.props.data.user[0].storageId) && <>\r\n {(context) => (<> {context.getTranslation(\"configuration\", \"storageConnectionString\")})}}\r\n disabled\r\n />}\r\n {this.state.regionalStorageLocation === 'S3Storage' && <>\r\n {\r\n this.setState({\r\n awsType: newVal.key,\r\n changed: true\r\n });\r\n }}\r\n disabled={true}\r\n />\r\n {\r\n this.setState({\r\n awsAccessKeyId: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n {\r\n this.setState({\r\n awsSecretAccess: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n {this.state.awsType == \"OnPremise\" &&\r\n {\r\n this.setState({\r\n awsServiceUrl: newValue,\r\n changed: true\r\n });\r\n }}\r\n />}\r\n {\r\n this.setState({\r\n awsBucketName: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n {this.state.awsType === \"Cloud\" &&\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return {\r\n this.setState({\r\n awsRegion: newVal.key,\r\n changed: true\r\n });\r\n }}\r\n disabled={true}\r\n />\r\n }}\r\n }\r\n\r\n }\r\n }\r\n\r\n\r\n \r\n {this.state.licenseType == \"10\"\r\n ? ( {\r\n this.setState({\r\n addOnAnalytics: newValue,\r\n changed: true\r\n });\r\n\r\n }}\r\n />)\r\n : }\r\n\r\n\r\n {this.props.tenantData.addOnFullChat ?\r\n {\r\n this.setState({\r\n addOnFullChat: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n\r\n {this.state.licenseType == \"10\"\r\n ? ( {\r\n this.setState((prevState) => {\r\n return {\r\n addOnQualityManagement: newValue ? prevState.addOnQualityManagement : false,\r\n addOnCompliance: newValue,\r\n changed: true\r\n }\r\n });\r\n }}\r\n />)\r\n : }\r\n\r\n {this.props.tenantData.addOnQualityManagement ?\r\n {\r\n this.setState({\r\n addOnQualityManagement: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnZoom ?\r\n {\r\n this.setState({\r\n addOnZoom: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnGenesys ?\r\n {\r\n this.setState({\r\n addOnGenesys: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnRingcentral ?\r\n {\r\n this.setState({\r\n addOnRingcentral: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnLeapXpert ?\r\n {\r\n this.setState({\r\n addOnLeapXpert: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {(this.state.addOnRingcentral || this.state.addOnGenesys || this.state.addOnZoom || this.state.addOnLeapXpert) &&\r\n {\r\n this.setState({\r\n integrationUser: newValue,\r\n changed: true\r\n });\r\n }} />}\r\n {this.props.tenantData.addOnDynamics ?\r\n {\r\n this.setState({\r\n addOnDynamics: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n\r\n\r\n
\r\n )\r\n }\r\n \r\n
{context.getTranslation(\"configuration\", \"rules\")}
\r\n\r\n
\r\n );\r\n }\r\n\r\n\r\n if (error) return Failed to connect
;\r\n if (data.getStorageData == null) {\r\n return ;\r\n }\r\n let storagesList = [];\r\n if (data.getStorageData != null) {\r\n\r\n //add empty option for no storage\r\n storagesList.push({\r\n key: null,\r\n text: \"\",\r\n });\r\n\r\n if (this.props.data.user.length > 0 && this.props.data.user[0].storageId !== null && this.props.data.user[0].storageId !== undefined) {\r\n\r\n let currentStorage = data.getStorageData.find(obj => obj.id === this.state.storageId);\r\n for (var j = 0; j < data.getStorageData.length; j++) {\r\n\r\n //if user has a storage assiged that is no longer visible for assignemnt\r\n //he can see that has the storage assigend but will no longer be able to select it again if it's not visible for assignment\r\n if (!currentStorage && this.state.storageId !== \"\") {\r\n let findSetStorage = this.props.storageData.find(obj => obj.id === this.state.storageId);\r\n\r\n if (findSetStorage) {\r\n storagesList.push({\r\n key: this.state.storageId,\r\n text: findSetStorage.displayName,\r\n disabled: true,\r\n hidden: true\r\n\r\n });\r\n }\r\n }\r\n\r\n\r\n storagesList.push({\r\n key: data.getStorageData[j].id,\r\n text: data.getStorageData[j].displayName\r\n\r\n });\r\n }\r\n } else {\r\n for (var i = 0; i < data.getStorageData.length; i++) {\r\n\r\n storagesList.push({\r\n key: data.getStorageData[i].id,\r\n text: data.getStorageData[i].displayName,\r\n disabled: false\r\n\r\n });\r\n }\r\n }\r\n }\r\n\r\n return\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getAWSRegions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n const stack = data.getAWSRegions;\r\n if (data.getAWSRegions != null) {\r\n for (let x = 0; x < stack.length; x++) {\r\n let i = {\r\n key: stack[x].code,\r\n text: stack[x].displayName,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return
\r\n \r\n {\r\n if (option.key == \"10\") {\r\n this.setState({\r\n licenseType: option.key,\r\n addOnCompliance: true,\r\n addOnAnalytics: true,\r\n changed: true\r\n });\r\n }\r\n else {\r\n this.setState({\r\n licenseType: option.key,\r\n changed: true\r\n });\r\n }\r\n }}\r\n />\r\n \r\n
\r\n )}\r\n \r\n
\r\n
\r\n )\r\n }\r\n \r\n
\r\n
\r\n
\r\n
\r\n\r\n
\r\n
\r\n )}\r\n \r\n\r\n \r\n\r\n \r\n
\r\n {context.getTranslation(\"configuration\", \"deleteUserQuestion\")} {this.getUserNames()} ?
\r\n\r\n
\r\n
\r\n )}\r\n {context.getTranslation(\"configuration\", \"unlinkAccount\")} : {item.value}
\r\n\r\n\r\n
\r\n
\r\n )\r\n }\r\n \r\n
{context.getTranslation(\"configuration\", \"linkedAccounts\")}
\r\n\r\n\r\n
\r\n
\r\n )\r\n }\r\n\r\n \r\n \r\n \r\n
\r\n \r\n\r\n
\r\n\r\n \r\n\r\n
\r\n {context.getTranslation(\"configuration\", \"linkAccount\")}
\r\n\r\n\r\n
\r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {this.showInfo(this.props.data.user)}\r\n
\r\n {this.renderLicense()}\r\n {this.renderRules()}\r\n {true &&\r\n { (event.target.value >= 1 || event.target.value === \"\") && this.setState({ changed: true, priority: event.target.value }) }}\r\n />\r\n }\r\n {/*{this.props.userRules.ruleAccess != null && this.props.userRules.ruleAccess.confMapUser && this.renderUserMapping()}*/}\r\n {this.renderOptions()}\r\n
\r\n );\r\n\r\n };\r\n showInfo = (user) => {\r\n if (user.length === 1) {\r\n\r\n\r\n let userContent = {\r\n name: user[0].name,\r\n superviser: \"\",\r\n street: \"\",\r\n city: \"\",\r\n zip: \"\",\r\n country: \"\"\r\n };\r\n\r\n\r\n return (\r\n \r\n {this.renderLicense()}\r\n {this.renderRules()}\r\n {true &&
\r\n
\r\n );\r\n\r\n } else {\r\n\r\n return (\r\n \r\n {user.map(({ name }, i) => {\r\n return (\r\n
\r\n );\r\n\r\n }\r\n }\r\n\r\n toggleSaveButton = (newRules) => {\r\n if (this.state.changed === false) {\r\n this.setState({ changed: true });\r\n }\r\n this.setState(newRules);\r\n };\r\n _closeModal = () => {\r\n this.setState({ showModal: false });\r\n }\r\n\r\n _openModal = () => {\r\n this.setState({ showModal: true });\r\n }\r\n\r\n renderRules = () => {\r\n return \r\n
\r\n\r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n {\r\n this.setState({\r\n storageId: newValue.key,\r\n changed: true\r\n })\r\n }}\r\n\r\n defaultSelectedKey={this.state.storageId}\r\n options={storagesList}\r\n />\r\n\r\n }}\r\n\r\n \r\n {(this.props.data.user.length > 0 && this.state.regionalStorageLocation && !this.props.data.user[0].storageId) && <>\r\n {(context) => (<> {context.getTranslation(\"configuration\", \"storageConnectionString\")})}}\r\n disabled\r\n />}\r\n\r\n {this.state.regionalStorageLocation === 'S3Storage' && <>\r\n {\r\n this.setState({\r\n awsType: newVal.key,\r\n changed: true\r\n });\r\n }}\r\n disabled={true}\r\n />\r\n {\r\n this.setState({\r\n awsAccessKeyId: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n {\r\n this.setState({\r\n awsSecretAccess: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n {this.state.awsType == \"OnPremise\" &&\r\n {\r\n this.setState({\r\n awsServiceUrl: newValue,\r\n changed: true\r\n });\r\n }}\r\n />}\r\n {\r\n this.setState({\r\n awsBucketName: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n {this.state.awsType === \"Cloud\" &&\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return {\r\n this.setState({\r\n awsRegion: newVal.key,\r\n changed: true\r\n });\r\n }}\r\n disabled={true}\r\n />\r\n }}\r\n }\r\n\r\n }\r\n }\r\n\r\n\r\n {this.state.licenseType == \"10\"\r\n ? ( {\r\n this.setState({\r\n addOnAnalytics: newValue,\r\n changed: true\r\n });\r\n\r\n }}\r\n />)\r\n : }\r\n\r\n {this.props.tenantData.addOnFullChat ?\r\n {\r\n this.setState({\r\n addOnFullChat: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n\r\n\r\n {this.state.licenseType == \"10\"\r\n ? ( {\r\n this.setState((prevState) => {\r\n return {\r\n addOnQualityManagement: newValue ? prevState.addOnQualityManagement : false,\r\n addOnCompliance: newValue,\r\n changed: true\r\n }\r\n });\r\n }}\r\n />)\r\n : }\r\n\r\n {this.props.tenantData.addOnQualityManagement ?\r\n {\r\n this.setState({\r\n addOnQualityManagement: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnZoom ?\r\n {\r\n this.setState({\r\n addOnZoom: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnGenesys ?\r\n {\r\n this.setState({\r\n addOnGenesys: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnRingcentral ?\r\n {\r\n this.setState({\r\n addOnRingcentral: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnLeapXpert ?\r\n {\r\n this.setState({\r\n addOnLeapXpert: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n {this.props.tenantData.addOnDynamics ?\r\n {\r\n this.setState({\r\n addOnDynamics: newValue,\r\n changed: true\r\n });\r\n }}\r\n />\r\n : }\r\n\r\n\r\n
)\r\n }\r\n \r\n
{context.getTranslation(\"configuration\", \"rules\")}
\r\n\r\n
\r\n );\r\n }\r\n\r\n\r\n if (error) return Failed to connect
;\r\n if (data.getStorageData == null) {\r\n return ;\r\n }\r\n\r\n let storagesList = [];\r\n if (data.getStorageData != null) {\r\n //add empty option for no storage\r\n storagesList.push({\r\n key: null,\r\n text: \"\",\r\n });\r\n if (this.props.data.user.length > 0 && this.props.data.user[0].storageId !== null && this.props.data.user[0].storageId !== undefined) {\r\n\r\n let currentStorage = data.getStorageData.find(obj => obj.id === this.state.storageId);\r\n\r\n for (var j = 0; j < data.getStorageData.length; j++) {\r\n\r\n //if user has a storage assiged that is no longer visible for assignemnt\r\n //he can see that has the storage assigend but will no longer be able to select it again if it's not visible for assignment\r\n if (!currentStorage && this.state.storageId !== \"\") {\r\n let findSetStorage = this.props.storageData.find(obj => obj.id === this.state.storageId);\r\n\r\n if (findSetStorage) {\r\n storagesList.push({\r\n key: this.state.storageId,\r\n text: findSetStorage.displayName,\r\n disabled: true,\r\n hidden: true\r\n\r\n });\r\n }\r\n }\r\n storagesList.push({\r\n key: data.getStorageData[j].id,\r\n text: data.getStorageData[j].displayName\r\n });\r\n }\r\n } else {\r\n for (var i = 0; i < data.getStorageData.length; i++) {\r\n\r\n storagesList.push({\r\n key: data.getStorageData[i].id,\r\n text: data.getStorageData[i].displayName,\r\n disabled: false\r\n\r\n });\r\n }\r\n }\r\n }\r\n\r\n return\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getAWSRegions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n const stack = data.getAWSRegions;\r\n if (data.getAWSRegions != null) {\r\n for (let x = 0; x < stack.length; x++) {\r\n let i = {\r\n key: stack[x].code,\r\n text: stack[x].displayName,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return
\r\n \r\n {\r\n if (option.key == \"10\") {\r\n this.setState({\r\n licenseType: option.key,\r\n addOnCompliance: true,\r\n addOnAnalytics: true,\r\n changed: true\r\n });\r\n }\r\n else {\r\n this.setState({\r\n licenseType: option.key,\r\n changed: true\r\n });\r\n }\r\n }}\r\n />\r\n \r\n
\r\n )}\r\n \r\n
\r\n
\r\n )\r\n }\r\n \r\n
\r\n
\r\n
\r\n
\r\n )}\r\n \r\n\r\n \r\n\r\n \r\n
\r\n {context.getTranslation(\"configuration\", \"deleteUserQuestion\")} {this.getGroupNames()} ?
\r\n\r\n\r\n
\r\n
\r\n )}\r\n Unlink Account : {item.value}
\r\n\r\n\r\n
\r\n
\r\n );\r\n }\r\n\r\n}\r\n","import * as React from 'react';\r\nimport { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';\r\nimport {\r\n NormalPeoplePicker,\r\n ValidationState,\r\n PeoplePickerItem\r\n} from 'office-ui-fabric-react/lib/Pickers';\r\nimport { Query } from 'react-apollo';\r\nimport { Spinner } from 'office-ui-fabric-react/lib/Spinner';\r\nimport { queryGetUser } from '../../../queries/querySettings';\r\nimport { PeoplePickerItemSuggestion } from '@fluentui/react'\r\nimport { MyContext } from '../../../context';\r\n\r\n\r\n\r\nexport default class UserPicker extends React.Component {\r\n\r\n static contextType = MyContext\r\n\r\n _picker = React.createRef();\r\n\r\n constructor(props) {\r\n super(props);\r\n const perSel = [];\r\n this.query = this.query.bind(this);\r\n if (props.dataUsers != null) {\r\n const output = [];\r\n const suggestion = [];\r\n let current;\r\n for (let i = 0; i < props.dataUsers.length; i++) {\r\n current = {\r\n key: props.dataUsers[i].userId,\r\n userId: props.dataUsers[i].userId,\r\n text: props.dataUsers[i].name,\r\n email: props.dataUsers[i].username\r\n };\r\n for (let j = 0;\r\n this.props.user !== undefined\r\n && this.props.user != null\r\n && j < this.props.user.length;\r\n j++) {\r\n if (this.props.user[j].userId === current.userId) {\r\n perSel.push(current);\r\n }\r\n }\r\n output.push(current);\r\n if (i < 5) {\r\n suggestion.push(current);\r\n }\r\n }\r\n this.state = {\r\n currentPicker: 1,\r\n delayResults: false,\r\n peopleList: output,\r\n mostRecentlyUsed: suggestion,\r\n currentSelectedItems: [],\r\n isPickerDisabled: this.props.disabled == undefined ? false : this.props.disabled,\r\n perSel,\r\n };\r\n this.perSel = perSel;\r\n } else {\r\n for (let j = 0;\r\n props.user !== undefined && props.user != null && j < props.user.length;\r\n j++) {\r\n perSel.push({ key: props.user[j].userId, userId: props.user[j].userId, text: props.user[j].name != null ? props.user[j].name : props.user[j].userId });\r\n }\r\n this.state = {\r\n currentPicker: 1,\r\n delayResults: false,\r\n peopleList: [],\r\n mostRecentlyUsed: [],\r\n currentSelectedItems: [],\r\n isPickerDisabled: this.props.disabled == undefined ? false : this.props.disabled,\r\n perSel: perSel,\r\n };\r\n this.perSel = perSel;\r\n }\r\n\r\n }\r\n\r\n\r\n componentDidUpdate(prevProps) {\r\n if (this.props.user !== prevProps.user) {\r\n // Update local state when the prop changes\r\n //doing this for perSel because the states were not synchronized and perSel did not get updated when updating only by state but not by interracting with it,\r\n //because it is only updated in _onChange function\r\n this.setState({ perSel: this.props.user });\r\n }\r\n }\r\n\r\n render() {\r\n if (this.props.dataUsers != null) {\r\n return (\r\n <>\r\n {this._renderNormalPicker()}\r\n \r\n );\r\n } else {\r\n return (\r\n <>\r\n {this.query()}\r\n \r\n );\r\n }\r\n }\r\n\r\n _getTextFromItem(persona) {\r\n return persona.text;\r\n }\r\n\r\n query = (layerFunction, auth) => (\r\n \r\n
Linked Accounts
\r\n\r\n\r\n
\r\n
\r\n )\r\n }\r\n\r\n \r\n \r\n \r\n
\r\n \r\n\r\n
\r\n\r\n \r\n\r\n
\r\n Link Account
\r\n\r\n\r\n
\r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
\r\n\r\n if (data.getUserData == null) return \r\n //if parent provides passUserDataToParent props func, and props.passUserDataToParent is null\r\n //we lift \"data.getUserData\" up to EditPolicy\r\n if ((this.props.passUserDataToParent != null || this.props.passUserDataToParent != undefined)\r\n && this.props.userdata == null) {\r\n this.props.passUserDataToParent(data.getUserData)\r\n return \r\n }\r\n this.users = data.getUserData.userdata;\r\n this.convertToUserPicker(data.getUserData.userdata, false);\r\n return this._renderNormalPicker();\r\n }}\r\n \r\n )\r\n\r\n convertToUserPicker = (data, stateChange) => {\r\n const presel = [];\r\n const output = [];\r\n const sugestion = [];\r\n let current;\r\n\r\n if (data != null) {\r\n for (let k = 0; k < data.length; k++) {\r\n // Collect the users\r\n\r\n //if new prop displayType is set to \"noGroups\" will not add the groups\r\n //groups are find based on members prop of the user if it's null it's a user\r\n if (this.props.displayType === \"noGroups\" && data[k].members !== null) {\r\n continue;\r\n }\r\n if (this.props.availableUsers != null && this.props.availableUsers != undefined) {\r\n if (!this.props.availableUsers.includes(data[k].userId))\r\n continue;\r\n }\r\n current = {\r\n key: data[k].userId,\r\n userId: data[k].userId,\r\n text: data[k].name,\r\n email: data[k].username,\r\n members: data[k].members,\r\n addOnCompliance: data[k].addOnCompliance\r\n }\r\n\r\n output.push(current);\r\n if (k < 5) {\r\n sugestion.push(current);\r\n }\r\n\r\n }\r\n }\r\n\r\n for (let j = 0; this.props.user !== undefined && this.props.user != null && j < this.props.user.length; j++) {\r\n let i = 0;\r\n for (i = 0; i < data.length; i++) {\r\n //if new prop displayType is set to \"noGroups\" will not add the groups\r\n //groups are find based on members prop of the user if it's null it's a user\r\n if (this.props.displayType === \"noGroups\" && data[i].members !== null) {\r\n continue;\r\n }\r\n current = { key: data[i].userId, userId: data[i].userId, text: data[i].name, email: data[i].username, addOnCompliance: data[i].addOnCompliance, members: data[i].members };\r\n\r\n if (this.props.user[j].userId === current.userId) {\r\n presel.push(current);\r\n break;\r\n }\r\n }\r\n if (i >= data.length) {\r\n // Freestyle user (PSTN)\r\n presel.push(this.state.perSel[j]);\r\n }\r\n }\r\n if (stateChange) {\r\n this.setState({ peopleList: output, mostRecentlyUsed: sugestion, perSel: presel });\r\n }\r\n this.perSel = presel;\r\n };\r\n\r\n _renderNormalPicker() {\r\n\r\n const renderItem = (p) => {\r\n\r\n const newProps = {\r\n ...p,\r\n styles: { root: { border: this.props.editPolicy !== undefined && this.props.editPolicy && !p.item.addOnCompliance ? '2.5px solid red' : '' } }\r\n };\r\n\r\n return\r\n { this.updateOwnFields(newValue, \"upserFolder\"); }}\r\n />\r\n { this.updateOwnFields(newValue, \"deleteFolders\"); }}\r\n />\r\n {\r\n this.setState({\r\n ownFolder:{\r\n ...this.state.ownFolder,\r\n shareFolders: newValue\r\n },\r\n hideDialogSafe: newValue\r\n });\r\n this.updateOwnFields(true, \"shareFolders\")\r\n }}\r\n />\r\n {\r\n this.setState({ hideDialogSafe: true, })\r\n this.updateOwnFields(true, \"shareFolders\")\r\n }}\r\n ok={() => {\r\n this.setState({ hideDialogSafe: true })\r\n this.updateOwnFields(false, \"shareFolders\")\r\n }}\r\n />\r\n { this.updateOwnFields(newValue, \"addConversations\"); }}\r\n />\r\n { this.updateOwnFields(newValue, \"removeConversations\"); }}\r\n />\r\n { this.updateOwnFields(newValue, \"exportFolders\"); }}\r\n />\r\n
\r\n )\r\n }\r\n\r\n}","import React from 'react';\r\nimport { getCognitiveServicesLocalesTranscription } from '../../queries/querySettings';\r\nimport { Query } from \"@apollo/react-components\";\r\nimport { Spinner } from 'office-ui-fabric-react/lib';\r\nimport { MyContext } from '../../../src/context';\r\nimport { ComboBox } from \"office-ui-fabric-react\";\r\n\r\nexport const TranscriptLanuages = ({ label, selectedKey, onChange, ...otherProps }) => (\r\n \r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n if (data.getTranscriptionLocales == null) {\r\n return ;\r\n }\r\n let transcriptLanguageList = [];\r\n\r\n if (data.getTranscriptionLocales != null) {\r\n\r\n let languageNames = new Intl.DisplayNames(['en'], { type: 'language' });\r\n for (var i = 0; i < data.getTranscriptionLocales.length; i++) {\r\n var countryName = languageNames.of(data.getTranscriptionLocales[i]);\r\n transcriptLanguageList.push({\r\n key: data.getTranscriptionLocales[i],\r\n text: countryName\r\n });\r\n }\r\n }\r\n\r\n return\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n\r\n if (data.getTranslatorLocales == null) {\r\n return ;\r\n }\r\n let translateLanguageList = [];\r\n\r\n if (data.getTranslatorLocales != null) {\r\n\r\n for (var i = 0; i < data.getTranslatorLocales.length; i++) {\r\n let translateLanguageData = JSON.parse(data.getTranslatorLocales[i]);\r\n\r\n translateLanguageList.push({\r\n key: translateLanguageData.key,\r\n text: translateLanguageData.text\r\n });\r\n }\r\n }\r\n\r\n return {\r\n document.getElementById(this.props.idResult).innerHTML = '';\r\n document.getElementById(this.props.idError).innerHTML = '';\r\n\r\n if (this.fileInputRef.current) {\r\n this.fileInputRef.current.click()\r\n }\r\n }}\r\n >\r\n {/*
\r\n {(this.props.fileBtnText !== \"Start file\" && this.props.fileBtnText !== \"Stop file\" && this.props.fileBtnText !== \"\") &&\r\n <>\r\n \r\n\r\n */}\r\n {/* {context.getTranslation(\"common\", \"uploadFile\")}*/}\r\n {/*
*/}\r\n\r\n \r\n\r\n \r\n {!this.state.playActive\r\n ? { document.getElementById(this.props.idResult + \"player\").play(); this.setState({ playActive: true }) }} />\r\n : { document.getElementById(this.props.idResult + \"player\").pause(); this.setState({ playActive: false }) }} />\r\n }\r\n
\r\n \r\n }\r\n\r\n {this.props.fileBtnText}
\r\n\r\n\r\n\r\n {\r\n var files = document.getElementById(this.props.idFiles).files;\r\n if (!files.length) {\r\n alert('Please select a file');\r\n } else {\r\n if (!validFilename(files[0])) {\r\n alert('Please input a real filenmae!');\r\n } else {\r\n document.getElementById(this.props.idResult).innerHTML = 'Log in...';\r\n this.setState({ uploadActive: true });\r\n document.getElementById(this.props.idResult).innerHTML = 'Upload running...';\r\n this.execute(files[0]).then(() => console.log(\"Done\")).catch((e) => {\r\n document.getElementById(this.props.idError).innerHTML = 'Error...' + e; this.setState({ uploadActive: false });\r\n });\r\n }\r\n }\r\n }} ref={this.fileInputRef} style={{ display: \"none\" }} accept=\"audio/wav\" name=\"avatar\" />\r\n \r\n \r\n
\r\n\r\n\r\n \r\n\r\n )}
\r\n \r\n { this.props.deleteAnnouncement(this.props.id, false) }} />\r\n \r\n
\r\n \r\n \r\n\r\n {\r\n var ann = this.state.announcement\r\n ann.prefixList = newValue\r\n this.props.updateAnnouncement(this.props.id, ann);\r\n this.setState({\r\n announcement: ann\r\n });\r\n\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n}\r\n","import React, { Component } from 'react'\r\nimport { MyContext } from '../../../../context';\r\nimport RestrictedAccessForm from '../RestrictedAccessForm';\r\nimport { ChoiceGroup, Text, Stack } from \"office-ui-fabric-react\";\r\nimport { FontWeights } from 'office-ui-fabric-react/lib';\r\n\r\nclass ConversationSafeAccessRule extends Component {\r\n\r\n static contextType = MyContext;\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n if (this.props.conversationSafeAccess !== null) {\r\n this.state = {\r\n accUserSafe: this.props.conversationSafeAccess.accUserSafe,\r\n restrictedAccess: this.props.conversationSafeAccess.restrictedAccess\r\n }\r\n } else {\r\n this.state = {\r\n accUserSafe: 'No',\r\n restrictedAccess: {\r\n ownFolder: {}\r\n }\r\n }\r\n this.props.updateConversationSafeAccess(this.state)\r\n }\r\n }\r\n\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n {this.context.getTranslation(\"configuration\", \"conversationSafe\")} \r\n\r\n {\r\n let state = {\r\n accUserSafe: newValue.key,\r\n }\r\n let conversationSafeAccess = {}\r\n if (newValue.key === \"No\" || newValue.key === \"Full\") {\r\n state = {\r\n ...state,\r\n restrictedAccess: {\r\n ownFolder: {}\r\n }\r\n }\r\n conversationSafeAccess = state\r\n } else {\r\n conversationSafeAccess = {\r\n accUserSafe: newValue.key,\r\n restrictedAccess: this.state.restrictedAccess\r\n }\r\n }\r\n this.setState({\r\n ...state\r\n });\r\n this.props.updateConversationSafeAccess(conversationSafeAccess)\r\n }}\r\n label={this.context.getTranslation(\"configuration\", \"accessToConversationSafe\")}\r\n />\r\n\r\n {this.state.accUserSafe === 'Restricted' &&\r\n \r\n \r\n {\r\n this.setState({\r\n restrictedAccess: rest\r\n })\r\n let conversationSafeAccess = {\r\n accUserSafe: this.state.accUserSafe,\r\n restrictedAccess: rest\r\n }\r\n this.props.updateConversationSafeAccess(conversationSafeAccess)\r\n }\r\n }\r\n />\r\n \r\n }\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default ConversationSafeAccessRule","import React from 'react'\r\nimport { Checkbox, Stack } from 'office-ui-fabric-react'\r\nimport { MyContext } from '../../../../context'\r\n\r\nconst checkboxStyles = () => {\r\n return {\r\n root: {\r\n marginTop: '10px'\r\n }\r\n };\r\n};\r\n\r\n//This components was initially intended to serve on multiple parts of the project but as its logic was further refined\r\n// became very specialized and it would now be better changed its name to something less generic.\r\n\r\nexport default class ListOfDependentCheckboxes extends React.Component {\r\n \r\n static contextType = MyContext\r\n \r\n constructor(props) {\r\n super(props);\r\n this.currentCount = 0\r\n let initialSelectedCheckBoxCount = this.props.secondary.filter(e=> e.value).length ? this.props.secondary.filter(e=> e.value).length : 1\r\n this.state = {\r\n defaultIsNeeded: this.props.secondary.filter(e=> e.value).length ? false : true,\r\n secondaryCBCheckedN: initialSelectedCheckBoxCount\r\n }\r\n this.props.updateParentState({\r\n visibilityCount: initialSelectedCheckBoxCount })\r\n \r\n \r\n }\r\n \r\n updateCount = (lastCBHasBeenFlagged) => {\r\n if(lastCBHasBeenFlagged){\r\n if(this.state.secondaryCBCheckedN == 1 && this.state.defaultIsNeeded){\r\n this.setState({\r\n defaultIsNeeded:false,\r\n secondaryCBCheckedN: 1\r\n })\r\n this.currentCount = 1\r\n } else{\r\n this.setState({\r\n defaultIsNeeded:false,\r\n secondaryCBCheckedN: this.state.secondaryCBCheckedN +1\r\n })\r\n this.currentCount = this.state.secondaryCBCheckedN +1\r\n }\r\n } else{\r\n if(this.state.secondaryCBCheckedN > 1){\r\n this.setState({\r\n secondaryCBCheckedN: this.state.secondaryCBCheckedN - 1\r\n })\r\n this.currentCount = this.state.secondaryCBCheckedN -1\r\n }else{\r\n this.setState({\r\n defaultIsNeeded: true,\r\n secondaryCBCheckedN: 0\r\n })\r\n this.currentCount = 0\r\n }\r\n }\r\n }\r\n \r\n \r\n updateStateInParentComponent = (newState) => {\r\n this.props.updateParentState({\r\n ...newState,\r\n visibilityCount: this.currentCount })\r\n }\r\n\r\nrender(){\r\n return (\r\n {this.context.getTranslation('configuration', 'visibilityCSFolderPanelLabel')}
\r\n {this.props.secondary.slice(0,-1).map((e, i) => {\r\n return (\r\n {/* Your additional component code or JSX */}\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default VisibilityReplayRule;\r\n","import React from 'react';\r\nimport {\r\n Checkbox,\r\n ChoiceGroup,\r\n FontWeights,\r\n TextField,\r\n Stack\r\n} from \"office-ui-fabric-react\";\r\nimport { MyContext } from '../../../../context';\r\n\r\nconst KeepDeleteSettings = ({ updateState, data, type, ...props }) => {\r\n return (\r\n \r\n\r\n { updateState(type, parseInt(newValue), \"toDoTimer\") }}\r\n disabled={!data.isSendToDo}\r\n min=\"1\"\r\n max=\"48\"\r\n errorMessage={data.toDoTimer < 1 ? \"Minimum value is 1 hour\" : data.toDoTimer > 48 ? \"Maximum value is 48 hours\" : \"\"}\r\n />\r\n
\r\n hour(s)\r\n - \r\n {list}\r\n
\r\n {this.tmpUserUsage.length > 0 && this._openModal(\"users\")}>{window.innerWidth < 600 ? \"Exp\" : context.getTranslation(\"configuration\", \"ruleUsedBy\") + this.tmpUserUsage.length + context.getTranslation(\"configuration\", \"users\")}}\r\n
\r\n {this.tmpGroupUsage.length > 0 && this._openModal(\"groups\")}>{window.innerWidth < 600 ? \"Exp\" : context.getTranslation(\"configuration\", \"ruleUsedBy\") + this.tmpGroupUsage.length + \" groups\"}}\r\n\r\n
\r\n )\r\n }\r\n \r\n {this.tmpGroupUsage.length > 0 && this._openModal(\"groups\")}>{window.innerWidth < 600 ? \"Exp\" : context.getTranslation(\"configuration\", \"ruleUsedBy\") + this.tmpGroupUsage.length + \" groups\"}}\r\n
\r\n {this.state.modalDisplay === \"users\"\r\n ? (\r\n {context.getTranslation(\"configuration\", \"ruleUsedBy\") + this.tmpUserUsage.length + context.getTranslation(\"configuration\", \"users\")}\r\n\r\n ) : (\r\n {context.getTranslation(\"configuration\", \"ruleUsedBy\") + this.tmpGroupUsage.length + \" groups\"}\r\n\r\n )}\r\n\r\n\r\n
\r\n \r\n {this.state.modalDisplay === \"users\"\r\n ? (\r\n \r\n {this.displayUsers.map((user) => \r\n ) : (\r\n \r\n {this.displayGroups.map((group) => \r\n )\r\n }\r\n
\r\n \r\n \r\n
\r\n )}\r\n {user.name}
\r\n \r\n
\r\n )}\r\n \r\n {this.state.saveMessage && (\r\n {context.getTranslation(\"configuration\", \"deleteRuleQuestion\")} \r\n \r\n \r\n )}\r\n }\r\n \r\n \r\n
\r\n { this.modifyState(\"Inbound\", parseInt(newValue), \"wrapUpTimer\") }}\r\n disabled={!this.state.keepDeleteSettingsInbound.hasWrapUp}\r\n min=\"1\"\r\n max=\"900\"\r\n errorMessage={this.state.keepDeleteSettingsInbound.wrapUpTimer < 1 ? \"Minimum value is 1 sec\" : this.state.keepDeleteSettingsInbound.wrapUpTimer > 900 ? \"Maximum value is 900 sec\" : \"\"}\r\n />\r\n
\r\n \r\n { this.modifyState(\"Outbound\", parseInt(newValue), \"wrapUpTimer\") }}\r\n disabled={!this.state.keepDeleteSettingsOutbound.hasWrapUp}\r\n min=\"1\"\r\n max=\"900\"\r\n errorMessage={this.state.keepDeleteSettingsOutbound.wrapUpTimer < 1 ? \"Minimum value is 1 sec\" : this.state.keepDeleteSettingsOutbound.wrapUpTimer > 900 ? \"Maximum value is 900 sec\" : \"\"}\r\n />\r\n
\r\n \r\n { this.modifyState(\"Meeting\", parseInt(newValue), \"wrapUpTimer\") }}\r\n disabled={!this.state.keepDeleteSettingsMeeting.hasWrapUp}\r\n min=\"1\"\r\n max=\"900\"\r\n errorMessage={this.state.keepDeleteSettingsMeeting.wrapUpTimer < 1 ? \"Minimum value is 1 sec\" : this.state.keepDeleteSettingsMeeting.wrapUpTimer > 900 ? \"Maximum value is 900 sec\" : \"\"}\r\n />\r\n
\r\n \r\n { this.modifyState(\"ExternalMeeting\", parseInt(newValue), \"wrapUpTimer\") }}\r\n disabled={!this.state.keepDeleteSettingsMeetingExternal.hasWrapUp}\r\n min=\"1\"\r\n max=\"900\"\r\n errorMessage={this.state.keepDeleteSettingsMeetingExternal.wrapUpTimer < 1 ? \"Minimum value is 1 sec\" : this.state.keepDeleteSettingsMeetingExternal.wrapUpTimer > 900 ? \"Maximum value is 900 sec\" : \"\"}\r\n />\r\n
\r\n \r\n { this.modifyState(\"InternalMeeting\", parseInt(newValue), \"wrapUpTimer\") }}\r\n disabled={!this.state.keepDeleteSettingsMeetingInternal.hasWrapUp}\r\n min=\"1\"\r\n max=\"900\"\r\n errorMessage={this.state.keepDeleteSettingsMeetingInternal.wrapUpTimer < 1 ? \"Minimum value is 1 sec\" : this.state.keepDeleteSettingsMeetingInternal.wrapUpTimer > 900 ? \"Maximum value is 900 sec\" : \"\"}\r\n />\r\n
\r\n \r\n { this.modifyState(\"Internal\", parseInt(newValue), \"wrapUpTimer\") }}\r\n disabled={!this.state.keepDeleteSettingsInternal.hasWrapUp}\r\n min=\"1\"\r\n max=\"900\"\r\n errorMessage={this.state.keepDeleteSettingsInternal.wrapUpTimer < 1 ? \"Minimum value is 1 sec\" : this.state.keepDeleteSettingsInternal.wrapUpTimer > 900 ? \"Maximum value is 900 sec\" : \"\"}\r\n />\r\n
\r\n {context.getTranslation(\"configuration\", \"recChannelList\")}:
\r\n\r\n {/*add DTMF code*/}\r\n\r\n {((this.state.recAudioType === 'Demand' || this.state.recAudioType === 'ControlBulkRecording')\r\n || (this.state.recAudioType === 'Complex' && (this.state.recInboundType === 'Demand' || this.state.recOutboundType === 'Demand' || this.state.recMeetingType === 'Demand' || this.state.recInternalType === 'Demand' || this.state.recInboundType === 'ControlBulkRecording' || this.state.recOutboundType === 'ControlBulkRecording' || this.state.recMeetingType === 'ControlBulkRecording' || this.state.recInternalType === 'ControlBulkRecording'))\r\n || ((this.state.recAudioType === 'Complex' && this.state.recMeetingType === 'Complex') && (this.state.recMeetingExternalType === 'Demand' || this.state.recMeetingInternalType === 'Demand' || this.state.recMeetingExternalType === 'ControlBulkRecording' || this.state.recMeetingInternalType === 'ControlBulkRecording'))\r\n ) &&\r\n <>\r\n
\r\n {\r\n var res = this.validateDTMFCode(newValue, \"rodStartError\");\r\n\r\n this.setState({\r\n rodDmtfSTart: res,\r\n updated: true\r\n });\r\n }}\r\n className=\"display-inline\"\r\n disabled={!this.state.isDtmfEnabled}\r\n />\r\n
\r\n \r\n\r\n {context.getTranslation(\"configuration\", \"rodStartCode\")}
\r\n\r\n {\r\n\r\n var res = this.validateDTMFCode(newValue, \"rodStopError\");\r\n this.setState({\r\n rodDmtfStop: res,\r\n updated: true\r\n });\r\n }}\r\n className=\"display-inline\"\r\n disabled={!this.state.isDtmfEnabled}\r\n\r\n />\r\n
\r\n \r\n {context.getTranslation(\"configuration\", \"rodStopCode\")}
\r\n\r\n {\r\n var res = this.validateDTMFCode(newValue, \"suppressionCodeError\");\r\n\r\n this.setState({\r\n announcementSuppressionCode: res,\r\n updated: true\r\n });\r\n }}\r\n className=\"display-inline\"\r\n disabled={!this.state.isDtmfAnnouncementSuppressionEnabled}\r\n />\r\n
\r\n \r\n\r\n {context.getTranslation(\"configuration\", \"suppressionCode\")}
\r\n\r\n {\r\n\r\n this.setState({\r\n announcementSuppressionTimeInDays: parseInt(newValue),\r\n updated: true\r\n });\r\n }}\r\n className=\"display-inline\"\r\n disabled={!this.state.isDtmfAnnouncementSuppressionEnabled}\r\n min={0}\r\n\r\n />\r\n
\r\n {context.getTranslation(\"configuration\", \"suppressionDays\")}
\r\n\r\n
{context.getTranslation(\"configuration\", \"removeAnnouncement\")}
\r\n\r\n {context.getTranslation(\"configuration\", \"repeatEvery\")}\r\n {\r\n this.setState({\r\n ascBeeptoneFrequency: parseInt(newValue),\r\n updated: true\r\n });\r\n }}\r\n errorMessage={this.state.ascBeeptoneFrequency < 5 ? Minimum 5 seconds : \"\"}\r\n disabled={this.state.ascBeeptone ? false : true}\r\n\r\n />\r\n {context.getTranslation(\"common\", \"seconds\")}\r\n
\r\n \r\n {\r\n this.setState({\r\n disableNextRecordingReasonRequired: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n\r\n {this.state.disableNextRecordingReasonRequired && <>\r\n this.onChangeReasonsInput(event, \"disableNextRecordingReasons\", \"disableNextRecordingReasonsPlaceholder\")}\r\n placeholder=\"Up to 10 reasons, separated by '|' (e.g., 'Reason 1|Reason 2')\"\r\n />\r\n {this.state.disableNextRecordingReasonsPlaceholder}\r\n \r\n }\r\n
\r\n }\r\n {this.state.recAudioType !== \"Complex\" && \r\n { this.modifyState(\"NonComplex\", parseInt(newValue), \"wrapUpTimer\") }}\r\n disabled={!this.state.keepDeleteSettingsNonComplex.hasWrapUp}\r\n min=\"1\"\r\n max=\"900\"\r\n errorMessage={this.state.keepDeleteSettingsNonComplex.wrapUpTimer < 1 ? \"Minimum value is 1 sec\" : this.state.keepDeleteSettingsNonComplex.wrapUpTimer > 900 ? \"Maximum value is 900 sec\" : \"\"}\r\n />\r\n
\r\n \r\n\r\n
{context.getTranslation(\"configuration\", \"retentionTime\")}:
\r\n{context.getTranslation(\"configuration\", \"description\")}:
\r\n\r\n {context.getTranslation(\"configuration\", \"filter\")} \r\n {\r\n this.setState({\r\n replayFilterEnabled: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n
\r\n )}\r\n\r\n\r\n {this.state.replayFilterEnabled &&\r\n\r\n {context.getTranslation(\"dashboard\", \"startDate\")}
\r\n {context.getTranslation(\"dashboard\", \"endDate\")}
\r\n \r\n \r\n
\r\n
\r\n\r\n \r\n {\r\n if (isNaN(newValue) || newValue === \"\") {\r\n this.setState({\r\n replayDurationFrom: parseInt(-1),\r\n updated: true\r\n });\r\n } else {\r\n this.setState({\r\n replayDurationFrom: parseInt(newValue),\r\n updated: true\r\n });\r\n }\r\n }}\r\n min={0}\r\n />\r\n
\r\n \r\n {\r\n if (isNaN(newValue) || newValue === \"\") {\r\n this.setState({\r\n replayDurationTo: parseInt(-1),\r\n updated: true\r\n });\r\n } else {\r\n this.setState({\r\n replayDurationTo: parseInt(newValue),\r\n updated: true\r\n });\r\n }\r\n }}\r\n min={0}\r\n\r\n />\r\n
\r\n \r\n \r\n\r\n
{context.getTranslation(\"configuration\", \"description\")}:
\r\n\r\n {\r\n if (!newValue) {\r\n this.setState({\r\n administrateCustomFields: newValue,\r\n defActionCustomFields: false,\r\n updated: true\r\n });\r\n } else {\r\n this.setState({\r\n administrateCustomFields: newValue,\r\n updated: true\r\n });\r\n }\r\n\r\n\r\n }}\r\n />\r\n {this.state.administrateCustomFields &&
\r\n\r\n }\r\n\r\n {/*allow suspension of all conversation deletion process*/}\r\n \r\n {\r\n this.setState({\r\n defActionCustomFields: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n
}\r\n\r\n ;\r\n\r\n if (data.getAllCustomFieldDefinitions == null) {\r\n return
\r\n {\r\n this.setState({\r\n cfDisableTagging: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n
\r\n }\r\n \r\n\r\n\r\n
\r\n
\r\n{context.getTranslation(\"configuration\", \"compliancePolicy\")} \r\n {\r\n this.setState({\r\n complianceResultsAccess: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n {this.props.userRules.addOnQualityManagement && ( {\r\n this.setState({\r\n complianceQMResultsAccess: newValue,\r\n updated: true\r\n });\r\n }}\r\n />)}\r\n\r\n {\r\n this.setState({\r\n accUserCompliancePolicy: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n \r\n {\r\n this.setState({\r\n accUserCompliancePolicyActivate: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n {\r\n this.setState({\r\n accUserCompliancePolicyInitiateWorkflow: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n {\r\n this.setState({\r\n accUserCompliancePolicyEdit: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n {\r\n this.setState({\r\n accUserCompliancePolicyAssign: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n {\r\n this.setState({\r\n accUserComplianceAIQuestions: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n {this.props.userRules.addOnQualityManagement && ( {\r\n this.setState({\r\n userComplianceQM: newValue,\r\n updated: true\r\n });\r\n }}\r\n />)}\r\n {\r\n this.setState({\r\n accuserComplianceAIAssistant: newValue,\r\n updated: true\r\n });\r\n }}\r\n />\r\n \r\n\r\n\r\n {/* ConversationSafeAccessRule, to configure conversation safe access */}\r\n
)}\r\n\r\n \r\n
\r\n
\r\n
\r\n
{context.getTranslation(\"configuration\", \"userBulkIpRange\")}
\r\n{context.getTranslation(\"configuration\", \"userBulkPasswordLength\")}
\r\n\r\n {\r\n this.setState({\r\n userBulkSafeAdd: newValue,\r\n updated: true\r\n });\r\n }}*/\r\n />\r\n {\r\n this.setState({\r\n userBulkSafeRemove: newValue,\r\n updated: true,\r\n hideDialogSafe: !newValue\r\n });\r\n }}\r\n />\r\n
\r\n {/*safety dialog to alert remove from conversation safe*/}\r\n \r\n\r\n
\r\n\r\n
\r\n
\r\n\r\n
\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n if (data.getTranscriptionLocales == null) {\r\n return ;\r\n }\r\n let transcriptLanguageList = [];\r\n\r\n if (data.getTranscriptionLocales != null) {\r\n\r\n let languageNames = new Intl.DisplayNames(['en'], { type: 'language' });\r\n for (var i = 0; i < data.getTranscriptionLocales.length; i++) {\r\n var countryName = languageNames.of(data.getTranscriptionLocales[i]);\r\n transcriptLanguageList.push({\r\n key: data.getTranscriptionLocales[i],\r\n text: countryName\r\n });\r\n }\r\n }\r\n\r\n return\r\n
\r\n
\r\n\r\n
\r\n \r\n \r\n \r\n { this.handleChange(event, 1) }}\r\n value={this.state.keyword}\r\n onKeyDown={this._handleKeyDown}\r\n />\r\n \r\n \r\n {\r\n if (this.state.keyword.length > 0) {\r\n this.addToKeylist(this.state.keyword)\r\n } else {\r\n toast.error(\"Keyword to short.\", this.toastyy)\r\n }\r\n }} text={\"Add\"} />\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n {\r\n if (this.state.selectionDetails !== undefined && this.state.selectionDetails.text != null) {\r\n this.delKeylist(this.state.selectionDetails.text);\r\n } else {\r\n toast.error(\"Nothing to delete.\", this.toastyy)\r\n }\r\n }} text={\"Del\"} />\r\n \r\n \r\n \r\n\r\n\r\n
}\r\n\r\n \r\n
\r\n
\r\n\r\n }\r\n }\r\n , { key: 'column2', name: \r\n
)\r\n }\r\n \r\n \r\n
\r\n \r\n
\r\n\r\n }\r\n }\r\n , { key: 'column2', name: 'Account', fieldName: 'value', minWidth: 50, maxWidth: 160, isResizable: true }\r\n , { key: 'column3', name: 'Name', fieldName: 'key', minWidth: 50, maxWidth: 220, isResizable: true }\r\n ];\r\n\r\n getColItems = async (apol,filter) => {\r\n let _allItems = [];\r\n var data = await apol\r\n .query({\r\n query: queryGetAllGroups,\r\n variables: {\r\n auth: this.props.authorization,\r\n filter: filter\r\n }\r\n });\r\n\r\n var DataArr = data.data.getAllGroups;\r\n console.log(DataArr);\r\n if (DataArr !== undefined) {\r\n for (let i = 0; i < DataArr.length && i < 20; i++) {\r\n // Filter all users which have a license already\r\n var found = false;\r\n this.props.data.forEach(function (aGroup) {\r\n if (aGroup.adGroupId === DataArr[i].adGroupId) {\r\n found = true;\r\n };\r\n });\r\n if (found === false) {\r\n _allItems.push({\r\n key: DataArr[i].adGroupId,\r\n value: DataArr[i].name,\r\n groupId: DataArr[i].id\r\n });\r\n }\r\n }\r\n }\r\n this.setState({ groupItems: _allItems });\r\n\r\n \r\n }\r\n\r\n render(): React.ReactNode {\r\n return \r\n
;\r\n }\r\n\r\n _onItemInvoked = (item, index, ev) => {\r\n this.setState({ selectedItem: item });\r\n console.log(item.key);\r\n }\r\n\r\n\r\n _getSelectionDetails(): string {\r\n const selectionCount = this._selection.getSelectedCount();\r\n\r\n switch (selectionCount) {\r\n case 0:\r\n return '';\r\n case 1:\r\n return '';\r\n default:\r\n return `${selectionCount} Items selected`;\r\n }\r\n }\r\n\r\n\r\n notifyGroupAdd= async (apol)=> {\r\n // Add Group\r\n var groupList = [];\r\n this._selection.getSelection().forEach((aGroup) => {\r\n console.log(aGroup);\r\n groupList.push({\r\n adGroupId: aGroup.key,\r\n name: aGroup.value,\r\n id: aGroup.key,\r\n license: this.props.addType\r\n });\r\n });\r\n var data = await apol\r\n .mutate({\r\n mutation: mutationCreateGroup,\r\n refetchQueries: [{\r\n query: queryGetConfigData,\r\n variables: { auth: this.props.authorization },\r\n }],\r\n variables: {\r\n auth: this.props.authorization,\r\n group: groupList\r\n }\r\n });\r\n if (data.data.createGroup == null || data.data.createGroup.length === 0) {\r\n toast.info('Add Group not successful', {\r\n position: \"bottom-left\",\r\n autoClose: 5000,\r\n hideProgressBar: false,\r\n closeOnClick: true,\r\n pauseOnHover: true,\r\n draggable: true,\r\n });\r\n } else if (data.data.createGroup[0].name === \"error\") {\r\n toast.info('Add Group not successful: ' + data.data.createGroup[0].access, {\r\n position: \"bottom-left\",\r\n autoClose: 5000,\r\n hideProgressBar: false,\r\n closeOnClick: true,\r\n pauseOnHover: true,\r\n draggable: true,\r\n });\r\n } else {\r\n toast.info('Group added', {\r\n position: \"bottom-left\",\r\n autoClose: 5000,\r\n hideProgressBar: false,\r\n closeOnClick: true,\r\n pauseOnHover: true,\r\n draggable: true,\r\n });\r\n }\r\n };\r\n\r\n}\r\n","import React, { Component } from 'react';\r\n\r\nimport { DatePicker, FontWeights, Separator } from 'office-ui-fabric-react/lib';\r\nimport { MyContext } from '../../../context';\r\nimport { queryGetConfigData, mutationMarkDeleteImportRule, getProcessingRegions } from \"../../../queries/querySettings\";\r\nimport { toast } from 'react-toastify';\r\nimport Utils from '../../common/Utils';\r\nimport DateTimePicker from 'react-datetime-picker';\r\nimport UserPicker from '../../ReportView/ReportConfiguration/UserPicker';\r\nimport { Query } from \"@apollo/react-components\";\r\n\r\n\r\nimport gql from 'graphql-tag';\r\n\r\nimport {\r\n DefaultButton,\r\n PrimaryButton,\r\n Stack,\r\n TextField,\r\n ComboBox, Checkbox, Spinner, Text, Label, SpinButton, ChoiceGroup\r\n , Toggle\r\n} from \"office-ui-fabric-react\";\r\nimport { iniGraphqlUrl } from \"../../../ini/ini\";\r\n\r\n\r\nclass ImportConfig extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n\r\n //I added this part because for new jobs or existing recent jobs are fine with new Date() and new date(jobTime)\r\n //but we have old jobs that have as value '0001-01-01T00:00:00' and it's not working because it's not recognized as a valid DateTime because it reads as 0000-12-31T22:15:36.000Z\r\n //so in case of an old wrong value I will change it in 0001-01-01T00:00:00Z because the Z adds an extra 1h:44min and is able to read the date correct\r\n let jobTime = new Date();\r\n if (this.props.data != null && this.props.data.jobType != null) {\r\n if (this.props.data.jobType.jobStartTime === '0001-01-01T00:00:00') {\r\n jobTime = new Date('0001-01-01T00:00:00Z');\r\n } else if (this.props.data.jobType.jobStartTime === '') {\r\n jobTime = new Date();\r\n } else {\r\n jobTime = new Date(this.props.data.jobType.jobStartTime)\r\n }\r\n }\r\n let callStartTime = new Date();\r\n if (this.props.data != null && this.props.data.callStartTime != null) {\r\n if (this.props.data.callStartTime === '0001-01-01T00:00:00') {\r\n callStartTime = new Date('0001-01-01T00:00:00Z');\r\n } else if (this.props.data.callStartTime === '') {\r\n callStartTime = new Date();\r\n } else {\r\n callStartTime = new Date(this.props.data.callStartTime)\r\n }\r\n }\r\n let callEndTime = new Date();\r\n if (this.props.data != null && this.props.data.callEndTime != null) {\r\n if (this.props.data.callEndTime === '0001-01-01T00:00:00') {\r\n callEndTime = new Date('0001-01-01T00:00:00Z');\r\n } else if (this.props.data.callEndTime === '') {\r\n callEndTime = new Date();\r\n } else {\r\n callEndTime = new Date(this.props.data.callEndTime)\r\n }\r\n }\r\n\r\n\r\n let importUserGroupUsers = [];\r\n let importUserGroupIds = (this.props.data == null || this.props.data.userIds === \"undefined\" || this.props.data.userIds == null || this.props.data.userIds == \"\") ? \"\" : this.props.data.userIds;\r\n for (let x = 0; x < importUserGroupIds.length; x++) {\r\n importUserGroupUsers.push({\r\n userId: importUserGroupIds[x],\r\n key: importUserGroupIds[x]\r\n }\r\n );\r\n }\r\n\r\n this.state = {\r\n name: this.props.data != null ? this.props.data.name : \"Import\",\r\n id: this.props.isNew ? Utils.guidGenerator() : this.props.data.id,\r\n jobStartTime: jobTime,\r\n intervalType: (this.props.data != null && this.props.data.jobType != null) ? this.props.data.jobType.intervalType : \"OneTime\",\r\n intervalMonth: (this.props.data != null && this.props.data.jobType != null) ? this.props.data.jobType.intervalMonth : 0,\r\n intervalDay: (this.props.data != null && this.props.data.jobType != null) ? this.props.data.jobType.intervalDay : 0,\r\n intervalHour: (this.props.data != null && this.props.data.jobType != null) ? this.props.data.jobType.intervalHour : 0,\r\n intervalMinute: (this.props.data != null && this.props.data.jobType != null) ? this.props.data.jobType.intervalMinute : 0,\r\n importType: (this.props.data != null && this.props.data.importType != null) ? this.props.data.importType : \"Neo\",\r\n mappingType: (this.props.data != null && this.props.data.mappingType != null) ? this.props.data.mappingType : \"UsersToUsers\",\r\n mappingUserId: (this.props.data == null || this.props.data.mappingUserId == null) ? [] : [{\r\n userId: this.props.data.mappingUserId\r\n }],\r\n sourceTtl: this.props.isNew ? -1 : this.props.data.sourceTtl,\r\n sourceTtlEnabled: this.props.isNew ? false : this.props.data.sourceTtl != -1,\r\n storageConnectionString: this.props.isNew ? \"\" : this.props.data.storageConnectionString,\r\n storageContainerName: this.props.isNew ? \"ascimport\" : this.props.data.storageContainerName,\r\n storageRootDirectory: this.props.isNew ? \"\" : this.props.data.storageRootDirectory,\r\n targetTtl: this.props.isNew ? \"730\" : this.props.data.targetTtl,\r\n enabled: this.props.isNew ? \"true\" : this.props.data.enabled,\r\n processingRegion: this.props.isNew ? \"EU\" : this.props.data.processingRegion,\r\n sftpPrivateKeyUpload: (this.props.data != null && this.props.data.sftpPrivateKeyUpload != null) ? this.props.data.sftpPrivateKeyUpload : \"\",\r\n hasSftpKey: (this.props.data !== null && this.props.data.hasSftpKey !== null) ? this.props.data.hasSftpKey : false,\r\n jobDeletionActive: false,\r\n callStartTime: callStartTime,\r\n callEndTime: callEndTime,\r\n userIds: importUserGroupUsers,\r\n transferId: this.props.isNew ? \"New transfer\" : this.props.data.transferId,\r\n downloadNeoTransferTextBtn: \"downloadNeoTransferFile\",\r\n isValidUUID: true\r\n\r\n };\r\n }\r\n loadFile = async (file) => {\r\n let text = await file.text();\r\n this.setState({ sftpPrivateKeyUpload: text });\r\n }\r\n\r\n onFileChange = event => {\r\n\r\n let activeFile = event.target.files[0];\r\n\r\n if (activeFile) {\r\n this.setState({ hasSftpKey: true });\r\n\r\n }\r\n\r\n if (event.target.files[0]) {\r\n\r\n this.loadFile(event.target.files[0]);\r\n }\r\n\r\n };\r\n\r\n downloadNeoTransferFile = async () => {\r\n this.setState({ downloadNeoTransferTextBtn: \"downloading\" });\r\n let data = await this.props.apol\r\n .mutate({\r\n mutation: gql`\r\n mutation ent ($input: AuthInput, $transferId:String, $graphAPIUri:String) {\r\n downloadNeoTransferFile (input: $input, transferId:$transferId, graphAPIUri:$graphAPIUri) \r\n }\r\n `,\r\n variables: {\r\n input: this.props.authorization,\r\n transferId: this.state.transferId,\r\n graphAPIUri: iniGraphqlUrl\r\n },\r\n });\r\n if (data.data.downloadNeoTransferFile !== null) {\r\n let content = data.data.downloadNeoTransferFile;\r\n if (!content) {\r\n toast.error('Download not successful', {\r\n position: \"bottom-left\",\r\n autoClose: 5000,\r\n hideProgressBar: false,\r\n closeOnClick: true,\r\n pauseOnHover: true,\r\n draggable: true,\r\n });\r\n this.setState({ downloadNeoTransferTextBtn: \"downloadNeoTransferFile\" });\r\n\r\n } else {\r\n let blob = new Blob([content], { type: \"text/plain\" });\r\n let url = window.URL.createObjectURL(blob);\r\n let a = document.createElement('a');\r\n a.href = url;\r\n a.download = \"transfer_[\" + this.props.data.tenantId + \"]_[\" + this.state.transferId + \"].bin\";\r\n a.click();\r\n this.setState({ downloadNeoTransferTextBtn: \"downloadNeoTransferFile\" });\r\n }\r\n\r\n }\r\n }\r\n\r\n validateUUID = (value) => {\r\n if (value === \"New Transfer\") {\r\n return true; // Accept placeholder \"New Transfer\"\r\n }\r\n const uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;\r\n return uuidRegex.test(value);\r\n }\r\n\r\n handleTransferIdChange = (event, newValue) => {\r\n const isValidUUID = this.validateUUID(newValue);\r\n this.setState({ transferId: newValue, isValidUUID });\r\n }\r\n render() {\r\n\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalMonth: newValue\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalDay: newValue\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalHour: newValue,\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n e.preventDefault()}\r\n label={context.getTranslation(\"configuration\", \"cycleMinute\")}\r\n value={this.state.intervalMinute}\r\n onChange={(event, newValue) => {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalMinute: newValue\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n
\r\n\r\n
\r\n \r\n
\r\n {this.state.hasSftpKey ? context.getTranslation(\"common\", \"updateFile\") : context.getTranslation(\"common\", \"uploadFile\")}\r\n
{this.state.sftpPrivateKeyUpload\r\n ? \r\n : context.getTranslation(\"common\", \"noFileSelected\")}
\r\n\r\n {this.state.importType !== \"NeoTransfer\" &&\r\n \r\n }\r\n\r\n {/* import connection string */}\r\n {this.state.importType !== \"NeoTransfer\" &&
\r\n
\r\n {![\"Genesys\", \"Numonix\", \"Kerv\", \"SmartNumbers\", \"Verba\", \"Abelia\", \"DC\",\"NeoTransfer\"].includes(this.state.importType) && <>\r\n\r\n \r\n
\r\n
\r\n
\r\n
\r\n\r\n
\r\n {(context) => (<> {context.getTranslation(\"common\", \"loadingRegions\")})}} ariaLive=\"assertive\" labelPosition=\"top\" />\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getProcessingRegions == null) {\r\n return ;\r\n }\r\n\r\n const licenseText = {\r\n EU: \"EU\",\r\n US: \"USA\",\r\n AS: \"APAC\",\r\n EUW: \"EUW\",\r\n };\r\n this.tmpKey = [];\r\n const license = data.getProcessingRegions;\r\n if (data.getProcessingRegions != null) {\r\n for (let x = 0; x < license.length; x++) {\r\n let i = {\r\n key: license[x],\r\n text: licenseText[license[x]] || license[x],\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n\r\n return
\r\n\r\n
\r\n\r\n
\r\n
\r\n\r\n \r\n\r\n
\r\n {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalMonth: parseInt(newValue)\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalDay: parseInt(newValue)\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalHour: parseInt(newValue),\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n e.preventDefault()}\r\n label={context.getTranslation(\"configuration\", \"cycleMinute\")}\r\n value={this.state.intervalMinute}\r\n onChange={(event, newValue) => {\r\n if (newValue < 0)\r\n newValue = 0;\r\n this.setState({\r\n intervalMinute: parseInt(newValue)\r\n })\r\n }}\r\n disabled={(this.props.data !== null && this.props.data.isArchived) ? true : false}\r\n\r\n />\r\n\r\n
\r\n\r\n \r\n
\r\n
\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getAWSRegions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n const stack = data.getAWSRegions;\r\n if (data.getAWSRegions != null) {\r\n for (let x = 0; x < stack.length; x++) {\r\n let i = {\r\n key: stack[x].code,\r\n text: stack[x].displayName,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return
\r\n \r\n
\r\n }\r\n {(this.state.exportType === \"AuditLogSFTPCustom\" || this.state.exportType === \"AuditEvent\") &&\r\n {this.state.selectedFile ? context.getTranslation(\"common\", \"updateFile\") : context.getTranslation(\"common\", \"uploadFile\")}\r\n
{this.state.selectedFile\r\n ? \r\n : context.getTranslation(\"common\", \"noFileSelected\")}
\r\n\r\n
\r\n {this.state.exportType !== \"NeoTransfer\" &&\r\n \r\n }\r\n\r\n {(this.state.exportType === \"eKontakt\" || this.state.exportType === \"AuditLogSFTPCustom\" || this.state.exportType === \"AuditEvent\" || this.state.exportType === \"SFTP\") &&\r\n
\r\n \r\n
\r\n {this.state.hasSftpKey ? context.getTranslation(\"common\", \"updateFile\") : context.getTranslation(\"common\", \"uploadFile\")}\r\n
{this.state.sftpPrivateKeyUpload\r\n ? \r\n : context.getTranslation(\"common\", \"noFileSelected\")}
\r\n\r\n {(this.state.exportType !== \"AuditLogSFTPCustom\" && this.state.exportType !== \"AuditEvent\" && this.state.exportType !== \"NeoTransfer\") && <>\r\n
\r\n \r\n
\r\n
\r\n\r\n {/*merge audio into video*/}\r\n {(this.state.exportType !== \"Bloomberg\" && this.state.exportType !== \"eKontakt\" && this.state.exportType !== \"AuditLogSFTPCustom\" && this.state.exportType !== \"Neo\" && this.state.exportType !== \"AuditEvent\") && <>\r\n
\r\n
\r\n \r\n }\r\n\r\n\r\n\r\n \r\n\r\n\r\n\r\n {/* media type */}\r\n {(this.state.exportType !== \"AuditLogSFTPCustom\" && this.state.exportType !== \"eKontakt\" && this.state.exportType !== \"AuditEvent\") &&
\r\n {(context) => (<> {context.getTranslation(\"common\", \"loadingRegions\")})}} ariaLive=\"assertive\" labelPosition=\"top\" />\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getProcessingRegions == null) {\r\n return ;\r\n }\r\n\r\n const licenseText = {\r\n EU: \"EU\",\r\n US: \"USA\",\r\n AS: \"APAC\",\r\n EUW: \"EUW\",\r\n };\r\n this.tmpKey = [];\r\n const license = data.getProcessingRegions;\r\n if (data.getProcessingRegions != null) {\r\n for (let x = 0; x < license.length; x++) {\r\n let i = {\r\n key: license[x],\r\n text: licenseText[license[x]] || license[x],\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n\r\n return
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n\r\n {this.state.integrationType !== \"LeapXpert\" &&\r\n \r\n }\r\n\r\n\r\n {/* import connection string */}\r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n\r\n
\r\n
;\r\n if (error) return {context.getTranslation(\"detailContainer\", \"failedToConnect\")}
;\r\n\r\n if (data.getAuditData == null) {\r\n return ;\r\n }\r\n this.audit = data.getAuditData;\r\n this.audit.map(({ key }, i) => {\r\n if (this.props.events.includes(key)) {\r\n this.audit[i].checked = true;\r\n } else {\r\n this.audit[i].checked = false;\r\n }\r\n });\r\n return this._renderNormalPicker()\r\n }\r\n }\r\n )\r\n }\r\n\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n\r\n if (data[querySelection.data] == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n this.tenants = [];\r\n\r\n if (querySelection.data != null) {\r\n const availableJobs = data[querySelection.data];\r\n //check how many tenants the user has access to\r\n this.tenants = availableJobs.map(job => ({ key: job.tenantId, text: job.tenantId }));\r\n\r\n //if user has access to only one tenant jobs will be directly displayed\r\n let selectedTenantJobs = [];\r\n if (this.tenants.length === 1) {\r\n selectedTenantJobs = availableJobs.find(tenant => tenant.tenantId === (this.tenants[0].key))?.jobList || [];\r\n } else {//else user have to select tenant first\r\n\r\n selectedTenantJobs = availableJobs.find(tenant => tenant.tenantId === (this.state.tenantId))?.jobList || [];\r\n }\r\n\r\n this.tmpKey = selectedTenantJobs.map(job => ({ key: job.jobId, text: job.jobName }));\r\n\r\n\r\n }\r\n\r\n\r\n return\r\n \r\n\r\n
\r\n )\r\n }\r\n \r\n \r\n \r\n {\r\n if (newValue == \"CC\")\r\n this.setState({ changedCycle: \"Current\" });\r\n\r\n this.setState({\r\n changedTitle: newValue\r\n });\r\n }}\r\n errorMessage={this.state.changedTitle === '' ? \"Set Title\" : \"\"}\r\n />\r\n \r\n\r\n \r\n {\r\n this.setState({\r\n showAllVersionPolicies: option.key === \"AICategorizationKPI\" || (option.key === \"Policies\" && this.state.changedWidget === \"TagCloud\") ? false : true,\r\n changedWidget: this.getWidgetOptionKey(option.key),\r\n changedKpi: option.key,\r\n tValue: this.getValueOptionKey(option.key),\r\n tType: this.getTypeOptionKey(this.getWidgetOptionKey(option.key), option.key),\r\n changedCycle: this.getCycleOptionKey(option.key),\r\n selectedOptionKeys: [],\r\n sel4list: null,\r\n selectedJobs: [],\r\n jobList: null\r\n });\r\n }}\r\n options={this.getKpiList(context)}\r\n\r\n />\r\n\r\n \r\n\r\n \r\n {\r\n this.setState({\r\n user: user\r\n });\r\n }}\r\n />\r\n\r\n {this.state.changedKpi === \"QMAgentCompared\" &&\r\n (this.state.changedWidget === \"SplineChart\" || this.state.changedWidget === \"SimpleBarChart\" || this.state.changedWidget === \"StackedBarChart\") && (\r\n \r\n {this.state.user.length < 1 && context.getTranslation(\"compliance\", \"selectUserOrGroupError1\")}\r\n {this.state.user.length > 6 && context.getTranslation(\"compliance\", \"selectUserOrGroupError6\")}\r\n \r\n )\r\n }\r\n\r\n \r\n\r\n \r\n {\r\n this.setState({\r\n changedWidget: option.key,\r\n tType: this.getTypeOptionKey(option.key, this.state.changedKpi),\r\n changedCycle: this.getCycleOptionKey(this.state.changedKpi, option.key),\r\n alarming: option.key != \"Number\" ? false : this.state.alarming,\r\n showAllVersionPolicies: option.key === \"TagCloud\" && this.state.changedKpi === \"Policies\" ? false : true\r\n });\r\n }}\r\n />\r\n \r\n \r\n {\r\n this.setState({\r\n tType: newVal.key\r\n });\r\n }}\r\n />\r\n \r\n {(this.state.changedKpi !== \"AU\" && this.state.changedKpi !== \"AgentsOnCall\" && this.state.changedKpi !== \"LiveInbound\" && this.state.changedKpi !== \"LiveTotal\" && this.state.changedKpi !== \"AgentTalkTime\" && this.state.changedKpi !== \"CC\" && this.state.changedKpi !== \"GCC\" && this.state.changedKpi !== \"CNR\") && \r\n {\r\n if (item) {\r\n this.setState({\r\n conversationType: item.selected ? [...this.state.conversationType, item.key] : this.state.conversationType.filter(key => key !== item.key)\r\n });\r\n }\r\n }}\r\n autoComplete={true}\r\n allowFreeform={false}\r\n label={context.getTranslation(\"dashboard\", \"conversationType\")}\r\n />\r\n }\r\n {(this.state.changedKpi === \"CNR\") && \r\n {\r\n if (item) {\r\n this.setState({\r\n problemTypes: item.selected ? [...this.state.problemTypes, item.key] : this.state.problemTypes.filter(key => key !== item.key)\r\n });\r\n }\r\n }}\r\n autoComplete={true}\r\n allowFreeform={false}\r\n label={context.getTranslation(\"dashboard\", \"problemTypes\")}\r\n />\r\n }\r\n \r\n {\r\n this.setState({\r\n tValue: newVal.key\r\n });\r\n }}\r\n label={context.getTranslation(\"dashboard\", \"valueType\")}\r\n />\r\n \r\n {this.props.userRules.allowedTenants != null && this.props.userRules.allowedTenants.length > 0 &&\r\n \r\n {\r\n this.setState({\r\n tenantId: newVal.key\r\n });\r\n }}\r\n />\r\n \r\n }\r\n {this.props.userRules.ruleAccess != null && this.props.userRules.ruleAccess.tenantCreate && \r\n { this.setState({ botAppId: event.target.value }) }}\r\n />\r\n\r\n }\r\n\r\n {this.props.userRules.ruleAccess != null && \r\n {(this.state.changedKpi === 'Exported' || this.state.changedKpi === 'Export' || this.state.changedKpi === 'Imported' || this.state.changedKpi === 'NotImported') && <>\r\n {this.renderAvailableJobs()}\r\n \r\n }\r\n }\r\n\r\n \r\n {\r\n this.setState({\r\n tForm: newVal.key\r\n });\r\n }}\r\n label={context.getTranslation(\"dashboard\", \"timeFormat\")}\r\n />\r\n \r\n\r\n {this.selectForm()}\r\n\r\n \r\n {this.renderKeyWordInput()}\r\n \r\n {!this.props.userRules.ruleAccess.denyReportAlarming && \r\n {(this.state.changedWidget == \"Number\" && this.state.changedKpi != \"QMAgentCompared\") && \r\n {\r\n this.setState({\r\n alarming: newValue\r\n });\r\n }}\r\n />\r\n }\r\n {this.state.alarming && \r\n \r\n ' },\r\n { key: 'lowerThan', text: '<' },\r\n { key: 'greaterThanOrEqual', text: '>=' },\r\n { key: 'lowerThanOrEqual', text: '<=' },\r\n { key: 'equalTo', text: '==' },\r\n { key: 'change', text: '<>' }\r\n ]}\r\n onChange={(ev, newVal) => {\r\n this.setState({\r\n alarmingEvent: newVal.key\r\n });\r\n }}\r\n label={context.getTranslation(\"filterPanel\", \"valueType\")}\r\n />\r\n\r\n \r\n \r\n {\r\n this.setState({\r\n alarmingValue: event.target.value\r\n })\r\n }}\r\n />\r\n \r\n }\r\n\r\n {(this.state.alarming) && \r\n {\r\n this.setState({\r\n alarmingMail: event.target.value,\r\n domainCheck: \"\"\r\n })\r\n }}\r\n />\r\n \r\n
\r\n\r\n {this.state.alarmingMail ? (\r\n { this.checkMailForDomainRestrictions(this.props.apol) }} />\r\n ) : (\r\n }\r\n\r\n {!this.props.userRules.ruleAccess.denyReportAlarming && this.jobType()}\r\n\r\n\r\n }\r\n \r\n \r\n \r\n\r\n
\r\n\r\n \r\n {context.getTranslation(\"dashboard\", \"selectedUser\")}
\r\n\r\n\r\n {this.state.alarmingMail ? (\r\n
\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n\r\n if (data.getAllCategoryVersions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n this.tmpKey.push({ key: \"Header1\", text: \"Categories\", itemType: 2 });\r\n if (data.getAllCategoryVersions.categorydata != null) {\r\n let dataFilter = data.getAllCategoryVersions.categorydata;\r\n if (!this.state.showAllVersionCategories) {\r\n dataFilter = data.getAllCategoryVersions.categorydata.filter(c => c.selected)\r\n }\r\n for (let x = 0; x < dataFilter.length; x++) {\r\n let i = {\r\n name: dataFilter[x].name + \" - v\" + dataFilter[x].version,\r\n fromCompliance: dataFilter[x].fromCompliance,\r\n text: dataFilter[x].name + \" - v\" + dataFilter[x].version,\r\n keywords: dataFilter[x].keywords,\r\n id: dataFilter[x].id,\r\n key: dataFilter[x].id,\r\n tenantId: dataFilter[x].tenantId,\r\n frequence: dataFilter[x].frequence,\r\n link: dataFilter[x].link,\r\n sentiments: dataFilter[x].sentiments,\r\n selectedDb: dataFilter[x].selected,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n const allCategories = this.tmpKey\r\n const allButComplianceCategories = allCategories.filter(e => e.fromCompliance == false)\r\n return\r\n {/*combobox for category selection*/}\r\n
\r\n }}\r\n \r\n )\r\n }\r\n\r\n \r\n {\r\n let showAllVersionCategories = !this.state.showAllVersionCategories\r\n let optionIds = []\r\n let optionsCategories = (this.props.userRules?.ruleAccess?.complianceResultsAccess ?? false)\r\n && (this.props.userRules?.addOnCompliance ?? false) ? allCategories : allButComplianceCategories;\r\n if (showAllVersionCategories) {\r\n optionIds = optionsCategories.map(p => p.id);\r\n } else {\r\n optionIds = optionsCategories.filter(p => p.selectedDb).map(p => p.id);\r\n }\r\n let selectedOptionKeys = this.state.selectedOptionKeys.filter(p => optionIds.includes(p));\r\n this.setState({\r\n showAllVersionCategories,\r\n selectedOptionKeys\r\n })\r\n }}\r\n />\r\n
\r\n Failed to connect
;\r\n if (data.getAllPolicyVersions == null) {\r\n return ;\r\n }\r\n //console.log(data.getAllPolicyVersions)\r\n var options = [];\r\n options.push({ key: \"Header1\", text: context.getTranslation(\"compliance\", \"policiesSelecion\"), itemType: 2 });\r\n if (data.getAllPolicyVersions !== null && data.getAllPolicyVersions.length > 0) {\r\n this.allPolicy = data.getAllPolicyVersions\r\n let dataFilter = []\r\n if (this.state.showAllVersionPolicies) {\r\n dataFilter = data.getAllPolicyVersions\r\n } else {\r\n dataFilter = data.getAllPolicyVersions.filter(pol => pol.selected)\r\n }\r\n if (this.state.changedKpi === 'AICategorizationKPI') {\r\n dataFilter.filter(e => e.basedOn === \"AICategorization\").forEach(p => {\r\n let o = {\r\n name: p.name,\r\n text: p.name,\r\n key: p.id,\r\n id: p.id,\r\n selectedDB: p.selected\r\n }\r\n options.push(o);\r\n })\r\n } else if (this.state.changedKpi === 'Policies' || this.state.changedKpi === 'PolicyCompared') {\r\n dataFilter.filter(e => e.basedOn === \"PolicyRule\").forEach(p => {\r\n let o = {\r\n name: p.name,\r\n text: p.name + \" - v\" + p.version,\r\n key: p.id,\r\n id: p.id,\r\n masterItemId: p.masterItemId,\r\n selectedDB: p.selected\r\n }\r\n options.push(o);\r\n })\r\n } else if (this.state.changedKpi === \"QMAgentCompared\") {\r\n dataFilter.filter(e => e.basedOn === \"Scorecard\" && e.selected).forEach(p => {\r\n let o = {\r\n name: p.name,\r\n text: p.name,\r\n key: p.id,\r\n id: p.id,\r\n selectedDB: p.selected\r\n }\r\n options.push(o);\r\n })\r\n }\r\n }\r\n const uniqueOptions = options.reduce((acc, currentItem) => {\r\n const itemExists = acc.find(item => item.key === currentItem.key);\r\n if (!itemExists) {\r\n acc.push(currentItem);\r\n }\r\n return acc;\r\n }, []);\r\n this.tmpKey = uniqueOptions;\r\n return\r\n {/*combobox for policy selection*/}\r\n
\r\n }}\r\n \r\n )\r\n }\r\n\r\n \r\n {\r\n let showAllVersionPolicies = !this.state.showAllVersionPolicies\r\n let optionIds = []\r\n if (showAllVersionPolicies) {\r\n optionIds = uniqueOptions.map(p => p.id)\r\n } else {\r\n optionIds = uniqueOptions.filter(p => p.selectedDB).map(p => p.id)\r\n }\r\n let selectedOptionKeys = this.state.selectedOptionKeys.filter(p => optionIds.includes(p))\r\n //thre is a mess with this field sel4list and also is bad that policies ids are saved in categories field in the db\r\n let sel4list = uniqueOptions.filter(p => selectedOptionKeys.includes(p.id))\r\n this.setState({\r\n showAllVersionPolicies,\r\n selectedOptionKeys,\r\n sel4list\r\n })\r\n }}\r\n />\r\n
}\r\n \r\n {' '}\r\n\r\n {context.getTranslation(\"dashboard\", \"auditLogEvents\")} \r\n {\r\n //console.log(audit); \r\n this.setState({\r\n changedKeyword: audit\r\n });\r\n }} />\r\n
\r\n )\r\n }\r\n {context.getTranslation(\"dashboard\", \"startDate\")}
\r\n {context.getTranslation(\"dashboard\", \"endDate\")}
\r\n \r\n
\r\n {\r\n this.setState({\r\n mailMonth: newValue,\r\n reportDomainCheck: \"\"\r\n })\r\n }}\r\n />\r\n\r\n
\r\n\r\n \r\n {\r\n this.setState({\r\n mailDay: newValue,\r\n reportDomainCheck: \"\"\r\n })\r\n }}\r\n />\r\n\r\n
\r\n\r\n \r\n {\r\n this.setState({\r\n mailHour: newValue,\r\n reportDomainCheck: \"\"\r\n })\r\n }}\r\n />\r\n\r\n
\r\n \r\n\r\n {this.state.reportMail ? (\r\n
\r\n {this.renderRules()}\r\n {this.renderOptions()}\r\n
\r\n );\r\n\r\n };\r\n showInfo = (user) => {\r\n if (user.length === 1) {\r\n\r\n\r\n let userContent = {\r\n name: user[0].name,\r\n department: user[0].department,\r\n office: user[0].department,\r\n superviser: \"\",\r\n street: \"\",\r\n city: \"\",\r\n zip: \"\",\r\n country: \"\"\r\n };\r\n\r\n\r\n return (\r\n \r\n
\r\n
\r\n )\r\n }\r\n \r\n
{context.getTranslation(\"configuration\", \"department\")}: {userContent.department}
\r\n{context.getTranslation(\"configuration\", \"office\")}: {userContent.office}
\r\n{context.getTranslation(\"configuration\", \"supervisor\")}: {userContent.superviser}
\r\n{context.getTranslation(\"configuration\", \"street\")}: {userContent.street}
\r\n{context.getTranslation(\"configuration\", \"city\")}: {userContent.city}
\r\n{context.getTranslation(\"configuration\", \"zip\")}: {userContent.zip}
\r\n{context.getTranslation(\"configuration\", \"country\")}: {userContent.country}
\r\n\r\n {user.map(({ name }, i) => {\r\n return (\r\n
\r\n );\r\n\r\n }\r\n }\r\n\r\n toggleSaveButton = (newRules) => {\r\n if (this.state.changed === false) {\r\n this.setState({ changed: true });\r\n }\r\n this.setState(newRules);\r\n };\r\n\r\n renderRules = () => {\r\n return \r\n
\r\n
\r\n
\r\n )\r\n }\r\n \r\n
{context.getTranslation(\"configuration\", \"rules\")}
\r\n\r\n
\r\n
\r\n )\r\n }\r\n \r\n
\r\n {this.buttenSel(this.state.changed)}\r\n
\r\n\r\n
\r\n
\r\n )}\r\n \r\n\r\n \r\n\r\n \r\n
\r\n {context.getTranslation(\"configuration\", \"deleteUserQuestion\")} {this.getUserNames()} ?
\r\n\r\n
\r\n
\r\n )\r\n }\r\n {context.getTranslation(\"configuration\", \"unlinkAccount\")} : {item.value}
\r\n\r\n\r\n
\r\n
\r\n )\r\n }\r\n \r\n
{context.getTranslation(\"configuration\", \"linkedAccounts\")}
\r\n\r\n\r\n
\r\n
\r\n )\r\n }\r\n\r\n \r\n \r\n \r\n
\r\n \r\n\r\n
\r\n\r\n \r\n\r\n
\r\n {context.getTranslation(\"configuration\", \"linkAccount\")}
\r\n\r\n\r\n
\r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n \r\n {this.state.message}
\r\n \r\n {props.item.isArchived\r\n ? defaultRender({ ...props, styles: { root: { backgroundColor: '#EDEDED', color: '#666666' } } })\r\n : defaultRender({ ...props })\r\n }\r\n
\r\n )}\r\n />\r\n \r\n {(context) => (<> {context.getTranslation(\"settings\", \"on\")})}}\r\n offText={{(context) => (<> {context.getTranslation(\"settings\", \"off\")})} }\r\n onChange={(ev, checked) => {\r\n this.setDisplayArchive(checked);\r\n }}\r\n />
\r\n \r\n }\r\n };\r\n\r\n return [addButton, displayArchive];\r\n\r\n };\r\n\r\n _onColumnClick = (ev: React.MouseEvent{item.defaultStorage}
\r\n ),\r\n styles: headerStyle\r\n\r\n },\r\n\r\n ];\r\n\r\n let defaultStorageItem = [\r\n {\r\n key: '1',\r\n defaultStorage: this.getDefaultStorage(),\r\n },\r\n ];\r\n\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.setState({\r\n selectionDetails: this._getSelectionDetails()\r\n });\r\n }\r\n });\r\n\r\n this.state = {\r\n items: this._allItems,\r\n columns: columns,\r\n selectionDetails: this._getSelectionDetails(),\r\n isModalSelection: false,\r\n isCompactMode: true,\r\n filter: \"\",\r\n defaultStorageItem: defaultStorageItem,\r\n columnsDefaultSetting: columnsDefaultSetting\r\n };\r\n }\r\n\r\n render() {\r\n const { columns, isCompactMode, isModalSelection, columnsDefaultSetting, defaultStorageItem } = this.state;\r\n this.storageData = this._generateDocuments(this.props.data, this.state.filter);\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n }\r\n \r\n {emailsList.map(email => {\r\n return {email}\r\n })}\r\n
\r\n }\r\n },\r\n {\r\n key: 'col6', name:{item.NotificationText}
\r\n }\r\n },\r\n {\r\n key: 'col4', name:\r\n {(context) => (<> {context.getTranslation(\"configuration\", \"notifications\")})} \r\n\r\n
\r\n \r\n
\r\n \r\n }\r\n\r\n {/* mapping modal*/}\r\n {this.state.showModalMapping &&\r\n \r\n {(context) => (<> {context.getTranslation(\"configuration\", \"Mapping\")})} \r\n\r\n
\r\n \r\n
\r\n \r\n }\r\n - \r\n {this.state.mappingItems.split(\",\").map((item,i) => {\r\n return
- {item} \r\n })}\r\n
\r\n {emailsList.map(email => {\r\n return {email}\r\n })}\r\n
\r\n }\r\n\r\n },\r\n {\r\n key: 'col6', name:{item.NotificationText}
\r\n }\r\n },\r\n {\r\n key: 'col4', name:\r\n
\r\n
\r\n
\r\n
\r\n{(context) => (<> {context.getTranslation(\"dashboard\", \"checkValidity\")})}}\r\n onClick={(event) => { this.checkTTLValidity(this.props.apol, \"csRetentionTimeFieldYes\", \"csRetentionTimeBtnYes\", this.state.ttlSettingYes, \"Yes\") }}\r\n style={{ width: \"100px\", marginTop: \"5px\", padding: \"0px\" }}\r\n disabled={this.state.TTLLoading}\r\n />\r\n {this.state.ttlBtnMessageYes && {(context) => (<> {context.getTranslation(\"common\", \"no\")})}, onClick: () => { this.setState({ ttlBtnMessageYes: false, ttlConfirmed: false }) } }}\r\n primaryButtonProps={{ children: {(context) => (<> {context.getTranslation(\"common\", \"yes\")})} , onClick: () => { this.setState({ ttlBtnMessageYes: false, ttlConfirmed: true }) } }}\r\n headline={{(context) => (<> {context.getTranslation(\"common\", \"warning\")})} \r\n }\r\n\r\n >\r\n {(context) => (<> {context.getTranslation(\"tenants\", \"TTLErrorMessage\")})} \r\n\r\n }\r\n
\r\n \r\n {\r\n this.validateInputs(\"ttlSettingYes\", newValue);\r\n }}\r\n min={1}\r\n disabled={!this.props.userRules.ruleAccess.confDefineActionOnCustomFields}\r\n\r\n />\r\n
\r\n Yes\r\n
\r\n {\r\n this.validateInputs(\"ttlSettingNo\", newValue);\r\n }}\r\n min={1}\r\n disabled={!this.props.userRules.ruleAccess.confDefineActionOnCustomFields}\r\n />\r\n No\r\n
\r\n{(context) => (<> {context.getTranslation(\"dashboard\", \"checkValidity\")})}}\r\n onClick={(event) => { this.checkTTLValidity(this.props.apol, \"csRetentionTimeFieldNo\", \"csRetentionTimeBtnNo\", this.state.ttlSettingNo) }}\r\n style={{ width: \"100px\", marginTop: \"5px\", padding: \"0px\" }}\r\n disabled={this.state.TTLLoading}\r\n\r\n />\r\n {this.state.ttlBtnMessageNo && {(context) => (<> {context.getTranslation(\"common\", \"no\")})}, onClick: () => { this.setState({ ttlBtnMessageNo: false, ttlConfirmed: false }) } }}\r\n primaryButtonProps={{ children: {(context) => (<> {context.getTranslation(\"common\", \"yes\")})} , onClick: () => { this.setState({ ttlBtnMessageNo: false, ttlConfirmed: true }) } }}\r\n headline={{(context) => (<> {context.getTranslation(\"common\", \"warning\")})} \r\n }\r\n\r\n >\r\n {(context) => (<> {context.getTranslation(\"tenants\", \"TTLErrorMessage\")})} \r\n\r\n }\r\n
\r\n\r\n\r\n }\r\n \r\n
\r\n
\r\n {\r\n this.setState({\r\n CheckboxDependencyType: newValue.key\r\n });\r\n }}\r\n disabled={!this.props.userRules.ruleAccess.confDefineActionOnCustomFields}\r\n\r\n />\r\n \r\n\r\n
\r\n }\r\n \r\n
\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getAWSRegions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n const stack = data.getAWSRegions;\r\n if (data.getAWSRegions != null) {\r\n for (let x = 0; x < stack.length; x++) {\r\n let i = {\r\n key: stack[x].code,\r\n text: stack[x].displayName,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return
\r\n
\r\n\r\n\r\n
\r\n this.notifyStorageChange(this.props.apol)}\r\n text={context.getTranslation(\"common\", \"save\")}\r\n disabled={this.saveDisableCheck()}\r\n style={{ marginRight: \"10px\" }}\r\n />\r\n { this.props.cl() }} text={context.getTranslation(\"common\", \"cancel\")} />\r\n
\r\n )\r\n }\r\n )\r\n }\r\n\r\n\r\n notifyStorageChange = async (apol) => {\r\n //Add or change storage\r\n this.setState({ isSaving: true });\r\n var storage;\r\n\r\n storage = {\r\n id: this.state.id,\r\n group: this.state.group,\r\n storageAccountName: this.state.storageAccountName,\r\n visibleForAssignment: this.state.visibleForAssignment,\r\n isActive: this.state.isActive,\r\n displayName: this.state.displayName,\r\n awsAccessKeyId: this.state.awsAccessKeyId,\r\n awsSecretAccess: this.state.awsSecretAccess,\r\n awsBucketName: this.state.awsBucketName,\r\n awsRegion: this.state.awsRegion,\r\n awsType: this.state.awsType,\r\n awsServiceUrl: this.state.awsServiceUrl,\r\n storageLocation: this.state.storageLocation,\r\n useRegionalEncryption: this.state.useRegionalEncryption,\r\n keyVaultUrl: this.state.keyVaultUrl,\r\n secretName: this.state.secretName,\r\n isAsymmetric: this.state.isAsymmetric,\r\n\r\n };\r\n if (this.props.data != null) {\r\n var data = await apol\r\n .mutate({\r\n mutation: mutationUpdateStorage,\r\n refetchQueries: [{\r\n query: queryGetConfigData,\r\n variables: { auth: this.props.authorization },\r\n }],\r\n variables: {\r\n auth: this.props.authorization,\r\n storage: storage\r\n }\r\n });\r\n if (data.data.updateStorage == null) {\r\n toast.error(\r\n
\r\n )\r\n }\r\n\r\n _onDismissPanel = (): void => {\r\n this.setState({\r\n showPanel: false\r\n });\r\n };\r\n\r\n rules = [];\r\n\r\n _show = (current, vall) => {\r\n switch (vall) {\r\n case undefined:\r\n case null:\r\n break;\r\n default:\r\n if (current == null) {\r\n this.setState({ showPanel: true, case: vall, info: null, isEdit: false });\r\n\r\n }\r\n else {\r\n switch (current.length) {\r\n case undefined:\r\n this.setState({ showPanel: true, case: vall, info: [current], isEdit: true });\r\n break;\r\n default:\r\n this.setState({ showPanel: true, case: vall, info: current, isEdit: true });\r\n break;\r\n }\r\n }\r\n }\r\n }\r\n\r\n query = (layerFunction, auth, apol, userRules) => {\r\n\r\n return \r\n
\r\n \r\n\r\n
\r\n\r\n \r\n\r\n \r\n {this.state.showPanel && (\r\n \r\n {(context) => (\r\n \r\n {this.panelSelect()}\r\n )}\r\n \r\n\r\n )}\r\n \r\n\r\n\r\n
\r\n \r\n \r\n {this.query(this._show, this.props.authorization, this.props.apol, this.props.userRules)}\r\n\r\n \r\n\r\n
\r\n \r\n
;\r\n if (error) {\r\n console.log(error)\r\n return (\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getRuleRecording == null) {\r\n return
\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getRuleReplay == null) {\r\n return
\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getRuleAccess == null) {\r\n return
\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getRuleAnalytics == null) {\r\n return ;\r\n }\r\n return
\r\n \r\n { this.setState({ error: \"\" }) }}\r\n >\r\n {this.state.error}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n\r\n\r\n save = () => {\r\n this.setState({ processing: true })\r\n //save into db the settings\r\n let listTenantSettings = this.state.settingsColumns\r\n this.props.apol\r\n .mutate({\r\n mutation: mutationSaveListTenantSettings,\r\n variables: { listTenantSettings }\r\n })\r\n .then((result) => {\r\n if (result.data.saveListTenantSettings.status === \"ok\") {\r\n let resultColumns = this.state.settingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n this.props.updateColumnsSettings(resultColumns)\r\n this.setState({\r\n processing: false,\r\n isPanelOpen: false\r\n })\r\n } else {\r\n this.setState({\r\n processing: false,\r\n error: result.data.saveListTenantSettings.text\r\n })\r\n }\r\n });\r\n }\r\n\r\n\r\n onChange = (name) => {\r\n let settingsColumns = []\r\n if (this.state.settingsColumns.includes(name)) {\r\n settingsColumns = this.state.settingsColumns.filter(c => c !== name)\r\n } else {\r\n settingsColumns = [...this.state.settingsColumns, name]\r\n }\r\n let selected = settingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n let notSelected = this.props.allColumns.filter(col => !settingsColumns.includes(col.fieldName) && col !== undefined)\r\n this.setState({\r\n settingsColumns,\r\n selected,\r\n notSelected\r\n })\r\n }\r\n\r\n up = (i) => {\r\n let newSettingsColumns = this.state.settingsColumns\r\n newSettingsColumns[i] = newSettingsColumns.splice(i - 1, 1, newSettingsColumns[i])[0];\r\n let selected = newSettingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n let notSelected = this.props.allColumns.filter(col => !newSettingsColumns.includes(col.fieldName) && col !== undefined)\r\n this.setState({\r\n settingsColumns: newSettingsColumns,\r\n selected,\r\n notSelected\r\n })\r\n }\r\n\r\n down = (i) => {\r\n let newSettingsColumns = this.state.settingsColumns\r\n newSettingsColumns[i] = newSettingsColumns.splice(i + 1, 1, newSettingsColumns[i])[0];\r\n let selected = newSettingsColumns.map(c => {\r\n return this.props.allColumns.filter(col => col.fieldName === c)[0]\r\n }).filter(d => d !== undefined)\r\n let notSelected = this.props.allColumns.filter(col => !newSettingsColumns.includes(col.fieldName) && col !== undefined)\r\n this.setState({\r\n settingsColumns: newSettingsColumns,\r\n selected,\r\n notSelected\r\n })\r\n }\r\n\r\n\r\n render() {\r\n let lengthSelected = this.state.selected.length\r\n return (\r\n {this.context.getTranslation(\"settings\", \"settingsColumns\")}
\r\n {/*Alert*/}\r\n {this.state.error !== \"\" && \r\n {/*Wheel button for open settings panel*/}\r\n { this.setState({ isPanelOpen: true }) }} />\r\n {/*Settings panel*/}\r\n { this.setState({ isPanelOpen: false }) }}\r\n isFooterAtBottom={false}\r\n onRenderHeader={this.getHeader}\r\n type={PanelType.small}\r\n >\r\n
\r\n )\r\n }\r\n}","import * as React from 'react';\r\nimport { TextField } from 'office-ui-fabric-react/lib/TextField';\r\nimport { Fabric } from 'office-ui-fabric-react/lib/Fabric';\r\nimport { DetailsList, DetailsListLayoutMode, Selection, SelectionMode, IColumn } from 'office-ui-fabric-react/lib/DetailsList';\r\nimport { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';\r\nimport { mergeStyleSets } from 'office-ui-fabric-react/lib/Styling';\r\nimport { Icon } from 'office-ui-fabric-react/lib/Icon';\r\nimport { Stack } from 'office-ui-fabric-react/lib/Stack';\r\nimport { Spinner } from 'office-ui-fabric-react/lib/Spinner';\r\nimport { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';\r\nimport { MyContext } from '../../../context';\r\nimport { Dialog, DialogType } from 'office-ui-fabric-react/lib/Dialog';\r\nimport { queryGetLoggedUserData } from '../../../queries/querySettings'\r\nimport SettingsColumnsTenant from './SettingsColumnsTenant';\r\nimport { CommandBarButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { FontSizes } from 'office-ui-fabric-react/lib';\r\n\r\nimport zipcelx from 'zipcelx';\r\n\r\nconst classNames = mergeStyleSets({\r\n fileIconHeaderIcon: {\r\n padding: 0,\r\n fontSize: '16px'\r\n },\r\n fileIconCell: {\r\n textAlign: 'center',\r\n selectors: {\r\n '&:before': {\r\n content: '.',\r\n display: 'inline-block',\r\n verticalAlign: 'middle',\r\n height: '100%',\r\n width: '0px',\r\n visibility: 'hidden'\r\n }\r\n }\r\n },\r\n fileIconImg: {\r\n verticalAlign: 'middle',\r\n maxHeight: '20px',\r\n maxWidth: '20px'\r\n },\r\n controlWrapper: {\r\n display: 'flex',\r\n flexWrap: 'wrap'\r\n },\r\n exampleToggle: {\r\n display: 'inline-block',\r\n marginBottom: '10px',\r\n marginRight: '30px'\r\n },\r\n selectionDetails: {\r\n marginBottom: '20px'\r\n }\r\n});\r\n\r\nconst config = {\r\n filename: 'TenantReport',\r\n sheet: {\r\n data: [\r\n [{\r\n value: \"Tenant\",\r\n type: 'string'\r\n }, {\r\n value: 'Type',\r\n type: 'string'\r\n }, {\r\n value: 'Reseller',\r\n type: 'bool'\r\n }, {\r\n value: \"Onboarding\",\r\n type: 'date'\r\n }, {\r\n value: \"Training\",\r\n type: 'date'\r\n }, {\r\n value: \"Billing\",\r\n type: 'date'\r\n }, {\r\n value: \"SupportNotes\",\r\n type: 'string'\r\n }, {\r\n value: \"SystemId\",\r\n type: 'string'\r\n }, {\r\n value: \"Country\",\r\n type: 'string'\r\n }, {\r\n value: \"OrderNr\",\r\n type: 'string'\r\n }, {\r\n value: \"Partner\",\r\n type: 'string'\r\n }, {\r\n value: \"PartnerContract\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseRecordingInsinghtsAIUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseRecordingInsinghtsAIBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnAnalyticsUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnAnalyticsBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnFullChatUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnFullChatBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnZoomUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnZoomBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnGenesysUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnGenesysBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnRingcentralUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnRingcentralBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnDynamicsUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnDynamicsBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnComplianceUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnComplianceBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnQualityManagementUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnQualityManagementBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnLeapXpertUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnLeapXpertBought\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageStorage\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageVideoAna\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageSpeechAna\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageTranscriptAna\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageTranslate\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageAnalyticsAI\",\r\n type: 'string'\r\n }, {\r\n value: \"StorageLocation\",\r\n type: 'string'\r\n }, {\r\n value: \"TenantId\",\r\n type: 'string'\r\n }, {\r\n value: \"storageUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"storageBought\",\r\n type: 'string'\r\n }, {\r\n value: \"TranscriptUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"TranscriptBought\",\r\n type: 'string'\r\n }, {\r\n value: \"VideoIndexerUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"VideoIndexerBought\",\r\n type: 'string'\r\n }, {\r\n value: \"SpeechAnalyticsUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"SpeechAnalyticsBought\",\r\n type: 'string'\r\n }, {\r\n value: \"TranslateUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"TranslateBought\",\r\n type: 'string'\r\n }, {\r\n value: \"ImportUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageImport\",\r\n type: 'string'\r\n }, {\r\n value: \"ExportUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageExport\",\r\n type: 'string'\r\n }, {\r\n value: \"MailAlarming\",\r\n type: 'string'\r\n }, {\r\n value: \"GroupCallUsers\",\r\n type: 'string'\r\n }\r\n ]\r\n ]\r\n }\r\n};\r\n\r\nconst configGlobal = {\r\n filename: 'TenantReport',\r\n sheet: {\r\n data: [\r\n [{\r\n value: \"Tenant\",\r\n type: 'string'\r\n }, {\r\n value: 'Type',\r\n type: 'string'\r\n }, {\r\n value: 'Reseller',\r\n type: 'bool'\r\n }, {\r\n value: \"Onboarding\",\r\n type: 'date'\r\n }, {\r\n value: \"Training\",\r\n type: 'date'\r\n }, {\r\n value: \"Billing\",\r\n type: 'date'\r\n }, {\r\n value: \"SupportNotes\",\r\n type: 'string'\r\n }, {\r\n value: \"SystemId\",\r\n type: 'string'\r\n }, {\r\n value: \"Country\",\r\n type: 'string'\r\n }, {\r\n value: \"OrderNr\",\r\n type: 'string'\r\n }, {\r\n value: \"Partner\",\r\n type: 'string'\r\n }, {\r\n value: \"PartnerContract\",\r\n type: 'string'\r\n }, {\r\n value: \"Support\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartVoiceAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseSmartUCAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceAnaUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseCompVoiceAnaBought\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseRecordingInsinghtsAIUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"LicenseRecordingInsinghtsAIBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnAnalyticsUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnAnalyticsBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnFullChatUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnFullChatBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnZoomUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnZoomBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnGenesysUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnGenesysBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnRingcentralUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnRingcentralBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnDynamicsUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnDynamicsBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnComplianceUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnQualityManagementUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnQualityManagementBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnComplianceBought\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnLeapXpertUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"AddOnLeapXpertBought\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageStorage\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageVideoAna\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageSpeechAna\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageTranscriptAna\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageTranslate\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageAnalyticsAI\",\r\n type: 'string'\r\n }, {\r\n value: \"StorageLocation\",\r\n type: 'string'\r\n }, {\r\n value: \"TenantId\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot01\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot02\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot03\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot04\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot05\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot06\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot07\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot08\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot09\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot10\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot11\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot12\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot13\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot14\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot15\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot16\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot17\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot18\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot19\",\r\n type: 'string'\r\n }, {\r\n value: \"Bot20\",\r\n type: 'string'\r\n }, {\r\n value: \"storageUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"storageBought\",\r\n type: 'string'\r\n }, {\r\n value: \"TranscriptUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"TranscriptBought\",\r\n type: 'string'\r\n }, {\r\n value: \"VideoIndexerUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"VideoIndexerBought\",\r\n type: 'string'\r\n }, {\r\n value: \"SpeechAnalyticsUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"SpeechAnalyticsBought\",\r\n type: 'string'\r\n }, {\r\n value: \"TranslateUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"TranslateBought\",\r\n type: 'string'\r\n }, {\r\n value: \"ImportUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageImport\",\r\n type: 'string'\r\n }, {\r\n value: \"ExportUsed\",\r\n type: 'string'\r\n }, {\r\n value: \"PackageExport\",\r\n type: 'string'\r\n }, {\r\n value: \"MailAlarming\",\r\n type: 'string'\r\n }, {\r\n value: \"GroupCallUsers\",\r\n type: 'string'\r\n }\r\n ]\r\n ]\r\n }\r\n};\r\n\r\nexport interface IDetailsListDocumentsExampleState {\r\n columns: IColumn[];\r\n selectionDetails: string;\r\n isModalSelection: boolean;\r\n isCompactMode: boolean;\r\n}\r\n\r\n\r\nexport default class UserList extends React.Component<{}, IDetailsListDocumentsExampleState> {\r\n _selection: Selection;\r\n _allItems: [];\r\n\r\n defaultSettingsColumns = [\"option\", \"name\", \"type\", \"storageContent\", \"license1\", \"license2\"];\r\n\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.setState({\r\n selectionDetails: this._getSelectionDetails()\r\n });\r\n }\r\n });\r\n\r\n this.state = {\r\n selectionDetails: this._getSelectionDetails(),\r\n isModalSelection: true,\r\n isCompactMode: true,\r\n items: this._allItems,\r\n allColumns: [],\r\n columns: [],\r\n settingsColumns: [],\r\n filter: \"\",\r\n isDialogOpen: false\r\n };\r\n\r\n }\r\n\r\n styles = {\r\n root: {\r\n paddingTop: \"20px\"\r\n }\r\n };\r\n\r\n async componentDidMount() {\r\n //get List view settings from db\r\n let auth = this.props.authorization\r\n let result = await this.props.apol\r\n .query({\r\n query: queryGetLoggedUserData,\r\n variables: { auth }\r\n })\r\n let user = result.data.getLoggedUserData\r\n let settingsColumns = user === null || user.listTenantSettings === null ? this.defaultSettingsColumns : user.listTenantSettings\r\n\r\n const columns: IColumn[] = [\r\n {\r\n key: 'column1',\r\n name: \r\n {this.state.selected.map((c, i) => {\r\n return (\r\n \r\n { this.setState({ isPanelOpen: false }) }} style={{ marginTop: \"30px\", marginLeft: \"15px\" }} disabled={this.state.processing} />\r\n \r\n
\r\n \r\n \r\n \r\n this.up(i)} disabled={i === 0} />\r\n this.down(i)} disabled={i === lengthSelected - 1} />\r\n \r\n
\r\n )\r\n })}\r\n {this.state.notSelected.length > 0 && \r\n { this.onChange(c.fieldName) }} disabled={c.fixed} />\r\n
\r\n \r\n { this.onChange(c.fieldName) }} disabled={c.fixed} />\r\n
\r\n )\r\n })}\r\n {/*FOOTER BUTTONS*/}\r\n \r\n
\r\n\r\n {this.userData[0].licenseCompVoice != null && this.userData[0].licenseCompVoice.bought > 0 &&
\r\n
\r\n \r\n\r\n
\r\n {(context) => (<>{context.getTranslation(\"tenants\", \"convertAfter\")})}}\r\n value={this.state.convertBlobOlderThanDays} onChange={(event) => { this.setState({ convertBlobOlderThanDays: event.target.value }) }}\r\n errorMessage={(this.state.convertToMP3 && this.state.convertBlobOlderThanDays < 1) ? \"Minimum value 1 days\" : \"\"}\r\n />\r\n \r\n
\r\n\r\n \r\n\r\n {this.props.storageType !== \"S3Storage\" &&
\r\n \r\n
\r\n\r\n {/* execution */}\r\n\r\n \r\n {(context) => (<>{context.getTranslation(\"settings\", \"enabled\")})}}\r\n checked={this.state.archiveBlobs}\r\n onChange={(event, newValue) => {\r\n this.setState({\r\n archiveBlobs: newValue\r\n });\r\n }}\r\n />\r\n\r\n {(context) => (<> {context.getTranslation(\"tenants\", \"archiveDestinationAudioFromat\")})}}\r\n options={[{\r\n key: \"Keep current\",\r\n text: \"None\"\r\n },\r\n {\r\n key: \"MP3\",\r\n text: \"MP3\",\r\n }]\r\n }\r\n selectedKey={this.state.archiveDestinationAudioFormat}\r\n onChange={(event, newValue) => {\r\n if (newValue.key === \"MP3\") {\r\n this.setState({\r\n convertToMP3: false,\r\n archiveDestinationAudioFormat: newValue.key\r\n })\r\n } else {\r\n this.setState({\r\n archiveDestinationAudioFormat: newValue.key\r\n })\r\n }\r\n }}\r\n />\r\n \r\n \r\n \r\n
}\r\n \r\n\r\n {/* execution */}\r\n
\r\n {(context) => (<>{context.getTranslation(\"tenants\", \"archiveAfter\")})}}\r\n value={this.state.archiveBlobOlderThanDays} onChange={(event) => { this.setState({ archiveBlobOlderThanDays: event.target.value }) }}\r\n errorMessage={(this.state.archiveBlobs && !(this.state.archiveBlobOlderThanDays > 89 && this.state.archiveBlobOlderThanDays < 99999999999)) ? \"Minimum value 90 days\" : \"\"}\r\n />\r\n \r\n
\r\n\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n {this.props.userRules.ruleAccess.tenantCreate && <>\r\n
\r\n
\r\n }\r\n \r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n {this.props.userRules.ruleAccess.tenantCreate && <>\r\n
\r\n
\r\n }\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n {this.props.userRules.ruleAccess.tenantCreate && <>\r\n
\r\n
\r\n }\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n {this.props.userRules.ruleAccess.tenantCreate && <>\r\n
\r\n
\r\n }\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n {this.props.userRules.ruleAccess.tenantCreate && <>\r\n
\r\n
\r\n }\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n {this.props.userRules.ruleAccess.tenantCreate && <>\r\n
\r\n
\r\n }\r\n\r\n\r\n\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
Onboarding Date
\r\n Training Date
\r\n BillingDate
\r\n \r\n
\r\n }\r\n\r\n {this.state.addOnAnalytics > 0 ?\r\n
\r\n
\r\n }\r\n\r\n {this.state.packageAnalyticsTranscript > 0 ?\r\n
\r\n
\r\n }\r\n\r\n {this.state.packageStorage > 0 ?\r\n
\r\n
\r\n }\r\n\r\n {this.state.addOnZoom > 0 ?\r\n
\r\n
\r\n }\r\n\r\n {this.state.license7 > 0 ?\r\n
\r\n
\r\n }\r\n\r\n\r\n {(!this.props.userRules.ruleAccess.tenantCreate && this.props.userRules.access != \"Order\"\r\n && this.props.userRules.access != \"Partner\"\r\n && this.props.userRules.access != \"Support\") &&\r\n < Stack.Item>\r\n
\r\n {(context) => (<>{context.getTranslation(\"common\", \"loading\")})}} ariaLive=\"assertive\" labelPosition=\"top\" />\r\n
\r\n );\r\n }\r\n\r\n\r\n if (error) return Failed to connect
;\r\n if (data.getStorageData == null) {\r\n return ;\r\n }\r\n\r\n let storagesList = [];\r\n if (data.getStorageData != null) {\r\n for (var i = 0; i < data.getStorageData.length; i++) {\r\n storagesList.push({\r\n key: data.getStorageData[i].id,\r\n text: data.getStorageData[i].displayName,\r\n disabled: false\r\n\r\n });\r\n }\r\n\r\n }\r\n\r\n return\r\n {(context) => (<>{context.getTranslation(\"common\", \"loading\")})}} ariaLive=\"assertive\" labelPosition=\"top\" />\r\n
\r\n );\r\n }\r\n\r\n\r\n if (error) return Failed to connect
;\r\n if (data.getStorageData == null) {\r\n return ;\r\n }\r\n\r\n let storagesList = [];\r\n if (data.getStorageData != null) {\r\n for (var i = 0; i < data.getStorageData.length; i++) {\r\n\r\n storagesList.push({\r\n key: data.getStorageData[i].id,\r\n text: data.getStorageData[i].displayName,\r\n });\r\n }\r\n\r\n }\r\n\r\n return\r\n {(context) => (<> {context.getTranslation(\"common\", \"loadingRegions\")})}} ariaLive=\"assertive\" labelPosition=\"top\" />\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getAWSRegions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n const stack = data.getAWSRegions;\r\n if (data.getAWSRegions != null) {\r\n for (let x = 0; x < stack.length; x++) {\r\n let i = {\r\n key: stack[x].code,\r\n text: stack[x].displayName,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return
\r\n
\r\n
\r\n {(context) => (<> {context.getTranslation(\"common\", \"warning\")})} \r\n
\r\n \r\n \r\n {(context) => (<> {context.getTranslation(\"configuration\", \"secretDoesNotExist\")})} \r\n
\r\n{(context) => (<> {context.getTranslation(\"configuration\", \"createSecretQuestion\")})} \r\n \r\n
\r\n \r\n{(context) => (<> {context.getTranslation(\"common\", \"yes\")})}}\r\n allowDisabledFocus={true}\r\n onClick={\r\n () => {\r\n this.createCustomKeySecret(this.props.apol);\r\n this._closeModal();\r\n }\r\n }\r\n styles={iconButtonStyles}\r\n />\r\n {(context) => (<> {context.getTranslation(\"common\", \"cancel\")})}}\r\n allowDisabledFocus={true}\r\n onClick={\r\n () => {\r\n this._closeModal();\r\n }\r\n }\r\n styles={iconButtonStyles}\r\n style={{ background: \"#edebeb\", color: \"black\", border: \"#edebeb\", \"margin-left\": \"5px\" }}\r\n />\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n {!this.state.asymmetricKeyEnabled && <>\r\n\r\n
\r\n{(context) => (<> {context.getTranslation(\"tenants\", \"manualCreation\")})}}\r\n value={this.state.manualCreationKeyRotation}\r\n onChange={(event, newValue) => {\r\n this.setState({\r\n manualCreationKeyRotation: newValue,\r\n isChecked: newValue\r\n });\r\n }}\r\n checked={this.state.isChecked}\r\n />\r\n {this.state.manualCreationKeyRotation ? (\r\n {(context) => (<> {context.getTranslation(\"tenants\", \"requestForRotation\")})}} onClick={(event) => { this.changeEncryptionKey(this.props.apol) }} />\r\n ) : (\r\n {(context) => (<> {context.getTranslation(\"tenants\", \"requestForRotation\")})}} disabled />\r\n )}\r\n\r\n
\r\n }\r\n
}\r\n\r\n {/* Key creation interval */}\r\n {this.state.rotationType == \"Interval\" && \r\n
\r\n }\r\n
\r\n \r\n {(context) => (<> {context.getTranslation(\"tenants\", \"every\")})}
\r\n{(context) => (<> {context.getTranslation(\"tenants\", \"for\")})}
\r\n{(context) => (<> {context.getTranslation(\"tenants\", \"keyExpiration\")})}}\r\n checked={this.state.willExpire}\r\n onChange={(event, newValue) => { this.handleChange(newValue, 56) }}\r\n id=\"keyExpiration\"\r\n />\r\n {this.state.keyExpirationMessage &&\r\n {(context) => (<> {context.getTranslation(\"common\", \"no\")})}, onClick: () => { this.setState({ willExpire: false, keyExpirationMessage: false }) } }}\r\n primaryButtonProps={{ children: {(context) => (<> {context.getTranslation(\"common\", \"yes\")})} , onClick: () => { this.setState({ willExpire: true, keyExpirationMessage: false }) } }}\r\n headline={{(context) => (<> {context.getTranslation(\"common\", \"warning\")})} \r\n }\r\n\r\n >\r\n {(context) => (<> {context.getTranslation(\"tenants\", \"keyExpirationCheckboxWarningMsg\")})} \r\n\r\n \r\n }\r\n {this.state.willExpire &&
}\r\n\r\n \r\n
\r\n { this.handleChange(event.target.value, 52) }}>\r\n \r\n \r\n
\r\n\r\n {/* Delay of activation */}\r\n \r\n\r\n \r\n
\r\n { this.handleChange(event.target.value, 53) }}>\r\n \r\n \r\n
\r\n\r\n \r\n\r\n \r\n {(context) => (<> {context.getTranslation(\"tenants\", \"after\")})} < br />\r\n
}\r\n\r\n\r\n {this.state.willExpire && \r\n {\r\n this.handleChange(event.target.value, 54);\r\n }}>\r\n \r\n \r\n
\r\n\r\n {/* AUDIO STORAGE SETTINGS*/}\r\n
\r\n {/*enable/disable suspension of all conversation deletion process*/}\r\n
\r\n {/*enable Chat Model A*/}\r\n
End Date
\r\n Start Date
\r\n End Date
\r\n \r\n
;\r\n if (error) return ;\r\n\r\n if (data.getRuleData == null) {\r\n return
\r\n
\r\n
\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n
\r\n
\r\n }\r\n\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n\r\n
\r\n
\r\n }\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n\r\n
\r\n
\r\n }\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n\r\n
\r\n
\r\n }\r\n\r\n\r\n\r\n\r\n\r\n\r\n {this.props.userRules.ruleAccess.tenantCreate &&
\r\n
\r\n }\r\n\r\n\r\n {this.state.addOnQualityManagement > 0 ?\r\n
\r\n
\r\n }\r\n\r\n {this.state.packageAnalyticsTranscript > 0 ?\r\n
\r\n
\r\n }\r\n\r\n {this.state.packageStorage > 0 ?\r\n
\r\n
\r\n }\r\n\r\n\r\n\r\n\r\n {(this.props.userRules.ruleAccess.tenantCreate || this.props.userRules.access == \"OrderMitel\")\r\n &&
Onboarding Date
\r\n Training Date
\r\n Billing Date
\r\n \r\n {(context) => (<>{context.getTranslation(\"common\", \"loading\")})}} ariaLive=\"assertive\" labelPosition=\"top\" />\r\n
\r\n );\r\n }\r\n\r\n\r\n if (error) return Failed to connect
;\r\n if (data.getStorageData == null) {\r\n return ;\r\n }\r\n\r\n let storagesList = [];\r\n if (data.getStorageData != null) {\r\n for (var i = 0; i < data.getStorageData.length; i++) {\r\n\r\n storagesList.push({\r\n key: data.getStorageData[i].id,\r\n text: data.getStorageData[i].displayName\r\n });\r\n }\r\n\r\n }\r\n\r\n return\r\n {(context) => (<> {context.getTranslation(\"common\", \"loadingRegions\")})}} ariaLive=\"assertive\" labelPosition=\"top\" />\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getAWSRegions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n const stack = data.getAWSRegions;\r\n if (data.getAWSRegions != null) {\r\n for (let x = 0; x < stack.length; x++) {\r\n let i = {\r\n key: stack[x].code,\r\n text: stack[x].displayName,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return
\r\n\r\n }\r\n
\r\n
;\r\n if (error) return ;\r\n\r\n if (data.getRuleData == null) {\r\n return
\r\n
\r\n )\r\n }\r\n\r\n _onDismissPanel = (): void => {\r\n this.setState({\r\n showPanel: false\r\n });\r\n };\r\n\r\n rules = [];\r\n\r\n _show = (current, vall) => {\r\n switch (vall) {\r\n case undefined:\r\n case null:\r\n break;\r\n default:\r\n\r\n\r\n if (current == null) {\r\n this.setState({ showPanel: true, case: vall, info: null });\r\n }\r\n else {\r\n this.setState({ showPanel: true, case: vall, info: current });\r\n }\r\n\r\n\r\n }\r\n }\r\n\r\n query = (layerFunction, auth, apol, userRules) => {\r\n return \r\n
\r\n \r\n\r\n
\r\n\r\n \r\n\r\n
\r\n \r\n \r\n {this.state.showPanel && (\r\n \r\n {this.panelSelect()}\r\n \r\n )}\r\n \r\n\r\n
\r\n\r\n\r\n \r\n \r\n {this.query(this._show, this.props.authorization, this.props.apol, this.props.userRules)}\r\n\r\n \r\n\r\n
\r\n \r\n
;\r\n if (error) return ;\r\n\r\n if (data.getTenantList == null) {\r\n return
\r\n {(context) => (<> {context.getTranslation(\"settings\", \"ticketMail\")})} {created}{(context) => (<> {context.getTranslation(\"settings\", \"ticketSubject\")})}}\r\n value={subject}\r\n disabled\r\n />\r\n {(context) => (<> {context.getTranslation(\"settings\", \"ticketFrom\")})}}\r\n value={from}\r\n disabled\r\n />\r\n {(context) => (<> {context.getTranslation(\"settings\", \"ticketTo\")})}}\r\n value={to}\r\n disabled\r\n />\r\n {(context) => (<> {context.getTranslation(\"settings\", \"ticketContent\")})}
\r\n
\r\n ))\r\n }}\r\n \r\n \r\n
\r\n \r\n {\r\n this.setState({ error: \"\" });\r\n }}\r\n >\r\n {this.state.error}\r\n \r\n \r\n )}\r\n
\r\n );\r\n };\r\n\r\n save = () => {\r\n this.setState({ processing: true });\r\n //save into db the settings\r\n let listTicketSettings = this.state.settingsColumns;\r\n this.props.apol\r\n .mutate({\r\n mutation: mutationSaveListTicketSettings,\r\n variables: { listTicketSettings },\r\n })\r\n .then((result) => {\r\n if (result.data.saveListTicketSettings.status === \"ok\") {\r\n let resultColumns = this.state.settingsColumns\r\n .map((c) => {\r\n return this.props.allColumns.filter((col) => col.fieldName === c)[0];\r\n })\r\n .filter((d) => d !== undefined);\r\n this.props.updateColumnsSettings(resultColumns);\r\n this.setState({\r\n processing: false,\r\n isPanelOpen: false,\r\n });\r\n } else {\r\n this.setState({\r\n processing: false,\r\n error: result.data.saveListTicketSettings.text,\r\n });\r\n }\r\n });\r\n };\r\n\r\n onChange = (name) => {\r\n let settingsColumns = [];\r\n if (this.state.settingsColumns.includes(name)) {\r\n settingsColumns = this.state.settingsColumns.filter((c) => c !== name);\r\n } else {\r\n settingsColumns = [...this.state.settingsColumns, name];\r\n }\r\n let selected = settingsColumns\r\n .map((c) => {\r\n return this.props.allColumns.filter((col) => col.fieldName === c)[0];\r\n })\r\n .filter((d) => d !== undefined);\r\n let notSelected = this.props.allColumns.filter((col) => !settingsColumns.includes(col.fieldName) && col !== undefined);\r\n this.setState({\r\n settingsColumns,\r\n selected,\r\n notSelected,\r\n });\r\n };\r\n\r\n up = (i) => {\r\n let newSettingsColumns = this.state.settingsColumns;\r\n newSettingsColumns[i] = newSettingsColumns.splice(i - 1, 1, newSettingsColumns[i])[0];\r\n let selected = newSettingsColumns\r\n .map((c) => {\r\n return this.props.allColumns.filter((col) => col.fieldName === c)[0];\r\n })\r\n .filter((d) => d !== undefined);\r\n let notSelected = this.props.allColumns.filter((col) => !newSettingsColumns.includes(col.fieldName) && col !== undefined);\r\n this.setState({\r\n settingsColumns: newSettingsColumns,\r\n selected,\r\n notSelected,\r\n });\r\n };\r\n\r\n down = (i) => {\r\n let newSettingsColumns = this.state.settingsColumns;\r\n newSettingsColumns[i] = newSettingsColumns.splice(i + 1, 1, newSettingsColumns[i])[0];\r\n let selected = newSettingsColumns\r\n .map((c) => {\r\n return this.props.allColumns.filter((col) => col.fieldName === c)[0];\r\n })\r\n .filter((d) => d !== undefined);\r\n let notSelected = this.props.allColumns.filter((col) => !newSettingsColumns.includes(col.fieldName) && col !== undefined);\r\n this.setState({\r\n settingsColumns: newSettingsColumns,\r\n selected,\r\n notSelected,\r\n });\r\n };\r\n render() {\r\n let lengthSelected = this.state.selected.length;\r\n return (\r\n \r\n {this.context.getTranslation(\"settings\", \"settingsColumns\")}\r\n
\r\n {/*Alert*/}\r\n {this.state.error !== \"\" && (\r\n \r\n {/*Wheel button for open settings panel*/}\r\n {\r\n this.setState({\r\n isPanelOpen: true,\r\n });\r\n }}\r\n />\r\n {/*Settings panel*/}\r\n {\r\n this.setState({ isPanelOpen: false });\r\n }}\r\n isFooterAtBottom={false}\r\n onRenderHeader={this.getHeader}\r\n type={PanelType.small}\r\n >\r\n
\r\n );\r\n }\r\n componentDidUpdate(prevProps) {\r\n if(\r\n prevProps.settingsColumns !== this.props.settingsColumns ||\r\n prevProps.allColumns !== this.props.allColumns\r\n ) {\r\n const selected = this.props.settingsColumns\r\n .map((c) => this.props.allColumns.find((col) => col.fieldName === c))\r\n .filter((d) => d !== undefined);\r\n\r\n const notSelected = this.props.allColumns.filter(\r\n (col) => !this.props.settingsColumns.includes(col.fieldName)\r\n );\r\n\r\n this.setState({\r\n selected,\r\n notSelected,\r\n settingsColumns: this.props.settingsColumns,\r\n });\r\n }\r\n }\r\n}\r\n","import * as React from \"react\";\r\nimport { TextField } from \"office-ui-fabric-react/lib/TextField\";\r\nimport { Fabric } from \"office-ui-fabric-react/lib/Fabric\";\r\nimport { DetailsList, DetailsListLayoutMode, Selection, SelectionMode, IColumn } from \"office-ui-fabric-react/lib/DetailsList\";\r\nimport { MarqueeSelection } from \"office-ui-fabric-react/lib/MarqueeSelection\";\r\nimport { mergeStyleSets } from \"office-ui-fabric-react/lib/Styling\";\r\nimport { CommandBar } from \"office-ui-fabric-react/lib/CommandBar\";\r\nimport { MyContext } from \"../../../context\";\r\nimport { Dialog, DialogType } from \"office-ui-fabric-react/lib/Dialog\";\r\nimport zipcelx from \"zipcelx\";\r\nimport TicketListOverlay from \"./TicketListOverlay\";\r\nimport SettingsColumnsTicket from \"./SettingsColumnsTicket\";\r\nimport { queryGetLoggedUserData } from \"../../../queries/querySettings\";\r\n\r\nconst classNames = mergeStyleSets({\r\n fileIconHeaderIcon: {\r\n padding: 0,\r\n fontSize: \"16px\",\r\n },\r\n fileIconCell: {\r\n textAlign: \"center\",\r\n selectors: {\r\n \"&:before\": {\r\n content: \".\",\r\n display: \"inline-block\",\r\n verticalAlign: \"middle\",\r\n height: \"100%\",\r\n width: \"0px\",\r\n visibility: \"hidden\",\r\n },\r\n },\r\n },\r\n fileIconImg: {\r\n verticalAlign: \"middle\",\r\n maxHeight: \"20px\",\r\n maxWidth: \"20px\",\r\n },\r\n controlWrapper: {\r\n display: \"flex\",\r\n flexWrap: \"wrap\",\r\n },\r\n exampleToggle: {\r\n display: \"inline-block\",\r\n marginBottom: \"10px\",\r\n marginRight: \"30px\",\r\n },\r\n selectionDetails: {\r\n marginBottom: \"20px\",\r\n },\r\n});\r\n\r\nconst config = {\r\n filename: \"TenantReport\",\r\n sheet: {\r\n data: [\r\n [\r\n {\r\n value: \"Title\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"Created\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"Last Changed\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"Priority\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"CaseId\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"State\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"TenantId\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"Description\",\r\n type: \"string\",\r\n },\r\n {\r\n value: \"Tenant Name\",\r\n type: \"string\",\r\n }\r\n ],\r\n ],\r\n },\r\n};\r\n\r\nexport interface IDetailsListDocumentsExampleState {\r\n columns: IColumn[];\r\n selectionDetails: string;\r\n isModalSelection: boolean;\r\n isCompactMode: boolean;\r\n}\r\n\r\nexport default class UserList extends React.Component<{}, IDetailsListDocumentsExampleState> {\r\n _selection: Selection;\r\n _allItems: [];\r\n defaultSettingsColumns = [\"caseId\", \"priority\", \"state\", \"changedMs\", \"title\", \"createdMs\", \"description\", \"userId\", \"tenantId\"];\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.setState({\r\n selectionDetails: this._getSelectionDetails(),\r\n });\r\n },\r\n });\r\n\r\n this.TicketListOverlayRef = React.createRef();\r\n\r\n this.state = {\r\n allColumns: [],\r\n columns: [],\r\n settingsColumns: [],\r\n selectionDetails: this._getSelectionDetails(),\r\n isModalSelection: false,\r\n isCompactMode: true,\r\n items: this._allItems,\r\n filter: \"\",\r\n isDialogOpen: false,\r\n };\r\n }\r\n async componentDidMount() {\r\n let auth = this.props.authorization;\r\n let result = await this.props.apol.query({\r\n query: queryGetLoggedUserData,\r\n variables: { auth },\r\n });\r\n let user = result.data.getLoggedUserData;\r\n let settingsColumns = user === null || user.listTicketSettings === null ? this.defaultSettingsColumns : user.listTicketSettings; \r\n console.log(settingsColumns)\r\n let columns: IColumn[] = [\r\n {\r\n key: \"column2\",\r\n name: \r\n {this.state.selected.map((c, i) => {\r\n return (\r\n \r\n {\r\n this.setState({ isPanelOpen: false });\r\n }}\r\n style={{ marginTop: \"30px\", marginLeft: \"15px\" }}\r\n disabled={this.state.processing}\r\n />\r\n \r\n
\r\n \r\n \r\n \r\n this.up(i)} disabled={i === 0} />\r\n this.down(i)} disabled={i === lengthSelected - 1} />\r\n \r\n
\r\n );\r\n })}\r\n {this.state.notSelected.length > 0 && \r\n {\r\n this.onChange(c.fieldName);\r\n }}\r\n disabled={c.fixed}\r\n />\r\n
\r\n \r\n {\r\n this.onChange(c.fieldName);\r\n }}\r\n disabled={c.fixed}\r\n />\r\n
\r\n );\r\n })}\r\n {/*FOOTER BUTTONS*/}\r\n \r\n {\" \"}\r\n
\r\n );\r\n },\r\n };\r\n\r\n let download = {\r\n key: \"download\",\r\n iconProps: { iconName: \"Download\" },\r\n name: \"Export Report\",\r\n onClick: () => {\r\n this._onExport();\r\n },\r\n };\r\n let columnSettings = {\r\n key: \"settings\",\r\n name: \"Column Settings\",\r\n onRender: () => {\r\n return (\r\n \r\n \r\n {(context) => (<> {context.getTranslation(\"common\", \"Upload\")})}} onClick={() => document.getElementById('file-btn').click()} />\r\n
\r\n\r\n\r\n {/* Display uploaded files */}\r\n {this.state.files.length > 0 && }\r\n \r\n - \r\n {this.state.files.map((file, index) => (\r\n
- \r\n
\r\n
\r\n )\r\n }\r\n\r\n _onDismissPanel = (): void => {\r\n this.setState({\r\n showPanel: false\r\n });\r\n };\r\n\r\n rules = [];\r\n\r\n _show = (current, vall) => {\r\n switch (vall) {\r\n case undefined:\r\n case null:\r\n break;\r\n default:\r\n\r\n\r\n if (current == null) {\r\n this.setState({ showPanel: true, case: vall, info: null });\r\n }\r\n else {\r\n this.setState({ showPanel: true, case: vall, info: current });\r\n }\r\n\r\n\r\n }\r\n }\r\n\r\n query = (layerFunction, auth, apol, tenantId, asPartner, userRules) => {\r\n return \r\n
\r\n \r\n\r\n
\r\n\r\n \r\n\r\n
\r\n \r\n \r\n {this.state.showPanel && (\r\n \r\n {this.panelSelect()}\r\n \r\n )}\r\n \r\n\r\n
\r\n\r\n\r\n \r\n \r\n {this.query(this._show, this.props.authorization, this.props.apol, null, true, this.props.userRules)}\r\n\r\n \r\n\r\n
\r\n \r\n
;\r\n if (error) return ;\r\n\r\n if (data.getTickets == null) {\r\n return
< Text variant=\"medium\" block>{context.getTranslation(\"filterPanel\", \"defaultFilter\")}\r\n {\r\n this.fillFromDefaultFilter(newValue)\r\n }}\r\n />
}\r\n\r\n {context.getTranslation(\"dashboard\", \"startDate\")}
\r\n {context.getTranslation(\"dashboard\", \"endDate\")}
\r\n \r\n \r\n
\r\n
\r\n\r\n \r\n {\r\n //in case user leaves empty will sends -1 and ui displays empty\r\n //because leaving it 0 instead of empty is confusing\r\n if (isNaN(newValue) || newValue === \"\") {\r\n this.setState({\r\n durationFrom: parseInt(-1),\r\n filterDefaultEnabled: false,\r\n filterUserEnabled: true,\r\n updated: true\r\n });\r\n } else {\r\n this.setState({\r\n durationFrom: parseInt(newValue),\r\n filterDefaultEnabled: false,\r\n filterUserEnabled: true,\r\n updated: true\r\n });\r\n }\r\n }}\r\n min={0}\r\n />\r\n
\r\n \r\n {\r\n //in case user leaves empty will sends -1 and ui displays empty\r\n //because leaving it 0 instead of empty is confusing\r\n if (isNaN(newValue) || newValue === \"\") {\r\n this.setState({\r\n durationTo: parseInt(-1),\r\n filterDefaultEnabled: false,\r\n filterUserEnabled: true,\r\n updated: true\r\n });\r\n } else {\r\n this.setState({\r\n durationTo: parseInt(newValue),\r\n filterDefaultEnabled: false,\r\n filterUserEnabled: true,\r\n updated: true\r\n });\r\n }\r\n }}\r\n min={0}\r\n\r\n />\r\n
\r\n \r\n \r\n\r\n
\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n\r\n if (data.getImportData == null) {\r\n return ;\r\n }\r\n this.tmpKeyImport = [];\r\n this.tmpKeyImport.push({ key: \"Header1\", text: context.getTranslation(\"filterPanel\", \"importSelection\"), itemType: 2 });\r\n\r\n if (data.getImportData.importdata != null) {\r\n const filteredData = this.state.showArchivedImports\r\n ? data.getImportData.importdata\r\n : data.getImportData.importdata.filter(item => !item.isArchived);\r\n\r\n for (let x = 0; x < filteredData.length; x++) {\r\n let i = {\r\n name: filteredData[x].name,\r\n text: filteredData[x].name,\r\n id: filteredData[x].id,\r\n key: filteredData[x].id\r\n };\r\n this.tmpKeyImport.push(i);\r\n }\r\n\r\n\r\n }\r\n return\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n\r\n if (data.getIntegrationData == null) {\r\n return ;\r\n }\r\n this.tmpKeyIntegration = [];\r\n this.tmpKeyIntegration.push({ key: \"Header1\", text: context.getTranslation(\"filterPanel\", \"integrationsSelection\"), itemType: 2 });\r\n // First of all put teams as standard integration\r\n this.tmpKeyIntegration.push({\r\n name: \"Teams\",\r\n text: \"Teams\",\r\n id: \"1\",\r\n key: \"1\"\r\n });\r\n if (data.getIntegrationData.integrationdata != null) {\r\n for (let x = 0; x < data.getIntegrationData.integrationdata.length; x++) {\r\n let i = {\r\n name: data.getIntegrationData.integrationdata[x].name,\r\n text: data.getIntegrationData.integrationdata[x].name,\r\n id: data.getIntegrationData.integrationdata[x].id,\r\n key: data.getIntegrationData.integrationdata[x].id\r\n };\r\n this.tmpKeyIntegration.push(i);\r\n }\r\n }\r\n return\r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n\r\n if (data.getAllCategoryVersions == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n this.tmpKey.push({ key: \"Header1\", text: context.getTranslation(\"filterPanel\", \"categorySelection\"), itemType: 2 });\r\n if (data.getAllCategoryVersions.categorydata != null) {\r\n let dataFilter = data.getAllCategoryVersions.categorydata;\r\n if (!this.state.showAllVersionCategories) {\r\n dataFilter = data.getAllCategoryVersions.categorydata.filter(c => c.selected)\r\n }\r\n for (let x = 0; x < dataFilter.length; x++) {\r\n let i = {\r\n name: dataFilter[x].name + \" - v\" + dataFilter[x].version,\r\n fromCompliance: dataFilter[x].fromCompliance,\r\n text: dataFilter[x].name + \" - v\" + dataFilter[x].version,\r\n keywords: dataFilter[x].keywords,\r\n id: dataFilter[x].id,\r\n key: dataFilter[x].id,\r\n tenantId: dataFilter[x].tenantId,\r\n frequence: dataFilter[x].frequence,\r\n link: dataFilter[x].link,\r\n sentiments: dataFilter[x].sentiments,\r\n selectedDb: dataFilter[x].selected,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return\r\n
\r\n }}\r\n \r\n\r\n \r\n {\r\n let showAllVersionCategories = !this.state.showAllVersionCategories\r\n let optionIds = []\r\n let optionsCategories = this.getCategoriesComboBoxes(this.tmpKey);\r\n if (showAllVersionCategories) {\r\n optionIds = optionsCategories.map(p => p.id)\r\n } else {\r\n optionIds = optionsCategories.filter(p => p.selectedDB).map(p => p.id)\r\n }\r\n let selectedOptionKeys = this.state.selectedOptionKeys !== undefined ?\r\n this.state.selectedOptionKeys.filter(p => optionIds.includes(p)) : []\r\n this.setState({\r\n showAllVersionCategories,\r\n selectedOptionKeys\r\n })\r\n }}\r\n />\r\n
\r\n\r\n \r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n if (data.getAllPolicyVersions == null) {\r\n return ;\r\n }\r\n this.optionsPolicies = [];\r\n this.optionsPolicies.push({ key: \"Header1\", text: context.getTranslation(\"compliance\", \"policiesSelecion\"), itemType: 2 });\r\n if (data.getAllPolicyVersions !== null && data.getAllPolicyVersions.length > 0) {\r\n let dataFilter = []\r\n if (this.state.showAllVersionPolicies) {\r\n dataFilter = data.getAllPolicyVersions\r\n } else {\r\n dataFilter = data.getAllPolicyVersions.filter(pol => pol.selected)\r\n }\r\n dataFilter/*.sort((a, b) => a.masterItemId > b.masterItemId ? 1 : -1)*/.forEach(p => {\r\n let o = {\r\n text: p.name + \" - v\" + p.version,\r\n key: p.id,\r\n selectedDB: p.selected,\r\n id: p.id\r\n }\r\n this.optionsPolicies.push(o);\r\n })\r\n let comboOptionsTitle = this.optionsPolicies.splice(0, 1)[0]\r\n this.optionsPolicies.sort((a, b) => {\r\n if (a.text.toLowerCase() > b.text.toLowerCase()) return 1\r\n return -1\r\n })\r\n this.optionsPolicies.splice(0, 0, comboOptionsTitle)\r\n }\r\n return\r\n
\r\n }}\r\n \r\n \r\n {\r\n let showAllVersionPolicies = !this.state.showAllVersionPolicies\r\n let optionIds = []\r\n if (showAllVersionPolicies) {\r\n optionIds = this.optionsPolicies.map(p => p.id)\r\n } else {\r\n optionIds = this.optionsPolicies.filter(p => p.selectedDB).map(p => p.id)\r\n }\r\n let selectedOptionPolicies = !_.isNil(this.state.selectedOptionPolicies) ?\r\n this.state.selectedOptionPolicies.filter(p => optionIds.includes(p)) : []\r\n this.setState({\r\n showAllVersionPolicies,\r\n selectedOptionPolicies\r\n })\r\n }}\r\n />\r\n
\r\n\r\n \r\n
\r\n );\r\n }\r\n if (error) return Failed to connect
;\r\n this.foldersOption = [\r\n { key: 'Header1', text: `${context.getTranslation(\"filterPanel\", \"convSafe\")}`, itemType: SelectableOptionMenuItemType.Header },\r\n { key: 'selectAll', text: `${context.getTranslation(\"filterPanel\", \"selectAll\")}`, itemType: SelectableOptionMenuItemType.SelectAll },\r\n { key: 'divider', text: '-', itemType: SelectableOptionMenuItemType.Divider }\r\n ];\r\n let availableFolders = data.getConversationSafeFolders.map(e => {\r\n return ({\r\n \"key\": e.id ? e.id : '-1',\r\n \"text\": e.name,\r\n \"itemType\": SelectableOptionMenuItemType.Normal\r\n })\r\n })\r\n let options = _.concat(this.foldersOption, availableFolders)\r\n this.foldersOption = availableFolders\r\n\r\n\r\n\r\n return (\r\n {/*onBlur={this.handleNavBlur}*/}\r\n \r\n
\r\n )}\r\n ;\r\n\r\n return data.getDetailDay.map(({ date , content}) => (\r\n\r\n
\r\n \r\n \r\n
;\r\n }\r\n}\r\n","// Header & Footer for Elements\r\nimport React from \"react\";\r\nimport {Icon} from \"office-ui-fabric-react\";\r\n\r\n\r\n\r\n// Element Layout\r\n\r\nfunction generateElement(title,content) {\r\n //console.log(title);\r\n return ( content)\r\n\r\n}\r\n\r\n\r\nexport {\r\n generateElement\r\n}","export const countriesGDP = {\r\n 'Afghanistan': {\r\n 'agriculture': 34.9, 'industry': 25, 'services': 40, 'total': 20312\r\n },\r\n 'Albania': {\r\n 'agriculture': 20.7, 'industry': 19.7, 'services': 59.6, 'total': 13262\r\n },\r\n 'Algeria': {\r\n 'agriculture': 12, 'industry': 56.5, 'services': 31.5, 'total': 214080\r\n },\r\n 'Angola': {\r\n 'agriculture': 9.6, 'industry': 65.8, 'services': 24.6, 'total': 128564\r\n },\r\n 'Anguilla': {\r\n 'agriculture': 2.2, 'industry': 28.5, 'services': 69.3\r\n },\r\n 'Antigua and Barbuda': {\r\n 'agriculture': 3.8, 'industry': 32.9, 'services': 63.4, 'total': 1242\r\n },\r\n 'Argentina': {\r\n 'agriculture': 10, 'industry': 30.7, 'services': 59.2, 'total': 540164\r\n },\r\n 'Armenia': {\r\n 'agriculture': 19.1, 'industry': 40.5, 'services': 40.3, 'total': 10279\r\n },\r\n 'Aruba': {\r\n 'agriculture': 0.4, 'industry': 33.3, 'services': 66.3\r\n },\r\n 'Australia': {\r\n 'agriculture': 4, 'industry': 24.6, 'services': 71.4, 'total': 1444189\r\n },\r\n 'Austria': {\r\n 'agriculture': 1.5, 'industry': 29.4, 'services': 69.1, 'total': 437123\r\n },\r\n 'Azerbaijan': {\r\n 'agriculture': 5.5, 'industry': 62.1, 'services': 32.4, 'total': 74145\r\n },\r\n 'Bahamas, The': {\r\n 'agriculture': 2.2, 'industry': 6.5, 'services': 91.3, 'total': 8657\r\n },\r\n 'Bahrain': {\r\n 'agriculture': 0.4, 'industry': 63.6, 'services': 36, 'total': 33862\r\n },\r\n 'Bangladesh': {\r\n 'agriculture': 18.4, 'industry': 28.6, 'services': 53, 'total': 185415\r\n },\r\n 'Barbados': {\r\n 'agriculture': 3.2, 'industry': 13.9, 'services': 82.9, 'total': 4348\r\n },\r\n 'Belarus': {\r\n 'agriculture': 9.4, 'industry': 45.9, 'services': 44.7, 'total': 76139\r\n },\r\n 'Belgium': {\r\n 'agriculture': 0.7, 'industry': 21.7, 'services': 77.6, 'total': 534672\r\n },\r\n 'Belize': {\r\n 'agriculture': 9.7, 'industry': 19.8, 'services': 70.5, 'total': 1693\r\n },\r\n 'Benin': {\r\n 'agriculture': 36, 'industry': 6.4, 'services': 57.6, 'total': 8701\r\n },\r\n 'Bermuda': {\r\n 'agriculture': 0.7, 'industry': 7, 'services': 92.2\r\n },\r\n 'Bhutan': {\r\n 'agriculture': 16.7, 'industry': 45.4, 'services': 37.9, 'total': 2092\r\n },\r\n 'Bolivia': {\r\n 'agriculture': 10, 'industry': 40, 'services': 50, 'total': 34425\r\n },\r\n 'Bosnia and Herz.': {\r\n 'agriculture': 8.3, 'industry': 26.3, 'services': 65.4, 'total': 17977\r\n },\r\n 'Botswana': {\r\n 'agriculture': 2.1, 'industry': 45, 'services': 52.9, 'total': 15789\r\n },\r\n 'Brazil': {\r\n 'agriculture': 5.5, 'industry': 27.5, 'services': 67, 'total': 2353025\r\n },\r\n 'British Virgin Islands': {\r\n 'agriculture': 1, 'industry': 11.9, 'services': 87.2\r\n },\r\n 'Brunei': {\r\n 'agriculture': 0.8, 'industry': 66.7, 'services': 32.5, 'total': 15102\r\n },\r\n 'Bulgaria': {\r\n 'agriculture': 5.2, 'industry': 30.6, 'services': 64.2, 'total': 55837\r\n },\r\n 'Burkina Faso': {\r\n 'agriculture': 34.7, 'industry': 23.3, 'services': 42, 'total': 12503\r\n },\r\n 'Burundi': {\r\n 'agriculture': 31, 'industry': 21.4, 'services': 47.7, 'total': 3094\r\n },\r\n 'Cambodia': {\r\n 'agriculture': 30, 'industry': 30, 'services': 40, 'total': 16551\r\n },\r\n 'Cameroon': {\r\n 'agriculture': 19.5, 'industry': 31, 'services': 49.5, 'total': 31669\r\n },\r\n 'Canada': {\r\n 'agriculture': 1.9, 'industry': 27.1, 'services': 71, 'total': 1788717\r\n },\r\n 'Cape Verde': {\r\n 'agriculture': 8.4, 'industry': 15.7, 'services': 75.9, 'total': 1899\r\n },\r\n 'Cayman Islands': {\r\n 'agriculture': 0.5, 'industry': 50.4, 'services': 49.1\r\n },\r\n 'Central African Rep.': {\r\n 'agriculture': 53.1, 'industry': 14.5, 'services': 32.4, 'total': 1786\r\n },\r\n 'Chad': {\r\n 'agriculture': 52.7, 'industry': 6.7, 'services': 40.6, 'total': 13947\r\n },\r\n 'Chile': {\r\n 'agriculture': 5.1, 'industry': 41.8, 'services': 53.1, 'total': 257968\r\n },\r\n 'China': {\r\n 'agriculture': 10.1, 'industry': 46.8, 'services': 43.1, 'total': 10380380\r\n },\r\n 'Colombia': {\r\n 'agriculture': 7, 'industry': 37.6, 'services': 55.5, 'total': 384901\r\n },\r\n 'Comoros': {\r\n 'agriculture': 51.6, 'industry': 13.6, 'services': 47, 'total': 717\r\n },\r\n 'Dem. Rep. Congo': {\r\n 'agriculture': 37.5, 'industry': 27.6, 'services': 35, 'total': 34677\r\n },\r\n 'Congo': {\r\n 'agriculture': 4.2, 'industry': 70.7, 'services': 25.1, 'total': 13502\r\n },\r\n 'Cook Islands': {\r\n 'agriculture': 11.7, 'industry': 9.9, 'services': 78.5\r\n },\r\n 'Costa Rica': {\r\n 'agriculture': 6.3, 'industry': 21.7, 'services': 72, 'total': 48144\r\n },\r\n 'Ivory Coast': {\r\n 'agriculture': 30, 'industry': 21, 'services': 49, 'total': 32000\r\n },\r\n 'Croatia': {\r\n 'agriculture': 5.4, 'industry': 25.5, 'services': 69.1, 'total': 57159\r\n },\r\n 'Cuba': {\r\n 'agriculture': 4, 'industry': 20.8, 'services': 75.2\r\n },\r\n 'Curacao': {\r\n 'agriculture': 0.7, 'industry': 15.5, 'services': 83.8\r\n },\r\n 'Cyprus': {\r\n 'agriculture': 2.4, 'industry': 16.5, 'services': 81.1, 'total': 23269\r\n },\r\n 'Czech Rep.': {\r\n 'agriculture': 1.6, 'industry': 38.1, 'services': 60.3, 'total': 205658\r\n },\r\n 'Denmark': {\r\n 'agriculture': 4.5, 'industry': 19.1, 'services': 76.4, 'total': 340806\r\n },\r\n 'Djibouti': {\r\n 'agriculture': 3, 'industry': 17, 'services': 79.9, 'total': 1589\r\n },\r\n 'Dominica': {\r\n 'agriculture': 21.4, 'industry': 22.4, 'services': 56.3, 'total': 526\r\n },\r\n 'Dominican Rep.': {\r\n 'agriculture': 6.7, 'industry': 26.1, 'services': 67.2, 'total': 64077\r\n },\r\n 'Ecuador': {\r\n 'agriculture': 6.5, 'industry': 34.6, 'services': 58.9, 'total': 100755\r\n },\r\n 'Egypt': {\r\n 'agriculture': 14.5, 'industry': 37.6, 'services': 47.6, 'total': 286435\r\n },\r\n 'El Salvador': {\r\n 'agriculture': 10.6, 'industry': 30, 'services': 59.3, 'total': 25329\r\n },\r\n 'Equatorial Guinea': {\r\n 'agriculture': 3.6, 'industry': 89.7, 'services': 4.3, 'total': 14308\r\n },\r\n 'Eritrea': {\r\n 'agriculture': 11, 'industry': 34, 'services': 55, 'total': 3858\r\n },\r\n 'Estonia': {\r\n 'agriculture': 3.5, 'industry': 28.5, 'services': 61, 'total': 25953\r\n },\r\n 'Ethiopia': {\r\n 'agriculture': 41, 'industry': 13, 'services': 46, 'total': 52335\r\n },\r\n 'European Union': {\r\n 'agriculture': 1.8, 'industry': 24.9, 'services': 73.2\r\n },\r\n 'Falkland Islands': {\r\n 'agriculture': 95, 'industry': 0, 'services': 0\r\n },\r\n 'Faroe Islands': {\r\n 'agriculture': 16, 'industry': 29, 'services': 55\r\n },\r\n 'Fiji': {\r\n 'agriculture': 12, 'industry': 20.2, 'services': 67.7, 'total': 4212\r\n },\r\n 'Finland': {\r\n 'agriculture': 3, 'industry': 29.2, 'services': 67.8, 'total': 271165\r\n },\r\n 'France': {\r\n 'agriculture': 1.8, 'industry': 18.8, 'services': 79.4, 'total': 2846889\r\n },\r\n 'French Polynesia': {\r\n 'agriculture': 3.5, 'industry': 20.4, 'services': 76.1\r\n },\r\n 'Gabon': {\r\n 'agriculture': 5.2, 'industry': 54.4, 'services': 40.4, 'total': 17182\r\n },\r\n 'Gambia, The': {\r\n 'agriculture': 26.7, 'industry': 17.4, 'services': 55.9, 'total': 825\r\n },\r\n 'Georgia': {\r\n 'agriculture': 8.8, 'industry': 22.7, 'services': 68.5, 'total': 16535\r\n },\r\n 'Germany': {\r\n 'agriculture': 0.8, 'industry': 28.6, 'services': 70.6, 'total': 3859547\r\n },\r\n 'Ghana': {\r\n 'agriculture': 28.3, 'industry': 21, 'services': 50.7, 'total': 38648\r\n },\r\n 'Gibraltar': {\r\n 'agriculture': 0, 'industry': 0, 'services': 100\r\n },\r\n 'Greece': {\r\n 'agriculture': 3.3, 'industry': 17.9, 'services': 78.9, 'total': 238023\r\n },\r\n 'Greenland': {\r\n 'agriculture': 4, 'industry': 29, 'services': 67, 'total': 2160\r\n },\r\n 'Grenada': {\r\n 'agriculture': 5.3, 'industry': 14.2, 'services': 80.5, 'total': 862\r\n },\r\n 'Guatemala': {\r\n 'agriculture': 13.3, 'industry': 24, 'services': 62.7, 'total': 60422\r\n },\r\n 'Guernsey': {\r\n 'agriculture': 3, 'industry': 10, 'services': 87\r\n },\r\n 'Guinea': {\r\n 'agriculture': 16.9, 'industry': 53.6, 'services': 29.5, 'total': 6529\r\n },\r\n 'Guinea-Bissau': {\r\n 'agriculture': 55.8, 'industry': 13, 'services': 31.2, 'total': 1024\r\n },\r\n 'Guyana': {\r\n 'agriculture': 18.5, 'industry': 30.6, 'services': 50.9, 'total': 2997\r\n },\r\n 'Haiti': {\r\n 'agriculture': 25, 'industry': 16, 'services': 59, 'total': 8711\r\n },\r\n 'Honduras': {\r\n 'agriculture': 12.6, 'industry': 26.3, 'services': 61.1, 'total': 19511\r\n },\r\n 'Hong Kong': {\r\n 'agriculture': 0.1, 'industry': 6.8, 'services': 93.2, 'total': 289628\r\n },\r\n 'Hungary': {\r\n 'agriculture': 3.7, 'industry': 31.3, 'services': 65, 'total': 137104\r\n },\r\n 'Iceland': {\r\n 'agriculture': 5.4, 'industry': 24.7, 'services': 69.9, 'total': 16693\r\n },\r\n 'India': {\r\n 'agriculture': 17.2, 'industry': 26.4, 'services': 56.4, 'total': 2049501\r\n },\r\n 'Indonesia': {\r\n 'agriculture': 14.7, 'industry': 47.2, 'services': 38.1, 'total': 888648\r\n },\r\n 'Iran': {\r\n 'agriculture': 10.4, 'industry': 37.7, 'services': 51.8, 'total': 404132\r\n },\r\n 'Iraq': {\r\n 'agriculture': 9.7, 'industry': 60.5, 'services': 29.8, 'total': 221130\r\n },\r\n 'Ireland': {\r\n 'agriculture': 2, 'industry': 29, 'services': 69, 'total': 246438\r\n },\r\n 'Isle of Man': {\r\n 'agriculture': 1, 'industry': 11, 'services': 88\r\n },\r\n 'Israel': {\r\n 'agriculture': 2.5, 'industry': 31.1, 'services': 64.9, 'total': 303771\r\n },\r\n 'Italy': {\r\n 'agriculture': 2, 'industry': 24.7, 'services': 73.4, 'total': 2147952\r\n },\r\n 'Jamaica': {\r\n 'agriculture': 5.8, 'industry': 29.5, 'services': 64.7, 'total': 13787\r\n },\r\n 'Japan': {\r\n 'agriculture': 1.2, 'industry': 27.3, 'services': 71.6, 'total': 4616335\r\n },\r\n 'Jersey': {\r\n 'agriculture': 1, 'industry': 2, 'services': 97\r\n },\r\n 'Jordan': {\r\n 'agriculture': 4.5, 'industry': 30.8, 'services': 64.7, 'total': 35765\r\n },\r\n 'Kazakhstan': {\r\n 'agriculture': 5.2, 'industry': 37.9, 'services': 56.9, 'total': 212260\r\n },\r\n 'Kenya': {\r\n 'agriculture': 19, 'industry': 16.4, 'services': 64.6, 'total': 60770\r\n },\r\n 'Kiribati': {\r\n 'agriculture': 8.9, 'industry': 24.2, 'services': 66.8, 'total': 181\r\n },\r\n 'Dem. Rep. Korea': {\r\n 'agriculture': 23, 'industry': 43.4, 'services': 33.6, 'total': 28000\r\n },\r\n 'Korea': {\r\n 'agriculture': 2.6, 'industry': 39.2, 'services': 58.2, 'total': 1416949\r\n },\r\n 'Kosovo': {\r\n 'agriculture': 12.9, 'industry': 22.6, 'services': 64.5, 'total': 7318\r\n },\r\n 'Kuwait': {\r\n 'agriculture': 0.3, 'industry': 47.4, 'services': 52.3, 'total': 172350\r\n },\r\n 'Kyrgyzstan': {\r\n 'agriculture': 20.1, 'industry': 28.8, 'services': 51.1, 'total': 7402\r\n },\r\n 'Lao PDR': {\r\n 'agriculture': 27.8, 'industry': 34.8, 'services': 37.4, 'total': 11676\r\n },\r\n 'Latvia': {\r\n 'agriculture': 4, 'industry': 21.7, 'services': 74.3, 'total': 31970\r\n },\r\n 'Lebanon': {\r\n 'agriculture': 4.6, 'industry': 19.7, 'services': 75.7, 'total': 49919\r\n },\r\n 'Lesotho': {\r\n 'agriculture': 7.5, 'industry': 33.1, 'services': 59.4, 'total': 2159\r\n },\r\n 'Liberia': {\r\n 'agriculture': 76.9, 'industry': 5.4, 'services': 17.7, 'total': 2028\r\n },\r\n 'Libya': {\r\n 'agriculture': 3.2, 'industry': 49.5, 'services': 47.3, 'total': 41148\r\n },\r\n 'Liechtenstein': {\r\n 'agriculture': 8, 'industry': 37, 'services': 55\r\n },\r\n 'Lithuania': {\r\n 'agriculture': 3.3, 'industry': 28.2, 'services': 68.6, 'total': 48232\r\n },\r\n 'Luxembourg': {\r\n 'agriculture': 0.4, 'industry': 13.6, 'services': 86, 'total': 62395\r\n },\r\n 'Macau': {\r\n 'agriculture': 0.1, 'industry': 9.4, 'services': 90.6\r\n },\r\n 'Macedonia': {\r\n 'agriculture': 9.5, 'industry': 27.1, 'services': 63.4, 'total': 11342\r\n },\r\n 'Madagascar': {\r\n 'agriculture': 28.3, 'industry': 16.4, 'services': 55.2, 'total': 10595\r\n },\r\n 'Malawi': {\r\n 'agriculture': 30.3, 'industry': 16.7, 'services': 53, 'total': 4263\r\n },\r\n 'Malaysia': {\r\n 'agriculture': 12, 'industry': 40, 'services': 48, 'total': 326933\r\n },\r\n 'Maldives': {\r\n 'agriculture': 5.6, 'industry': 16.9, 'services': 77.5, 'total': 2854\r\n },\r\n 'Mali': {\r\n 'agriculture': 38.8, 'industry': 21.9, 'services': 39.3, 'total': 11915\r\n },\r\n 'Malta': {\r\n 'agriculture': 1.9, 'industry': 17.2, 'services': 80.9, 'total': 10582\r\n },\r\n 'Marshall Islands': {\r\n 'agriculture': 31.7, 'industry': 14.9, 'services': 53.4, 'total': 193\r\n },\r\n 'Mauritania': {\r\n 'agriculture': 17.8, 'industry': 37.6, 'services': 44.7, 'total': 5079\r\n },\r\n 'Mauritius': {\r\n 'agriculture': 4.5, 'industry': 24, 'services': 71.4, 'total': 13240\r\n },\r\n 'Mexico': {\r\n 'agriculture': 3.8, 'industry': 34.2, 'services': 62, 'total': 1282725\r\n },\r\n 'Micronesia, Federated States of': {\r\n 'agriculture': 28.9, 'industry': 15.2, 'services': 55.9\r\n },\r\n 'Moldova': {\r\n 'agriculture': 16.2, 'industry': 20.3, 'services': 63.5, 'total': 7944\r\n },\r\n 'Monaco': {\r\n 'agriculture': 0, 'industry': 4.9, 'services': 95.1\r\n },\r\n 'Mongolia': {\r\n 'agriculture': 15.8, 'industry': 32.6, 'services': 51.6, 'total': 11981\r\n },\r\n 'Montenegro': {\r\n 'agriculture': 0.8, 'industry': 11.3, 'services': 87.9, 'total': 4462\r\n },\r\n 'Montserrat': {\r\n 'agriculture': 1.6, 'industry': 23, 'services': 75.3\r\n },\r\n 'Morocco': {\r\n 'agriculture': 16.6, 'industry': 32.2, 'services': 51.2, 'total': 109201\r\n },\r\n 'Mozambique': {\r\n 'agriculture': 31.5, 'industry': 23.8, 'services': 44.7, 'total': 16684\r\n },\r\n 'Myanmar': {\r\n 'agriculture': 38.2, 'industry': 18.2, 'services': 43.6, 'total': 62802\r\n },\r\n 'Namibia': {\r\n 'agriculture': 7.2, 'industry': 33.3, 'services': 59.5, 'total': 13353\r\n },\r\n 'Nepal': {\r\n 'agriculture': 34.9, 'industry': 15, 'services': 50.1, 'total': 19637\r\n },\r\n 'Netherlands': {\r\n 'agriculture': 2.7, 'industry': 24.2, 'services': 73.1, 'total': 866354\r\n },\r\n 'New Caledonia': {\r\n 'agriculture': 2, 'industry': 27.1, 'services': 70.9\r\n },\r\n 'New Zealand': {\r\n 'agriculture': 4.8, 'industry': 24.5, 'services': 70.7, 'total': 198118\r\n },\r\n 'Nicaragua': {\r\n 'agriculture': 17.4, 'industry': 25.7, 'services': 56.8, 'total': 11707\r\n },\r\n 'Niger': {\r\n 'agriculture': 39, 'industry': 16, 'services': 45, 'total': 8025\r\n },\r\n 'Nigeria': {\r\n 'agriculture': 35.4, 'industry': 33.6, 'services': 31, 'total': 573652\r\n },\r\n 'Niue': {\r\n 'agriculture': 23.5, 'industry': 26.9, 'services': 49.5\r\n },\r\n 'Norway': {\r\n 'agriculture': 2.6, 'industry': 39.7, 'services': 57.7, 'total': 500244\r\n },\r\n 'Oman': {\r\n 'agriculture': 1.5, 'industry': 49.5, 'services': 48.9, 'total': 77755\r\n },\r\n 'Pakistan': {\r\n 'agriculture': 20.9, 'industry': 25.8, 'services': 53.3, 'total': 250136\r\n },\r\n 'Palau': {\r\n 'agriculture': 6.2, 'industry': 12, 'services': 81.8, 'total': 269\r\n },\r\n 'Panama': {\r\n 'agriculture': 4.1, 'industry': 16.7, 'services': 79.2, 'total': 43784\r\n },\r\n 'Papua New Guinea': {\r\n 'agriculture': 29.9, 'industry': 37.6, 'services': 32.4, 'total': 16060\r\n },\r\n 'Paraguay': {\r\n 'agriculture': 23.1, 'industry': 18.6, 'services': 58.3, 'total': 29704\r\n },\r\n 'Peru': {\r\n 'agriculture': 8, 'industry': 38, 'services': 54, 'total': 202948\r\n },\r\n 'Philippines': {\r\n 'agriculture': 12.8, 'industry': 31.5, 'services': 55.7, 'total': 284927\r\n },\r\n 'Poland': {\r\n 'agriculture': 3.4, 'industry': 33.6, 'services': 63, 'total': 546644\r\n },\r\n 'Portugal': {\r\n 'agriculture': 2.5, 'industry': 22.8, 'services': 74.7, 'total': 230012\r\n },\r\n 'Puerto Rico': {\r\n 'agriculture': 1, 'industry': 45, 'services': 54, 'total': 103500\r\n },\r\n 'Qatar': {\r\n 'agriculture': 0.1, 'industry': 73, 'services': 26.9, 'total': 210002\r\n },\r\n 'Romania': {\r\n 'agriculture': 7.9, 'industry': 32.9, 'services': 59.2, 'total': 199950\r\n },\r\n 'Russia': {\r\n 'agriculture': 4.5, 'industry': 36.9, 'services': 58.6, 'total': 1857461\r\n },\r\n 'Rwanda': {\r\n 'agriculture': 33, 'industry': 13.9, 'services': 53.1, 'total': 8012\r\n },\r\n 'Saint Kitts and Nevis': {\r\n 'agriculture': 2.4, 'industry': 22.8, 'services': 74.7, 'total': 841\r\n },\r\n 'Saint Lucia': {\r\n 'agriculture': 4.1, 'industry': 18.4, 'services': 77.5, 'total': 1356\r\n },\r\n 'Saint Martin': {\r\n 'agriculture': 1, 'industry': 15, 'services': 84\r\n },\r\n 'Saint Vincent and the Grenadines': {\r\n 'agriculture': 7.8, 'industry': 25.9, 'services': 66.3, 'total': 736\r\n },\r\n 'Samoa': {\r\n 'agriculture': 9.9, 'industry': 28.8, 'services': 61.4, 'total': 826\r\n },\r\n 'San Marino': {\r\n 'agriculture': 0.1, 'industry': 39.2, 'services': 60.7, 'total': 1786\r\n },\r\n 'Sao Tome and Principe': {\r\n 'agriculture': 15, 'industry': 24.4, 'services': 60.6\r\n },\r\n 'Saudi Arabia': {\r\n 'agriculture': 2, 'industry': 69.1, 'services': 28.9, 'total': 752459\r\n },\r\n 'Senegal': {\r\n 'agriculture': 15, 'industry': 22.8, 'services': 62.2, 'total': 15584\r\n },\r\n 'Serbia': {\r\n 'agriculture': 11.2, 'industry': 18.7, 'services': 70, 'total': 43866\r\n },\r\n 'Seychelles': {\r\n 'agriculture': 2, 'industry': 18.5, 'services': 79.5, 'total': 1420\r\n },\r\n 'Sierra Leone': {\r\n 'agriculture': 51.5, 'industry': 22, 'services': 26.5, 'total': 5033\r\n },\r\n 'Singapore': {\r\n 'agriculture': 0, 'industry': 26.6, 'services': 73.4, 'total': 308051\r\n },\r\n 'Sint Maarten': {\r\n 'agriculture': 0.4, 'industry': 18.3, 'services': 81.3\r\n },\r\n 'Slovakia': {\r\n 'agriculture': 3.8, 'industry': 35.5, 'services': 60.7, 'total': 99971\r\n },\r\n 'Slovenia': {\r\n 'agriculture': 2.5, 'industry': 6.9, 'services': 90.5, 'total': 49506\r\n },\r\n 'Solomon Islands': {\r\n 'agriculture': 37.7, 'industry': 6.4, 'services': 55.9, 'total': 1155\r\n },\r\n 'Somalia': {\r\n 'agriculture': 60.2, 'industry': 7.4, 'services': 32.5, 'total': 1071\r\n },\r\n 'South Africa': {\r\n 'agriculture': 2.5, 'industry': 31.6, 'services': 65.9, 'total': 350082\r\n },\r\n 'Spain': {\r\n 'agriculture': 3.2, 'industry': 25.8, 'services': 71, 'total': 1406855\r\n },\r\n 'Sri Lanka': {\r\n 'agriculture': 13, 'industry': 29.6, 'services': 57.4, 'total': 74588\r\n },\r\n 'Sudan': {\r\n 'agriculture': 25, 'industry': 29.3, 'services': 45.7, 'total': 73816\r\n },\r\n 'S. Sudan': {\r\n 'total': 12833\r\n },\r\n 'Suriname': {\r\n 'agriculture': 10.8, 'industry': 24.4, 'services': 64.8, 'total': 5297\r\n },\r\n 'Swaziland': {\r\n 'agriculture': 8.2, 'industry': 46.9, 'services': 44.9, 'total': 3676\r\n },\r\n 'Sweden': {\r\n 'agriculture': 1.8, 'industry': 27.3, 'services': 70.9, 'total': 570137\r\n },\r\n 'Switzerland': {\r\n 'agriculture': 1.3, 'industry': 27.5, 'services': 71.3, 'total': 712050\r\n },\r\n 'Syria': {\r\n 'agriculture': 16.9, 'industry': 27.4, 'services': 55.7, 'total': 71998\r\n },\r\n 'Taiwan': {\r\n 'agriculture': 1.3, 'industry': 32, 'services': 66.9, 'total': 529550\r\n },\r\n 'Tajikistan': {\r\n 'agriculture': 21.4, 'industry': 21.7, 'services': 56.8, 'total': 9242\r\n },\r\n 'Tanzania': {\r\n 'agriculture': 27.8, 'industry': 24.2, 'services': 48, 'total': 47932\r\n },\r\n 'Thailand': {\r\n 'agriculture': 13.3, 'industry': 34, 'services': 52.7, 'total': 373804\r\n },\r\n 'Timor-Leste': {\r\n 'agriculture': 26.5, 'industry': 17.8, 'services': 55.6, 'total': 4478\r\n },\r\n 'Togo': {\r\n 'agriculture': 46, 'industry': 23, 'services': 31, 'total': 4604\r\n },\r\n 'Tonga': {\r\n 'agriculture': 20.8, 'industry': 18.1, 'services': 61.1, 'total': 454\r\n },\r\n 'Trinidad and Tobago': {\r\n 'agriculture': 0.3, 'industry': 58.4, 'services': 41.3, 'total': 28788\r\n },\r\n 'Tunisia': {\r\n 'agriculture': 10.6, 'industry': 34.6, 'services': 54.8, 'total': 48553\r\n },\r\n 'Turkey': {\r\n 'agriculture': 9.3, 'industry': 28.1, 'services': 62.6, 'total': 806108\r\n },\r\n 'Turkmenistan': {\r\n 'agriculture': 7.9, 'industry': 24.5, 'services': 67.6, 'total': 47932\r\n },\r\n 'Turks and Caicos Islands': {\r\n 'agriculture': 1, 'industry': 24.2, 'services': 74.8\r\n },\r\n 'Tuvalu': {\r\n 'agriculture': 16.6, 'industry': 27.2, 'services': 56.2, 'total': 38\r\n },\r\n 'Uganda': {\r\n 'agriculture': 22, 'industry': 25.4, 'services': 52.6, 'total': 27616\r\n },\r\n 'Ukraine': {\r\n 'agriculture': 9.4, 'industry': 34.4, 'services': 56.2, 'total': 130660\r\n },\r\n 'United Arab Emirates': {\r\n 'agriculture': 0.8, 'industry': 53.9, 'services': 45.3, 'total': 401647\r\n },\r\n 'United Kingdom': {\r\n 'agriculture': 0.7, 'industry': 21.4, 'services': 77.8, 'total': 2945146\r\n },\r\n 'United States': {\r\n 'agriculture': 1.2, 'industry': 19.2, 'services': 79.6, 'total': 17418925\r\n },\r\n 'Uruguay': {\r\n 'agriculture': 9.4, 'industry': 21.7, 'services': 68.9, 'total': 55143\r\n },\r\n 'Uzbekistan': {\r\n 'agriculture': 21.9, 'industry': 37.7, 'services': 40.3, 'total': 62619\r\n },\r\n 'Vanuatu': {\r\n 'agriculture': 21.2, 'industry': 10.4, 'services': 68.4, 'total': 812\r\n },\r\n 'Venezuela': {\r\n 'agriculture': 3.8, 'industry': 35.8, 'services': 60.4, 'total': 205787\r\n },\r\n 'Vietnam': {\r\n 'agriculture': 22, 'industry': 40.3, 'services': 37.7, 'total': 186049\r\n },\r\n 'U.S. Virgin Islands': {\r\n 'agriculture': 1, 'industry': 19, 'services': 80\r\n },\r\n 'West Bank and Gaza': {\r\n 'agriculture': 3.7, 'industry': 13.6, 'services': 82.7\r\n },\r\n 'Western Sahara': {\r\n 'agriculture': 0, 'industry': 0, 'services': 40\r\n },\r\n 'Yemen': {\r\n 'agriculture': 7.9, 'industry': 42.2, 'services': 49.9, 'total': 43229\r\n },\r\n 'Zambia': {\r\n 'agriculture': 21.4, 'industry': 35.1, 'services': 43.5, 'total': 26758\r\n },\r\n 'Zimbabwe': {\r\n 'agriculture': 20.4, 'industry': 24.6, 'services': 54.9, 'total': 13672\r\n }\r\n};\r\n","import React from 'react';\r\n\r\nimport Map, {\r\n Label,\r\n Layer,\r\n Size\r\n} from 'devextreme-react/vector-map';\r\n\r\nimport * as mapsData from 'devextreme/dist/js/vectormap-data/world.js';\r\nimport { countriesGDP } from './data.js';\r\n\r\nconst colorGroups = [0, 10000, 50000, 100000, 500000, 1000000, 10000000, 50000000];\r\nfunction customizeLayer(elements) {\r\n elements.forEach((element) => {\r\n const countryGDPData = countriesGDP[element.attribute('name')];\r\n element.attribute('total', countryGDPData && countryGDPData.total);\r\n });\r\n}\r\n\r\nclass App extends React.Component{\r\n \r\n render(){\r\n return (\r\n \r\n {renderDataDay(project(),this.props.authorization, this.props.apol, this.props.rules)}\r\n
\r\n\r\n Quantity: ${arg.valueText}` :\r\n null\r\n };\r\n}\r\n\r\nexport default TreeMaping;\r\n","import React from 'react';\r\n\r\nimport Funnel, {\r\n Export,\r\n Item,\r\n Border,\r\n Label\r\n} from 'devextreme-react/funnel';\r\nimport {Size} from \"devextreme-react/vector-map\";\r\n\r\nclass FunnelChart extends React.Component{\r\n render() {\r\n return (\r\n
${arg.item.argument}`;\r\n}\r\n\r\nexport default FunnelChart;\r\n","export const dataSource = [{\r\n total1: 9.5,\r\n total2: 168.8,\r\n total3: 127.2,\r\n older1: 2.4,\r\n older2: 8.8,\r\n older3: 40.1,\r\n perc1: 25.4,\r\n perc2: 5.3,\r\n perc3: 31.6,\r\n tag1: 'Sweden',\r\n tag2: 'Nigeria',\r\n tag3: 'Japan'\r\n}, {\r\n total1: 82.8,\r\n total2: 91.7,\r\n total3: 90.8,\r\n older1: 21.9,\r\n older2: 4.6,\r\n older3: 8.0,\r\n perc1: 26.7,\r\n perc2: 5.4,\r\n perc3: 8.9,\r\n tag1: 'Germany',\r\n tag2: 'Ethiopia',\r\n tag3: 'Viet Nam'\r\n}, {\r\n total1: 16.7,\r\n total2: 80.7,\r\n total3: 21.1,\r\n older1: 3.8,\r\n older2: 7.0,\r\n older3: 2.7,\r\n perc1: 22.8,\r\n perc2: 8.4,\r\n perc3: 12.9,\r\n tag1: 'Netherlands',\r\n tag2: 'Egypt',\r\n tag3: 'Sri Lanka'\r\n}, {\r\n total1: 62.8,\r\n total2: 52.4,\r\n total3: 96.7,\r\n older1: 14.4,\r\n older2: 4.0,\r\n older3: 5.9,\r\n perc1: 23.0,\r\n perc2: 7.8,\r\n perc3: 6.1,\r\n tag1: 'United Kingdom',\r\n tag2: 'South Africa',\r\n tag3: 'Philippines'\r\n}, {\r\n total1: 38.2,\r\n total2: 43.2,\r\n total3: 66.8,\r\n older1: 7.8,\r\n older2: 1.8,\r\n older3: 9.6,\r\n perc1: 20.4,\r\n perc2: 4.3,\r\n perc3: 13.7,\r\n tag1: 'Poland',\r\n tag2: 'Kenya',\r\n tag3: 'Thailand'\r\n}, {\r\n total1: 45.5,\r\n total3: 154.7,\r\n total4: 34.8,\r\n older1: 9.5,\r\n older3: 10.3,\r\n older4: 7.2,\r\n perc1: 21.1,\r\n perc3: 6.8,\r\n perc4: 20.8,\r\n tag1: 'Ukraine',\r\n tag3: 'Bangladesh',\r\n tag4: 'Canada'\r\n}, {\r\n total1: 143.2,\r\n total4: 120.8,\r\n older1: 26.5,\r\n older4: 11.0,\r\n perc1: 18.6,\r\n perc4: 9.5,\r\n tag1: 'Russian Federation',\r\n tag4: 'Mexico'\r\n}];","import React from 'react';\r\n\r\nimport {\r\n Chart,\r\n Series,\r\n CommonSeriesSettings,\r\n Legend,\r\n ValueAxis,\r\n ArgumentAxis,\r\n Label,\r\n Border,\r\n Tooltip\r\n} from 'devextreme-react/chart';\r\n\r\nimport { dataSource } from './data.js';\r\nimport {Size} from \"devextreme-react/vector-map\";\r\n\r\nconst palette = ['#00ced1', '#008000', '#ffd700', '#ff7f50'];\r\n\r\nexport default class BubbleChart extends React.Component{\r\n render(){\r\n return (\r\n
Total Population: ${pointInfo.argumentText}M
Population with Age over 60: ${pointInfo.valueText}M (${pointInfo.size}%)`\r\n };\r\n}\r\n\r\nfunction seriesClick(e) {\r\n const series = e.target;\r\n if (series.isVisible()) {\r\n series.hide();\r\n } else {\r\n series.show();\r\n }\r\n}\r\n\r\nfunction customizeText(e) {\r\n return `${e.value}M`;\r\n}\r\n","import React from 'react';\r\nimport {\r\n Chart,\r\n Series,\r\n CommonSeriesSettings,\r\n Legend,\r\n Tooltip,\r\n} from 'devextreme-react/chart';\r\nimport { Size } from \"devextreme-react/vector-map\";\r\n\r\n\r\nclass StackedBarQM extends React.Component {\r\n\r\n render() {\r\n let dataChart = this.props.data\r\n if (this.props.type === \"scorecardPerformance\") {\r\n if (dataChart !== null) {\r\n //reduce data to be used in the chart\r\n let values = dataChart.map(d => {\r\n return d.value\r\n })\r\n dataChart = [{ name: this.props.name, yes: values[1], no: values[0] }]\r\n }\r\n return (\r\n
No data
\r\n } else {\r\n //reduce data to be used in the chart\r\n dataChart = dataChart.map(d => {\r\n const result = d.items?.reduce((acc, currentItem) => {\r\n acc[currentItem.args] = currentItem.value;\r\n return acc;\r\n }, {});\r\n const userName = this.props.persons.filter(p => p.userId === d.userId)[0]?.name ?? \"\"\r\n return { userName: userName, ...result }\r\n })\r\n\r\n return (\r\n
\r\n
\r\n
\r\n\r\n
)\r\n );\r\n }\r\n}\r\n\r\nclass SimpleCounter extends React.Component {\r\n\r\n render() {\r\n return (\r\n generateElement(this.props.title,\r\n \r\n
\r\n
\r\n\r\n
\r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\nclass QMCounter extends React.Component {\r\n static contextType = MyContext\r\n render() {\r\n return (\r\n generateElement(this.props.title,\r\n \r\n {this.props.val}\r\n
\r\n {this.props.overflow ? \" overflow\" : \"\"}
\r\n \r\n
\r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\n\r\nclass SimpleBarExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n let getOneSerie = (this.props.kpi !== \"PolicyCompared\" && this.props.kpi !== \"CategoryCompared\")\r\n\r\n let getMoreSeries = (this.props.kpi === \"PolicyCompared\" || this.props.kpi === \"CategoryCompared\")\r\n\r\n return (\r\n generateElement(this.props.title,\r\n \r\n {this.props.valueType === \"average\" ? `${this.props.val} ${this.context.getTranslation(\"compliance\", \"points\")}` : `${this.props.val}`}\r\n
\r\n \r\n {`${this.props.evaluations} ${this.context.getTranslation(\"compliance\", \"evaluations\")}`}\r\n
\r\n \r\n \r\n\r\n \r\n {this.props.overflow &&
\r\n )\r\n );\r\n }\r\n}\r\n\r\nclass WorldMapExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\n// Important Widgets\r\n\r\nclass SplineExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\nclass DoughnutExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\nclass StackedBarExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n switch (this.props.kpi) {\r\n case \"GCTA\":\r\n case \"CTA\":\r\n case \"COA\":\r\n case \"CIA\":\r\n case \"CMA\":\r\n case \"CEAA\":\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n ));\r\n case \"GCNR\":\r\n case \"CNR\":\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n ));\r\n case \"QMAgentCompared\": {\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n ));\r\n }\r\n }\r\n}\r\n\r\nclass TreeMapExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\nclass FunnelExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\nclass BubbleExChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n \r\n
\r\n )\r\n );\r\n }\r\n}\r\n\r\nclass SpeedometerChart extends React.Component {\r\n\r\n render() {\r\n let w, h;\r\n\r\n if (this.props.size.width === -1) {\r\n w = window.innerWidth * 0.9;\r\n h = window.innerHeight * 0.9;\r\n } else {\r\n\r\n h = this.props.size.height;\r\n w = this.props.size.width;\r\n\r\n }\r\n return (\r\n generateElement(this.props.title,\r\n overflow
}\r\n ${d.tooltip} (${d.value})
`);\r\n\r\n\r\n const [x, y] = [e.pageX, e.pageY];\r\n tooltip.style('left', `${x}px`)\r\n .style('top', `${y}px`);\r\n })\r\n .on('mouseout', function () {\r\n d3.select('.tooltipTagCloud' + idTooltip + \"\").remove();\r\n })\r\n .on('click', function (e, d) {\r\n //console.log(d, e)\r\n if (onClickTag !== undefined) {\r\n onClickTag(d);\r\n }\r\n })\r\n\r\n }\r\n\r\n //componentDidMount\r\n useEffect(() => {\r\n\r\n if (!containerRef.current || !tags.length) return;\r\n\r\n const layout = cloud()\r\n .size([containerW, containerH])\r\n .words(tags.map(tag => ({\r\n text: resizeWords(tag),\r\n size: fontScale(tag.value),\r\n id: tag.id,\r\n tooltip: tag.text,\r\n value: tag.value\r\n })))\r\n .padding(1)\r\n .rotate(0)//.rotate(() => Math.random() * 120 - 60)\r\n .font(\"Segoe UI\")\r\n .fontSize(d => d.size)\r\n .on('end', renderCloud);\r\n\r\n layout.start();\r\n\r\n }, []);\r\n\r\n //componentDidUpdate\r\n useEffect(() => {\r\n\r\n if (!areListsEqual(tagsState, tags)) {\r\n\r\n setTagsState(tags);\r\n\r\n if (!containerRef.current || !tags.length) return;\r\n\r\n const layout = cloud()\r\n .size([containerW, containerH])\r\n .words(tags.map(tag => ({\r\n text: resizeWords(tag),\r\n size: fontScale(tag.value),\r\n id: tag.id,\r\n tooltip: tag.text,\r\n value: tag.value\r\n })))\r\n .padding(1)\r\n .rotate(0)//.rotate(() => Math.random() * 120 - 60)\r\n .font(\"Segoe UI\")\r\n .fontSize(d => d.size)\r\n .on('end', renderCloud);\r\n\r\n layout.start();\r\n }\r\n\r\n }, [tags]);\r\n\r\n return ;\r\n}\r\n\r\nfunction areListsEqual(list1, list2) {\r\n\r\n if (list1.length !== list2.length) {\r\n return false;\r\n }\r\n const serializeObject = (obj) => JSON.stringify(Object.entries(obj).sort());\r\n\r\n const sortedList1 = list1.map(serializeObject).sort();\r\n const sortedList2 = list2.map(serializeObject).sort();\r\n\r\n for (let i = 0; i < sortedList1.length; i++) {\r\n if (sortedList1[i] !== sortedList2[i]) {\r\n return false;\r\n }\r\n }\r\n\r\n return true;\r\n}\r\n\r\nexport default TagCloud;\r\n","import React from 'react';\r\nimport {\r\n BubbleExChart,\r\n DoughnutExChart, FunnelExChart,\r\n PiExChart,\r\n SimpleBarExChart,\r\n SplineExChart,\r\n StackedBarExChart, TreeMapExChart, SimpleCounter, palette, colorSet, source, sourceHit, sourceCompare, sourceLoss, sourceTotal, HealthCheck, QMCounter, SpeedometerChart\r\n} from './DevExtremeWidgets';\r\nimport { Spinner } from 'office-ui-fabric-react/lib';\r\nimport { queryReportData } from \"../../../queries/queryReport\";\r\n\r\nimport { Query } from 'react-apollo';\r\n\r\nimport gql from 'graphql-tag';\r\nimport TagCloud from './TagCloud/TagCloud';\r\nconst frameStyle = {\r\n margin: 4 * 2,\r\n padding: 4 * 2,\r\n sizeSmal: 76 * 2,\r\n sizeBig: 178 * 2,\r\n footer: 40,\r\n\r\n};\r\n\r\nclass DevboardWidget extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.reportConf = React.createRef();\r\n this.state = {\r\n query: 0,\r\n };\r\n this.data = null;\r\n }\r\n\r\n render() {\r\n return (\r\n this.queryWidget(this.props.element.id, this.props.element, this.props.input, this.props.apol)\r\n )\r\n }\r\n\r\n queryWidget = (id, element, input, apol) => (\r\n\r\n ;\r\n if (data.getReportData != null) {\r\n let size_w; let\r\n size_h;\r\n if (this.props.resize === true) {\r\n size_h = -1;\r\n size_w = -1;\r\n } else {\r\n size_w = frameStyle.sizeBig;\r\n size_h = frameStyle.sizeBig;\r\n }\r\n\r\n let dataTotal = [];\r\n if (data.getReportData.data.total !== null) {\r\n dataTotal = data.getReportData.data.total;\r\n }\r\n let elementData = null;\r\n let tempArr = [];\r\n switch (this.props.element.type) {\r\n case 'total':\r\n if (this.props.element.conversationType !== null\r\n && this.props.element.conversationType.length !== 0\r\n && this.props.element.kpi !== \"CC\"\r\n && this.props.element.kpi !== \"AU\"\r\n && this.props.element.kpi !== \"CNR\"\r\n && this.props.element.kpi !== \"ActiveUser\"\r\n && this.props.element.kpi !== \"UserCheck\"\r\n && this.props.element.kpi !== \"HealthCheck\"\r\n && this.props.element.kpi !== \"Export\"\r\n && this.props.element.kpi !== \"Exported\"\r\n && this.props.element.kpi != \"CategoryCompared\"\r\n && this.props.element.kpi != \"PolicyCompared\"\r\n ) {\r\n dataTotal.map(el => {\r\n if (this.props.element.conversationType.includes(el.args)) {\r\n tempArr.push(el);\r\n }\r\n });\r\n\r\n elementData = tempArr;\r\n\r\n } if (this.props.element.kpi == \"AICategorizationKPI\") {\r\n //we access first element because at the moment we only consider one AI categorization when creating the graph,\r\n //cheges may be needed in case we have more than one AI cat.\r\n elementData = data.getReportData.data.keymap != null && data.getReportData.data.keymap.length > 0 ?\r\n data.getReportData.data.keymap[0].items : []\r\n } else {\r\n elementData = data.getReportData.data.total;\r\n }\r\n break;\r\n case 'keymap':\r\n elementData = data.getReportData.data.keymap;\r\n break;\r\n case 'time':\r\n elementData = data.getReportData.data.time;\r\n break;\r\n case \"scorecardPerformance\":\r\n case 'user':\r\n elementData = data.getReportData.data.total;\r\n break;\r\n case \"sectionUser\":\r\n elementData = data.getReportData.data.user;\r\n break;\r\n case 'TagCloud':\r\n elementData = data.getReportData.data.keymap != null && data.getReportData.data.keymap.length > 0 ?\r\n data.getReportData.data.keymap[0].items : []\r\n break;\r\n case 'number':\r\n default:\r\n if (this.props.element.widget === 'TagCloud') {\r\n elementData = data.getReportData.data.keymap != null && data.getReportData.data.keymap.length > 0 ?\r\n data.getReportData.data.keymap[0].items : []\r\n } else {\r\n elementData = data.getReportData.data.text;\r\n }\r\n }\r\n\r\n switch (this.props.element.widget) {\r\n case 'TagCloud':\r\n var words = elementData !== null ? elementData.map(e => (\r\n {\r\n value: e.value,\r\n text: e.name,\r\n }\r\n )) : []\r\n return (\r\n
\r\n {words.length > 0 && !this.props.resize &&\r\n console.log(tag)}\r\n />\r\n }\r\n {words.length > 0 && this.props.resize &&\r\n console.log(tag)}\r\n />\r\n }\r\n {words.length == 0 &&\r\n
\r\n )\r\n\r\n case 'DoughnutChart': {\r\n const keywords = this.props.element.kpi !== \"QMAgentCompared\" ? this.props.element.keywords : data.getReportData.data.text\r\n return (\r\n \r\n
\r\n }\r\n\r\n NO DATA FOUND
\r\n \r\n {this.props.title}\r\n
\r\n \r\n {\r\n
\r\n \r\n \r\n );\r\n }\r\n\r\n _closeModal = () => {\r\n this.setState({ showModal: false });\r\n }\r\n\r\n _openModal = () => {\r\n this.setState({ showModal: true });\r\n }\r\n\r\n get chart() {\r\n return this.chartRef.current.instance;\r\n }\r\n\r\n exportChart() {\r\n this.chart.exportTo('export', 'png');\r\n }\r\n}\r\n","import React, { Component } from 'react'\r\nimport { FontIcon } from '@fluentui/react/lib/Icon'\r\nimport { mergeStyles } from 'office-ui-fabric-react/lib/Styling';\r\n\r\nconst iconClass = mergeStyles({\r\n fontSize: 12,\r\n transform: 'rotate(-90deg)',\r\n marginTop: \"15px\"\r\n})\r\n\r\nconst divIconClass = mergeStyles({\r\n background: \"trasparent\",\r\n ':hover': {\r\n backgroundColor: '#e3e3e3'\r\n },\r\n fontSize: 12,\r\n marginLeft: '5px',\r\n marginRight: '10px',\r\n '@media(prefers-color-scheme: dark)': {\r\n background: \"trasparent\",\r\n ':hover': {\r\n backgroundColor: '#414141'\r\n },\r\n borderBottom: \"1px solid rgb(32, 32, 32)\"\r\n },\r\n height: \"48px\",\r\n width: \"35px\",\r\n alignItems: 'center',\r\n textAlign: \"center\",\r\n borderBottom: \"1px solid rgb(247, 247, 247);\"\r\n})\r\n\r\nconst divIconClassDark = mergeStyles({\r\n background: \"trasparent\",\r\n ':hover': {\r\n backgroundColor: '#414141'\r\n },\r\n fontSize: 12,\r\n marginLeft: '5px',\r\n marginRight: '10px',\r\n height: \"48px\",\r\n width: \"35px\",\r\n alignItems: 'center',\r\n textAlign: \"center\",\r\n borderBottom: \"1px solid rgb(32, 32, 32)\"\r\n})\r\n\r\nconst headerAccordion = mergeStyles({\r\n background: '#f1f1f1',\r\n ':hover': {\r\n backgroundColor: '#ededed'\r\n },\r\n '@media(prefers-color-scheme: dark)': {\r\n background: \"#2b2b2b\",\r\n ':hover': {\r\n backgroundColor: '#333333'\r\n },\r\n borderBottom: \"1px solid rgb(32, 32, 32)\"\r\n },\r\n height: 48,\r\n borderBottom: \"1px solid rgb(247, 247, 247);\"\r\n})\r\n\r\nconst headerAccordionDark = mergeStyles({\r\n background: \"#2b2b2b\",\r\n ':hover': {\r\n backgroundColor: '#333333'\r\n },\r\n height: 48,\r\n borderBottom: \"1px solid rgb(32, 32, 32)\"\r\n})\r\n\r\nclass RIAccordion extends Component {\r\n\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this.state = {\r\n selectedKey: null,\r\n }\r\n }\r\n\r\n selectKeyAccordion = (selectedKey) => {\r\n if (selectedKey === this.state.selectedKey) {\r\n this.setState({\r\n selectedKey: null\r\n })\r\n } else {\r\n this.setState({\r\n selectedKey\r\n })\r\n }\r\n\r\n }\r\n\r\n render() {\r\n const isDarkMode = this.props.theme !== undefined && this.props.theme.type === \"dark\"\r\n return (\r\n \r\n {\r\n this.props.data.map((d, i) => {\r\n return (\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default RIAccordion","import React from 'react';\r\nimport \"./../../ReportView/ReportDetailContainer/ReportDetailContainer.scss\"\r\nimport DetailViewOverlay from \"./../../DetailView/DetailViewOverlay\"\r\nimport { DetailsList, DetailsListLayoutMode, Selection, SelectionMode, IColumn } from 'office-ui-fabric-react/lib/DetailsList';\r\nimport { Fabric } from 'office-ui-fabric-react/lib/';\r\nimport { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';\r\nimport { mergeStyleSets } from 'office-ui-fabric-react/lib/Styling';\r\nimport { Dialog, DialogType } from 'office-ui-fabric-react/lib/Dialog';\r\nimport { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';\r\nimport { CommandBarButton } from 'office-ui-fabric-react/lib/Button';\r\nimport { FontSizes, Stack, Text } from 'office-ui-fabric-react/lib';\r\nimport { Depths } from '@uifabric/fluent-theme/lib/fluent/FluentDepths';\r\nimport RIAccordion from \"../../ConversationSafe/Accordion/RIAccordion\";\r\nimport UserScreenIcon from '../../common/UserScreenBlack.svg';\r\n\r\n\r\nimport { Icon } from \"office-ui-fabric-react\";\r\nimport SMSIcon from \"../../assets/icons/sms_icon_black.svg\";\r\n\r\nimport zipcelx from 'zipcelx';\r\nimport { MyContext } from '../../../context';\r\n\r\nconst config = {\r\n filename: 'report',\r\n sheet: {\r\n data: [\r\n [{\r\n value: \"Conversation ID\",\r\n type: 'string'\r\n }, {\r\n value: 'ConversationType',\r\n type: 'string'\r\n }, {\r\n value: \"Header\",\r\n type: 'string'\r\n }, {\r\n value: \"Date\",\r\n type: 'string'\r\n }, {\r\n value: \"Start\",\r\n type: 'string'\r\n }, {\r\n value: \"Duration\",\r\n type: 'string'\r\n }, {\r\n value: \"Participants\",\r\n type: 'string'\r\n }, {\r\n value: \"userLogin\",\r\n type: 'string'\r\n }, {\r\n value: \"userId\",\r\n type: 'string'\r\n }, {\r\n value: \"hasAudio\",\r\n type: 'string'\r\n }, {\r\n value: \"hasVideo\",\r\n type: 'string'\r\n }, {\r\n value: \"hasScreen\",\r\n type: 'string'\r\n }, {\r\n value: \"size\",\r\n type: 'string'\r\n }, {\r\n value: \"transcript\",\r\n type: 'string'\r\n }, {\r\n value: \"errorMessage\",\r\n type: 'string'\r\n }\r\n ]\r\n ]\r\n }\r\n};\r\n\r\nconst classNames = mergeStyleSets({\r\n fileIconHeaderIcon: {\r\n padding: 0,\r\n fontSize: '16px'\r\n },\r\n fileIconCell: {\r\n textAlign: 'center',\r\n selectors: {\r\n '&:before': {\r\n content: '.',\r\n display: 'inline-block',\r\n verticalAlign: 'middle',\r\n height: '100%',\r\n width: '0px',\r\n visibility: 'hidden'\r\n }\r\n }\r\n },\r\n fileIconImg: {\r\n verticalAlign: 'middle',\r\n maxHeight: '20px',\r\n maxWidth: '20px'\r\n },\r\n controlWrapper: {\r\n display: 'flex',\r\n flexWrap: 'wrap'\r\n },\r\n exampleToggle: {\r\n display: 'inline-block',\r\n marginBottom: '10px',\r\n marginRight: '30px'\r\n },\r\n selectionDetails: {\r\n marginBottom: '20px'\r\n }\r\n});\r\n\r\nexport interface IDocument {\r\n conversationType: Boolean,\r\n conversationID: String,\r\n conversationDirection: String,\r\n initiator: String,\r\n date: String,\r\n starttime: String,\r\n endtime: String,\r\n duration: String,\r\n attendees: String,\r\n notes: String,\r\n transcription: String\r\n\r\n}\r\n\r\nexport interface IDetailsListDocumentsExampleState {\r\n columns: IColumn[];\r\n items: IDocument[];\r\n selectionDetails: string;\r\n isModalSelection: boolean;\r\n isCompactMode: boolean;\r\n}\r\n\r\n\r\n\r\nexport default class ReportDetailContainer extends React.Component<{}, IDetailsListDocumentsExampleState> {\r\n _selection: Selection;\r\n _allItems: IDocument[];\r\n constructor(props: {}) {\r\n super(props);\r\n\r\n this.detailContainerRef = React.createRef();\r\n\r\n this._allItems = this.props.isGrouped ? [] : this._generateDocuments(props.data.entry);\r\n\r\n this._allGroupedItems = this.props.isGrouped ? this.props.data.groupedEntries.map(folder => ({\r\n ...folder, reportEntries: this._generateDocuments(folder.reportEntries)\r\n })) : []\r\n\r\n\r\n let columns = [\r\n {\r\n key: 'column1',\r\n name: \r\n
\r\n )\r\n })\r\n }\r\n \r\n
\r\n \r\n
\r\n this.selectKeyAccordion(i)} >\r\n
\r\n {d.header}\r\n {d.content}
\r\n \r\n\r\n {/* == Player and meta data. ===================================== */}\r\n\r\n
\r\n \r\n
\r\n \r\n b.reportEntries.length - a.reportEntries.length).map((folder, i) => {\r\n return ({\r\n header: \r\n \r\n\r\n })\r\n })}>\r\n \r\n )}\r\n {!this.props.isGrouped && (\r\n \r\n \r\n\r\n )}\r\n
{/* end of main contenten */}\r\n \r\n\r\n\r\n\r\n
\r\n {this.props.isGrouped && (\r\n\r\n {folder.groupName} ({folder.reportEntries.length})
,\r\n content:\r\n \r\n\r\n {/* == Player and meta data. ===================================== */}\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
{/* end of main contenten */}\r\n \r\n\r\n\r\n\r\n
\r\n \r\n \r\n \r\n {/* == Recording Header ========================================= */}\r\n \r\n \r\n\r\n Report {this.props.data.title}{this.props.data.overflow && \": Data Overflow\"} \r\n {\r\n if (event != null) event.persist();\r\n this.setState({\r\n items: newValue ? this._allItems.filter(i => (i.topic.toLowerCase().indexOf(newValue.toLowerCase()) > -1)\r\n || (i.userId.toLowerCase().indexOf(newValue.toLowerCase()) > -1)\r\n || (i.date.toLowerCase().indexOf(newValue.toLowerCase()) > -1)\r\n || (i.botAppId.toLowerCase().indexOf(newValue.toLowerCase()) > -1)\r\n || (i.scenarioId.toLowerCase().indexOf(newValue.toLowerCase()) > -1)\r\n || (i.tenantId.toLowerCase().indexOf(newValue.toLowerCase()) > -1)\r\n || (i.callId.toLowerCase().indexOf(newValue.toLowerCase()) > -1)) : this._allItems\r\n });\r\n }}\r\n />\r\n \r\n \r\n
);\r\n\r\n }\r\n componentDidUpdate(previousProps: any, previousState: IDetailsListDocumentsExampleState) {\r\n if (previousState.isModalSelection !== this.state.isModalSelection && !this.state.isModalSelection) {\r\n this._selection.setAllSelected(false);\r\n }\r\n }\r\n\r\n _onChangeText = (ev: React.FormEvent\r\n\r\n {/* == Player and meta data. ===================================== */}\r\n\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
{/* end of main contenten */}\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n {(context) => (\r\n \r\n
\r\n\r\n\r\n ;\r\n if (error) { toast.error(\"Error loading report list,\\n please check your connection \"); return };\r\n if (data.getReportDetails.lossEntry != null) {\r\n return (\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n {this.getCycle(el.element)}\r\n \r\n \r\n \r\n\r\n \r\n {this.getKpi(el.element)}\r\n \r\n \r\n \r\n\r\n \r\n \r\n {titleText}\r\n \r\n\r\n\r\n \r\n {\r\n \r\n \r\n \r\n {\r\n this.renderPersona(el.persons)\r\n }\r\n \r\n \r\n \r\n {this.getUnit(el.element)}\r\n \r\n \r\n\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n getCycle = (data) => {\r\n if (data.tForm == \"custom\") {\r\n let startDate = new Date(data.startDate);\r\n let endDate = new Date(data.endDate);\r\n return (\r\n \r\n
\r\n ),\r\n }}\r\n instantOpenOnClick\r\n >\r\n \r\n
\r\n ),\r\n }}\r\n instantOpenOnClick\r\n >\r\n \r\n
\r\n ),\r\n }}\r\n instantOpenOnClick\r\n >\r\n \r\n \r\n {_.map(this.items, (el) => this.createElement(el))}\r\n \r\n
\r\n )\r\n }\r\n\r\n demoButton = () => (\r\n \r\n )\r\n\r\n //translate only default titles, if it's not a match will show original title\r\n translateDefaultTitles = (title) => {\r\n const phrases = {\r\n \"Conversations Recorded per Month during the Year\": \"conversationsRecordedPerMonthDuringYear\",\r\n \"Conversations Recorded per Day during Last Month\": \"conversationsRecordedPerDayDuringLastMonth\",\r\n \"Conversations Recorded per Hour Yesterday\": \"conversationsRecordedPerHourYesterday\",\r\n \"Conversations Recorded per Day during Last Week\": \"conversationsRecordedPerDayDuringLastWeek\",\r\n \"Detailed Report on Call Recording Problems by Category\": \"detailedReportOnCallRecordingProblemsByCategory\",\r\n \"Conversations Recorded vs. the Calls with Problems\": \"conversationsRecordedVsCallsWithProblems\",\r\n \"System Activity: Users being Recorded\": \"systemActivityUsersBeingRecorded\",\r\n \"System Availability: Bot Clusters & Backend Services (0=working, 1=problems)\": \"systemAvailabilityBotClustersBackendServices\",\r\n \"System Activity: Total Duration of Recordings\": \"systemActivityTotalDurationOfRecordings\",\r\n \"System Activity: Number of Deleted Conversations\": \"systemActivityNumberOfDeletedConversations\",\r\n \"Total Duration of Recordings\": \"totalDurationOfRecordings\",\r\n \"Recorded Conversations Breakdown by Days & Type\": \"recordedConversationsBreakdownByDaysType\",\r\n \"Call Conversations Today\": \"callConversationsToday\",\r\n \"Inbound Call Conversations\": \"inboundCallConversations\",\r\n \"Outbound Call Conversations\": \"outboundCallConversations\"\r\n };\r\n\r\n return (\r\n \r\n \r\n\r\n
\r\n )\r\n }\r\n \r\n \r\n \r\n {\r\n if (newValue == \"CC\")\r\n this.setState({ changedCycle: \"Current\" });\r\n\r\n this.setState({\r\n changedTitle: newValue\r\n });\r\n }}\r\n />\r\n {this.state.changedTitle === '' && Title is required}\r\n\r\n \r\n\r\n \r\n { return { userId: u } }))}\r\n fc={(user) => {\r\n this.setState({\r\n owner: user\r\n });\r\n }}\r\n\r\n />\r\n {this.state.owner.length === 0 && At least one owner is required}\r\n\r\n \r\n\r\n \r\n { return { userId: u } }))}\r\n fc={(user) => {\r\n this.setState({\r\n managers: user\r\n });\r\n }}\r\n />\r\n\r\n \r\n\r\n \r\n { return { userId: u } }))}\r\n fc={(user) => {\r\n this.setState({\r\n dashboardUsers: user\r\n });\r\n }}\r\n disabled={!(this.props.isOwner && this.props.userRules.ruleAccess.userAllowSharing)}\r\n />\r\n\r\n \r\n \r\n \r\n \r\n\r\n
\r\n\r\n \r\n {context.getTranslation(\"conversationsPage\", \"owner\")}
\r\n{context.getTranslation(\"dashboard\", \"managers\")}
\r\n{context.getTranslation(\"dashboard\", \"viewers\")}
\r\n\r\n \r\n {this.queryDashboard(this.props.authorization, this.props.apol, this.state.dashboardItem.key)}\r\n \r\n
\r\n
\r\n );\r\n }\r\n\r\n renderHeader = (reload) => (\r\n
;\r\n if (data.getReports != null && data.getReports.length > 0) {\r\n let reports = data.getReports;\r\n if (!(this.props.userRules.addOnQualityManagement && this.props.userRules.ruleAccess.complianceQMResultsAccess)) {\r\n reports = reports.filter(r => r.kpi !== \"QMAgentCompared\");\r\n }\r\n return (\r\n
\r\n {this.renderHeader(() => {\r\n refetch();\r\n this.setState({ query: this.state.query });\r\n })}\r\n
\r\n );\r\n }\r\n return (\r\n {\r\n refetch();\r\n }}\r\n data={reports}\r\n input={input}\r\n apol={apol}\r\n isDraggable={this.state.editMode}\r\n userRules={this.props.userRules}\r\n authorization={this.props.authorization}\r\n theme={this.props.theme}\r\n isManager={this.state.dashboardItem.isManager}\r\n isOwner={this.state.dashboardItem.isOwner}\r\n />\r\n
\r\n \r\n {this.renderHeader(refetch)}\r\n
)\r\n }\r\n \r\n
\r\n {context.getTranslation(\"dashboard\", \"noWidgets\")}
\r\n\r\n \r\n {\r\n return (\r\n \r\n {context.getTranslation(\"settings\", \"navigation\")} \r\n\r\n {(this.props.userRules.ruleAccess != null && (this.props.userRules.ruleAccess.confAddUser || this.props.userRules.ruleAccess.confListUser)) && \r\n {\r\n window.location.href = \"/rules/\";\r\n }}\r\n />\r\n }\r\n\r\n {(this.props.userRules.ruleAccess != null && (this.props.userRules.ruleAccess.tenantCreate || this.props.userRules.ruleAccess.tenantChange)) && \r\n {\r\n window.location.href = \"/tenant/\";\r\n }}\r\n />\r\n } \r\n {(this.props.userRules.ruleAccess != null && !this.props.userRules.ruleAccess.userDenyUpload) && \r\n {\r\n window.location.href = \"/upload/\";\r\n }}\r\n />\r\n }\r\n {(this.props.userRules.ruleAccess != null && (this.props.userRules.ruleAccess.confTicket)) && \r\n {\r\n window.location.href = \"/ticket/\";\r\n }}\r\n />\r\n }\r\n \r\n )\r\n }} />\r\n\r\n\r\n \r\n\r\n \r\n {context.getTranslation(\"settings\", \"tooltip\")} \r\n \r\n\r\n \r\n {context.getTranslation(\"settings\", \"appearance\")} \r\n \r\n \r\n \r\n {this.props.userRules.ruleRecording != null && (this.props.userRules.ruleRecording.audioType == \"Switch\") && \r\n Switch Recording \r\n }\r\n {this.props.userRules.ruleAnalytics != null && this.props.userRules.ruleAnalytics.withTranscription && (!this.props.userRules.visibilityDetails || this.props.userRules.visibilityDetailsAnalyticsChange) && \r\n {context.getTranslation(\"settings\", \"analyticsSettings\")} \r\n \r\n\r\n \r\n }\r\n {false && \r\n\r\n \r\n {\r\n console.log(this.state)\r\n }\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return \r\n
\r\n {this.renderKeyList()}\r\n }\r\n \r\n
\r\n )\r\n }\r\n \r\n
;\r\n if (error) return ;\r\n\r\n if (data.getCategoryData == null) {\r\n return ;\r\n }\r\n this.tmpKey = [];\r\n this.tmpKey.push({ key: \"Header1\", text: \"Categories\", itemType: 2 });\r\n const stack = data.getCategoryData.categorydata;\r\n if (data.getCategoryData.categorydata != null) {\r\n for (let x = 0; x < stack.length; x++) {\r\n let i = {\r\n name: stack[x].name,\r\n text: stack[x].name,\r\n keywords: stack[x].keywords,\r\n id: stack[x].id,\r\n key: stack[x].id,\r\n tenantId: stack[x].tenantId,\r\n frequence: stack[x].frequence,\r\n sentiments: stack[x].sentiments,\r\n };\r\n this.tmpKey.push(i);\r\n }\r\n }\r\n\r\n return
\r\n {this.renderKeyList()}\r\n
\r\n {(this.props.userRules.ruleAccess.userDenyUpload == null || !this.props.userRules.ruleAccess.userDenyUpload) &&
)}\r\n
}\r\n \r\n \r\n {(this.props.userRules.analytics === \"SpeechToText\" || (this.props.userRules.ruleAnalytics != null && this.props.userRules.ruleAnalytics.withTranscription)) &&\r\n {\r\n this.setState({\r\n language: option.key,\r\n });\r\n }}\r\n />\r\n }\r\n
\r\n \r\n {\r\n document.getElementById('result').innerHTML = '';\r\n document.getElementById('error').innerHTML = '';\r\n\r\n if (this.fileInputRef.current) {\r\n this.fileInputRef.current.click()\r\n }\r\n }}\r\n />\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n {\r\n var files = document.getElementById('files').files;\r\n if (!files.length) {\r\n alert('Please select a file');\r\n } else {\r\n if (!validFilename(files[0])) {\r\n alert('Please input a real filenmae!');\r\n } else {\r\n document.getElementById('result').innerHTML = 'Log in...';\r\n this.setState({ uploadActive: true });\r\n document.getElementById('result').innerHTML = 'Upload running...';\r\n this.execute(files[0]).then(() => console.log(\"Done\")).catch((e) => {\r\n document.getElementById('error').innerHTML = 'Error...' + e; this.setState({ uploadActive: false });\r\n });\r\n }\r\n }\r\n }} ref={this.fileInputRef} style={{ display: \"none\" }} accept=\"video/x-flv, video/mp4, audio/mp4, application/x-mpeg, video/MP2T, video/3gpp, video/quicktime, video/x-msvideo, video/x-ms-wmv, audio/wav, .mp3\" name=\"avatar\" />\r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react'\r\nimport './Login.scss'\r\n\r\nexport default class Logout extends Component {\r\n\r\n componentDidMount() {\r\n\r\n // Generate random state string and store it, so we can verify it in the callback\r\n // Go to the Azure AD authorization endpoint\r\n let queryParams = {\r\n post_logout_redirect_uri: window.location.origin\r\n };\r\n var esc = encodeURIComponent;\r\n var query = Object.keys(queryParams)\r\n .map(k => esc(k) + '=' + esc(queryParams[k]))\r\n .join('&');\r\n let authorizeEndpoint = \"https://login.microsoftonline.com/common/oauth2/v2.0/logout?\" + query\r\n window.location.assign(authorizeEndpoint);\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react'\r\nimport * as microsoftTeams from \"@microsoft/teams-js\";\r\n\r\nimport './Login.scss'\r\n\r\nexport default class LoginResult extends Component {\r\n\r\n componentDidMount() {\r\n microsoftTeams.initialize();\r\n console.log(\"loginReply: Start\");\r\n if (this.props.authContext.isCallback(window.location.hash)) {\r\n this.props.authContext.handleWindowCallback(window.location.hash);\r\n console.log(\"loginReply: Callback\");\r\n if (this.props.authContext.getCachedUser()) {\r\n console.log(\"loginReply: Success\");\r\n microsoftTeams.authentication.notifySuccess();\r\n } else {\r\n console.log(\"loginReply: Failure\");\r\n microsoftTeams.authentication.notifyFailure(this.props.authContext.getLoginError());\r\n }\r\n } else {\r\n // Unexpected condition: hash does not contain error or access_token parameter\r\n microsoftTeams.authentication.notifyFailure(\"UnexpectedFailure\");\r\n }\r\n window.close();\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react'\r\nimport * as microsoftTeams from \"@microsoft/teams-js\";\r\n\r\nimport './Login.scss'\r\n\r\nexport default class Config extends Component {\r\n\r\n componentDidMount() {\r\n microsoftTeams.initialize();\r\n microsoftTeams.settings.setValidityState(true);\r\n microsoftTeams.settings.registerOnSaveHandler(function (saveEvent) {\r\n\r\n microsoftTeams.settings.setSettings({\r\n entityId: \"1\",\r\n contentUrl: \"https://dev-teams.asc-recording.app/\",\r\n suggestedDisplayName: \"Recordings\"\r\n });\r\n saveEvent.notifySuccess();\r\n });\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\nimport { ASCHeader } from \"../ASCHeader/ASCHeader\";\r\nimport ASCFooter from \"../ASCFooter/ASCFooter\";\r\nimport { Text } from 'office-ui-fabric-react';\r\n\r\nimport {\r\n Stack\r\n} from \"office-ui-fabric-react\";\r\nimport { MyContext } from '../../context';\r\n\r\n\r\n// Styles definition\r\nconst stackContainerStyles: IStackStyles = {\r\n root: {\r\n paddingTop: 50\r\n }\r\n};\r\n\r\n\r\nconst stackStyles: IStackStyles = {\r\n root: {\r\n maxWidth: 660,\r\n marginBottom: 50\r\n }\r\n};\r\n\r\n// Tokens definition\r\nconst stackTokens: IStackTokens = { childrenGap: 5 };\r\n\r\n\r\nexport default class Privacy extends Component {\r\n\r\n\r\nrender() {\r\n return (- \r\n
- Contact \r\n
- Legal Statements \r\n
- Privacy Policy \r\n {/*
- Sitemap */}\r\n
- Terms of use \r\n
\r\n \r\n\r\n \r\n \r\n {context.getTranslation(\"shop\", \"welcome\")} \r\n {context.getTranslation(\"shop\", \"title\")} \r\n \r\n \r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return (\r\n \r\n
\r\n {!this.state.success && {\r\n this.confirmSubscription(subscriptionId, planId, seatQuantity);\r\n }} text={context.getTranslation(\"shop\", \"activate\")}\r\n />}\r\n \r\n );\r\n }}\r\n \r\n \r\n\r\n \r\n {this.state.success && Activation successful }\r\n {this.state.error && Activation not successful }\r\n \r\n\r\n \r\n\r\n\r\n \r\n\r\n
\r\n )\r\n }\r\n No connection to Marketplace
;\r\n let purchaseObject = JSON.parse(data.transactablePurchase);\r\n let subscriptionId = purchaseObject.subscriptionId;\r\n let subscriptionName = purchaseObject.subscriptionName;\r\n let planId = purchaseObject.planId;\r\n let offerId = purchaseObject.offerId;\r\n let seatQuantity = purchaseObject.seatQuantity.toString();\r\n return (\r\n \r\n {!this.state.success &&
\r\n {title}
\r\n {priority}
\r\n {date} {time}
\r\n
\r\n {(this.props.userRules.ruleAccess != null && this.props.userRules.ruleAccess.tenantCreate) && {\r\n this.props.apol.mutate({\r\n mutation: mutationDeleteNewsEntry,\r\n refetchQueries: [{\r\n query: queryGetNewsList,\r\n variables: { id: null, auth: this.props.auth },\r\n }],\r\n variables: { id: id }\r\n })\r\n .then(result => console.log(result));\r\n }\r\n }\r\n text=\"Delete\"\r\n allowDisabledFocus={true}\r\n />}\r\n
\r\n ))\r\n }}\r\n \r\n\r\n );\r\n }\r\n handleChange(text, id) {\r\n switch (id) {\r\n case 0: this.setState({ title: text }); break;\r\n case 1: this.setState({ priority: text }); break;\r\n case 2: this.setState({ sendMail: text }); break;\r\n case 3: this.setState({ text: text }); break;\r\n default: break;\r\n }\r\n // Decide to set isChanged\r\n if (\r\n ((id === 0 ? text : this.state.title) !== \"\")\r\n && ((id === 1 ? text : this.state.priority) !== \"\")\r\n && ((id === 0 ? text : this.state.text) !== \"\")\r\n )\r\n {\r\n this.setState({ isChanged: true });\r\n } else {\r\n this.setState({ isChanged: false });\r\n }\r\n }\r\n\r\n\r\n createNewsEntry = async (apol) => {\r\n // Add or change User\r\n var newsEntry = {\r\n title: this.state.title,\r\n text: this.state.text,\r\n priority: this.state.priority,\r\n sendMail: this.state.sendMail\r\n };\r\n var data = await apol\r\n .mutate({\r\n mutation: mutationCreateNewsEntry,\r\n refetchQueries: [{\r\n query: queryGetNewsList,\r\n variables: { id: null, auth: this.props.auth },\r\n }],\r\n variables: {\r\n news: newsEntry\r\n }\r\n });\r\n if (data.data.createNewsEntry) {\r\n toast.info('Create NewsEntry successful', {\r\n position: \"bottom-left\",\r\n autoClose: 5000,\r\n hideProgressBar: false,\r\n closeOnClick: true,\r\n pauseOnHover: true,\r\n draggable: true,\r\n });\r\n } else {\r\n toast.info('Create News Entry not successful', {\r\n position: \"bottom-left\",\r\n autoClose: 5000,\r\n hideProgressBar: false,\r\n closeOnClick: true,\r\n pauseOnHover: true,\r\n draggable: true,\r\n });\r\n };\r\n };\r\n}","//React\r\nimport React from 'react';\r\n//import * as ReactDOM from 'react-dom';\r\n//Apollo\r\n//Components\r\nimport { Panel, PanelType, Spinner, Stack, Button, Link } from 'office-ui-fabric-react/lib';\r\nimport { Query } from \"react-apollo\";\r\nimport gql from \"graphql-tag\";\r\n\r\nimport { Text } from 'office-ui-fabric-react/lib/Text';\r\nimport { MyContext } from '../context';\r\nimport NewsPanel from './NewsPanel';\r\n\r\n\r\nexport const renderPanelRecording = (self, auth, client, userRules, theme) => (\r\n \r\n
\r\n
\r\n
\r\n {(this.props.userRules.ruleAccess != null && this.props.userRules.ruleAccess.tenantCreate) &&
\r\n
\r\n {context.getTranslation(\"helpPanel\", \"helpRecordingText\")} \r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n {context.getTranslation(\"helpPanel\", \"helpRulesText\")} \r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n {context.getTranslation(\"helpPanel\", \"helpTenantText\")} \r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n {context.getTranslation(\"helpPanel\", \"helpSettingsText\")} \r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n {context.getTranslation(\"helpConversationUpload\", \"titleText\")} \r\n
\r\n
\r\n {context.getTranslation(\"helpConversationUpload\", \"language\")} \r\n
\r\n \r\n {context.getTranslation(\"helpConversationUpload\", \"languageText\")} \r\n
\r\n
\r\n {context.getTranslation(\"helpConversationUpload\", \"fileTypesText\")} \r\n
\r\n
\r\n {context.getTranslation(\"helpConversationUpload\", \"uploadText\")} \r\n
\r\n
\r\n {context.getTranslation(\"helpConversationUpload\", \"analysisText\")} \r\n
\r\n \r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n {context.getTranslation(\"helpPanel\", \"helpReportDashboardText\")} \r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n {context.getTranslation(\"helpPanel\", \"policyText\")} \r\n
\r\n\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n {context.getTranslation(\"helpPanel\", \"ticketText\")} \r\n
\r\n\r\n\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n\r\n\r\n \r\n \r\n\r\n
\r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n
\r\n );\r\n }\r\n}\r\n","import gql from 'graphql-tag';\r\n\r\nexport const queryPolicyRules = gql`query {\r\n getPolicyRules {\r\n id\r\n name\r\n description\r\n personal\r\n createdBy\r\n userId\r\n tenantId\r\n policyRuleGroup {\r\n id\r\n name\r\n generalGroup\r\n }\r\n areas{\r\n searchAreaType\r\n connectionType\r\n position\r\n frequence\r\n areaItems{\r\n connectionType\r\n items{\r\n position\r\n operatorType\r\n value\r\n name\r\n }\r\n }\r\n }\r\n masterItemId\r\n }\r\n }`\r\n\r\nexport const queryPolicyRuleLabels = gql`query {\r\n getPolicyRuleLabels {\r\n id\r\n name\r\n description\r\n masterItemId\r\n }\r\n }`\r\nexport const queryAICategorizationLabels = gql`query {\r\n \t\t\tgetAICategorizations {\r\n id\r\n name\r\n }\r\n }`\r\n\r\nexport const queryPolicyRule = gql`query ent ( $id: String) {\r\n getPolicyRule ( id: $id) {\r\n id\r\n name\r\n description\r\n personal\r\n createdBy\r\n userId\r\n tenantId\r\n policyRuleGroup {\r\n id\r\n generalGroup\r\n }\r\n areas{\r\n searchAreaType\r\n connectionType\r\n position\r\n frequence\r\n areaItems{\r\n connectionType\r\n items{\r\n position\r\n operatorType\r\n value\r\n name\r\n }\r\n }\r\n }\r\n version\r\n masterItemId\r\n selected\r\n }\r\n }`\r\n\r\nexport const createPolicyRule = gql`mutation ent( $policyRule: PolicyRuleInputType){\r\n createPolicyRule( policyRule: $policyRule) {\r\n text\r\n status\r\n id\r\n } }`\r\n\r\nexport const createPolicyRuleTemplate = gql`mutation ent( $policyRule: PolicyRuleInputType){\r\n createPolicyRuleTemplate( policyRule: $policyRule) {\r\n text\r\n status\r\n id\r\n } }`\r\n\r\nexport const deletePolicyRule = gql`mutation ent ( $id: String) {\r\n deletePolicyRule ( id: $id)\r\n {\r\n text\r\n status\r\n id\r\n }\r\n }`\r\n\r\nexport const getPatternsDetection = gql`query {\r\n getPatternsDetection {\r\n id\r\n name\r\n masterItemId\r\n }\r\n }`\r\n\r\nexport const getSearchAreaTypeEnum = gql`query ent {\r\n getSearchAreaTypeEnum\r\n {\r\n name\r\n }\r\n }`\r\n\r\nexport const getConnectionTypeEnum = gql`query ent {\r\n getConnectionTypeEnum\r\n {\r\n name\r\n }\r\n }`\r\n\r\nexport const getAdherencePhrases = gql`query {\r\n getAdherencePhrases {\r\n id\r\n name\r\n masterItemId\r\n }\r\n }`\r\n\r\nexport const getAIAdherencePhrases = gql`query {\r\n getAIAdherencePhrases {\r\n id\r\n name\r\n masterItemId\r\n }\r\n }`\r\n\r\nexport const getAIQuestions = gql`query {\r\n getAIQuestions {\r\n id\r\n name\r\n masterItemId\r\n }\r\n }`\r\n\r\nexport const getAllVersionOfPolicyRule = gql`query ent ($masterItemId: String) {\r\n getAllVersionOfPolicyRule(masterItemId: $masterItemId) {\r\n id\r\n version\r\n }\r\n }`\r\n\r\nexport const restorePolicyRule = gql`mutation ent ($id: String) {\r\n restorePolicyRule(id: $id) {\r\n id\r\n text\r\n status\r\n }\r\n }`","import { Separator, Stack, TextField, PrimaryButton, IconButton, Dropdown } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport { IIconProps, initializeIcons } from '@fluentui/react';\r\nimport { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip';\r\n\r\n\r\nexport default class FormKeywords extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n newKeyword: \"\",\r\n frequence: this.props.frequence,\r\n selectedConnection: this.props.connectionInsideArea,\r\n connections: this.props.availableConnections,\r\n isFrequencyEnabled: this.props.frequence > 1\r\n }\r\n }\r\n\r\n addKeyword = () => {\r\n if (this.state.newKeyword === \"\") {\r\n this.setState({\r\n error: this.context.getTranslation(\"compliance\", \"errorEmptyKeywords\")\r\n })\r\n } else if (this.props.keywords.includes(this.state.newKeyword)) {\r\n this.setState({\r\n error: this.context.getTranslation(\"compliance\", \"errorDuplicatedKeywords\")\r\n })\r\n } else {\r\n this.setState({\r\n newKeyword: \"\"\r\n })\r\n this.props.updateKeywords(this.props.position, [...this.props.keywords, this.state.newKeyword])\r\n }\r\n }\r\n\r\n changeNewKeyword = (e, value) => {\r\n this.setState({\r\n newKeyword: value,\r\n error: \"\"\r\n })\r\n }\r\n\r\n changeNewFrequence = (e, value) => {\r\n this.setState({\r\n frequence: parseInt(value),\r\n error: \"\"\r\n })\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(value))\r\n }\r\n\r\n deleteWord = (word) => {\r\n this.props.updateKeywords(this.props.position, this.props.keywords.filter(w => { return w !== word }))\r\n this.setState({\r\n error: \"\"\r\n })\r\n }\r\n\r\n deleteAllKeywords = () => {\r\n this.props.updateKeywords(this.props.position, [])\r\n this.setState({\r\n error: \"\"\r\n })\r\n }\r\n\r\n onChangeSelectConnection = (e, item) => {\r\n this.setState({\r\n selectedConnection: item.key,\r\n isFrequencyEnabled: !(item.key == \"AND\" || item.key == \"OR\")\r\n })\r\n this.props.updateConnectionInsideArea(this.props.position, item.key)\r\n }\r\n\r\n changeFrequencyVisibility = () => {\r\n if (this.state.selectedConnection != \"NONE\" && this.state.selectedConnection != null) {\r\n let isFrequencyEnabled = this.state.selectedConnection == \"AT_LEAST\" ? true : !this.state.isFrequencyEnabled\r\n if (!isFrequencyEnabled) {\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(1))\r\n }\r\n this.setState(prevState => ({\r\n isFrequencyEnabled: isFrequencyEnabled,\r\n frequence: isFrequencyEnabled ? prevState.frequence : 1\r\n }))\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n Get in contact
\r\n\r\n
\r\n
\r\n \r\n this.props.deleteArea(this.props.position)} />\r\n {`${this.context.getTranslation(\"compliance\", \"keywords\")} (${this.props.keywords.length})`}\r\n {![\"NONE\",\"AT_LEAST\",null].includes(this.state.selectedConnection) && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {this.props.keywords.length > 1 && < Dropdown\r\n style={{ marginLeft: \"20px\" }}\r\n placeholder={this.context.getTranslation(\"compliance\", \"selectConnection\")}\r\n label=\"\"\r\n selectedKey={this.state.selectedConnection}\r\n onChange={this.onChangeSelectConnection}\r\n options={this.state.connections}\r\n disabled={this.props.disabled}\r\n />}\r\n \r\n {this.state.isFrequencyEnabled && (\r\n )}\r\n \r\n {this.props.keywordsCheck &&\r\n \r\n \r\n {this.state.error}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n}","import { Stack, Dropdown, IconButton, Separator, Spinner, TextField } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport { queryGetCategory } from \"../../../../queries/queryCategory\";\r\nimport { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip';\r\n\r\n\r\n\r\nexport default class FormCategories extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n availableKeywordCategories: [],\r\n frequence: this.props.frequence,\r\n selectedConnection: this.props.connectionInsideArea,\r\n connections: this.props.availableConnections,\r\n isFrequencyEnabled: this.props.frequence > 1\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n const auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: queryGetCategory,\r\n variables: { auth }\r\n })\r\n .then((result) => {\r\n const availableKeywordCategories = result.data.getCategoryData.categorydata.map(cat => {\r\n return ({\r\n \"key\": cat.masterItemId,\r\n \"text\": cat.name\r\n })\r\n })\r\n\r\n //to understand if a category was deleted\r\n let idAvailableCategory = availableKeywordCategories.map(cat => cat.key)\r\n let includedCategory = this.props.selectedKeywordCategories.filter(c => idAvailableCategory.includes(c))\r\n let deletedElement = includedCategory.length !== this.props.selectedKeywordCategories.length\r\n this.props.checkElementToRestoreOldVersion(deletedElement)\r\n\r\n this.setState({\r\n availableKeywordCategories,\r\n deletedElement\r\n })\r\n });\r\n }\r\n\r\n onChangeSelectKeywordCategories = (e, item) => {\r\n if (item) {\r\n const selectedKeywordCategories = item.selected ? [...this.props.selectedKeywordCategories, item.key] : this.props.selectedKeywordCategories.filter(key => key !== item.key)\r\n this.props.updateCategories(this.props.position, selectedKeywordCategories)\r\n }\r\n }\r\n\r\n onChangeSelectConnection = (e, item) => {\r\n this.setState({\r\n selectedConnection: item.key,\r\n isFrequencyEnabled: !(item.key == \"AND\" || item.key == \"OR\")\r\n })\r\n this.props.updateConnectionInsideArea(this.props.position, item.key)\r\n }\r\n\r\n changeNewFrequence = (e, value) => {\r\n this.setState({\r\n frequence: parseInt(value),\r\n error: \"\"\r\n })\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(value))\r\n }\r\n\r\n changeFrequencyVisibility = () => {\r\n if (this.state.selectedConnection != \"NONE\" && this.state.selectedConnection != null) {\r\n let isFrequencyEnabled = this.state.selectedConnection == \"AT_LEAST\" ? true : !this.state.isFrequencyEnabled\r\n if (!isFrequencyEnabled) {\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(1))\r\n }\r\n this.setState(prevState => ({\r\n isFrequencyEnabled: isFrequencyEnabled,\r\n frequence: isFrequencyEnabled ? prevState.frequence : 1\r\n }))\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {this.props.keywords.map(w => {\r\n return (\r\n { this.deleteWord(w) }} disabled={this.props.disabled} /> \r\n {w} \r\n )\r\n })}\r\n
\r\n \r\n \r\n this.props.deleteArea(this.props.position)} />\r\n {`${this.context.getTranslation(\"compliance\", \"categories\")} (${this.props.selectedKeywordCategories.length})`}\r\n {![\"NONE\", \"AT_LEAST\", null].includes(this.state.selectedConnection) && (\r\n \r\n {!this.state.deletedElement && \r\n \r\n {this.state.availableKeywordCategories.length === 0 &&\r\n \r\n \r\n {this.props.selectedKeywordCategories.length > 1 && \r\n {this.state.isFrequencyEnabled && (\r\n )}\r\n }\r\n {this.state.deletedElement && \r\n {this.context.getTranslation(\"compliance\", \"deletedElement\") + \" \" + this.props.selectedKeywordCategories.join(\", \")}\r\n }\r\n
\r\n )\r\n }\r\n}","import { Stack, Dropdown, IconButton, Separator, Spinner, TextField } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport * as query from '../PolicyRulesQuery';\r\nimport { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip';\r\n\r\n\r\n\r\nexport default class FormPatternsDetection extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n availablePatterns: [],\r\n frequence: this.props.frequence,\r\n selectedConnection: this.props.connectionInsideArea,\r\n connections: this.props.availableConnections,\r\n isFrequencyEnabled: this.props.frequence > 1\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n //load patterns from db\r\n this.props.apol\r\n .query({\r\n query: query.getPatternsDetection,\r\n })\r\n .then((result) => {\r\n if (result.data.getPatternsDetection !== null && result.data.getPatternsDetection.length > 0) {\r\n const availablePatterns = result.data.getPatternsDetection.map(pattern => {\r\n return ({\r\n \"key\": pattern.masterItemId,\r\n \"text\": pattern.name\r\n })\r\n })\r\n\r\n //to understand if a PATTERN was deleted\r\n let idAvailablePattern = availablePatterns.map(pat => pat.key)\r\n let includedPattern = this.props.selectedPatterns.filter(p => idAvailablePattern.includes(p))\r\n let deletedElement = includedPattern.length !== this.props.selectedPatterns.length\r\n this.props.checkElementToRestoreOldVersion(deletedElement)\r\n\r\n this.setState({\r\n availablePatterns,\r\n deletedElement\r\n })\r\n }\r\n });\r\n }\r\n\r\n onChangeSelectPattern = (e, item) => {\r\n if (item) {\r\n this.props.updatePatterns(this.props.position, item.selected ? [...this.props.selectedPatterns, item.key] : this.props.selectedPatterns.filter(key => key !== item.key))\r\n }\r\n }\r\n\r\n onChangeSelectConnection = (e, item) => {\r\n this.setState({\r\n selectedConnection: item.key,\r\n isFrequencyEnabled: !(item.key == \"AND\" || item.key == \"OR\")\r\n })\r\n this.props.updateConnectionInsideArea(this.props.position, item.key)\r\n }\r\n\r\n changeNewFrequence = (e, value) => {\r\n this.setState({\r\n frequence: parseInt(value),\r\n error: \"\"\r\n })\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(value))\r\n }\r\n\r\n changeFrequencyVisibility = () => {\r\n if (this.state.selectedConnection != \"NONE\" && this.state.selectedConnection != null) {\r\n let isFrequencyEnabled = this.state.selectedConnection == \"AT_LEAST\" ? true : !this.state.isFrequencyEnabled\r\n if (!isFrequencyEnabled) {\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(1))\r\n }\r\n this.setState(prevState => ({\r\n isFrequencyEnabled: isFrequencyEnabled,\r\n frequence: isFrequencyEnabled ? prevState.frequence : 1\r\n }))\r\n }\r\n }\r\n\r\n render() {\r\n\r\n return (\r\n \r\n \r\n this.props.deleteArea(this.props.position)} />\r\n {`${this.context.getTranslation(\"compliance\", \"patternDetection\")} (${this.props.selectedPatterns.length})`}\r\n {![\"NONE\", \"AT_LEAST\", null].includes(this.state.selectedConnection) && (\r\n \r\n {!this.state.deletedElement && \r\n \r\n {this.state.availablePatterns.length === 0 &&\r\n \r\n \r\n {this.props.selectedPatterns.length > 1 && < Dropdown\r\n style={{ marginLeft: \"20px\" }}\r\n placeholder={this.context.getTranslation(\"compliance\", \"selectConnection\")}\r\n label=\"\"\r\n selectedKey={this.state.selectedConnection}\r\n onChange={this.onChangeSelectConnection}\r\n options={this.state.connections}\r\n />}\r\n \r\n {this.state.isFrequencyEnabled && (\r\n )}\r\n }\r\n {this.state.deletedElement && \r\n {this.context.getTranslation(\"compliance\", \"deletedElement\") + \" \" + this.props.selectedPatterns.join(\", \")}\r\n }\r\n
\r\n )\r\n }\r\n}","import { Stack, Dropdown, IconButton, Separator, Spinner, TextField } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport * as query from '../PolicyRulesQuery';\r\nimport { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip';\r\n\r\n\r\n\r\nexport default class FormAdherencePhrases extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n availablePhrases: null,\r\n frequence: this.props.frequence,\r\n selectedConnection: this.props.connectionInsideArea,\r\n connections: this.props.availableConnections,\r\n isFrequencyEnabled: this.props.frequence > 1\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n const auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: query.getAdherencePhrases,\r\n variables: { auth }\r\n })\r\n .then((result) => {\r\n const availablePhrases = result.data.getAdherencePhrases.map(p => {\r\n return ({\r\n \"key\": p.masterItemId,\r\n \"text\": p.name\r\n })\r\n })\r\n\r\n //to understand if a adhph was deleted\r\n let idAvailableAP = availablePhrases.map(ap => ap.key)\r\n let includedAP = this.props.selectedPhrases.filter(ap => idAvailableAP.includes(ap))\r\n let deletedElement = includedAP.length !== this.props.selectedPhrases.length\r\n this.props.checkElementToRestoreOldVersion(deletedElement)\r\n\r\n this.setState({\r\n availablePhrases,\r\n deletedElement\r\n })\r\n });\r\n }\r\n\r\n onChangeSelectPhrases = (e, item) => {\r\n if (item) {\r\n const selectedPhrases = item.selected ? [...this.props.selectedPhrases, item.key] : this.props.selectedPhrases.filter(key => key !== item.key)\r\n this.props.updatePhrases(this.props.position, selectedPhrases)\r\n }\r\n }\r\n\r\n onChangeSelectConnection = (e, item) => {\r\n this.setState({\r\n selectedConnection: item.key,\r\n isFrequencyEnabled: !(item.key == \"AND\" || item.key == \"OR\")\r\n\r\n })\r\n this.props.updateConnectionInsideArea(this.props.position, item.key)\r\n }\r\n\r\n changeNewFrequence = (e, value) => {\r\n this.setState({\r\n frequence: parseInt(value),\r\n error: \"\"\r\n })\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(value))\r\n }\r\n\r\n changeFrequencyVisibility = () => {\r\n if (this.state.selectedConnection != \"NONE\" && this.state.selectedConnection != null) {\r\n let isFrequencyEnabled = this.state.selectedConnection == \"AT_LEAST\" ? true : !this.state.isFrequencyEnabled\r\n if (!isFrequencyEnabled) {\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(1))\r\n }\r\n this.setState(prevState => ({\r\n isFrequencyEnabled: isFrequencyEnabled,\r\n frequence: isFrequencyEnabled ? prevState.frequence : 1\r\n }))\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n this.props.deleteArea(this.props.position)} />\r\n {`${this.context.getTranslation(\"compliance\", \"AdherencePhrases\")} (${this.props.selectedPhrases.length})`}\r\n {![\"NONE\", \"AT_LEAST\", null].includes(this.state.selectedConnection) && (\r\n \r\n {!this.state.deletedElement && \r\n \r\n {this.state.availablePhrases === null &&\r\n \r\n \r\n {this.props.selectedPhrases.length > 1 && \r\n {this.state.isFrequencyEnabled && (\r\n )}\r\n }\r\n {this.state.deletedElement && \r\n {this.context.getTranslation(\"compliance\", \"deletedElement\") + \" \" + this.props.selectedPhrases.join(\", \")}\r\n }\r\n
\r\n )\r\n }\r\n}","import { Stack, Dropdown, IconButton, Separator, Spinner, TextField } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport * as query from '../PolicyRulesQuery';\r\nimport { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip';\r\n\r\n\r\n\r\nexport default class FormAdherencePhrases extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n availablePhrases: null,\r\n frequence: this.props.frequence,\r\n selectedConnection: this.props.connectionInsideArea,\r\n connections: this.props.availableConnections,\r\n isFrequencyEnabled: this.props.frequence > 1\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n const auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: query.getAIAdherencePhrases,\r\n variables: { auth }\r\n })\r\n .then((result) => {\r\n const availablePhrases = result.data.getAIAdherencePhrases.map(p => {\r\n return ({\r\n \"key\": p.masterItemId,\r\n \"text\": p.name\r\n })\r\n })\r\n\r\n //to understand if a adhph was deleted\r\n let idAvailableAP = availablePhrases.map(ap => ap.key)\r\n let includedAP = this.props.selectedPhrases.filter(ap => idAvailableAP.includes(ap))\r\n let deletedElement = includedAP.length !== this.props.selectedPhrases.length\r\n this.props.checkElementToRestoreOldVersion(deletedElement)\r\n\r\n this.setState({\r\n availablePhrases,\r\n deletedElement\r\n })\r\n });\r\n }\r\n\r\n onChangeSelectPhrases = (e, item) => {\r\n if (item) {\r\n const selectedPhrases = item.selected ? [...this.props.selectedPhrases, item.key] : this.props.selectedPhrases.filter(key => key !== item.key)\r\n this.props.updatePhrases(this.props.position, selectedPhrases)\r\n }\r\n }\r\n\r\n onChangeSelectConnection = (e, item) => {\r\n this.setState({\r\n selectedConnection: item.key,\r\n isFrequencyEnabled: !(item.key == \"AND\" || item.key == \"OR\")\r\n\r\n })\r\n this.props.updateConnectionInsideArea(this.props.position, item.key)\r\n }\r\n\r\n changeNewFrequence = (e, value) => {\r\n this.setState({\r\n frequence: parseInt(value),\r\n error: \"\"\r\n })\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(value))\r\n }\r\n\r\n changeFrequencyVisibility = () => {\r\n if (this.state.selectedConnection != \"NONE\" && this.state.selectedConnection != null) {\r\n let isFrequencyEnabled = this.state.selectedConnection == \"AT_LEAST\" ? true : !this.state.isFrequencyEnabled\r\n if (!isFrequencyEnabled) {\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(1))\r\n }\r\n this.setState(prevState => ({\r\n isFrequencyEnabled: isFrequencyEnabled,\r\n frequence: isFrequencyEnabled ? prevState.frequence : 1\r\n }))\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n this.props.deleteArea(this.props.position)} />\r\n {`${this.context.getTranslation(\"compliance\", \"AIAdherencePhrases\")} (${this.props.selectedPhrases.length})`}\r\n {![\"NONE\", \"AT_LEAST\", null].includes(this.state.selectedConnection) && (\r\n \r\n {!this.state.deletedElement && \r\n \r\n {this.state.availablePhrases === null &&\r\n \r\n \r\n {this.props.selectedPhrases.length > 1 && \r\n {this.state.isFrequencyEnabled && (\r\n )}\r\n }\r\n {this.state.deletedElement && \r\n {this.context.getTranslation(\"compliance\", \"deletedElement\") + \" \" + this.props.selectedPhrases.join(\", \")}\r\n }\r\n
\r\n )\r\n }\r\n}","import { Stack, Dropdown, IconButton, Separator, Spinner, TextField } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport * as query from '../PolicyRulesQuery';\r\nimport { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip';\r\n\r\n\r\n\r\nexport default class FormAIQuestions extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n availableQuestions: null,\r\n frequence: this.props.frequence,\r\n selectedConnection: this.props.connectionInsideArea,\r\n connections: this.props.availableConnections,\r\n isFrequencyEnabled: this.props.frequence > 1\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n const auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: query.getAIQuestions,\r\n variables: { auth }\r\n })\r\n .then((result) => {\r\n const availableQuestions = result.data.getAIQuestions.map(p => {\r\n return ({\r\n \"key\": p.masterItemId,\r\n \"text\": p.name\r\n })\r\n })\r\n this.setState({\r\n availableQuestions\r\n })\r\n });\r\n }\r\n\r\n onChangeSelectQuestions = (e, item) => {\r\n if (item) {\r\n const selectedAIQuestions = item.selected ? [...this.props.selectedQuestions, item.key] : this.props.selectedQuestions.filter(key => key !== item.key)\r\n this.props.updateQuestions(this.props.position, selectedAIQuestions)\r\n }\r\n }\r\n\r\n onChangeSelectConnection = (e, item) => {\r\n this.setState({\r\n selectedConnection: item.key,\r\n isFrequencyEnabled: !(item.key == \"AND\" || item.key == \"OR\")\r\n })\r\n this.props.updateConnectionInsideArea(this.props.position, item.key)\r\n }\r\n\r\n changeNewFrequence = (e, value) => {\r\n this.setState({\r\n frequence: parseInt(value),\r\n error: \"\"\r\n })\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(value))\r\n }\r\n\r\n changeFrequencyVisibility = () => {\r\n if (this.state.selectedConnection != \"NONE\" && this.state.selectedConnection != null) {\r\n let isFrequencyEnabled = this.state.selectedConnection == \"AT_LEAST\" ? true : !this.state.isFrequencyEnabled\r\n if (!isFrequencyEnabled) {\r\n this.props.updateFrequenceInsideArea(this.props.position, parseInt(1))\r\n }\r\n this.setState(prevState => ({\r\n isFrequencyEnabled: isFrequencyEnabled,\r\n frequence: isFrequencyEnabled ? prevState.frequence : 1\r\n }))\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n this.props.deleteArea(this.props.position)} />\r\n {`${this.context.getTranslation(\"compliance\", \"AIQuestions\")} (${this.props.selectedQuestions.length})`}\r\n {![\"NONE\", \"AT_LEAST\", null].includes(this.state.selectedConnection) && (\r\n \r\n \r\n \r\n {this.state.availableQuestions === null &&\r\n \r\n \r\n {this.props.selectedQuestions.length > 1 && \r\n {this.state.isFrequencyEnabled && (\r\n )}\r\n \r\n
\r\n )\r\n }\r\n}","import { Checkbox, Stack, TextField, PrimaryButton, SecondaryButton, DefaultButton, Dropdown, Toggle, Separator, Spinner } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport * as QueryPR from '../PolicyRulesQuery';\r\nimport FormKeywords from './FormKeywords';\r\nimport FormCategories from './FormCategories';\r\nimport FormPatternsDetection from './FormPatternsDetection';\r\nimport FormAdherencePhrases from './FormAdherencePhrases';\r\nimport FormAIAdherencePhrases from './FormAIAdherencePhrases';\r\nimport '../../ComplianceView.scss';\r\nimport { Query } from 'react-apollo';\r\nimport FormAIQuestions from './FormAIQuestions';\r\n\r\n\r\nexport default class EditPolicyRule extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n const policyRule = this.props.data !== undefined ? this.props.data : null\r\n this.state = {\r\n //page data\r\n processing: false,\r\n processingVersion: false,\r\n selectedArea: null,\r\n availableAreas: [],\r\n availableConnections: [],\r\n isConnectionAreaInAnd: true,\r\n deletedElement: false,\r\n //policy rule data\r\n id: policyRule !== null ? policyRule.id : null,\r\n name: policyRule !== null ? policyRule.name : \"\",\r\n description: policyRule !== null ? policyRule.description : \"\",\r\n personal: policyRule !== null ? policyRule.personal : false,\r\n userId: policyRule !== null ? policyRule.userId : null,\r\n tenantId: policyRule !== null ? policyRule.tenantId : null,\r\n policyRuleGroup: policyRule !== null ? policyRule.policyRuleGroup.id : null,\r\n generalGroup: policyRule !== null ? policyRule.policyRuleGroup.generalGroup : false,\r\n areas: policyRule !== null && policyRule.areas !== undefined ? this.getAreas(policyRule.areas) : [],\r\n version: policyRule !== null ? policyRule.version : 0,\r\n masterItemId: policyRule !== null ? policyRule.masterItemId : null,\r\n selected: policyRule !== null ? policyRule.selected : true,\r\n //versions\r\n selectedOtherVersion: false,\r\n selectedVersion: policyRule !== null ? policyRule.id : null\r\n }\r\n }\r\n\r\n getAreas = (areas) => {\r\n var availableAreas = areas;\r\n if (!this.props.ruleAccess.userComplianceAIQuestions) {\r\n availableAreas = areas.filter(x => x.searchAreaType != \"AIQuestions\");\r\n }\r\n\r\n return availableAreas.map(a => {\r\n return (\r\n {\r\n connectionType: a.connectionType,\r\n position: a.position,\r\n frequence: a.frequence,\r\n searchAreaType: a.searchAreaType,\r\n areaItems: {\r\n connectionType: a.areaItems.connectionType,\r\n items: a.areaItems.items.map(i => {\r\n return ({\r\n operatorType: i.operatorType,\r\n position: i.position,\r\n value: i.value\r\n })\r\n })\r\n }\r\n }\r\n )\r\n })\r\n }\r\n\r\n refetchQueryVersions = null;\r\n numberOfVersions = 1\r\n\r\n refreshVersions = () => {\r\n if (this.refetchQueryVersions !== null) {\r\n this.refetchQueryVersions()\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n this.props.apol\r\n .query({\r\n query: QueryPR.getSearchAreaTypeEnum,\r\n })\r\n .then((result) => {\r\n var areas = result.data.getSearchAreaTypeEnum.filter(a => a.name !== \"QMQuestions\" && a.name !== \"ManualQMQuestions\");\r\n if (!this.props.ruleAccess.userComplianceAIQuestions) {\r\n areas = areas.filter(x => x.name != \"AIQuestions\");\r\n }\r\n var availableAreas = areas.map(r => {\r\n\r\n return {\r\n \"key\": r.name,\r\n \"text\": this.context.getTranslation(\"compliance\", r.name)\r\n }\r\n \r\n })\r\n this.setState({\r\n availableAreas\r\n })\r\n });\r\n\r\n this.props.apol\r\n .query({\r\n query: QueryPR.getConnectionTypeEnum,\r\n })\r\n .then((result) => {\r\n var availableConnections = []\r\n result.data.getConnectionTypeEnum.forEach(r => {\r\n if (r.name !== \"NONE\")\r\n availableConnections.push({\r\n \"key\": r.name,\r\n \"text\": this.context.getTranslation(\"compliance\", \"connection_\"+r.name)\r\n })\r\n })\r\n this.setState({\r\n availableConnections\r\n })\r\n });\r\n\r\n this.refreshVersions()\r\n }\r\n\r\n changeName = (e, value) => {\r\n this.setState({\r\n name: value,\r\n selectedOtherVersion: false,\r\n deletedElement: false,\r\n areas: this.state.deletedElement ? [] : this.state.areas,\r\n })\r\n }\r\n\r\n changeDescription = (e, value) => {\r\n this.setState({\r\n description: value,\r\n selectedOtherVersion: false,\r\n deletedElement: false,\r\n areas: this.state.deletedElement ? [] : this.state.areas,\r\n })\r\n }\r\n\r\n onChangePersonal = () => {\r\n this.setState({\r\n personal: !this.state.personal,\r\n selectedOtherVersion: false,\r\n deletedElement: false,\r\n areas: this.state.deletedElement ? [] : this.state.areas,\r\n })\r\n }\r\n\r\n /*Buttons cancel and save*/\r\n\r\n cancel = () => {\r\n this.props.closePanel()\r\n }\r\n\r\n save = (saveAsTemplate) => {\r\n this.setState({ processing: true })\r\n const policyRule = {\r\n id: this.state.id,\r\n name: this.state.name,\r\n description: this.state.description,\r\n personal: this.state.personal,\r\n userId: this.state.userId,\r\n tenantId: this.state.tenantId,\r\n policyRuleGroup: { id: this.state.policyRuleGroup, generalGroup: this.state.generalGroup != null ? this.state.generalGroup : saveAsTemplate },\r\n areas: this.state.areas,\r\n // manage version\r\n version: this.numberOfVersions,\r\n masterItemId: this.state.masterItemId,\r\n selected: this.state.selected,\r\n }\r\n this.props.apol\r\n .mutate({\r\n mutation: saveAsTemplate ? QueryPR.createPolicyRuleTemplate : QueryPR.createPolicyRule,\r\n variables: { policyRule }\r\n })\r\n .then((result) => {\r\n var resultData = saveAsTemplate ? result.data.createPolicyRuleTemplate : result.data.createPolicyRule\r\n var state = {}\r\n if (resultData.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshPolicyRules()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", resultData.text))\r\n }\r\n this.setState({ ...state, processing: false })\r\n });\r\n }\r\n\r\n //form validation -> disable save button with this method\r\n isValid = () => {\r\n var allAreasAreValid = true;\r\n this.state.areas.forEach(area => {\r\n if (area.areaItems.connectionType == \"AT_LEAST\" && area.frequence > area.areaItems.items.length) {\r\n allAreasAreValid = false\r\n }\r\n if ((area.areaItems.connectionType === null && area.areaItems.items.length > 1) || (area.frequence < 1 || isNaN(area.frequence)) || area.areaItems.items.length === 0) {\r\n allAreasAreValid = false;\r\n }\r\n })\r\n return this.state.name !== \"\" && this.state.areas.length > 0 && allAreasAreValid\r\n }\r\n\r\n onChangeSelectArea = (e, item) => {\r\n if (item !== null) {\r\n this.setState({\r\n selectedArea: item.key,\r\n deletedElement: false,\r\n areas: this.state.deletedElement ? [] : this.state.areas,\r\n })\r\n }\r\n }\r\n\r\n changeConnectionArea = (e, checked) => {\r\n this.setState({\r\n isConnectionAreaInAnd: checked\r\n })\r\n }\r\n\r\n addArea = () => {\r\n if (this.state.selectedArea !== null) {\r\n const newArea = {\r\n searchAreaType: this.state.selectedArea,\r\n position: this.state.areas.length,\r\n connectionType: this.state.areas.length === 0 ? \"NONE\" : this.state.isConnectionAreaInAnd ? \"AND\" : \"OR\",\r\n frequence: 1,\r\n areaItems: {\r\n connectionType: null,\r\n items: []\r\n }\r\n }\r\n this.setState({\r\n areas: [...this.state.areas, newArea],\r\n selectedArea: null,\r\n isConnectionAreaInAnd: true,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n }\r\n\r\n deleteArea = (position) => {\r\n var newAreas = this.state.areas.filter(area => area.position !== position);\r\n newAreas = newAreas.map((area, i) => {\r\n return (\r\n {\r\n ...area,\r\n position: i,\r\n frequence: 1,\r\n connectionType: i === 0 ? \"NONE\" : area.connectionType\r\n }\r\n )\r\n })\r\n this.setState({\r\n selectedOtherVersion: false,\r\n deletedElement: false,\r\n areas: this.state.deletedElement ? [] : newAreas,\r\n })\r\n }\r\n\r\n updateItems = (position, elements) => {\r\n const newAreas = this.state.areas.map(area => {\r\n if (area.position === position) {\r\n return (\r\n {\r\n ...area,\r\n areaItems: {\r\n connectionType: area.areaItems.connectionType,\r\n items: elements.map((e, i) => {\r\n return ({\r\n position: i,\r\n operatorType: \"equals\",\r\n value: e\r\n })\r\n })\r\n }\r\n }\r\n )\r\n } else {\r\n return area\r\n }\r\n })\r\n this.setState({\r\n areas: newAreas,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n updateConnectionInsideArea = (position, connection) => {\r\n const newAreas = this.state.areas.map(area => {\r\n if (area.position === position) {\r\n return (\r\n {\r\n ...area,\r\n areaItems: {\r\n connectionType: connection,\r\n items: area.areaItems.items,\r\n }\r\n }\r\n )\r\n } else {\r\n return area\r\n }\r\n })\r\n this.setState({\r\n areas: newAreas,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n updateFrequenceInsideArea = (position, frequence) => {\r\n const newAreas = this.state.areas.map(area => {\r\n if (area.position === position) {\r\n return (\r\n {\r\n ...area,\r\n frequence: frequence\r\n }\r\n )\r\n } else {\r\n return area\r\n }\r\n })\r\n this.setState({\r\n areas: newAreas,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n updateConnectionOutsideArea = (position) => {\r\n const newAreas = this.state.areas.map(area => {\r\n if (area.position === position) {\r\n return (\r\n {\r\n ...area,\r\n connectionType: area.connectionType === \"AND\" ? \"OR\" : \"AND\"\r\n }\r\n )\r\n } else {\r\n return area\r\n }\r\n })\r\n this.setState({\r\n areas: newAreas,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n onChangeVersion = (e, item) => {\r\n //get specific version to fill the fields\r\n this.setState({ processingVersion: true })\r\n let id = item.key\r\n this.props.apol\r\n .query({\r\n query: QueryPR.queryPolicyRule,\r\n variables: { id }\r\n })\r\n .then(({ loading, error, data, refetch }) => {\r\n let oldVersion = data.getPolicyRule;\r\n this.setState({\r\n name: oldVersion.name,\r\n description: oldVersion.description,\r\n personal: oldVersion.personal,\r\n userId: oldVersion.userId,\r\n policyRuleGroup: oldVersion.policyRuleGroup.id,\r\n generalGroup: oldVersion.policyRuleGroup.generalGroup,\r\n areas: this.getAreas(oldVersion.areas),\r\n tenantId: oldVersion.tenantId,\r\n selectedVersion: id,\r\n selectedOtherVersion: true,\r\n processingVersion: false\r\n })\r\n });\r\n }\r\n\r\n restoreVersion = () => {\r\n this.setState({ processing: true })\r\n //restorePolicyRule -> id vesrion to restore\r\n let id = this.state.selectedVersion\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryPR.restorePolicyRule,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.restorePolicyRule.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshPolicyRules()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.restorePolicyRule.text))\r\n }\r\n this.setState({\r\n selectedOtherVersion: false,\r\n processing: false\r\n })\r\n });\r\n }\r\n\r\n checkElementToRestoreOldVersion = (deletedElement) => {\r\n this.setState({\r\n deletedElement\r\n })\r\n }\r\n\r\n renderAreas = () => {\r\n //console.log(this.state.areas)\r\n if (this.state.areas.length > 0 && this.state.availableAreas.length > 0 && this.state.availableConnections.length > 0) {\r\n const result = this.state.areas.map(area => {\r\n return (\r\n {area.connectionType !== \"NONE\" &&\r\n \r\n }\r\n {area.searchAreaType === \"Keywords\" &&\r\n 0 ? area.areaItems.items.map(i => i.value) : []}\r\n frequence={area.frequence != undefined && area.frequence != \"\" ? area.frequence : 1}\r\n updateKeywords={this.updateItems}\r\n position={area.position}\r\n deleteArea={this.deleteArea}\r\n updateConnectionInsideArea={this.updateConnectionInsideArea}\r\n updateFrequenceInsideArea={this.updateFrequenceInsideArea}\r\n connectionInsideArea={area.areaItems.connectionType}\r\n availableConnections={this.state.availableConnections}\r\n disabled={this.state.deletedElement}\r\n />\r\n }\r\n {area.searchAreaType === \"Categories\" &&\r\n 0 ? area.areaItems.items.map(i => i.value) : []}\r\n frequence={area.frequence != undefined && area.frequence != \"\" ? area.frequence : 1}\r\n updateCategories={this.updateItems}\r\n apol={this.props.apol}\r\n auth={this.props.auth}\r\n position={area.position}\r\n deleteArea={this.deleteArea}\r\n updateConnectionInsideArea={this.updateConnectionInsideArea}\r\n updateFrequenceInsideArea={this.updateFrequenceInsideArea}\r\n connectionInsideArea={area.areaItems.connectionType}\r\n availableConnections={this.state.availableConnections}\r\n checkElementToRestoreOldVersion={this.checkElementToRestoreOldVersion}\r\n />}\r\n {area.searchAreaType === \"Patterns\" &&\r\n 0 ? area.areaItems.items.map(i => i.value) : []}\r\n frequence={area.frequence != undefined && area.frequence != \"\" ? area.frequence : 1}\r\n updatePatterns={this.updateItems}\r\n apol={this.props.apol}\r\n auth={this.props.auth}\r\n position={area.position}\r\n deleteArea={this.deleteArea}\r\n updateConnectionInsideArea={this.updateConnectionInsideArea}\r\n updateFrequenceInsideArea={this.updateFrequenceInsideArea}\r\n connectionInsideArea={area.areaItems.connectionType}\r\n availableConnections={this.state.availableConnections}\r\n checkElementToRestoreOldVersion={this.checkElementToRestoreOldVersion}\r\n />\r\n }\r\n {area.searchAreaType === \"AdherencePhrases\" &&\r\n 0 ? area.areaItems.items.map(i => i.value) : []}\r\n frequence={area.frequence != undefined && area.frequence != \"\" ? area.frequence : 1}\r\n updatePhrases={this.updateItems}\r\n apol={this.props.apol}\r\n auth={this.props.auth}\r\n position={area.position}\r\n deleteArea={this.deleteArea}\r\n updateConnectionInsideArea={this.updateConnectionInsideArea}\r\n updateFrequenceInsideArea={this.updateFrequenceInsideArea}\r\n connectionInsideArea={area.areaItems.connectionType}\r\n availableConnections={this.state.availableConnections}\r\n checkElementToRestoreOldVersion={this.checkElementToRestoreOldVersion}\r\n />\r\n }\r\n {area.searchAreaType === \"AIQuestions\" &&\r\n 0 ? area.areaItems.items.map(i => i.value) : []}\r\n frequence={area.frequence != undefined && area.frequence != \"\" ? area.frequence : 1}\r\n updateQuestions={this.updateItems}\r\n apol={this.props.apol}\r\n auth={this.props.auth}\r\n position={area.position}\r\n deleteArea={this.deleteArea}\r\n updateConnectionInsideArea={this.updateConnectionInsideArea}\r\n updateFrequenceInsideArea={this.updateFrequenceInsideArea}\r\n connectionInsideArea={area.areaItems.connectionType}\r\n availableConnections={this.state.availableConnections}\r\n />\r\n }\r\n {area.searchAreaType === \"AIAdherencePhrases\" &&\r\n 0 ? area.areaItems.items.map(i => i.value) : []}\r\n frequence={area.frequence != undefined && area.frequence != \"\" ? area.frequence : 1}\r\n updatePhrases={this.updateItems}\r\n apol={this.props.apol}\r\n auth={this.props.auth}\r\n position={area.position}\r\n deleteArea={this.deleteArea}\r\n updateConnectionInsideArea={this.updateConnectionInsideArea}\r\n updateFrequenceInsideArea={this.updateFrequenceInsideArea}\r\n connectionInsideArea={area.areaItems.connectionType}\r\n availableConnections={this.state.availableConnections}\r\n checkElementToRestoreOldVersion={this.checkElementToRestoreOldVersion}\r\n />\r\n }\r\n
\r\n )\r\n })\r\n return result;\r\n } else {\r\n return this.state.areas.length > 0 ? (\r\n \r\n this.updateConnectionOutsideArea(area.position)}\r\n disabled={this.state.deletedElement} />\r\n
\r\n \r\n {\r\n this.state.processingVersion &&
\r\n )\r\n }\r\n\r\n\r\n}","import { MessageBar, MessageBarType, Spinner } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../../context';\r\nimport EditPolicyRule from './EditPolicyRule'\r\nimport * as QueryPR from '../PolicyRulesQuery';\r\n\r\nexport default class EditPolicyRuleContainers extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n render() {\r\n const { auth } = this.props\r\n const id = this.props.policyRuleId\r\n return (\r\n \r\n
\r\n }\r\n {\r\n !this.state.processingVersion && \r\n {/*QUERY ALL VERSIONS*/}\r\n {this.state.masterItemId !== null && \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) {\r\n return (\r\n \r\n \r\n \r\n {this.renderAreas()}\r\n {this.state.areas.length > 0 && \r\n \r\n \r\n {this.state.areas.length > 0 && < Stack.Item align=\"center\" >\r\n \r\n \r\n \r\n {/*FOOTER BUTTONS*/}\r\n \r\n this.save(false)} style={{ marginTop: \"30px\", marginLeft: \"15px\" }} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {(this.props.userRules.userTemplateAllowed && (!this.state.selectedOtherVersion || this.state.id === this.state.selectedVersion)) &&\r\n this.save(true)} style={!this.isValid() || this.state.processing ? saveAsTemplateStyle : { ...saveAsTemplateStyle, background: \"red\", color: \"white\" }} allowDisabledFocus={true} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {this.state.selectedOtherVersion && this.state.id !== this.state.selectedVersion &&\r\n \r\n
\r\n }\r\n \r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n }\r\n {this.context.getTranslation(\"compliance\", \"textbasedIdentifiers\")}
\r\n\r\n
\r\n }\r\n \r\n {/*edit policy*/}\r\n {\r\n id != null && (\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getPolicyRule == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noDataPolicyRule\")}\r\n )\r\n }\r\n return (
\r\n )\r\n }\r\n}","import { CommandBarButton, DetailsList, FontIcon, MarqueeSelection, Panel, PanelType, Selection, SelectionMode, Spinner, Stack, GroupHeader } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\nimport { Query } from 'react-apollo';\r\nimport * as QueryPR from './PolicyRulesQuery';\r\nimport EditPolicyRuleContainers from './Panels/EditPolicyRuleContainers';\r\nimport { NetworkStatus } from 'apollo-boost';\r\nimport AlertBar from '../../CustomComponents/AlertBar';\r\nimport SafetyDialog from '../../CustomComponents/SafetyDialog'\r\nimport Utils from '../../common/Utils'\r\n\r\nconst orderAlphabetically = Utils.orderAlphabetically\r\n\r\n\r\nexport default class PolicyRules extends Component {\r\n static contextType = MyContext\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.setState({\r\n policyRuleId: this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : \"\",\r\n alertMessage: \"\",\r\n });\r\n }\r\n });\r\n\r\n this.state = {\r\n isPanelOpen: false,\r\n policyRuleId: null,\r\n alertMessage: \"\",\r\n alertMessagePanel: \"\",\r\n hideDialogDelete: true,\r\n isProcessing: false\r\n };\r\n }\r\n\r\n groupsCollapsed = []\r\n\r\n editPolicyRule = () => {\r\n var state = {};\r\n if (this._selection.getSelection().length > 0 && this._selection.getSelection()[0].id !== null) {\r\n state = {\r\n ...state,\r\n isPanelOpen: true,\r\n policyRuleId: this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : \"\"\r\n }\r\n } else {\r\n state = {\r\n ...state,\r\n alertMessage: this.context.getTranslation(\"compliance\", \"selectPolicyRule\"),\r\n alertType: \"warning\"\r\n }\r\n }\r\n this.setState({\r\n ...state\r\n })\r\n }\r\n\r\n newPolicyRule = () => {\r\n this.setState({\r\n isPanelOpen: true,\r\n policyRuleId: null,\r\n alertMessage: \"\"\r\n })\r\n }\r\n\r\n deletePolicyRule = () => {\r\n this.setState({ hideDialogDelete: true, isProcessing: true })\r\n if (this._selection.getSelection().length > 0 && this._selection.getSelection()[0].id !== null) {\r\n const id = this._selection.getSelection()[0].id\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryPR.deletePolicyRule,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.deletePolicyRule.status !== \"ok\") {\r\n this.setState({\r\n alertMessage: this.context.getTranslation(\"compliance\", result.data.deletePolicyRule.text),\r\n alertType: result.data.deletePolicyRule.status,\r\n isProcessing: false\r\n })\r\n } else {\r\n this.setState({ isProcessing: false })\r\n this.refetchQueryPolicyRules();\r\n }\r\n });\r\n }\r\n }\r\n\r\n\r\n hidePanel = () => {\r\n this.setState({ isPanelOpen: false, alertMessagePanel: \"\" });\r\n };\r\n\r\n _getKey = (item, index) => {\r\n return item.key;\r\n }\r\n\r\n _renderItemColumn = (item, index, column) => {\r\n const fieldContent = item[column.fieldName]\r\n switch (column.key) {\r\n case 'keywords':\r\n var keywords = []\r\n item.areas.forEach(a => {\r\n if (a.searchAreaType === \"Keywords\") {\r\n a.areaItems.items.forEach(w => {\r\n keywords.push(w.value)\r\n })\r\n }\r\n })\r\n return {this.joinElements(keywords)};\r\n case 'categories':\r\n var categories = []\r\n item.areas.forEach(a => {\r\n if (a.searchAreaType === \"Categories\") {\r\n a.areaItems.items.forEach(c => {\r\n categories.push(c.name)\r\n })\r\n }\r\n })\r\n return {this.joinElements(categories)};\r\n case \"patterns\":\r\n var patterns = []\r\n item.areas.forEach(a => {\r\n if (a.searchAreaType === \"Patterns\") {\r\n a.areaItems.items.forEach(c => {\r\n patterns.push(c.name)\r\n })\r\n }\r\n })\r\n return {this.joinElements(patterns)};\r\n case \"phrases\":\r\n var phrases = []\r\n item.areas.forEach(a => {\r\n if (a.searchAreaType === \"AdherencePhrases\") {\r\n a.areaItems.items.forEach(c => {\r\n phrases.push(c.name)\r\n })\r\n }\r\n })\r\n return {this.joinElements(phrases)};\r\n case \"AIQuestions\":\r\n var AIQuestions = []\r\n item.areas.forEach(a => {\r\n if (a.searchAreaType === \"AIQuestions\") {\r\n a.areaItems.items.forEach(c => {\r\n AIQuestions.push(c.name)\r\n })\r\n }\r\n })\r\n return {this.joinElements(AIQuestions)};\r\n case \"personal\":\r\n return {\r\n
\r\n )\r\n }}\r\n \r\n )\r\n }\r\n {/*create policy*/}\r\n {\r\n id === null && (\r\n \r\n
\r\n )\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this._selection.getSelection().length > 0 && this._selection.getSelection()[0].id !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n alertMessage: this.context.getTranslation(\"compliance\", \"selectPolicyRule\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n render() {\r\n\r\n const columns = this.props.userRules.ruleAccess.userComplianceAIQuestions ? [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"name\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"description\"), fieldName: 'description', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'keywords', name: this.context.getTranslation(\"compliance\", \"keywords\"), fieldName: 'keywords', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'categories', name: this.context.getTranslation(\"compliance\", \"categories\"), fieldName: 'categories', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'patterns', name: this.context.getTranslation(\"compliance\", \"patterns\"), fieldName: 'patterns', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'phrases', name: this.context.getTranslation(\"compliance\", \"AdherencePhrases\"), fieldName: 'phrases', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'AIQuestions', name: this.context.getTranslation(\"compliance\", \"AIQuestions\"), fieldName: 'AIQuestions', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'createdBy', name: this.context.getTranslation(\"compliance\", \"createdBy\"), fieldName: 'createdBy', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'personal', name: this.context.getTranslation(\"compliance\", \"personal\"), fieldName: 'personal', minWidth: 80, maxWidth: 100, isResizable: true },\r\n ] :\r\n [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"name\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"description\"), fieldName: 'description', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'keywords', name: this.context.getTranslation(\"compliance\", \"keywords\"), fieldName: 'keywords', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'categories', name: this.context.getTranslation(\"compliance\", \"categories\"), fieldName: 'categories', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'patterns', name: this.context.getTranslation(\"compliance\", \"patterns\"), fieldName: 'patterns', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'phrases', name: this.context.getTranslation(\"compliance\", \"AdherencePhrases\"), fieldName: 'phrases', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'createdBy', name: this.context.getTranslation(\"compliance\", \"createdBy\"), fieldName: 'createdBy', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'personal', name: this.context.getTranslation(\"compliance\", \"personal\"), fieldName: 'personal', minWidth: 80, maxWidth: 100, isResizable: true },\r\n ]\r\n\r\n return (\r\n {label}
\r\n \r\n\r\n {/*Manage button add and edit and delete policy rule*/}\r\n \r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ alertMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isProcessing && \r\n \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryPolicyRules = refetch;\r\n if (loading || networkStatus === NetworkStatus.refetch) return (\r\n \r\n {\r\n return (\r\n {\r\n this.groupsCollapsed = this.groupsCollapsed.map(g => {\r\n return g.key === group.key ? { ...g, isCollapsed: !g.isCollapsed } : g\r\n })\r\n if (props.onToggleCollapse) {\r\n props.onToggleCollapse(group)\r\n }\r\n }}\r\n />\r\n )\r\n }\r\n }}\r\n columns={columns}\r\n selectionMode={SelectionMode.single}\r\n selection={this._selection}\r\n getKey={this._getKey}\r\n setKey=\"single\"\r\n onRenderItemColumn={this._renderItemColumn}\r\n />\r\n \r\n )\r\n }}\r\n \r\n }\r\n\r\n {/*Policy rule edit and create panel*/}\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deletePolicyRule}\r\n />\r\n
\r\n )\r\n }\r\n\r\n\r\n\r\n\r\n\r\n}\r\n","import { Stack, Dropdown, Spinner, PrimaryButton, Text, DefaultButton, Dialog, DialogFooter, DialogType } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport {\r\n getAllFoldersShrinked, getFoldersAllowedForPolicies,\r\n saveFoldersInConversation\r\n} from \"../../../ConversationSafe/ConversationSafeQuery\";\r\nimport { queryGetEntry } from \"../../../../queries/queryRecordings\";\r\nimport { SpinnerSize } from \"office-ui-fabric-react/lib/Spinner\";\r\nimport _ from 'lodash'\r\nimport { MessageBar, MessageBarType } from \"office-ui-fabric-react\";\r\n\r\n\r\nexport default class PolicyCSFolders extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n availableFolders: null\r\n }\r\n\r\n }\r\n\r\n componentDidMount() {\r\n const auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: getFoldersAllowedForPolicies,\r\n variables: { input: auth }\r\n })\r\n .then((result) => {\r\n let availableFolders = result.data.getConversationSafeFolderLabelsPolicy.filter(e => e.id !== null && (e?.allowedInPolicy ?? true))\r\n this.setState({\r\n availableFolders,\r\n })\r\n })\r\n .catch(err => {\r\n console.log('error', err)\r\n this.setState({\r\n queryError: true,\r\n availableFolders: []\r\n })\r\n })\r\n }\r\n\r\n buildDropdownObjects = (allFolders) => {\r\n let availableFolders = allFolders.map(e => {\r\n return ({\r\n \"key\": e.id,\r\n \"text\": e.name,\r\n disabled: false\r\n })\r\n })\r\n return availableFolders\r\n }\r\n\r\n onChange = (event, folder) => {\r\n //when unassigned folder is selected\r\n console.log('folder', folder)\r\n let newFolderSelection = this.props.selectedFolders.includes(folder.key) ?\r\n this.props.selectedFolders.filter(e => e != folder.key) :\r\n [...this.props.selectedFolders, folder.key]\r\n this.props.onChangePolicyFolders(newFolderSelection)\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n // \r\n // {this.context.getTranslation('compliance', 'removeUsersWithoutAOCActionLabel')} \r\n //
}\r\n >\r\n {this.context.getTranslation('compliance', 'removeUsersWithoutAOCNotice')}\r\n \r\n \r\n )\r\n }\r\n\r\n}","import {\r\n Checkbox,\r\n Stack,\r\n TextField,\r\n PrimaryButton,\r\n Dropdown,\r\n DefaultButton,\r\n Spinner,\r\n TooltipHost,\r\n ChoiceGroup,\r\n ComboBox\r\n} from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext, getUserLanguage } from '../../../../context';\r\nimport * as QueryP from '../PolicyQuery';\r\nimport * as QueryPR from '../../PolicyRules/PolicyRulesQuery';\r\nimport UserPicker from '../../../ReportView/ReportConfiguration/UserPicker';\r\nimport { Query } from 'react-apollo';\r\nimport _ from 'lodash'\r\nimport PolicyCSFolders from \"./PolicyCSFolders\";\r\nimport { queryScorecardsLabels } from '../../AIQualityManagement/AIQualityManagementQuery';\r\nimport AlertNoAddOnCompliance from './AlertNoAddOnCompliance';\r\nimport AISupportedLanguages from \"../aisupportedlanguages.json\";\r\nimport AlertBar from '../../../CustomComponents/AlertBar';\r\nimport { queryAllAIAssistantQuestions } from '../../AIQuestion/AIQuestionQuery';\r\nimport AIAssistantQuestionsSelector from '../../AIAssistant/AIAssistantQuestionsSelector';\r\n\r\nexport default class EditPolicy extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n const policy = this.props.data !== undefined ? this.props.data : null\r\n\r\n //policyUsersWOAOC -> users(assignees) from the policy WithOut Add On Compliance license\r\n const policyUsersWOAOC = policy?.users.filter(u => !u.addOnCompliance).length ?? 0\r\n const policySupervisorsWOAOC = policy?.supervisors.filter(u => !u.addOnCompliance).length ?? 0\r\n\r\n // selectedUsersAndGroup: set of users and groups'members (no duplicates)\r\n let selectedUsersAndGroup = policy !== null\r\n ? [...new Set([\r\n ...policy.users.map(u => u.userId),\r\n ...policy.groups.map(g => g?.users.split(',')).flat()\r\n ])]\r\n : []\r\n let metaAssigneeUsersDeleted = policy?.metaAssigneeUsersDeleted ?? []\r\n let metaUsersThatAreNotInUsersYet = [...metaAssigneeUsersDeleted.filter(metaUser => !selectedUsersAndGroup.find(e => e === metaUser))]\r\n selectedUsersAndGroup = [...metaUsersThatAreNotInUsersYet, ...selectedUsersAndGroup]\r\n\r\n\r\n let selectedSupervisors = policy !== null ? policy.supervisors.map(u => u.userId) : []\r\n let metaMonitorUsersDeleted = policy?.metaMonitorUsersDeleted ?? []\r\n let metaMonitorUsersThatAreNotInUsersYet = metaMonitorUsersDeleted.filter(metaUser => !selectedSupervisors.find(e => e === metaUser))\r\n selectedSupervisors = [...metaMonitorUsersThatAreNotInUsersYet, ...selectedSupervisors]\r\n\r\n let visibleForUsers = policy !== null ? policy.visibleForUsers.map(u => u.userId) : []\r\n\r\n this.state = {\r\n //user data, information regarding add on compliance, this state is populated by its child userPicker\r\n userdata: null,\r\n //page data\\\r\n processing: false,\r\n processingVersion: false,\r\n //policy data\r\n id: policy !== null ? policy.id : null,\r\n name: policy !== null ? policy.name : \"\",\r\n description: policy !== null ? policy.description : \"\",\r\n userId: policy !== null ? policy.userId : null,\r\n tenantId: policy !== null ? policy.tenantId : null,\r\n channel: policy !== null ? policy.channel : \"None\",\r\n channelList: policy !== null ? policy.channelList : [],\r\n riskRating: policy !== null ? policy.riskRating : \"None\",\r\n active: policy !== null ? policy.active : false,\r\n aILanguageAnswer: policy != null ? policy.aILanguageAnswer : \"None\", \r\n selectedPolicyRule: policy !== null\r\n ? policy?.basedOn !== \"PolicyRule\" ?? null\r\n ? []\r\n : (policy.policyRules[0].masterItemId != null\r\n ? policy.policyRules[0].masterItemId\r\n : policy.policyRules[0].id)\r\n : [],\r\n selectedSupervisors,\r\n visibleForUsers,\r\n selectedUsersAndGroup,\r\n version: policy !== null ? policy.version : 0,\r\n masterItemId: policy !== null ? policy.masterItemId : null,\r\n selected: policy !== null ? policy.selected : true,\r\n //versions\r\n selectedOtherVersion: false,\r\n selectedVersion: policy !== null ? policy.id : null,\r\n allAssigneeHaveAOC: !metaAssigneeUsersDeleted.length,\r\n allMonitorsHaveAOC: !metaMonitorUsersDeleted.length,\r\n allVisibleForUsersHaveAOC: true,\r\n //number of users in the picker bordered with red (without AOC), useful for bulk deleting from message Bar\r\n deleteNoAOCUsersBulk: metaUsersThatAreNotInUsersYet.length + policyUsersWOAOC,\r\n deleteNoAOCUsersBulkMonitor: metaMonitorUsersThatAreNotInUsersYet.length + policySupervisorsWOAOC,\r\n metaMonitorUsersDeleted: policy?.metaMonitorUsersDeleted ?? [],\r\n conversationSafeFolders: policy?.conversationSafeFolders.map(e => e.id) ?? [],\r\n basedOn: policy?.basedOn ?? \"PolicyRule\",\r\n aICategorizationId: policy !== null && policy.aICategorizationInfos !== null && policy.aICategorizationInfos.length > 0 ? policy.aICategorizationInfos[0].aICategorizationId : \"\",\r\n AICatOccurrences: policy !== null && policy.aICategorizationInfos !== null && policy.aICategorizationInfos.length > 0 ? policy.aICategorizationInfos[0].occurrences : 0,\r\n scorecardId: policy !== null && policy.aIScorecardInfos !== null && policy.aIScorecardInfos.length > 0 ? policy.aIScorecardInfos[0].scorecardId : null,\r\n conversationType: policy !== null && policy.aIScorecardInfos !== null && policy.aIScorecardInfos.length > 0 ? policy.aIScorecardInfos[0].conversationType : [],\r\n //policy ai language data\r\n browserDefaultLanguage: getUserLanguage(),\r\n languageOptions: AISupportedLanguages.languages,\r\n aIAssistantSelectedQuestions: policy !== null && policy.aIAssistantQuestions !== null && policy.aIAssistantQuestions.length > 0 ? policy.aIAssistantQuestions.map(q => { return q.masterItemId }) : [],\r\n aIQuestionType: \"AIAssistantQuestion\"\r\n };\r\n\r\n }\r\n\r\n componentDidMount() {\r\n this.refreshVersions();\r\n\r\n //get language from context\r\n const { language } = this.context;\r\n this.setState({ browserDefaultLanguage: language });\r\n\r\n\r\n\r\n if (this.state.basedOn === \"Scorecard\" || this.state.basedOn === \"AICategorization\" || this.state.basedOn === \"AIAssistant\") {\r\n let language = this.getAILanguageAnswer(this.state.languageOptions, this.state.browserDefaultLanguage);\r\n this.setState({ aILanguageAnswer: language })\r\n }\r\n else {\r\n this.setState({ aILanguageAnswer: \"None\" })\r\n }\r\n\r\n }\r\n\r\n\r\n refetchQueryVersions = null;\r\n numberOfVersions = 1\r\n\r\n refreshVersions = () => {\r\n if (this.refetchQueryVersions !== null) {\r\n this.refetchQueryVersions()\r\n }\r\n }\r\n\r\n changeName = (e, value) => {\r\n this.setState({\r\n name: value,\r\n selectedOtherVersion: false,\r\n })\r\n }\r\n\r\n changeDescription = (e, value) => {\r\n this.setState({\r\n description: value,\r\n selectedOtherVersion: false,\r\n })\r\n }\r\n\r\n onChangeText = () => {\r\n let channel = \"\"\r\n switch (this.state.channel) {\r\n case \"Text\": channel = \"None\"; break;\r\n case \"None\": channel = \"Text\"; break;\r\n case \"Both\": channel = \"Voice\"; break;\r\n case \"Voice\": channel = \"Both\"; break;\r\n }\r\n this.setState({\r\n channel,\r\n selectedOtherVersion: false,\r\n })\r\n }\r\n\r\n onChangeRiskRating = (ev) => {\r\n let riskRating = \"\"\r\n switch (ev.target.id) {\r\n case \"Info\": riskRating = \"Info\"; break;\r\n case \"Adherence\": riskRating = \"Adherence\"; break;\r\n case \"Warning\": riskRating = \"Warn\"; break;\r\n }\r\n this.setState({\r\n riskRating,\r\n selectedOtherVersion: false,\r\n })\r\n }\r\n\r\n onChangeVoice = () => {\r\n let channel = \"\"\r\n switch (this.state.channel) {\r\n case \"Text\": channel = \"Both\"; break;\r\n case \"None\": channel = \"Voice\"; break;\r\n case \"Both\": channel = \"Text\"; break;\r\n case \"Voice\": channel = \"None\"; break;\r\n }\r\n this.setState({\r\n channel,\r\n selectedOtherVersion: false,\r\n })\r\n }\r\n\r\n onChangeChannel = (event, checked, channelType) => {\r\n\r\n let channelList = []\r\n\r\n // if channelList is empty we are editing an old policy with 2 old channels\r\n if (this.state.channelList == null || this.state.channelList === undefined) {\r\n if (checked) {\r\n if (channelType != this.state.channel && this.state.channel == \"Both\") {\r\n channelList.push(\"Text\");\r\n channelList.push(\"Voice\");\r\n channelList.push(channelType);\r\n }\r\n else if (channelType != this.state.channel){\r\n channelList.push(this.state.channel);\r\n channelList.push(channelType);\r\n }\r\n }\r\n else if (!checked) {\r\n if (this.state.channel == \"Both\" && channelType == \"Text\") {\r\n channelList.push(\"Voice\");\r\n }\r\n else if (this.state.channel == \"Both\" && channelType == \"Voice\") {\r\n channelList.push(\"Text\");\r\n }\r\n \r\n }\r\n this.setState({channelList})\r\n }\r\n else\r\n {\r\n if (checked && !this.state.channelList.includes(channelType)) {\r\n channelList = [... this.state.channelList, channelType]\r\n this.setState({channelList})\r\n }\r\n else if (!checked && this.state.channelList.includes(channelType)) {\r\n channelList = this.state.channelList.filter((item) => item !== channelType)\r\n this.setState({channelList})\r\n }\r\n }\r\n }\r\n\r\n convertChannel = () => {\r\n\r\n let channelList = []\r\n\r\n switch (this.state.channel) {\r\n case \"Text\":\r\n channelList.push(\"Text\");\r\n break;\r\n case \"Voice\":\r\n channelList.push(\"Voice\");\r\n break;\r\n case \"Both\":\r\n channelList.push(\"Text\");\r\n channelList.push(\"Voice\");\r\n break;\r\n }\r\n\r\n return channelList;\r\n };\r\n\r\n onChangeActive = () => {\r\n this.setState({\r\n active: !this.state.active,\r\n selectedOtherVersion: false,\r\n })\r\n }\r\n\r\n onChangeSelectPolicyRule = (e, item) => {\r\n this.setState({\r\n selectedPolicyRule: item.key,\r\n selectedOtherVersion: false,\r\n })\r\n }\r\n\r\n onChangePolicyFolders = (newSelection) => {\r\n this.setState({ conversationSafeFolders: newSelection, selectedOtherVersion: false })\r\n }\r\n\r\n onChangeAIAssistantQuestions = (newSelection) => {\r\n this.setState({ aIAssistantSelectedQuestions: newSelection })\r\n }\r\n\r\n /*Buttons cancel and save*/\r\n\r\n cancel = () => {\r\n this.props.closePanel()\r\n }\r\n\r\n save = () => {\r\n this.setState({ processing: true })\r\n const auth = this.props.auth\r\n const policy = {\r\n id: this.state.id,\r\n name: this.state.name,\r\n description: this.state.description,\r\n channel: null,\r\n channelList: this.state.channelList == null || this.state.channelList === undefined\r\n ? this.convertChannel()\r\n : this.state.channelList, \r\n riskRating: this.state.riskRating,\r\n active: this.state.active,\r\n userId: this.state.userId,\r\n tenantId: this.state.tenantId,\r\n supervisors: this.state.selectedSupervisors.map(userIdOrGroupId => { return ({ userId: userIdOrGroupId }) }),\r\n aILanguageAnswer: this.state.aILanguageAnswer,\r\n policyRules: this.state.selectedPolicyRule.length ? [\r\n {\r\n id: this.state.selectedPolicyRule\r\n }\r\n ] : [],\r\n //FIXME: for now all users and groups are stored here in users\r\n users: this.state.selectedUsersAndGroup.map(userIdOrGroupId => ({ userId: userIdOrGroupId })),\r\n visibleForUsers: this.state.visibleForUsers.map(userIdOrGroupId => ({ userId: userIdOrGroupId })),\r\n metaAssigneeUsersDeleted: [],\r\n metaMonitorUsersDeleted: this.state.metaMonitorUsersDeleted,\r\n //manage version\r\n version: this.numberOfVersions,\r\n masterItemId: this.state.masterItemId,\r\n selected: this.state.selected,\r\n //managed conversationSafeFolders\r\n conversationSafeFolders: this.state?.conversationSafeFolders?.map(id => ({ id })) ?? [],\r\n basedOn: this.state.basedOn,\r\n aICategorizationInfos: this.state.basedOn === \"AICategorization\" ? [{\r\n aICategorizationId: this.state?.aICategorizationId,\r\n occurrences: parseInt(this.state.AICatOccurrences)\r\n }] : [],\r\n aIScorecardInfos: this.state.basedOn === \"Scorecard\" ? [{\r\n scorecardId: this.state.scorecardId,\r\n conversationType: this.state.conversationType\r\n }] : [],\r\n aIAssistantQuestions: this.state.basedOn === \"AIAssistant\" ?\r\n this.state.aIAssistantSelectedQuestions.map(question => { return ({ id: question }) }) : []\r\n\r\n }\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryP.createPolicy,\r\n variables: { auth, policy }\r\n })\r\n .then((result) => {\r\n var state = {}\r\n if (result.data.createPolicy.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshPolicies()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.createPolicy.text))\r\n }\r\n this.setState({ ...state, processing: false })\r\n });\r\n }\r\n\r\n //form validation -> disable save button with this method\r\n isValid = () => {\r\n const name = this.state.name !== \"\"\r\n const assignTo = this.state.selectedUsersAndGroup.length > 0\r\n const channel = this.state.channel !== \"None\" || (this.state.channelList.length > 0)\r\n const riskRating = this.state.riskRating !== \"\"\r\n let basedOnCheck = false\r\n switch (this.state.basedOn) {\r\n case \"PolicyRule\": {\r\n basedOnCheck = this.state.basedOn !== \"PolicyRule\" ? true : this.state.selectedPolicyRule.length > 0\r\n break;\r\n }\r\n case \"AICategorization\": {\r\n const AICatSectionFilled = this.state.basedOn !== \"AICategorization\" ? true :\r\n this.state.aICategorizationId !== \"\" && (_.inRange(this.state?.AICatOccurrences, 1, 6))\r\n basedOnCheck = AICatSectionFilled\r\n break;\r\n }\r\n case \"Scorecard\": {\r\n basedOnCheck = this.state.scorecardId !== null\r\n break;\r\n }\r\n case \"AIAssistant\": {\r\n basedOnCheck = this.state.aIAssistantSelectedQuestions !== null\r\n break;\r\n }\r\n default: break;\r\n }\r\n\r\n const allSelectedUsersHaveAOC = this.state.selectedUsersAndGroup.reduce((acc, cur) => {\r\n return acc &&\r\n (this.state?.userdata?.find(e => e.id == cur)?.addOnCompliance ?? false)\r\n }, true)\r\n const allSelectedMonitorsHaveAOC = this.state.selectedSupervisors.reduce((acc, cur) => {\r\n return acc &&\r\n (this.state?.userdata?.find(e => e.id == cur)?.addOnCompliance ?? false)\r\n }, true)\r\n\r\n return name && assignTo && channel && riskRating && basedOnCheck && allSelectedUsersHaveAOC && allSelectedMonitorsHaveAOC\r\n }\r\n\r\n onChangeVersion = (e, item) => {\r\n //get specific version to fill the fields\r\n this.setState({ processingVersion: true })\r\n let id = item.key\r\n let auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: QueryP.queryPolicy,\r\n variables: { auth, id }\r\n })\r\n .then(({ loading, error, data, refetch }) => {\r\n let oldVersion = data.getPolicy;\r\n this.setState({\r\n name: oldVersion.name,\r\n description: oldVersion.description,\r\n userId: oldVersion.userId,\r\n channel: oldVersion.channel,\r\n channelList: oldVersion.channelList,\r\n riskRating: oldVersion.riskRating,\r\n active: oldVersion.active,\r\n selectedPolicyRule: oldVersion !== null\r\n ? oldVersion?.basedOn !== \"PolicyRule\" ?? null\r\n ? []\r\n : (oldVersion.policyRules[0].masterItemId != null\r\n ? oldVersion.policyRules[0].masterItemId\r\n : oldVersion.policyRules[0].id)\r\n : [],\r\n selectedSupervisors: oldVersion.supervisors.map(u => u.userId),\r\n selectedUsersAndGroup: [...oldVersion.users.map(u => u.userId), ...oldVersion.groups.map(g => g.id)],\r\n visibleForUsers: oldVersion.visibleForUsers.map(u => u.userId),\r\n tenantId: oldVersion.tenantId,\r\n selectedVersion: id,\r\n selectedOtherVersion: true,\r\n processingVersion: false,\r\n metaAssigneeUsersDeleted: oldVersion.metaMonitorUsersDeleted,\r\n metaMonitorUsersDeleted: oldVersion.metaMonitorUsersDeleted,\r\n conversationSafeFolders: oldVersion?.conversationSafeFolders.map(e => e.id) ?? [],\r\n basedOn: oldVersion.basedOn,\r\n aICategorizationId: oldVersion.aICategorizationInfos !== null && oldVersion.aICategorizationInfos.length > 0 ? oldVersion.aICategorizationInfos[0].aICategorizationId : \"\",\r\n AICatOccurrences: oldVersion.aICategorizationInfos !== null && oldVersion.aICategorizationInfos.length > 0 ? oldVersion.aICategorizationInfos[0].occurrences : 0,\r\n scorecardId: oldVersion.aIScorecardInfos !== null && oldVersion.aIScorecardInfos.length > 0 ? oldVersion.aIScorecardInfos[0].scorecardId : null,\r\n conversationType: oldVersion.aIScorecardInfos !== null && oldVersion.aIScorecardInfos.length > 0 ? oldVersion.aIScorecardInfos[0].conversationType : [],\r\n aIAssistantSelectedQuestions: oldVersion.aIAssistantQuestions !== null && oldVersion.aIAssistantQuestions.length > 0 ? oldVersion.aIAssistantQuestions.map(q => { return q.masterItemId }) : []\r\n })\r\n });\r\n }\r\n\r\n onChangePolicyFolders = (newSelection) => {\r\n this.setState({ conversationSafeFolders: newSelection, selectedOtherVersion: false })\r\n }\r\n\r\n getAILanguageAnswer(languageOptions, browserDefaultLanguage) {\r\n if (this.state.aILanguageAnswer === \"None\") {\r\n // set AI Lang answer as the browser language when adding new policy\r\n return this.getLanguageFromJSON(languageOptions, browserDefaultLanguage)\r\n }\r\n else {\r\n // otherwise use the default returned from backend\r\n return this.getLanguageFromJSON(languageOptions, this.state.aILanguageAnswer)\r\n }\r\n }\r\n\r\n getLanguageFromJSON(languageOptions, languageCode) {\r\n if (languageCode == \"\") {\r\n return this.context.getTranslation(\"compliance\", \"aIAssistantAutoDetectLanguage\")\r\n }\r\n let language = languageOptions.find((language) => language.key.toLowerCase() === languageCode.toLowerCase());\r\n\r\n if (language) {\r\n // if is used the browser default language while adding a new policy\r\n return language.text\r\n }\r\n else {\r\n language = languageOptions.find((language) => language.text.toLowerCase() === languageCode.toLowerCase());\r\n if (language) {\r\n // if editing an existing policy - searching in the json by language name\r\n return language.text\r\n }\r\n else {\r\n // if a non existing language or code is passed\r\n language = languageOptions.find((language) => language.text.toLowerCase() === \"english\")\r\n return language.text\r\n }\r\n\r\n }\r\n }\r\n\r\n handleLanguageChange = (event, option) => {\r\n if (option.key == \"-1\") {\r\n this.setState({\r\n aILanguageAnswer: \"\",\r\n });\r\n }\r\n else {\r\n this.setState({ aILanguageAnswer: option.text })\r\n }\r\n }\r\n\r\n restoreVersion = () => {\r\n this.setState({ processing: true })\r\n //restorePolicy -> id vesrion to restore\r\n let id = this.state.selectedVersion\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryP.restorePolicy,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.restorePolicy.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshPolicies()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.restorePolicy.text))\r\n }\r\n this.setState({\r\n selectedOtherVersion: false,\r\n processing: false\r\n })\r\n });\r\n }\r\n\r\n basedOnOpt = () => {\r\n var opt =\r\n [\r\n {\r\n key: 'PolicyRule',\r\n text: this.context.getTranslation(\"compliance\", \"policyRuleCheck\"),\r\n styles: { field: { fontWeight: '400' } }\r\n },\r\n {\r\n key: 'AICategorization',\r\n text: this.context.getTranslation(\"compliance\", \"autocatagorizationAI\"),\r\n styles: { field: { fontWeight: '400' } }\r\n }\r\n ]\r\n if (this.props.userRules.addOnQualityManagement && this.props.userRules.ruleAccess.userComplianceQM) {\r\n opt = [...opt,\r\n {\r\n key: 'Scorecard',\r\n text: this.context.getTranslation(\"compliance\", \"scorecard\"),\r\n styles: { field: { fontWeight: '400' } }\r\n }]\r\n }\r\n if (this.props.userRules.ruleAccess.userComplianceAIAssistant) {\r\n opt = [...opt,\r\n {\r\n key: 'AIAssistant',\r\n text: this.context.getTranslation(\"compliance\", \"aIAssistant\"),\r\n styles: { field: { fontWeight: '400' } }\r\n }]\r\n }\r\n\r\n return opt\r\n }\r\n\r\n\r\n\r\n render() {\r\n const numericalSpacingStackTokens = { childrenGap: 15 };\r\n return (\r\n {\r\n this.state.processingVersion &&
\r\n )\r\n }\r\n\r\n\r\n}\r\n","import { MessageBar, MessageBarType, Spinner } from \"@fluentui/react\";\r\nimport { Query } from \"react-apollo\";\r\nimport { MyContext } from \"../../../../context\";\r\nimport EditPolicy from \"./EditPolicy\";\r\nimport * as QueryPR from '../PolicyQuery';\r\nimport React, { Component } from 'react';\r\n\r\nexport default class EditPolicyContainer extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n query: 0,\r\n };\r\n this.data = null;\r\n }\r\n\r\n render() {\r\n const { auth, id, apol, hidePanel } = this.props\r\n return (\r\n \r\n
\r\n }\r\n {!this.state.processingVersion && \r\n {/*QUERY ALL VERSIONS*/}\r\n {this.state.masterItemId !== null && \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) {\r\n return (\r\n this.setState({\r\n basedOn: option.key,\r\n aILanguageAnswer: option.key === 'PolicyRule' ? \"None\" : this.getAILanguageAnswer(this.state.languageOptions, this.state.browserDefaultLanguage),\r\n riskRating: option.key === 'Scorecard' ? \"None\" : this.state.riskRating,\r\n selectedOtherVersion: false,\r\n })}\r\n />\r\n {/*BASED ON POLICY RULE*/}\r\n {this.state.basedOn === \"PolicyRule\" &&\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return ( \r\n }\r\n {/*BASED ON CATEGORIZATION*/}\r\n {this.state.basedOn === \"AICategorization\" &&\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return (\r\n \r\n {\r\n this.setState({\r\n aICategorizationId: i.key,\r\n selectedOtherVersion: false,\r\n })\r\n }}\r\n autoComplete={true}\r\n options={data.getAICategorizations.map(e => ({ text: e.name, key: e.id }))}\r\n />\r\n \r\n \r\n {this.context.getTranslation(\"compliance\", \"max#\")}\r\n \r\n \r\n \r\n {\r\n this.setState({\r\n AICatOccurrences: newValue,\r\n selectedOtherVersion: false,\r\n });\r\n }}\r\n />\r\n \r\n \r\n \r\n }}\r\n \r\n }\r\n {/*BASED ON AIASSISTANT*/}\r\n {this.state.basedOn === \"AIAssistant\" &&\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return ( \r\n {/*CHANNEL*/}\r\n \r\n this.onChangeChannel(event, checked,\"Text\")}\r\n />\r\n this.onChangeChannel(event, checked,\"Voice\")}\r\n />\r\n this.onChangeChannel(event, checked,\"Screen\")}\r\n />\r\n \r\n {/*POLICY WORKFLOW*/}\r\n {this.props.userRules.ruleAccess.userCompliancePolicyInitiateWorkflow && this.state.basedOn !== \"Scorecard\" && this.state.basedOn !== \"AIAssistant\" &&\r\n this.setState({ userdata })}\r\n userdata={this.state.userdata}\r\n placeholder={this.context.getTranslation(\"compliance\", \"selectUserOrGroup\")}\r\n user={(() => {\r\n // add elements from metaAssign to selectedUsersAndGroup only those who are not yet present,\r\n // we do so by finding metaUsers in selectedUsersAndGroup, then we filter.\r\n\r\n // let metaUsersThatAreNotInUsersYet = [...this.state.metaAssigneeUsersDeleted.filter(metaUser => !this.state.selectedUsersAndGroup.find(e=>e.userId===metaUser))]\r\n return [...this.state.selectedUsersAndGroup.map(user => ({ \"userId\": user }))]\r\n })()}\r\n fc={(users, peopleList) => {\r\n let usersFromPicker = [...users]\r\n let newUsersForPicker = usersFromPicker.sort((a, b) => {\r\n if (a.addOnCompliance && !b.addOnCompliance) return 1\r\n else if (a.addOnCompliance && b.addOnCompliance) return 0\r\n else return -1\r\n }).map(u => u.userId)\r\n this.setState({\r\n //all users in assignee list have add on compliance\r\n deleteNoAOCUsersBulk: usersFromPicker.filter(u => !u.addOnCompliance).length,\r\n allAssigneeHaveAOC: !(usersFromPicker.filter(u => !u.addOnCompliance).length),\r\n selectedUsersAndGroup: [...newUsersForPicker,],\r\n selectedOtherVersion: false,\r\n // metaAssigneeUsersDeleted: usersFromMetaAssigneeThatRemain\r\n\r\n });\r\n }}\r\n />\r\n {/*MONITORED BY*/}\r\n {this.state.basedOn === \"Scorecard\" && \r\n \r\n {/*FOOTER BUTTONS*/}\r\n \r\n \r\n
\r\n }\r\n \r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n }\r\n {this.context.getTranslation(\"compliance\", \"basedOn\")}
\r\nFailed to connect
;\r\n if (data.getPolicyRuleLabels === null) return ;\r\n const availablePolicyRules = data.getPolicyRuleLabels.map(pr => {\r\n return { key: pr.masterItemId, text: pr.name }\r\n })\r\n return (\r\nFailed to connect
;\r\n if (data.getAICategorizations == null) return ;\r\n returnFailed to connect
;\r\n if (data.getScorecards == null) return ;\r\n const availableScorecards = data.getScorecards.map(s => {\r\n return { key: s.masterItemId, text: s.name }\r\n })\r\n return\r\n {\r\n this.setState({\r\n scorecardId: i.key,\r\n selectedOtherVersion: false,\r\n })\r\n }}\r\n autoComplete={true}\r\n options={availableScorecards}\r\n />\r\n {\r\n if (item) {\r\n this.setState({\r\n conversationType: item.selected ? [...this.state.conversationType, item.key] : this.state.conversationType.filter(key => key !== item.key),\r\n selectedOtherVersion: false,\r\n });\r\n }\r\n }}\r\n autoComplete={true}\r\n allowFreeform={false}\r\n label={this.context.getTranslation(\"conversationsPage\", \"conversationType\")}\r\n placeholder={this.context.getTranslation(\"conversationsPage\", \"selectConversationType\")}\r\n />\r\n
\r\n }}\r\n \r\n }\r\n {this.context.getTranslation(\"compliance\", \"detailPolicyChannel\")}
\r\n\r\n
\r\n }\r\n {/*Policy AI Language*/}\r\n {(this.state.basedOn === \"Scorecard\" || this.state.basedOn === \"AICategorization\" || this.state.basedOn === \"AIAssistant\") &&\r\n {this.context.getTranslation(\"compliance\", \"detailPolicyFoldersTitle\")}
\r\n\r\n \r\n \r\n
\r\n }\r\n {/*RISK RATING*/}\r\n {this.state.basedOn != \"AIAssistant\" && {this.context.getTranslation(\"compliance\", \"detailPolicyAILanguageAnswer\")}
\r\n\r\n \r\n \r\n
}\r\n {/*ASSIGN TO*/}\r\n \r\n {this.context.getTranslation(\"compliance\", \"detailPolicyRiskRating\")}\r\n
\r\n{this.context.getTranslation(\"compliance\", \"detailPolicyUsers\")}
\r\n {\r\n !this.state.selectedUsersAndGroup.reduce((acc, cur) => {\r\n let curMember = this.state?.userdata?.find(e => e.id == cur).members?.split(\",\");\r\n return acc && ((this.state?.userdata?.find(e => e.id == cur)?.addOnCompliance ?? false) && (this.state?.userdata?.filter(e => curMember?.includes(e.id)).filter(x => !x.addOnCompliance).length == 0 ?? false))\r\n }, true)\r\n &&\r\n {\r\n return ({\r\n \"userId\": user\r\n })\r\n })}\r\n fc={(users, peopleList) => {\r\n let usersFromPicker = [...users]\r\n let newUsersForPicker = usersFromPicker.sort((a, b) => {\r\n if (a.addOnCompliance && !b.addOnCompliance) return 1\r\n else if (a.addOnCompliance && b.addOnCompliance) return 0\r\n else return -1\r\n }).map(u => u.userId)\r\n\r\n let allMonitorsHaveAOC = usersFromPicker.reduce((acc, cur) => {\r\n let curMember = this.state?.userdata?.find(e => e.id == cur.key).members?.split(\",\");\r\n return acc && ((this.state?.userdata?.find(e => e.id == cur.key)?.addOnCompliance ?? false) && (this.state?.userdata?.filter(e => curMember?.includes(e.id)).filter(x => !x.addOnCompliance).length == 0 ?? false))\r\n }, true)\r\n\r\n this.setState({\r\n //all users in assignee list have add on compliance\r\n deleteNoAOCUsersBulkMonitor: usersFromPicker.filter(u => !u.addOnCompliance).length,\r\n allMonitorsHaveAOC: allMonitorsHaveAOC,\r\n selectedSupervisors: [...newUsersForPicker,],\r\n selectedOtherVersion: false,\r\n // metaAssigneeUsersDeleted: usersFromMetaAssigneeThatRemain\r\n\r\n })\r\n }}\r\n />\r\n
}\r\n {/*VISIBLE FOR USERS */}\r\n {this.state.basedOn != \"AICategorization\" && this.state.basedOn != \"AIAssistant\" && {this.context.getTranslation(\"compliance\", \"detailPolicySupervisor\")}
\r\n {!this.state.allMonitorsHaveAOC &&\r\n\r\n {\r\n return ({\r\n \"userId\": user\r\n })\r\n })}\r\n fc={(users, peopleList) => {\r\n let usersFromPicker = [...users]\r\n let newUsersForPicker = usersFromPicker.sort((a, b) => {\r\n if (a.addOnCompliance && !b.addOnCompliance) return 1\r\n else if (a.addOnCompliance && b.addOnCompliance) return 0\r\n else return -1\r\n }).map(u => u.userId)\r\n\r\n if (users.length !== 0 && !newUsersForPicker.includes(this.props.userRules.userId))\r\n newUsersForPicker = [this.props.userRules.userId, ...newUsersForPicker]\r\n\r\n let allVisibleForUsersHaveAOC = usersFromPicker.reduce((acc, cur) => {\r\n let curMember = this.state?.userdata?.find(e => e.id == cur.key).members?.split(\",\");\r\n return acc && ((this.state?.userdata?.find(e => e.id == cur.key)?.addOnCompliance ?? false) && (this.state?.userdata?.filter(e => curMember?.includes(e.id)).filter(x => !x.addOnCompliance).length == 0 ?? false))\r\n }, true)\r\n this.setState({\r\n //all users in assignee list have add on compliance\r\n deleteNoAOCUsersBulkMonitor: usersFromPicker.filter(u => !u.addOnCompliance).length,\r\n allVisibleForUsersHaveAOC: allVisibleForUsersHaveAOC,\r\n visibleForUsers: [...newUsersForPicker],\r\n selectedOtherVersion: false,\r\n // metaAssigneeUsersDeleted: usersFromMetaAssigneeThatRemain\r\n\r\n })\r\n }}\r\n />\r\n
}\r\n {/*ACTIVE*/}\r\n {this.context.getTranslation(\"compliance\", \"policyVisibleForUsers\")}
\r\n {!this.state.allVisibleForUsersHaveAOC &&\r\n\r\n {/*Edit policy*/}\r\n {id != null && (\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getPolicy == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noDataPolicy\")}\r\n )\r\n }\r\n return (
\r\n )\r\n }\r\n\r\n}","import { Stack, DocumentCard, MessageBarType, MessageBar, Spinner, Icon, FontSizes, CommandBar, ContextualMenuItemType, Dialog, PrimaryButton, DialogFooter, DefaultButton, DialogType } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport '../ComplianceView.scss';\r\nimport { MyContext } from '../../../context';\r\nimport { FontIcon, Toggle } from '@fluentui/react';\r\nimport { Text, FontWeights } from 'office-ui-fabric-react/lib/';\r\nimport * as QueryPolicy from './PolicyQuery';\r\nimport SafetyDialog from '../../CustomComponents/SafetyDialog';\r\nimport AIAssistantIcon from '../AIAssistant/AIAssistantIcon';\r\n\r\nexport default class PolicyTileView extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n alertMessage: \"\",\r\n alertType: \"\",\r\n isLoading: false,\r\n hideDialog: true\r\n }\r\n }\r\n\r\n getUsersAndGroups = (users, groups) => {\r\n return (TODO)\r\n }\r\n\r\n activeDeactivePolicy = () => {\r\n let policyToBeActivated = this.props.policies.filter(pol => { return pol.id == this.props.policyId })[0]\r\n this.setState({\r\n isLoading: true,\r\n hideDialog: true\r\n })\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryPolicy.changeStatusPolicy,\r\n variables: { policyId: policyToBeActivated.id }\r\n })\r\n .then((result) => {\r\n if (result.data.changeStatusPolicy.status !== \"ok\") {\r\n this.setState({\r\n alertMessage: this.context.getTranslation(\"compliance\", result.data.changeStatusPolicy.text),\r\n alertType: result.data.changeStatusPolicy.status,\r\n isLoading: false\r\n })\r\n } else {\r\n this.props.refreshPolicies()\r\n }\r\n });\r\n }\r\n\r\n getChannelRender = (policy) => {\r\n if (policy.channelList == null || policy.channelList === undefined) {\r\n switch (policy.channel) {\r\n case 'None':\r\n return \"\";\r\n case 'Text':\r\n return \r\n
\r\n )\r\n }}\r\n \r\n )\r\n }\r\n {/*Create policy*/}\r\n {\r\n id === null && (\r\n \r\n
\r\n )\r\n }\r\n \r\n {/*Alert*/}\r\n {this.state.alertMessage !== \"\" && \r\n \r\n {this.state.alertMessage}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n\r\n toggleHideDialog = (hide, policyId, policyIsActive) => {\r\n this.setState({\r\n hideDialog: hide,\r\n policyId,\r\n policyIsActive\r\n })\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n {this.context.getTranslation(\"compliance\", name)}\r\n \r\n {policies.length == 0 && ({this.context.getTranslation(\"compliance\", \"noDataTile\")})}\r\n {policies.length > 0 && (\r\n
\r\n \r\n {policies.map((policy, i) => {\r\n let iconName = \"\"\r\n let shortTitle = \"\"\r\n switch (policy.basedOn) {\r\n case \"PolicyRule\": {\r\n iconName = \"TaskManager\"\r\n shortTitle = this.shortTitle(policy.policyRules !== null ? policy.policyRules.map(cat => { return cat.name }).join() : \"\", window.innerWidth)\r\n break;\r\n }\r\n case \"AICategorization\": {\r\n iconName = \"UserGauge\"\r\n shortTitle = this.shortTitle(policy.aICategorizationInfos !== null ? policy.aICategorizationInfos.map(cat => { return cat.categorizationName }).join() : \"\", window.innerWidth)\r\n break;\r\n }\r\n case \"Scorecard\": {\r\n iconName = \"TrackersMirrored\"\r\n shortTitle = this.shortTitle(policy.aIScorecardInfos !== null ? policy.aIScorecardInfos.map(s => { return s.scorecardName }).join() : \"\", window.innerWidth)\r\n break;\r\n }\r\n case \"AIAssistant\": {\r\n iconName = \"AIAssistant\"\r\n shortTitle = this.shortTitle(policy.aIAssistantQuestions !== null ? policy.aIAssistantQuestions.length + \" Question(s)\" : \"\", window.innerWidth)\r\n break;\r\n }\r\n }\r\n return (\r\n
\r\n )}\r\n \r\n { this.props.selectPolicy(policy.id) }}\r\n style={policy.id == this.props.policyId ? { borderStyle: 'groove', margin: '20px' } : { margin: '20px' }}\r\n className={window.innerWidth < 600 ? \"GridItemSmall\" : \"GridItem\"}\r\n >\r\n \r\n \r\n \r\n \r\n {this.getChannelRender(policy)}\r\n \r\n \r\n \r\n \r\n { this.props.selectPolicy(policy.id) }}\r\n />\r\n \r\n \r\n \r\n \r\n {this.shortTitle(policy.name, window.innerWidth)}\r\n \r\n \r\n {iconName !== \"AIAssistant\" && \r\n {shortTitle}\r\n \r\n \r\n \r\n \r\n \r\n {this.getRiskRating(policy.riskRating)}\r\n \r\n \r\n \r\n \r\n this.toggleHideDialog(false, policy.id, policy.active)}\r\n ariaLabel=\"active action\"\r\n id={`activeButton_${policy.id}`}\r\n />\r\n \r\n \r\n \r\n\r\n \r\n \r\n
\r\n )\r\n })\r\n }\r\n \r\n {this.state.isLoading && { this.setState({ hideDialog: true }) }}\r\n ok={this.activeDeactivePolicy}\r\n />\r\n
\r\n )\r\n }\r\n}\r\n","import { CommandBarButton, DetailsList, FontIcon, Icon, MarqueeSelection, Panel, PanelType, Text, Selection, SelectionMode, Separator, Spinner, Stack, MessageBar, MessageBarType, DocumentCard, DocumentCardTitle, DocumentCardActions, DocumentCardLocation, TeachingBubble } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport '../ComplianceView.scss';\r\nimport { MyContext } from '../../../context';\r\nimport { IStackTokens, IDetailsColumnStyles } from '@fluentui/react';\r\n\r\nexport default class PolicyListView extends Component {\r\n static contextType = MyContext\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props)\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.props.selectPolicy(this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : null)\r\n }\r\n });\r\n }\r\n\r\n headerStyle: Partial\r\n
}\r\n {!this.state.isLoading &&\r\n \r\n {this.getTiles('activePolicies', this.props.policies.filter(x => { return x.active }, true))}\r\n {this.getTiles('noActivePolicies', this.props.policies.filter(x => { return !x.active }, false))}\r\n
}\r\n \r\n
;\r\n }\r\n case \"AICategorization\": {\r\n return \r\n
;\r\n }\r\n case \"Scorecard\": {\r\n return \r\n
;\r\n }\r\n default: return \r\n }\r\n }\r\n case \"active\":\r\n return {\r\n
\r\n )\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this.state.policyId !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectPolicyRule\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n\r\n render() {\r\n const { auth } = this.props\r\n\r\n return (\r\n {this.context.getTranslation(\"compliance\", this.state.panelTitle)}
\r\n \r\n {/*Manage button add and edit policy */}\r\n \r\n this.openPanel(\"create\")}\r\n />\r\n {!this.state.viewType &&\r\n { this.openPanel(\"edit\", this.state.policyId) }}\r\n />\r\n }\r\n {!this.state.viewType &&\r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isTokenExceeded && (\r\n \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryPolicies = refetch\r\n if (loading || networkStatus === NetworkStatus.refetch) return (\r\n }\r\n\r\n {/*Policy panel*/}\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deletePolicy}\r\n />\r\n
\r\n )\r\n }\r\n\r\n\r\n}\r\n","import gql from 'graphql-tag';\r\n\r\nexport const queryAllPatterns = gql`query {\r\n getPatternsDetection {\r\n id\r\n name\r\n description\r\n tenantId\r\n withFragments\r\n patternDetectionGroup {\r\n id\r\n name\r\n generalGroup\r\n }\r\n regExp\r\n fragments{\r\n index\r\n nDigits\r\n value\r\n fragmentType\r\n operatorType\r\n }\r\n }\r\n }`\r\n\r\nexport const queryGetPattern = gql`query ent ($id: String) {\r\n getPatternDetection (id: $id) {\r\n id\r\n name\r\n description\r\n tenantId\r\n withFragments\r\n regExp\r\n patternDetectionGroup {\r\n id\r\n name\r\n generalGroup\r\n }\r\n fragments{\r\n index\r\n nDigits\r\n value\r\n fragmentType\r\n operatorType\r\n }\r\n version\r\n masterItemId\r\n selected\r\n }\r\n }`\r\n\r\nexport const createPattern = gql`mutation ent($patternDetection: PatternDetectionInputType){\r\n upsertPatternDetection(patternDetection: $patternDetection) {\r\n text\r\n status\r\n id\r\n }\r\n }`\r\n\r\n\r\nexport const createPatternAsTemplate = gql`mutation ent($patternDetection: PatternDetectionInputType){\r\n upsertPatternDetectionAsTemplate(patternDetection: $patternDetection) {\r\n text\r\n status\r\n id\r\n }\r\n }`\r\n\r\nexport const deletePattern = gql`mutation ent ($id: String) {\r\n deletePatternDetection (id: $id) {\r\n text\r\n status\r\n id\r\n }\r\n }`\r\n\r\n\r\nexport const getFragmentType = gql`query ent {\r\n getFragmentTypeEnum\r\n {\r\n name\r\n description\r\n customField\r\n }\r\n }`\r\n\r\nexport const getOperatorType = gql`query ent {\r\n getOperatorTypeEnum\r\n {\r\n name\r\n description\r\n }\r\n }`\r\n\r\nexport const getAllVersionOfPatternDetection = gql`query ent ($masterItemId: String) {\r\n getAllVersionOfPatternDetection(masterItemId: $masterItemId) {\r\n id\r\n version\r\n }\r\n }`\r\n\r\n\r\nexport const restorePatternDetection = gql`mutation ent ($id: String) {\r\n restorePatternDetection(id: $id) {\r\n id\r\n text\r\n status\r\n }\r\n }`","import { IconButton, Stack, Dropdown, TextField } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\n\r\nclass FragmentItem extends Component {\r\n static contextType = MyContext\r\n\r\n //no internal state, its state is managed by his father FragmentList\r\n\r\n up = () => {\r\n this.props.up(this.props.data.index)\r\n }\r\n\r\n down = () => {\r\n this.props.down(this.props.data.index)\r\n }\r\n\r\n delete = () => {\r\n this.props.delete(this.props.data.index)\r\n }\r\n\r\n onChangeSelectType = (e, item) => {\r\n if (item) {\r\n const selected = item !== null ? item.key : null\r\n this.props.updateFragmentType(selected, this.props.data.index)\r\n }\r\n }\r\n\r\n changeNDigits = (e, value) => {\r\n this.props.changeNDigits(value, this.props.data.index)\r\n\r\n }\r\n\r\n chanegValue = (e, value) => {\r\n this.props.changeValue(value, this.props.data.index)\r\n }\r\n\r\n add = () => {\r\n this.props.addFragment()\r\n }\r\n\r\n render() {\r\n const dropdownStyles: Partial\r\n {!this.state.viewType && (
\r\n\r\n )\r\n }\r\n }}\r\n \r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default FragmentItem;","import { Stack } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport FragmentItem from './FragmentItem'\r\nimport * as QueryPatterns from '../PatternsQuery';\r\n\r\nclass FragmentsList extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n data: this.props.fragments !== null ? FragmentsList.getCleanFragments(this.props.fragments) : [\r\n {\r\n index: 1,\r\n nDigits: 1,\r\n value: \"\",\r\n fragmentType: \"\",\r\n operatorType: \"Equals\" //todo\r\n }\r\n ],\r\n fragmentTypeOptions: [],\r\n operatorTypeOptions: [],\r\n example: \"\",\r\n updated: false,\r\n };\r\n }\r\n\r\n static getDerivedStateFromProps(props, state) {\r\n if (props.fragments !== null && !FragmentsList.equalsFragments(props.fragments, state.data) && !state.updated) {\r\n return {\r\n data: FragmentsList.getCleanFragments(props.fragments),\r\n example: FragmentsList.getExample(props.fragments, state.fragmentTypeOptions)\r\n };\r\n }\r\n return null;\r\n }\r\n\r\n static equalsFragments = (f1, f2) => {\r\n if (f1.length !== f2.length) return false;\r\n for (var i = 0; i < f1.length; i++) {\r\n if (f1[i].fragmentType !== f2[i].fragmentType || f1[i].index !== f2[i].index || f1[i].nDigits !== f2[i].nDigits || f1[i].operatorType !== f2[i].operatorType || f1[i].value !== f2[i].value) {\r\n return false;\r\n }\r\n }\r\n return true;\r\n }\r\n\r\n static getCleanFragments = (fragments) => {\r\n return fragments.map(f => {\r\n return ({ fragmentType: f.fragmentType, index: f.index, nDigits: f.nDigits, operatorType: f.operatorType, value: f.value })\r\n })\r\n }\r\n\r\n componentDidMount() {\r\n if (this.props.fragments !== null)\r\n this.props.validationFragments(this.props.fragments)\r\n this.props.apol\r\n .query({\r\n query: QueryPatterns.getFragmentType,\r\n })\r\n .then((result) => {\r\n const fragmentTypeOptions = result.data.getFragmentTypeEnum.map(t => {\r\n return ({\r\n \"key\": t.name,\r\n \"text\": this.context.getTranslation(\"compliance\", t.name),\r\n \"description\": t.description,\r\n \"regex\": t.customField\r\n })\r\n })\r\n this.setState({\r\n fragmentTypeOptions,\r\n example: FragmentsList.getExample(this.state.data, fragmentTypeOptions)\r\n })\r\n });\r\n this.props.apol\r\n .query({\r\n query: QueryPatterns.getOperatorType,\r\n })\r\n .then((result) => {\r\n const operatorTypeOptions = result.data.getOperatorTypeEnum.map(t => {\r\n return ({\r\n \"key\": t.name,\r\n \"text\": this.context.getTranslation(\"compliance\", t.name),\r\n })\r\n })\r\n this.setState({\r\n operatorTypeOptions\r\n })\r\n });\r\n }\r\n\r\n setNewData = (newData) => {\r\n this.setState({\r\n data: newData,\r\n example: FragmentsList.getExample(newData, this.state.fragmentTypeOptions),\r\n updated: true\r\n })\r\n }\r\n\r\n updateFragmentType = (selected, index) => {\r\n var newData = this.state.data.map(d => {\r\n if (d.index === index) {\r\n return (\r\n {\r\n ...d,\r\n fragmentType: selected,\r\n nDigits: \"1\",\r\n value: \"\"\r\n }\r\n )\r\n } else {\r\n return d;\r\n }\r\n })\r\n this.setNewData(newData)\r\n this.props.validationFragments(newData)\r\n }\r\n\r\n deleteFragment = (index) => {\r\n var newData = this.state.data.filter(d => d.index !== index).map((dat, i) => {\r\n return ({ ...dat, index: i + 1 })\r\n })\r\n this.setNewData(newData)\r\n this.props.validationFragments(newData)\r\n }\r\n\r\n addFragment = () => {\r\n var newFragment = {\r\n index: this.state.data.length + 1,\r\n nDigits: 1,\r\n value: \"\",\r\n fragmentType: \"\",\r\n operatorType: \"Equals\" //todo\r\n }\r\n var newData = [...this.state.data, newFragment]\r\n this.setState({\r\n data: newData,\r\n updated: true\r\n })\r\n this.props.validationFragments(newData)\r\n }\r\n\r\n upFragment = (index) => {\r\n var newData = this.state.data.map(d => {\r\n if (d.index === index) {\r\n return (\r\n {\r\n ...d,\r\n index: index - 1\r\n }\r\n )\r\n } else if (d.index === index - 1) {\r\n return (\r\n {\r\n ...d,\r\n index: index\r\n }\r\n )\r\n } else {\r\n return d;\r\n }\r\n })\r\n this.setNewData(newData)\r\n }\r\n\r\n downFragment = (index) => {\r\n var newData = this.state.data.map(d => {\r\n if (d.index === index) {\r\n return (\r\n {\r\n ...d,\r\n index: index + 1\r\n }\r\n )\r\n } else if (d.index === index + 1) {\r\n return (\r\n {\r\n ...d,\r\n index: index\r\n }\r\n )\r\n } else {\r\n return d;\r\n }\r\n })\r\n this.setNewData(newData)\r\n }\r\n\r\n changeNDigits = (value, index) => {\r\n var newData = this.state.data.map(d => {\r\n if (d.index === index) {\r\n return (\r\n {\r\n ...d,\r\n nDigits: value,\r\n value: \"\"\r\n }\r\n )\r\n } else {\r\n return d;\r\n }\r\n })\r\n this.setNewData(newData)\r\n this.props.validationFragments(newData)\r\n }\r\n\r\n changeValue = (value, index) => {\r\n var newData = this.state.data.map(d => {\r\n if (d.index === index && d.fragmentType !== '' && (value === \"\" || this.isValidValue(value, d.fragmentType))) {\r\n return (\r\n {\r\n ...d,\r\n nDigits: \"\",\r\n value: value\r\n }\r\n )\r\n } else {\r\n return d;\r\n }\r\n })\r\n this.setNewData(newData)\r\n this.props.validationFragments(newData)\r\n }\r\n\r\n isValidValue = (value, fragmentType) => {\r\n var result = false\r\n this.state.fragmentTypeOptions.forEach(type => {\r\n if (type.key === fragmentType) {\r\n try {\r\n var r = new RegExp(type.regex);\r\n result = r.test(value)\r\n } catch (error) {\r\n console.log(`Error create regex ${error}`)\r\n result = false;\r\n }\r\n }\r\n })\r\n return result;\r\n }\r\n\r\n static getExample = (newData, fragmentTypeOptions) => {\r\n var result = \"\"\r\n var sortData = newData.sort((a, b) => (a.index > b.index) ? 1 : ((b.index > a.index) ? -1 : 0))\r\n sortData.forEach((frag, i) => {\r\n //if i have the exact value \r\n if (frag.value !== \"\") {\r\n result = result + \" \" + frag.value\r\n } else {\r\n //manage the range #\r\n var length = parseInt(frag.nDigits)\r\n if (isNaN(length) || frag.nDigits.toString().includes(\"-\")) {\r\n var range = frag.nDigits.split(\"-\")\r\n length = range[range.length - 1]\r\n }\r\n fragmentTypeOptions.forEach(type => {\r\n if (type.key === frag.fragmentType) {\r\n result = result + \" \" + FragmentsList.createExample(type.description, length)\r\n }\r\n })\r\n }\r\n })\r\n return result;\r\n }\r\n\r\n static createExample = (range, length) => {\r\n var result = '';\r\n for (var i = 0; i < length; i++) {\r\n result += range.charAt(Math.floor(Math.random() * range.length));\r\n }\r\n return result;\r\n }\r\n\r\n\r\n render() {\r\n var dataLength = this.state.data.length\r\n var sortData = this.state.data.sort((a, b) => (a.index > b.index) ? 1 : ((b.index > a.index) ? -1 : 0))\r\n this.props.updateFragments(sortData)\r\n\r\n return (\r\n \r\n \r\n \r\n {`${this.state.example}`}\r\n \r\n \r\n {\r\n sortData.map((d, i) => {\r\n return (\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default FragmentsList;","import { DefaultButton, PrimaryButton, Stack, TextField, Spinner, Dropdown } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport FragmentsList from './FragmentsList';\r\nimport * as QueryPatterns from '../PatternsQuery';\r\nimport { Query } from 'react-apollo';\r\n\r\nclass EditPattern extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n const pattern = this.props.data !== undefined ? this.props.data : null\r\n this.state = {\r\n //page data\r\n processing: false,\r\n areFragmentsValid: false,\r\n //pattern data\r\n id: pattern !== null && pattern.tenantId !== '' ? pattern.id : null,\r\n name: pattern !== null ? pattern.name : \"\",\r\n description: pattern !== null ? pattern.description : \"\",\r\n regExp: pattern !== null ? pattern.regExp : \"\",\r\n patternDetectionGroup: pattern !== null && pattern.patternDetectionGroup != null ? pattern.patternDetectionGroup.id : null,\r\n generalGroup: pattern !== null && pattern.patternDetectionGroup != null ? pattern.patternDetectionGroup.generalGroup : null,\r\n tenantId: pattern !== null ? pattern.tenantId : null,\r\n withFragments: pattern !== null ? pattern.withFragments : this.props.withFragments,\r\n fragments: pattern !== null && pattern.withFragments ? pattern.fragments : null,\r\n version: pattern !== null ? pattern.version : 0,\r\n masterItemId: pattern !== null ? pattern.masterItemId : null,\r\n selected: pattern !== null ? pattern.selected : true,\r\n //versions\r\n selectedOtherVersion: false,\r\n selectedVersion: pattern !== null ? pattern.id : null\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n this.refreshVersions()\r\n }\r\n\r\n refetchQueryVersions = null;\r\n numberOfVersions = 1\r\n\r\n refreshVersions = () => {\r\n if (this.refetchQueryVersions !== null) {\r\n this.refetchQueryVersions()\r\n }\r\n }\r\n\r\n //fragments from component FragmentsList\r\n fragments = null\r\n\r\n changeName = (e, value) => {\r\n this.setState({\r\n name: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n changeDescription = (e, value) => {\r\n this.setState({\r\n description: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n changeRegex = (e, value) => {\r\n this.setState({\r\n regExp: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n updateFragments = (fragments) => {\r\n this.fragments = fragments\r\n }\r\n\r\n isValid = () => {\r\n return this.state.name !== \"\" && (this.state.withFragments ? this.state.areFragmentsValid : this.state.regExp !== \"\");\r\n }\r\n\r\n validationFragments = (data) => {\r\n var result = data.length > 0;\r\n if (result) {\r\n data.forEach(frag => {\r\n if (frag.fragmentType === \"\" || (frag.value === \"\" && (frag.nDigits === \"\" || !this.nDigistValidation(frag.nDigits))) || (frag.value === \"\" && frag.nDigits === \"\")) {\r\n result = false;\r\n }\r\n })\r\n }\r\n this.setState({\r\n areFragmentsValid: result,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n nDigistValidation = (nDigits) => {\r\n var length = parseInt(nDigits)\r\n var result = !isNaN(length)\r\n if (!result || nDigits.toString().includes(\"-\")) {\r\n var range = nDigits.split(\"-\")\r\n var validNumbers = parseInt(range[0]) < parseInt(range[1])\r\n result = /^([1-9]|[1-9][0-9])[-]([0-9]|[1-9][0-9])$/.test(nDigits) && validNumbers\r\n }\r\n return result;\r\n }\r\n\r\n cancel = () => {\r\n this.props.closePanel()\r\n }\r\n\r\n save = (saveAsTemplate) => {\r\n this.setState({ processing: true })\r\n const auth = this.props.auth\r\n const patternDetection = {\r\n id: this.state.id,\r\n name: this.state.name,\r\n description: this.state.description,\r\n regExp: this.state.regExp,\r\n withFragments: this.state.withFragments,\r\n fragments: this.fragments,\r\n patternDetectionGroup: { id: this.state.patternDetectionGroup, generalGroup: this.state.generalGroup != null ? this.state.generalGroup : saveAsTemplate },\r\n tenantId: this.state.tenantId,\r\n // manage version\r\n version: this.numberOfVersions,\r\n masterItemId: this.state.masterItemId,\r\n selected: this.state.selected,\r\n }\r\n this.props.apol\r\n .mutate({\r\n mutation: saveAsTemplate ? QueryPatterns.createPatternAsTemplate : QueryPatterns.createPattern,\r\n variables: { auth, patternDetection }\r\n })\r\n .then((result) => {\r\n var resultData = saveAsTemplate ? result.data.upsertPatternDetectionAsTemplate : result.data.upsertPatternDetection\r\n var state = {}\r\n if (resultData.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshPatterns()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", resultData.text))\r\n }\r\n this.setState({ ...state, processing: false })\r\n });\r\n }\r\n\r\n onChangeVersion = (e, item) => {\r\n //get specific version to fill the fields\r\n this.setState({ processing: true })\r\n let id = item.key\r\n this.props.apol\r\n .query({\r\n query: QueryPatterns.queryGetPattern,\r\n variables: { id }\r\n })\r\n .then(({ loading, error, data, refetch }) => {\r\n let oldVersion = data.getPatternDetection;\r\n this.setState({\r\n name: oldVersion.name,\r\n description: oldVersion.description,\r\n regExp: oldVersion.regExp,\r\n withFragments: oldVersion.withFragments,\r\n patternDetectionGroup: oldVersion.patternDetectionGroup != null ? oldVersion.patternDetectionGroup.id : null,\r\n generalGroup: oldVersion.patternDetectionGroup != null ? oldVersion.patternDetectionGroup.generalGroup : null,\r\n fragments: oldVersion.withFragments ? oldVersion.fragments : null,\r\n tenantId: oldVersion.tenantId,\r\n selectedVersion: id,\r\n selectedOtherVersion: true,\r\n processing: false\r\n })\r\n });\r\n }\r\n\r\n restoreVersion = () => {\r\n this.setState({ processing: true })\r\n //restorePatternDetection -> id vesrion to restore\r\n let id = this.state.selectedVersion\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryPatterns.restorePatternDetection,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.restorePatternDetection.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshPatterns()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.restorePatternDetection.text))\r\n }\r\n this.setState({\r\n selectedOtherVersion: false,\r\n processing: false\r\n })\r\n });\r\n }\r\n\r\n render() {\r\n let masterItemId = this.state.masterItemId\r\n var saveAsTemplateStyle = { marginTop: \"30px\", marginLeft: \"15px\" }\r\n\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"patternExample\")}
\r\n{this.context.getTranslation(\"compliance\", \"addFragments\")}
\r\n\r\n {/*QUERY ALL VERSIONS*/}\r\n {masterItemId && (\r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) {\r\n return (\r\n this.save(false)} style={{ marginTop: \"30px\", marginLeft: \"15px\" }} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {(this.props.userRules.userTemplateAllowed && (!this.state.selectedOtherVersion || this.state.id === this.state.selectedVersion)) &&\r\n this.save(true)} style={!this.isValid() || this.state.processing ? saveAsTemplateStyle : { ...saveAsTemplateStyle, background: \"red\", color: \"white\" }} allowDisabledFocus={true} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {this.state.selectedOtherVersion && this.state.id !== this.state.selectedVersion &&\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default EditPattern;","import { MessageBar, MessageBarType, Spinner } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../../context';\r\nimport * as QueryPatterns from '../PatternsQuery';\r\nimport EditPattern from './EditPattern';\r\n\r\nclass EditPatternContainer extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {};\r\n }\r\n render() {\r\n const { auth, apol, hidePanel } = this.props\r\n const id = this.props.patternId\r\n return (\r\n \r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n )}\r\n \r\n {/*Edit pattern*/}\r\n {id !== null && (\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getPatternDetection == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noData\")}\r\n )\r\n }\r\n return (
\r\n );\r\n }\r\n}\r\n\r\nexport default EditPatternContainer;","import { DetailsList, MarqueeSelection, Selection, SelectionMode, GroupHeader } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\nimport Utils from '../../common/Utils'\r\n\r\nconst orderAlphabetically = Utils.orderAlphabetically\r\n\r\n\r\nclass PatternListView extends Component {\r\n static contextType = MyContext\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props);\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.props.selectPattern(this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : null)\r\n }\r\n });\r\n }\r\n\r\n groupsCollapsed = []\r\n\r\n getPatternGroups = (data) => {\r\n //create groups for dataillist\r\n var templateElements = data.filter(x => x.tenantId == \"\" || (x.patternDetectionGroup != null && x.patternDetectionGroup.generalGroup)).length\r\n let customGroup = {\r\n \"key\": \"customPat\",\r\n \"name\": this.context.getTranslation(\"compliance\", \"customPat\"),\r\n \"startIndex\": templateElements,\r\n \"count\": data.length - templateElements,\r\n \"level\": 0,\r\n \"isCollapsed\": this.groupsCollapsed.length === 0 ? false : this.groupsCollapsed.filter(g => g.key === \"customPat\")[0]?.isCollapsed\r\n }\r\n let groups = []\r\n if (templateElements !== 0) {\r\n groups = [\r\n {\r\n \"key\": \"templatePat\",\r\n \"name\": this.context.getTranslation(\"compliance\", \"templatePat\"),\r\n \"startIndex\": 0,\r\n \"count\": templateElements,\r\n \"level\": 0,\r\n \"isCollapsed\": this.groupsCollapsed.length === 0 ? true : this.groupsCollapsed.filter(g => g.key === \"templatePat\")[0]?.isCollapsed\r\n },\r\n customGroup\r\n ]\r\n } else {\r\n groups = [customGroup]\r\n }\r\n this.groupsCollapsed = groups.map(g => {\r\n return (\r\n {\r\n key: g.key,\r\n isCollapsed: g.isCollapsed\r\n }\r\n )\r\n })\r\n return groups;\r\n }\r\n\r\n _renderItemColumn = (item, index, column) => {\r\n const fieldContent = item[column.fieldName]\r\n switch (column.key) {\r\n case 'content':\r\n var result = \"\"\r\n if (item.withFragments) {\r\n result = [...new Set(item.fragments.map(frag => {\r\n return this.context.getTranslation(\"compliance\", frag.fragmentType)\r\n }))].join(\", \")\r\n } else {\r\n result = item.regExp\r\n }\r\n return {result};\r\n default:\r\n return {fieldContent !== null ? fieldContent : \"\"};\r\n }\r\n }\r\n\r\n _getKey = (item, index) => {\r\n return item.key;\r\n }\r\n\r\n render() {\r\n const columns = [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"detailPolicyName\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"detailPolicyDescription\"), fieldName: 'description', minWidth: 100, maxWidth: 200 },\r\n { key: 'content', name: this.context.getTranslation(\"compliance\", \"content\"), fieldName: 'content', minWidth: 100, maxWidth: 200 },\r\n ]\r\n\r\n var template = this.props.patterns.filter(x => x.tenantId == \"\" || (x.patternDetectionGroup != null && x.patternDetectionGroup.generalGroup))\r\n var nonTemplate = this.props.patterns.filter(x => (x.patternDetectionGroup == null || !x.patternDetectionGroup.generalGroup))\r\n var sortData = [\r\n ...template.sort((a, b) => orderAlphabetically.call(null, a.name.toLowerCase(), b.name.toLowerCase())),\r\n ...nonTemplate.sort((a, b) => orderAlphabetically.call(null, a.name.toLowerCase(), b.name.toLowerCase()))\r\n ]\r\n\r\n var groups = this.getPatternGroups(sortData)\r\n\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n )\r\n }\r\n {/*Create patter*/}\r\n {\r\n id === null && (\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this.state.patternId !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectPattern\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n render() {\r\n\r\n const optionTypePattern = {\r\n onDismiss: ev => {\r\n if (ev && ev.shiftKey) {\r\n ev.preventDefault();\r\n }\r\n },\r\n items: this.state.optionTypePattern,\r\n directionalHintFixed: true,\r\n };\r\n\r\n return ({this.context.getTranslation(\"compliance\", this.state.panelTitle)}
\r\n \r\n\r\n {/*Manage button add, edit and delete pattern*/}\r\n \r\n { this.openPanel(\"edit\", this.state.patternId) }}\r\n />\r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isProcessing && \r\n \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryPatterns = refetch\r\n if (loading) return (\r\n }\r\n\r\n {/*Pattern panel*/}\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deletePattern}\r\n />\r\n\r\n
)\r\n }\r\n}\r\n","import React, { Component } from 'react';\r\n//APPOLO + GQL\r\nimport { ApolloProvider, Query } from \"react-apollo\";\r\nimport { queryGetCategory } from \"../../queries/queryCategory\";\r\nimport { queryGetConfigData } from \"../../queries/querySettings\";\r\n//OFFICE Fabric\r\nimport { Customizer, getId } from '@uifabric/utilities';\r\nimport { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';\r\nimport { Spinner } from 'office-ui-fabric-react/lib/Spinner';\r\n//Styles\r\nimport './Setter.scss';\r\n//OTHER COMPONENS\r\nimport { ToastContainer } from \"react-toastify\";\r\nimport CategoryList from \"./RuleList/CategoryList\";\r\nimport AddCategorie from \"./RuleList/AddCategorie\";\r\nimport { MyContext } from '../../context';\r\nimport AlertBar from '../CustomComponents/AlertBar';\r\n\r\n\r\n\r\nexport default class CategoryWrapper extends Component {\r\n\r\n state = {\r\n showPanel: false,\r\n trapPanel: false,\r\n alertMessagePanel: \"\"\r\n };\r\n\r\n categorydata = []\r\n\r\n _layerHostId: string = getId('layerHost');\r\n\r\n getHeaderPanel = () => {\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n \r\n
)}\r\n {this.state.info === null ? context.getTranslation(\"configuration\", \"addCategory\") : context.getTranslation(\"configuration\", \"editCategory\")}
\r\n \r\n
;\r\n if (error) {\r\n console.log(error)\r\n return (\r\n
\r\n )\r\n }\r\n\r\n\r\n\r\n}\r\n","import { DetailsList, Selection, SelectionMode } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\nimport Utils from '../../common/Utils'\r\n\r\nconst orderAlphabetically = Utils.orderAlphabetically\r\n\r\n\r\nexport default class AdherencePhrasesListView extends Component {\r\n static contextType = MyContext\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props);\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.props.selectPhrase(this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : null)\r\n }\r\n });\r\n }\r\n\r\n getKey = (item, index) => {\r\n return item.key;\r\n }\r\n\r\n renderItemColumn = (item, index, column) => {\r\n const fieldContent = item[column.fieldName]\r\n switch (column.key) {\r\n case 'adherence':\r\n return {fieldContent}%;\r\n case 'contained': {\r\n if (item.adherence !== 0 && item.adherence !== 100) {\r\n return (\r\n \r\n {\r\n (fieldContent ?\r\n this.context.getTranslation(\"compliance\", \"exceeded\") :\r\n this.context.getTranslation(\"compliance\", \"fallenBelow\"))\r\n }\r\n \r\n )\r\n } else { return () }\r\n }\r\n default:\r\n return {fieldContent !== null ? fieldContent : \"\"};\r\n }\r\n }\r\n\r\n render() {\r\n const columns = [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"detailPolicyName\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"detailPolicyDescription\"), fieldName: 'description', minWidth: 100, maxWidth: 200 },\r\n { key: 'phrase', name: this.context.getTranslation(\"compliance\", \"phrase\"), fieldName: 'phrase', minWidth: 100, maxWidth: 200 },\r\n { key: 'adherence', name: this.context.getTranslation(\"compliance\", \"adherence\"), fieldName: 'adherence', minWidth: 30, maxWidth: 80 },\r\n { key: 'contained', name: this.context.getTranslation(\"compliance\", \"contained\"), fieldName: 'contained', minWidth: 100, maxWidth: 200 },\r\n ]\r\n return (\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n {/*CREATE/EDIT PANEL CATEGORY*/}\r\n \r\n {this.state.showPanel && (\r\n \r\n {(context) => (\r\n \r\n {this.panelCategory()}\r\n )}\r\n \r\n\r\n )}\r\n \r\n\r\n {/*LIST CATEGORIES*/}\r\n
\r\n \r\n \r\n {this.getAllCategories(this._show, this.props.authorization, this.props.apol, this.props.userRules)}\r\n\r\n \r\n\r\n
\r\n \r\n {this.props.label}\r\n {this.props.required ? {` *`} : \"\"}\r\n
\r\n )\r\n }\r\n}\r\n","import React, { Component } from 'react'\r\nimport { Stack, Slider } from 'office-ui-fabric-react';\r\nimport InputFieldTitle from './InputFieldTitle';\r\n\r\nclass RISlider extends Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n sliderValue: props.input,\r\n }\r\n }\r\n\r\n onSliderChange = (data) => {\r\n this.setState({\r\n sliderValue: data\r\n })\r\n this.props.onSliderChange(data)\r\n }\r\n\r\n static getDerivedStateFromProps(props, state) {\r\n if (props.input !== state.sliderValue) {\r\n return {\r\n sliderValue: props.input\r\n };\r\n }\r\n return null;\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {this.props.min}%\r\n
}\r\n \r\n {(((this.props.max - this.props.min) * 25) / 100) + this.props.min}%\r\n
\r\n \r\n {(((this.props.max - this.props.min) * 75) / 100) + this.props.min}%\r\n
\r\n \r\n {this.props.max}%\r\n
}\r\n \r\n {/*QUERY ALL VERSIONS*/}\r\n \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) {\r\n return (\r\n \r\n this.onAdherenceSliderChange(value)}\r\n revert={this.state.contained}\r\n />\r\n \r\n \r\n \r\n {this.context.getTranslation(\"compliance\", \"includeExcludeDescriptionPhrase\")} \r\n \r\n \r\n \r\n {/*FOOTER BUTTONS*/}\r\n \r\n \r\n
\r\n );\r\n }\r\n}","import { MessageBar, MessageBarType, Spinner } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../../context';\r\nimport * as QueryAP from '../AdherencePhrasesQuery';\r\nimport EditAdherencePhrase from './EditAdherencePhrase';\r\n\r\nexport default class EditAdherencePhraseContainer extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {};\r\n }\r\n render() {\r\n const { auth, apol, hidePanel } = this.props\r\n const id = this.props.phraseId\r\n return (\r\n \r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n \r\n \r\n {/*Edit phrase*/}\r\n {id !== null && (\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getAdherencePhrase == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noData\")}\r\n )\r\n }\r\n return (
\r\n );\r\n }\r\n}\r\n","import { CommandBarButton, PanelType, Spinner, Stack, Panel } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../context';\r\nimport AdherencePhrasesListView from './AdherencePhrasesListView';\r\nimport * as query from './AdherencePhrasesQuery';\r\nimport EditAdherencePhraseContainer from '../AdherencePhrases/Panels/EditAdherencePhraseContainer'\r\nimport AlertBar from '../../CustomComponents/AlertBar';\r\nimport SafetyDialog from '../../CustomComponents/SafetyDialog';\r\n\r\nexport default class AdherencePhrases extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isPanelOpen: false,\r\n phraseId: null,\r\n warningMessage: \"\",\r\n panelTitle: null,\r\n alertMessagePanel: \"\",\r\n hideDialogDelete: true,\r\n isProcessing: false\r\n };\r\n }\r\n\r\n openPanel = (title, phraseId) => {\r\n if (title === \"addPhrase\" || (title === \"editPhrase\" && phraseId !== null)) {\r\n this.setState({\r\n isPanelOpen: true,\r\n panelTitle: title,\r\n warningMessage: \"\"\r\n })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectPhrase\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n\r\n }\r\n\r\n getHeaderPanel = () => {\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n )\r\n }\r\n {/*Create phrase*/}\r\n {\r\n id === null && (\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n\r\n hidePanel = () => {\r\n this.setState({ isPanelOpen: false, alertMessagePanel: \"\" });\r\n };\r\n\r\n selectPhrase = (id) => {\r\n this.setState({\r\n phraseId: id,\r\n warningMessage: \"\"\r\n });\r\n }\r\n\r\n setMessageError = (message) => {\r\n this.setState({\r\n alertMessagePanel: message\r\n })\r\n }\r\n\r\n refreshPhrases = () => {\r\n this.refetchQueryPhrases()\r\n }\r\n\r\n refetchQueryPhrases = null;\r\n\r\n deletePhrase = () => {\r\n this.setState({ hideDialogDelete: true, isProcessing: true })\r\n if (this.state.phraseId !== null) {\r\n const id = this.state.phraseId\r\n this.props.apol\r\n .mutate({\r\n mutation: query.deleteAdherencePhrase,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.deleteAdherencePhrase.status !== \"ok\") {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", result.data.deleteAdherencePhrase.text),\r\n alertType: \"error\",\r\n isProcessing: false\r\n })\r\n } else {\r\n this.setState({\r\n phraseId: null,\r\n isProcessing: false\r\n })\r\n this.refetchQueryPhrases();\r\n }\r\n });\r\n }\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this.state.phraseId !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectPhrase\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n render() {\r\n return ({this.context.getTranslation(\"compliance\", this.state.panelTitle)}
\r\n \r\n\r\n {/*Manage button add, edit and delete*/}\r\n \r\n { this.openPanel(\"addPhrase\", null) }}\r\n />\r\n { this.openPanel(\"editPhrase\", this.state.phraseId) }}\r\n />\r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isProcessing && \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryPhrases = refetch\r\n if (loading) return (\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deletePhrase}\r\n />\r\n
)\r\n }\r\n}","import { DetailsList, Selection, SelectionMode } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\nimport Utils from '../../common/Utils'\r\n\r\nconst orderAlphabetically = Utils.orderAlphabetically\r\n\r\n\r\nexport default class AIAdherencePhrasesListView extends Component {\r\n static contextType = MyContext\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props);\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.props.selectPhrase(this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : null)\r\n }\r\n });\r\n }\r\n\r\n getKey = (item, index) => {\r\n return item.key;\r\n }\r\n\r\n renderItemColumn = (item, index, column) => {\r\n const fieldContent = item[column.fieldName]\r\n switch (column.key) {\r\n case 'adherence':\r\n return {fieldContent}%;\r\n case 'contained': {\r\n if (item.adherence !== 0 && item.adherence !== 100) {\r\n return (\r\n \r\n {\r\n (fieldContent ?\r\n this.context.getTranslation(\"compliance\", \"exceeded\") :\r\n this.context.getTranslation(\"compliance\", \"fallenBelow\"))\r\n }\r\n \r\n )\r\n } else { return () }\r\n }\r\n default:\r\n return {fieldContent !== null ? fieldContent : \"\"};\r\n }\r\n }\r\n\r\n render() {\r\n const columns = [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"detailPolicyName\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"detailPolicyDescription\"), fieldName: 'description', minWidth: 100, maxWidth: 200 },\r\n { key: 'phrase', name: this.context.getTranslation(\"compliance\", \"phrase\"), fieldName: 'phrase', minWidth: 100, maxWidth: 200 },\r\n {\r\n key: 'relatedPhrases',\r\n name: this.context.getTranslation(\"compliance\", \"relatedPhrases\"),\r\n fieldName: 'relatedPhrases',\r\n minWidth: 300,\r\n maxWidth: 600,\r\n isResizable: true,\r\n onRender: (item: IDocument) => {\r\n return item.relatedPhrases.join(\"; \")\r\n }\r\n },\r\n {\r\n key: 'unrelatedPhrases',\r\n name: this.context.getTranslation(\"compliance\", \"unrelatedPhrases\"),\r\n fieldName: 'unrelatedPhrases',\r\n minWidth: 300,\r\n maxWidth: 600,\r\n isResizable: true,\r\n onRender: (item: IDocument) => {\r\n return item.unrelatedPhrases.join(\"; \")\r\n }\r\n },\r\n ]\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n }\r\n\r\n {/*Phrase panel*/}\r\n \r\n {this.props.label}\r\n {this.props.required ? {` *`} : \"\"}\r\n
\r\n )\r\n }\r\n}\r\n","import { Separator, Stack, TextField, PrimaryButton, IconButton, Dropdown } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport { IIconProps, initializeIcons } from '@fluentui/react';\r\nimport { TooltipHost, ITooltipHostStyles } from '@fluentui/react/lib/Tooltip';\r\n\r\n\r\nexport default class FormAdherencePhrase extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n newKeyword: \"\",\r\n error:\"\"\r\n }\r\n }\r\n\r\n addKeyword = () => {\r\n if (this.state.newKeyword === \"\") {\r\n this.setState({\r\n error: this.context.getTranslation(\"compliance\", \"errorEmptyKeywords\")\r\n })\r\n } else if (this.props.adherencePhrases.includes(this.state.newKeyword)) {\r\n this.setState({\r\n error: this.context.getTranslation(\"compliance\", \"errorDuplicatedKeywords\")\r\n })\r\n } else {\r\n this.setState({\r\n newKeyword: \"\",\r\n error:\"\"\r\n })\r\n this.props.updateAdherencePhrases([...this.props.adherencePhrases, this.state.newKeyword])\r\n }\r\n }\r\n\r\n changeNewKeyword = (e, value) => {\r\n this.setState({\r\n newKeyword: value,\r\n error: \"\"\r\n })\r\n }\r\n\r\n \r\n deleteWord = (word) => {\r\n this.props.updateAdherencePhrases(this.props.adherencePhrases.filter(w => { return w !== word }))\r\n this.setState({\r\n error: \"\"\r\n })\r\n }\r\n\r\n deleteAllKeywords = () => {\r\n this.props.updateAdherencePhrases([])\r\n this.setState({\r\n error: \"\"\r\n })\r\n }\r\n\r\n \r\n render() {\r\n return (\r\n \r\n \r\n {`${this.context.getTranslation(\"compliance\", this.props.sectionName)} (${this.props.adherencePhrases.length})`}\r\n *\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {this.state.error!=\"\" &&\r\n \r\n \r\n {this.state.error}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n}","import React, { Component } from 'react'\r\nimport { Stack, Slider } from 'office-ui-fabric-react';\r\nimport InputFieldTitle from './InputFieldTitle';\r\n\r\nclass RISlider extends Component {\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n sliderValue: props.input,\r\n }\r\n }\r\n\r\n onSliderChange = (data) => {\r\n this.setState({\r\n sliderValue: data\r\n })\r\n this.props.onSliderChange(data)\r\n }\r\n\r\n static getDerivedStateFromProps(props, state) {\r\n if (props.input !== state.sliderValue) {\r\n return {\r\n sliderValue: props.input\r\n };\r\n }\r\n return null;\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {this.props.adherencePhrases.map(w => {\r\n return (\r\n { this.deleteWord(w) }} disabled={this.props.disabled} /> \r\n {w} \r\n )\r\n })}\r\n
\r\n \r\n {this.props.min}%\r\n
}\r\n \r\n {(((this.props.max - this.props.min) * 25) / 100) + this.props.min}%\r\n
\r\n \r\n {(((this.props.max - this.props.min) * 75) / 100) + this.props.min}%\r\n
\r\n \r\n {this.props.max}%\r\n
}\r\n \r\n {/*QUERY ALL VERSIONS*/}\r\n \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) {\r\n return ( this.updateAdherencePhrases(arr, \"relatedPhrases\")} />\r\n this.updateAdherencePhrases(arr, \"unrelatedPhrases\")} />\r\n\r\n {/*FOOTER BUTTONS*/}\r\n \r\n \r\n
\r\n );\r\n }\r\n}","import { MessageBar, MessageBarType, Spinner } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../../context';\r\nimport * as QueryAP from '../AIAdherencePhrasesQuery';\r\nimport EditAIAdherencePhrase from './EditAIAdherencePhrase';\r\n\r\nexport default class EditAIAdherencePhraseContainer extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {};\r\n }\r\n render() {\r\n const { auth, apol, hidePanel } = this.props\r\n const id = this.props.phraseId\r\n return (\r\n \r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n \r\n \r\n {/*Edit phrase*/}\r\n {id !== null && (\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getAIAdherencePhrase == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noData\")}\r\n )\r\n }\r\n return (
\r\n );\r\n }\r\n}\r\n","import { CommandBarButton, PanelType, Spinner, Stack, Panel } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../context';\r\nimport AIAdherencePhrasesListView from './AIAdherencePhrasesListView';\r\nimport * as query from './AIAdherencePhrasesQuery';\r\nimport EditAIAdherencePhraseContainer from './Panels/EditAIAdherencePhraseContainer'\r\nimport AlertBar from '../../CustomComponents/AlertBar';\r\nimport SafetyDialog from '../../CustomComponents/SafetyDialog';\r\n\r\nexport default class AIAdherencePhrases extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isPanelOpen: false,\r\n phraseId: null,\r\n warningMessage: \"\",\r\n panelTitle: null,\r\n alertMessagePanel: \"\",\r\n hideDialogDelete: true,\r\n isProcessing: false\r\n };\r\n }\r\n\r\n openPanel = (title, phraseId) => {\r\n if (title === \"addPhrase\" || (title === \"editPhrase\" && phraseId !== null)) {\r\n this.setState({\r\n isPanelOpen: true,\r\n panelTitle: title,\r\n warningMessage: \"\"\r\n })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectPhrase\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n\r\n }\r\n\r\n getHeaderPanel = () => {\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n )\r\n }\r\n {/*Create phrase*/}\r\n {\r\n id === null && (\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n\r\n hidePanel = () => {\r\n this.setState({ isPanelOpen: false, alertMessagePanel: \"\" });\r\n };\r\n\r\n selectPhrase = (id) => {\r\n this.setState({\r\n phraseId: id,\r\n warningMessage: \"\"\r\n });\r\n }\r\n\r\n setMessageError = (message) => {\r\n this.setState({\r\n alertMessagePanel: message\r\n })\r\n }\r\n\r\n refreshPhrases = () => {\r\n this.refetchQueryPhrases()\r\n }\r\n\r\n refetchQueryPhrases = null;\r\n\r\n deletePhrase = () => {\r\n this.setState({ hideDialogDelete: true, isProcessing: true })\r\n if (this.state.phraseId !== null) {\r\n const id = this.state.phraseId\r\n this.props.apol\r\n .mutate({\r\n mutation: query.deleteAdherencePhrase,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.deleteAIAdherencePhrase.status !== \"ok\") {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", result.data.deleteAIAdherencePhrase.text),\r\n alertType: \"error\",\r\n isProcessing: false\r\n })\r\n } else {\r\n this.setState({\r\n phraseId: null,\r\n isProcessing: false\r\n })\r\n this.refetchQueryPhrases();\r\n }\r\n });\r\n }\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this.state.phraseId !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectPhrase\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n render() {\r\n return ({this.context.getTranslation(\"compliance\", this.state.panelTitle)}
\r\n \r\n {/*Manage button add, edit and delete*/}\r\n \r\n { this.openPanel(\"addPhrase\", null) }}\r\n />\r\n { this.openPanel(\"editPhrase\", this.state.phraseId) }}\r\n />\r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isProcessing && \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryPhrases = refetch\r\n if (loading) return (\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deletePhrase}\r\n />\r\n
)\r\n }\r\n}","import React, { Component } from \"react\";\r\nimport { TagPicker, ITag, IBasePickerSuggestionsProps } from '@fluentui/react/lib/Pickers';\r\nimport { Label } from 'office-ui-fabric-react';\r\nimport gql from 'graphql-tag';\r\nimport { MyContext } from \"../../context\";\r\nimport _ from 'lodash'\r\n\r\n\r\nexport default class ConversationPicker extends Component {\r\n\r\n static contextType = MyContext;\r\n\r\n\r\n\r\n constructor(props) {\r\n super(props)\r\n this.state = {\r\n selectedConversationIds: [],\r\n hideDialog: [],\r\n initialConversation: []\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n var newSelection = []\r\n const { selectedConversationIds } = this.props\r\n if (selectedConversationIds != undefined && selectedConversationIds.length > 0) {\r\n this.setState({\r\n selectedConversationIds,\r\n initialConversation: selectedConversationIds.map(item => ({ key: item, name: item[0] + item.slice(1) }))\r\n })\r\n }\r\n }\r\n componentDidUpdate(prevProps) {\r\n if (prevProps.selectedConversationIds != this.props.selectedConversationIds) {\r\n this.setState({\r\n selectedConversationIds: this.props.selectedConversationIds,\r\n initialConversation: this.props.selectedConversationIds.map(item => ({ key: item, name: item[0] + item.slice(1) }))\r\n })\r\n }\r\n }\r\n\r\n getConversationIds = gql`query ent ( $search: String) {\r\n getConversationIds ( search: $search) \r\n }`\r\n\r\n\r\n\r\n getElements = async (search) => {\r\n var testTags: ITag[] = []\r\n let result = await this.props.apol\r\n .query({\r\n query: this.getConversationIds,\r\n variables: { search }\r\n })\r\n if (result.data != undefined && result.data.getConversationIds != undefined && result.data.getConversationIds.length > 0) {\r\n testTags = result.data.getConversationIds.map(item => ({ key: item, name: item[0] + item.slice(1) }));\r\n }\r\n return testTags\r\n }\r\n\r\n\r\n\r\n listContainsTagList = (tag: ITag, tagList?: ITag[]) => {\r\n if (!tagList || !tagList.length || tagList.length === 0) {\r\n return false;\r\n }\r\n return tagList.some(compareTag => compareTag.key === tag.key);\r\n };\r\n\r\n filterSuggestedTags = async (filterText: string, tagList: ITag[]): ITag[] => {\r\n var suggestions = []\r\n if (filterText.length > 3) {\r\n suggestions = await this.getElements(filterText)\r\n }\r\n return filterText\r\n ? suggestions.filter(\r\n tag => tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0 && !this.listContainsTagList(tag, tagList),\r\n )\r\n : [];\r\n };\r\n\r\n getTextFromItem = (item: ITag) => {\r\n item.name\r\n };\r\n\r\n onChange = (items) => {\r\n if (this.state.initialConversation && this.state.initialConversation.length > items.length) {\r\n var result = _.differenceWith(this.state.initialConversation, items, _.isEqual)\r\n if (this.props.canRemoveConversations) {\r\n if (this.props.conversationList.get(result[0].key) < 2) {\r\n this.props.open(items)\r\n } else {\r\n this.setState({ initialConversation: items })\r\n this.removeItem(items)\r\n }\r\n }\r\n } else {\r\n var actualSelection = items.length > 0 ? items.map(item => item.key) : []\r\n this.setState({ selectedConversationIds: actualSelection })\r\n if (this.props.onSelectionChange != undefined) {\r\n this.props.onSelectionChange(actualSelection)\r\n }\r\n }\r\n };\r\n\r\n removeItem = (items) => {\r\n var actualSelection = items.length > 0 ? items.map(item => item.key) : []\r\n this.setState({ selectedConversationIds: actualSelection })\r\n if (this.props.onSelectionChange != undefined) {\r\n this.props.onSelectionChange(actualSelection)\r\n }\r\n }\r\n\r\n render() {\r\n let pickerSuggestionsProps = {\r\n suggestionsHeaderText: this.context.getTranslation(\"conversationSafe\", \"suggestionsConversationPicker\"),\r\n noResultsFoundText: this.context.getTranslation(\"conversationSafe\", \"noResultsFoundConversationPicker\"),\r\n };\r\n\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n }\r\n\r\n {/*Phrase panel*/}\r\n \r\n \r\n ({ key: item, name: item[0] + item.slice(1) }))}\r\n onChange={this.onChange}\r\n removeButtonAriaLabel=\"Remove\"\r\n onResolveSuggestions={this.filterSuggestedTags}\r\n getTextFromItem={this.getTextFromItem}\r\n pickerSuggestionsProps={pickerSuggestionsProps}\r\n pickerCalloutProps={{ doNotLayer: true }}\r\n resolveDelay={300}\r\n inputProps={{\r\n id: 'conversationPicker',\r\n placeholder: this.state.selectedConversationIds.length == 0 ? this.context.getTranslation(\"conversationSafe\", \"typeIdConversation\") : \"\"\r\n }}\r\n />\r\n
\r\n );\r\n }\r\n}","import { DefaultButton, PrimaryButton, TextField, Stack, Label, Spinner, Checkbox } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog'\r\nimport { MyContext } from '../../../context';\r\nimport { upsertConversationSafe, getConversationSafeFolder, getDefaultConversationSafeFolder } from '../ConversationSafeQuery';\r\nimport UserPicker from '../../ReportView/ReportConfiguration/UserPicker';\r\nimport ConversationPicker from '../ConversationPicker';\r\nimport ListOfDependentCheckboxes from '../../RuleSetter/RuleList/AddRuleComponents/ListOfDependentCheckboxes'\r\nimport VisibilityReplayRule from '../../RuleSetter/RuleList/AddRuleComponents/VisibilityReplayRule'\r\n\r\n\r\n\r\n\r\nexport default class ConversationSafePanel extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n //page data\r\n processing: false,\r\n supervisors: [],\r\n selectedConversationIds: [],\r\n name: \"\",\r\n description: \"\",\r\n id: \"\",\r\n ownerName: \"\",\r\n attentionRequired: \"\",\r\n userId: \"\",\r\n tenantId: \"\",\r\n replayVisibilityDetails: false,\r\n replayVisibilityDetailsTranscript: false,\r\n replayVisibilityDetailsAnalyticsChange: false,\r\n replayVisibilityDetailsAnalytics: false,\r\n replayVisibilityDetailsNotes: false,\r\n replayVisibilityDetailsTTL: false,\r\n replayVisibilityDetailsCustomFields: false,\r\n replayVisibilityDetailsMetadata: false,\r\n replayVisibilityDetailsReplay: false,\r\n visibilityDetailsQM: false,\r\n addConversations: false,\r\n removeConversations: false,\r\n exportFolders: false,\r\n allowedInPolicy:false,\r\n valid: false,\r\n disableButtons: false,\r\n isOpen: false,\r\n items: []\r\n };\r\n }\r\n\r\n open = (items) => this.setState({ isOpen: true, items })\r\n\r\n removeItem = () => {\r\n var itemMap = this.state.items.map(x => { return x['key']; });\r\n this.setState({\r\n selectedConversationIds: itemMap,\r\n items: [],\r\n isOpen: false\r\n })\r\n }\r\n\r\n close = () => this.setState({ isOpen: false })\r\n\r\n grantObject = {\r\n name: { hide: false, disabled: false },\r\n description: { hide: false, disabled: false },\r\n assignedTo: { hide: false, disabled: false },\r\n addConversations: { hide: false, disabled: false },\r\n removeConversations: { hide: false, disabled: false },\r\n exportFolders: { hide: false, disabled: false },\r\n shareFolders: { hide: false, disabled: false },\r\n conversationPickerAdd: { hide: false, disabled: false },\r\n conversationPickerRemove: { hide: false, disabled: false },\r\n save: { hide: false, disabled: false },\r\n cancel: {hide: false}\r\n };\r\n\r\n componentDidMount() {\r\n const { folderId } = this.props\r\n this.setState({ processing: true })\r\n if (folderId != undefined && folderId != null && folderId != \"\") {\r\n this.props.apol\r\n .query({\r\n query: getConversationSafeFolder,\r\n variables: { id: folderId, input: this.props.auth }\r\n })\r\n .then((result) => {\r\n const { getConversationSafeFolder } = result.data\r\n this.buildGrantObject(getConversationSafeFolder);\r\n this.setState({\r\n processing: false,\r\n valid: this.checkForm(getConversationSafeFolder.name),\r\n name: getConversationSafeFolder.name,\r\n description: getConversationSafeFolder.description,\r\n id: getConversationSafeFolder.id,\r\n userId: getConversationSafeFolder.userId,\r\n ownerName: getConversationSafeFolder.ownerName,\r\n attentionRequired: getConversationSafeFolder.attentionRequired,\r\n tenantId: getConversationSafeFolder.tenantId,\r\n replayVisibilityDetails: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsActive ?? false,\r\n replayVisibilityDetailsTranscript: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsTranscript ?? false ,\r\n replayVisibilityDetailsTTL: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsTTL ?? false ,\r\n replayVisibilityDetailsAnalytics: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsAnalytics ?? false ,\r\n replayVisibilityDetailsAnalyticsChange: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsAnalyticsChange ?? false ,\r\n replayVisibilityDetailsMetadata: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsMetadata ?? false ,\r\n replayVisibilityDetailsCustomFields: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsCustomFields ?? false ,\r\n replayVisibilityDetailsNotes: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsNotes ?? false ,\r\n replayVisibilityDetailsReplay: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsReplay ?? false,\r\n visibilityDetailsQM: getConversationSafeFolder?.visibilityDetails?.visibilityDetailsQM ?? false,\r\n addConversations: getConversationSafeFolder.addConversations === null ? false : getConversationSafeFolder.addConversations,\r\n removeConversations: getConversationSafeFolder.removeConversations === null ? false : getConversationSafeFolder.removeConversations,\r\n exportFolders: getConversationSafeFolder.exportFolders === null ? false : getConversationSafeFolder.exportFolders,\r\n selectedConversationIds: getConversationSafeFolder.conversations != undefined && getConversationSafeFolder.conversations != null ?\r\n getConversationSafeFolder.conversations.map(x => x.conversationId) : [],\r\n supervisors: getConversationSafeFolder.supervisors != undefined && getConversationSafeFolder.supervisors != null ?\r\n getConversationSafeFolder.supervisors.map(x => x.userId) : [],\r\n allowedToEditFlagAllowedInPolicy: getConversationSafeFolder.allowedToEditFlagAllowedInPolicy,\r\n allowedInPolicy: getConversationSafeFolder.allowedInPolicy\r\n })\r\n });\r\n } else {\r\n this.buildGrantObject();\r\n this.setState({ processing: false })\r\n }\r\n }\r\n\r\n buildGrantObject = (folder = undefined) => {\r\n var isSharedFolder = folder != undefined ? this.isSharedFolder(folder.userId) : this.isSharedFolder()\r\n if (!isSharedFolder) {\r\n //open my folder or creating a new one\r\n //see RuleAccess for the grant\r\n this.grantObject.name.hide = false;\r\n this.grantObject.name.disabled = false;\r\n this.grantObject.description.hide = false;\r\n this.grantObject.description.disabled = false;\r\n this.grantObject.addConversations.hide = false;\r\n this.grantObject.addConversations.disabled = false;\r\n this.grantObject.removeConversations.hide = false;\r\n this.grantObject.removeConversations.disabled = false;\r\n this.grantObject.exportFolders.hide = false;\r\n this.grantObject.exportFolders.disabled = false;\r\n this.grantObject.shareFolders.hide = false;\r\n this.grantObject.shareFolders.disabled = false;\r\n\r\n this.grantObject.conversationPickerAdd.hide = false;\r\n this.grantObject.conversationPickerAdd.disabled = false;\r\n this.grantObject.conversationPickerAdd.hide = false;\r\n this.grantObject.conversationPickerRemove.hide = false;\r\n\r\n this.grantObject.save.hide = false;\r\n this.grantObject.save.disabled = false;\r\n this.grantObject.cancel.hide = false;\r\n this.grantObject.cancel.disabled = false;\r\n if (this.props.userRules.ruleAccess.userSafe == \"Full\") {\r\n this.grantObject.assignedTo.hide = false;\r\n this.grantObject.assignedTo.disabled = false;\r\n this.grantObject.cancel.hide = false\r\n\r\n } else {\r\n var ruleAccess = this.props.userRules.ruleAccess.ownFolder;\r\n this.grantObject.assignedTo.hide = !ruleAccess.shareFolders;\r\n this.grantObject.assignedTo.disabled = !ruleAccess.shareFolders;\r\n this.grantObject.addConversations.hide = !ruleAccess.shareFolders;\r\n this.grantObject.addConversations.disabled = !ruleAccess.shareFolders;\r\n this.grantObject.removeConversations.hide = !ruleAccess.shareFolders;\r\n this.grantObject.removeConversations.disabled = !ruleAccess.shareFolders;\r\n this.grantObject.exportFolders.hide = !ruleAccess.shareFolders;\r\n this.grantObject.exportFolders.disabled = !ruleAccess.shareFolders;\r\n this.grantObject.shareFolders.hide = !ruleAccess.shareFolders;\r\n this.grantObject.shareFolders.disabled = !ruleAccess.shareFolders;\r\n this.grantObject.conversationPickerAdd.disabled = !ruleAccess.addConversations;\r\n this.grantObject.conversationPickerRemove.disabled = !ruleAccess.removeConversations;\r\n this.grantObject.cancel.hide = false\r\n }\r\n\r\n\r\n } else {\r\n //open shared folder\r\n //see folder Rule for the grant\r\n this.grantObject.name.hide = false;\r\n this.grantObject.description.hide = false;\r\n this.grantObject.conversationPickerAdd.hide = false;\r\n this.grantObject.conversationPickerRemove.hide = false;\r\n this.grantObject.save.disabled = false;\r\n this.grantObject.cancel.hide = false\r\n if (this.props.userRules.ruleAccess.userSafe == \"Full\") {\r\n this.grantObject.name.disabled = false;\r\n this.grantObject.description.disabled = false;\r\n this.grantObject.assignedTo.disabled = false;\r\n this.grantObject.assignedTo.hide = false;\r\n this.grantObject.addConversations.hide = false;\r\n this.grantObject.addConversations.disabled = false;\r\n this.grantObject.removeConversations.hide = false;\r\n this.grantObject.removeConversations.disabled = false;\r\n this.grantObject.shareFolders.hide = false;\r\n this.grantObject.shareFolders.disabled = false;\r\n this.grantObject.exportFolders.hide = false;\r\n this.grantObject.exportFolders.disabled = false;\r\n this.grantObject.conversationPickerAdd.disabled = false;\r\n this.grantObject.conversationPickerRemove.disabled = false;\r\n this.grantObject.save.hide = false;\r\n this.grantObject.cancel.hide = false\r\n } else {\r\n this.grantObject.name.disabled = true;\r\n this.grantObject.description.disabled = true;\r\n this.grantObject.assignedTo.disabled = true;\r\n this.grantObject.assignedTo.hide = true;\r\n this.grantObject.addConversations.hide = true;\r\n this.grantObject.addConversations.disabled = !folder.addConversations;\r\n this.grantObject.removeConversations.hide = true;\r\n this.grantObject.removeConversations.disabled = !folder.removeConversations;\r\n this.grantObject.exportFolders.hide = true;\r\n this.grantObject.exportFolders.disabled = !folder.exportFolders;\r\n this.grantObject.shareFolders.hide = true;\r\n this.grantObject.shareFolders.disabled = true;\r\n this.grantObject.conversationPickerAdd.disabled = !folder.addConversations;\r\n this.grantObject.conversationPickerRemove.disabled = !folder.removeConversations;\r\n this.grantObject.save.hide = (!folder.addConversations && !folder.removeConversations) || (folder.attentionRequired !== \"\");\r\n this.grantObject.cancel.hide = (!folder.addConversations && !folder.removeConversations) || (folder.attentionRequired !== \"\");\r\n }\r\n\r\n }\r\n }\r\n\r\n onConversationIdsChanged = (selectedConversationIds) => {\r\n this.setState({\r\n selectedConversationIds\r\n })\r\n }\r\n\r\n changeText = (e, value) => {\r\n var formData = { ...this.state, [e.target.id]: value }\r\n this.setState({\r\n [e.target.id]: value,\r\n valid: this.checkForm(formData.name)\r\n })\r\n }\r\n\r\n changeUserPicker = (users) => {\r\n this.setState({ supervisors: users.map(u => u.userId), valid: this.checkForm(this.state.name) })\r\n }\r\n\r\n checkForm = (name) => {\r\n return name.length > 0\r\n }\r\n\r\n onChangeAddConversations = () => {\r\n this.setState(prevState => ({\r\n addConversations: !prevState.addConversations\r\n }))\r\n }\r\n\r\n onChangeRemoveConversations = () => {\r\n this.setState(prevState => ({\r\n removeConversations: !prevState.removeConversations\r\n }))\r\n }\r\n\r\n onChangeExportFolders = () => {\r\n this.setState(prevState => ({\r\n exportFolders: !prevState.exportFolders\r\n }))\r\n }\r\n\r\n save = () => {\r\n\r\n this.setState({ disableButtons: true })\r\n const auth = this.props.auth\r\n const conversationSafeFolder = {\r\n id: this.state.id,\r\n name: this.state.name,\r\n description: this.state.description,\r\n supervisors: this.state.supervisors != undefined && this.state.supervisors != null ? this.state.supervisors.map(x => { return { userId: x } }) : [],\r\n conversations: this.state.selectedConversationIds.map(x => { return { conversationId: x } }),\r\n userId: this.state.userId,\r\n tenantId: this.state.tenantId,\r\n visibilityDetails: {\r\n visibilityDetailsActive: this.state.replayVisibilityDetails,\r\n visibilityDetailsTranscript: this.state.replayVisibilityDetailsTranscript,\r\n visibilityDetailsAnalytics: this.state.replayVisibilityDetailsAnalytics,\r\n visibilityDetailsAnalyticsChange: this.state.replayVisibilityDetailsAnalyticsChange,\r\n visibilityDetailsMetadata: this.state.replayVisibilityDetailsMetadata,\r\n visibilityDetailsTTL: this.state.replayVisibilityDetailsTTL,\r\n visibilityDetailsCustomFields: this.state.replayVisibilityDetailsCustomFields,\r\n visibilityDetailsNotes: this.state.replayVisibilityDetailsNotes,\r\n visibilityDetailsReplay: this.state.replayVisibilityDetailsReplay,\r\n visibilityDetailsQM: this.state.visibilityDetailsQM\r\n },\r\n addConversations: this.state.addConversations,\r\n removeConversations: this.state.removeConversations,\r\n exportFolders: this.state.exportFolders,\r\n allowedInPolicy: this.state.allowedInPolicy\r\n }\r\n this.props.apol\r\n .mutate({\r\n mutation: upsertConversationSafe,\r\n variables: { auth, conversationSafeFolder }\r\n })\r\n .then((result) => {\r\n var state = {}\r\n if (result.data.createConversationSafeFolder.status === \"ok\") {\r\n this.props.refreshConversationSafeFolders()\r\n this.props.hidePanel()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.createConversationSafeFolder.text))\r\n }\r\n this.setState({ ...state, disableButtons: !this.checkForm(this.state.name) })\r\n });\r\n }\r\n\r\n //check if that folder is a shared folder\r\n isSharedFolder = (userId = null) => {\r\n var uId = userId != null ? userId : this.state.userId;\r\n return (this.props.folderId != null && uId != this.props.userRules.userId);\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n\r\n {this.state.processing && \r\n { this.props.hidePanel() }}\r\n disabled={this.state.disableButtons}\r\n style={{ marginTop: '30px', marginLeft: '15px',\r\n display: this.grantObject.cancel.hide ? 'none' : '' }}\r\n />\r\n \r\n
\r\n )}\r\n \r\n\r\n\r\n );\r\n\r\n }\r\n}\r\n","import React, { Component } from \"react\";\r\nimport { Spinner } from '@fluentui/react/lib/Spinner';\r\nimport { Icon } from \"office-ui-fabric-react\";\r\nimport { FontSizes, Stack } from 'office-ui-fabric-react/lib/';\r\nimport { mergeStyleSets } from 'office-ui-fabric-react/lib/Styling';\r\nimport { DetailsList, SelectionMode } from \"office-ui-fabric-react\";\r\nimport { MyContext } from \"../../context\";\r\nimport { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';\r\nimport { Query } from \"react-apollo\";\r\nimport DetailContainer from \"../DetailView/DetailContainer/DetailContainer\";\r\nimport { queryGetEntry, queryGetEntryByFolder } from \"../../queries/queryRecordings\";\r\nimport UserScreenIcon from '../common/UserScreenBlack.svg';\r\nimport SMSIcon from \"../assets/icons/sms_icon_black.svg\";\r\n\r\nconst classNames = mergeStyleSets({\r\n fileIconHeaderIcon: {\r\n padding: 0,\r\n fontSize: '16px'\r\n },\r\n fileIconCell: {\r\n textAlign: 'center',\r\n selectors: {\r\n '&:before': {\r\n content: '.',\r\n display: 'inline-block',\r\n verticalAlign: 'middle',\r\n height: '100%',\r\n width: '0px',\r\n visibility: 'hidden'\r\n }\r\n }\r\n },\r\n accordionItem: {\r\n paddingBottom: '9px'\r\n }\r\n});\r\n\r\nexport class ConversationSafeFolder extends Component {\r\n static contextType = MyContext;\r\n\r\n onItemInvoked = (item) => {\r\n this.setState({\r\n selectedConversationId: item.conversationId,\r\n showPanel: true\r\n })\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n allColumns: [],\r\n columns: [],\r\n showPanel: false,\r\n selectedConversationId: \"\",\r\n folder: this.props.folder.conversations,\r\n refreshCsList: false,\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n const columns = [\r\n {\r\n key: 'column1',\r\n name: \r\n {this.state.attentionRequired !== \"\" &&\r\n this.state.userId !== this.props.userRules.userId &&\r\n this.props.userRules.ruleAccess.userSafe !== \"Full\" &&\r\n {this.context.getTranslation(\"conversationSafe\", \"contactOwner\") + this.state.ownerName}\r\n }\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n {\r\n return ({ \"userId\": user })\r\n })}\r\n fc={(user) => { this.changeUserPicker(user) }}\r\n />\r\n
\r\n\r\n \r\n \r\n {\r\n this.setState({\r\n ...newState,\r\n updated: true})\r\n }}\r\n data={\r\n {\r\n replayVisibilityDetails: this.state.replayVisibilityDetails,\r\n userRulesVisibilityActive: this.props.userRules.visibilityDetails,\r\n secondary: {\r\n replayVisibilityDetailsTranscript: {\r\n value: this.state.replayVisibilityDetailsTranscript,\r\n rules: this.props.userRules.visibilityDetailsTranscript\r\n },\r\n replayVisibilityDetailsAnalyticsChange: {\r\n value: this.state.replayVisibilityDetailsAnalyticsChange,\r\n rules: this.props.userRules.visibilityDetailsAnalyticsChange\r\n },\r\n replayVisibilityDetailsAnalytics: {\r\n value: this.state.replayVisibilityDetailsAnalytics,\r\n rules: this.props.userRules.visibilityDetailsAnalytics\r\n },\r\n replayVisibilityDetailsNotes: {\r\n value: this.state.replayVisibilityDetailsNotes,\r\n rules: this.props.userRules.visibilityDetailsNotes\r\n },\r\n replayVisibilityDetailsTTL: {\r\n value: this.state.replayVisibilityDetailsTTL,\r\n rules: this.props.userRules.visibilityDetailsTTL\r\n },\r\n replayVisibilityDetailsCustomFields: {\r\n value: this.state.replayVisibilityDetailsCustomFields,\r\n rules: this.props.userRules.visibilityDetailsCustomFields\r\n },\r\n replayVisibilityDetailsMetadata: {\r\n value: this.state.replayVisibilityDetailsMetadata,\r\n rules: this.props.userRules.visibilityDetailsMetadata\r\n },\r\n replayVisibilityDetailsReplay: {\r\n value: this.state.replayVisibilityDetailsReplay,\r\n rules: this.props.userRules.visibilityDetailsReplay\r\n },\r\n visibilityDetailsQM: {\r\n value: this.state.visibilityDetailsQM,\r\n rules: this.props.userRules.visibilityDetailsQM\r\n }\r\n }\r\n \r\n }\r\n }\r\n >\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {this.props.userRules.ruleAccess.userCompliancePolicyInitiateWorkflow &&\r\n this.setState({allowedInPolicy: checked})}/>\r\n }\r\n
\r\n \r\n {\r\n this.setState({ showPanel: false })\r\n if (this.state.refreshCsList) this.props.refreshCSList()\r\n }}\r\n type={PanelType.smallFluid}>\r\n {/*MANAGED GET ENTRY FOR CONVERSATION SAFE FOLDER*/}\r\n {this.props.folder.id !== null &&\r\n < Query\r\n query={queryGetEntryByFolder}\r\n variables={{\r\n id: this.state.selectedConversationId,\r\n folderId: this.props.folder.id,\r\n auth: this.props.auth,\r\n callStartMs: this.props.callStartMs\r\n }}>\r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n ;\r\n if (data.getEntryByFolder !== null) {\r\n\r\n var userRules = { ...this.props.userRules }\r\n //if the folder does not contain the visibility rules,show all the information present on the detail view\r\n if (this.props.folder.visibilityDetails != undefined && this.props.folder.userId != this.props.userRules.userId) {\r\n userRules.visibilityDetails = this.props.folder.visibilityDetails.visibilityDetailsActive;\r\n userRules.visibilityDetailsNotes = this.props.folder.visibilityDetails.visibilityDetailsNotes;\r\n userRules.visibilityDetailsTranscript = this.props.folder.visibilityDetails.visibilityDetailsTranscript;\r\n userRules.visibilityDetailsTTL = this.props.folder.visibilityDetails.visibilityDetailsTTL;\r\n userRules.visibilityDetailsAnalytics = this.props.folder.visibilityDetails.visibilityDetailsAnalytics;\r\n userRules.visibilityDetailsAnalyticsChange = this.props.folder.visibilityDetails.visibilityDetailsAnalyticsChange;\r\n userRules.visibilityDetailsCustomFields = this.props.folder.visibilityDetails.visibilityDetailsCustomFields;\r\n userRules.visibilityDetailsMetadata = this.props.folder.visibilityDetails.visibilityDetailsMetadata;\r\n userRules[\"visibilityDetailsReplay\"] = this.props.folder.visibilityDetails.visibilityDetailsReplay;\r\n } else {\r\n userRules.visibilityDetails = this.props.userRules.visibilityDetails;\r\n userRules.visibilityDetailsNotes = this.props.userRules.visibilityDetailsNotes;\r\n userRules.visibilityDetailsTranscript = this.props.userRules.visibilityDetailsTranscript;\r\n userRules.visibilityDetailsTTL = this.props.userRules.visibilityDetailsTTL;\r\n userRules.visibilityDetailsAnalytics = this.props.userRules.visibilityDetailsAnalytics;\r\n userRules.visibilityDetailsAnalyticsChange = this.props.userRules.visibilityDetailsAnalyticsChange;\r\n userRules.visibilityDetailsCustomFields = this.props.userRules.visibilityDetailsCustomFields;\r\n userRules.visibilityDetailsMetadata = this.props.userRules.visibilityDetailsMetadata;\r\n userRules.visibilityDetailsQM = this.props.folder.visibilityDetails.visibilityDetailsQM;\r\n userRules[\"visibilityDetailsReplay\"] = true;\r\n }\r\n return (\r\n { this.setState({ showPanel: false }) }}\r\n />);\r\n }\r\n }}\r\n }\r\n {/*MANAGED GET ENTRY FOR UNALLOCATED FOLDER*/}\r\n {this.props.folder.id === null &&\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return ( ;\r\n return (\r\n { this.setState({ showPanel: false }) }}\r\n userRules={this.props.userRules}\r\n theme={this.props.theme}\r\n />\r\n );\r\n }}\r\n \r\n }\r\n \r\n {this.state.folder.length > 0 && (\r\n
\r\n );\r\n }\r\n}","import React, { Component } from \"react\";\r\nimport { TooltipHost } from '@fluentui/react/lib/Tooltip';\r\nimport { Stack, CommandBar, ContextualMenuItemType, Icon, FontSizes } from \"office-ui-fabric-react\";\r\nimport '../ConversationSafe.css'\r\nimport { MyContext } from \"../../../context\";\r\nimport DownloadDialog from '../../DetailView/DetailPivot/PivotElements/Transscript/DownloadDialog'\r\n\r\n\r\nexport class ConversationSafeAccordionHeader extends Component {\r\n\r\n static contextType = MyContext;\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = { folder: this.props.folder }\r\n }\r\n\r\n folderName = (name, conversationSize) => {\r\n var result = name.length > 25 ? `${name.substring(0, 25)} ...` : name\r\n result += ` (${conversationSize})`\r\n return result\r\n }\r\n\r\n folderSupervisors = (folder) => {\r\n if (this.props.userRules.ruleAccess.userSafe === \"Full\" || (folder.userId === this.props.userRules.userId && this.props.userRules.ruleAccess.ownFolder.shareFolders)) {\r\n if (!folder.supervisors.length) return '-'\r\n var supervisors = folder.supervisors.map(supervisor => {\r\n return supervisor.mail ? supervisor.mail : supervisor.name\r\n })\r\n .join(\", \")\r\n return supervisors.length > 70 ? supervisors.substring(0, 67) + \"...\" : supervisors\r\n } else {\r\n return \"\"\r\n }\r\n }\r\n\r\n menuIsNeeded = () => {\r\n return this.props.folder.id !== null\r\n }\r\n\r\n getAttention = () => {\r\n if (!this.state.folder.supervisors.length) return ''\r\n let attention = this.state.folder.attentionRequired !== \"\"\r\n return attention ? (\r\n
\r\n )\r\n };\r\n if (error) return ;\r\n if (data.getEntryByFolder === null) return {this.context.getTranslation(\"conversationSafe\", \"userNotAllowed\")}
\r\n
)\r\n };\r\n if (error) return ;\r\n if (data.getEntry === null) return {this.context.getTranslation(\"conversationSafe\", \"userNotAllowed\")}
\r\n {defaultRender({\r\n ...props, onClick: (event) => {\r\n event.preventDefault(); this.onItemInvoked(props.item)\r\n }\r\n })\r\n }\r\n
\r\n )}>\r\n }\r\n\r\n {this.props.folder.conversations.length === 0 &&\r\n \r\n
}\r\n\r\n {this.context.getTranslation(\"conversationSafe\", \"conversationNorExist\")}
\r\n e.stopPropagation()}>\r\n {this.props.width > 550 && \r\n \r\n \r\n \r\n }\r\n
\r\n );\r\n }\r\n}","import React, { Component } from \"react\";\r\nimport { ConversationSafeFolder } from \"./ConversationSafeFolder\";\r\nimport { MyContext } from \"../../context\";\r\nimport RIAccordion from \"./Accordion/RIAccordion\";\r\nimport { ConversationSafeAccordionHeader } from \"./Accordion/ConversationSafeAccordionHeader\";\r\n\r\nexport class ConversationSafeList extends Component {\r\n\r\n static contextType = MyContext;\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n width: window.innerWidth,\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n window.addEventListener('resize', this.handleResize);\r\n }\r\n\r\n componentWillUnmount() {\r\n window.removeEventListener('resize', this.handleResize);\r\n }\r\n\r\n handleResize = () => {\r\n this.setState({\r\n width: window.innerWidth\r\n });\r\n };\r\n\r\n propsForExportDialog = {\r\n client: this.props.apol,\r\n auth: this.props.auth,\r\n export: []\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
}\r\n {this.props.width <= 550 && \r\n {this.folderName(this.state.folder.name, this.state.folder.conversations.length)}\r\n
\r\n {this.state.folder.ownerName}
\r\n {this.props.width > 850 && {this.folderSupervisors(this.state.folder)}
}\r\n {this.getAttention()}
\r\n \r\n \r\n
}\r\n {(this.menuIsNeeded()) &&\r\n \r\n {this.folderName(this.state.folder.name, this.state.folder.conversations.length)}\r\n
\r\n {this.getAttention()}
\r\n \r\n \r\n {\r\n return ({\r\n header: \r\n
\r\n );\r\n }\r\n} ","import React, { Component } from 'react';\r\nimport { MyContext } from '../../context';\r\nimport {\r\n CommandBarButton,\r\n MessageBar,\r\n MessageBarType,\r\n Panel,\r\n PanelType,\r\n Spinner,\r\n Stack\r\n} from \"office-ui-fabric-react\";\r\nimport ConversationSafePanel from \"./Panel/ConversationSafePanel\";\r\nimport { ConversationSafeList } from \"./ConversationSafeList\";\r\nimport { deleteConversationSafeFolder, getAllFolders } from './ConversationSafeQuery'\r\nimport SafetyDialog from '../CustomComponents/SafetyDialog'\r\nimport { toast } from 'react-toastify'\r\n\r\n\r\nexport default class ConversationSafe extends Component {\r\n static contextType = MyContext;\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isPanelOpen: false,\r\n warningMessage: \"\",\r\n alertMessagePanel: \"\",\r\n folderId: null,\r\n conversationSafeFolders: [],\r\n loading: false,\r\n idDefaultFolder: false,\r\n dialogDeleteIsOpen: false,\r\n folderIdToDelete: null\r\n };\r\n }\r\n\r\n\r\n openPanel = (folderId = null) => {\r\n this.setState({\r\n isPanelOpen: true,\r\n folderId\r\n })\r\n }\r\n\r\n authRights = (data) => {\r\n let folders = data.getConversationSafeFolders\r\n let ownFolderRule = this.props.userRules.ruleAccess.ownFolder\r\n let user = this.props.userRules.userId\r\n\r\n if (this.props.userRules.ruleAccess.userSafe == \"Full\") {\r\n return folders.map(folder => {\r\n let userIsCreator = folder.userId == user\r\n return {\r\n folderId: folder.id,\r\n addConvRight: true,\r\n removeConvRight: true,\r\n upserRight: true,\r\n deleteFolder: true,\r\n exportFolder: true,\r\n userIsCreator\r\n }\r\n })\r\n }\r\n\r\n return folders.map(folder => {\r\n let userIsCreator = folder.userId == user\r\n let userIsAssignee = folder.supervisors.map(e => e.userId).includes(user)\r\n let addConvRight = (ownFolderRule.addConversations && userIsCreator) || (userIsAssignee && folder.addConversations)\r\n let removeConvRight = (ownFolderRule.removeConversations && userIsCreator) || (userIsAssignee && folder.removeConversations)\r\n let upserRight = ownFolderRule.upserFolder && userIsCreator\r\n let deleteFolder = userIsCreator && ownFolderRule.deleteFolders\r\n let exportFolder = (ownFolderRule.exportFolders && userIsCreator) || (userIsAssignee && folder.exportFolders)\r\n return {\r\n folderId: folder.id,\r\n addConvRight,\r\n removeConvRight,\r\n upserRight,\r\n deleteFolder,\r\n userIsCreator,\r\n exportFolder\r\n }\r\n })\r\n }\r\n\r\n componentDidMount() {\r\n this.refreshPage();\r\n }\r\n\r\n refreshPage = () => {\r\n this.setState({ loading: true })\r\n this.props.apol\r\n .query({\r\n query: getAllFolders,\r\n variables: { auth: this.props.auth },\r\n fetchPolicy: 'network-only'\r\n })\r\n .then((result) => {\r\n const { getConversationSafeFolders } = result.data\r\n // count folders in every conversation for dialog in conversationpicker\r\n const conversationList = new Map();\r\n getConversationSafeFolders.forEach((f) => {\r\n f.conversations.forEach((c) => {\r\n if (conversationList.get(c.conversationId) == undefined) {\r\n conversationList.set(c.conversationId, 1)\r\n }\r\n else {\r\n conversationList.set(c.conversationId, conversationList.get(c.conversationId) + 1)\r\n }\r\n })\r\n });\r\n let rightsArray = this.authRights(result.data)\r\n this.setState({\r\n loading: false,\r\n conversationSafeFolders: getConversationSafeFolders,\r\n conversationList: conversationList,\r\n rights: rightsArray\r\n })\r\n });\r\n }\r\n\r\n getHeaderPanel = () => {\r\n return (\r\n \r\n \r\n { this.setState({ alertMessagePanel: \"\" }) }}\r\n >\r\n {this.state.alertMessagePanel}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n checkAccessRules = () => {\r\n if (this.props.userRules.ruleAccess.userSafe == \"Full\" || this.props.userRules.ruleAccess.ownFolder.upserFolder) return false\r\n return true\r\n }\r\n\r\n openDialogDeleteFolder = (folderId) => {\r\n this.setState({\r\n folderIdToDelete: folderId,\r\n dialogDeleteIsOpen: true\r\n })\r\n }\r\n\r\n\r\n hidePanel = () => {\r\n this.setState({ isPanelOpen: false, alertMessagePanel: \"\" });\r\n };\r\n\r\n setMessageError = (message) => {\r\n this.setState({\r\n alertMessagePanel: message\r\n })\r\n }\r\n\r\n deleteFolder = () => {\r\n this.setState({ dialogDeleteIsOpen: false, loading: true })\r\n this.props.apol.mutate({\r\n mutation: deleteConversationSafeFolder,\r\n variables: { conversationSafeFolder: this.state.folderIdToDelete }\r\n })\r\n .then(result => {\r\n this.setState({\r\n loading: false\r\n })\r\n if (result.data.deleteConversationSafeFolder.status == \"ok\") {\r\n toast.info('Folder deleted.', {\r\n position: \"bottom-left\",\r\n autoClose: 5000,\r\n hideProgressBar: false,\r\n closeOnClick: true,\r\n pauseOnHover: true,\r\n draggable: true,\r\n })\r\n this.refreshPage();\r\n }\r\n }\r\n )\r\n }\r\n\r\n\r\n render() {\r\n return (\r\n {this.context.getTranslation(\"conversationSafe\", \"folderSettings\")}
\r\n {/*Alert*/}\r\n {this.state.alertMessagePanel !== \"\" && \r\n \r\n { this.openPanel() }}\r\n />\r\n \r\n \r\n {this.state.loading && ( \r\n \r\n { this.setState({ dialogDeleteIsOpen: false }) }}\r\n ok={this.deleteFolder}\r\n />\r\n\r\n\r\n
\r\n\r\n );\r\n }\r\n}\r\n","import { DetailsList, MarqueeSelection, Selection, SelectionMode, GroupHeader } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\n\r\nexport default class AIQuestionsListView extends Component {\r\n static contextType = MyContext\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props);\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.props.selectAIQuestion(this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : null)\r\n }\r\n });\r\n }\r\n\r\n _getKey = (item, index) => {\r\n return item.key;\r\n }\r\n\r\n render() {\r\n const columns = [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"detailPolicyName\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"detailPolicyDescription\"), fieldName: 'description', minWidth: 100, maxWidth: 200 },\r\n { key: 'question', name: this.context.getTranslation(\"compliance\", \"question\"), fieldName: 'question', minWidth: 100, maxWidth: 200 },\r\n ]\r\n\r\n return (\r\n \r\n
\r\n ),\r\n };\r\n\r\n constructor(props) {\r\n super(props);\r\n const aiQuestion = this.props.data !== undefined ? this.props.data : null\r\n this.state = {\r\n //page data\r\n processing: false,\r\n //phrase data\r\n id: aiQuestion !== null ? aiQuestion.id : null,\r\n name: aiQuestion !== null ? aiQuestion.name : \"\",\r\n description: aiQuestion !== null ? aiQuestion.description : \"\",\r\n question: aiQuestion !== null ? aiQuestion.question : \"\",\r\n tenantId: aiQuestion !== null ? aiQuestion.tenantId : null,\r\n version: aiQuestion !== null ? aiQuestion.version : 0,\r\n aiQuestionGroup: aiQuestion !== null ? aiQuestion.aiQuestionGroup.id : null,\r\n generalGroup: aiQuestion !== null ? aiQuestion.aiQuestionGroup.generalGroup : false,\r\n masterItemId: aiQuestion !== null ? aiQuestion.masterItemId : null,\r\n selected: aiQuestion !== null ? aiQuestion.selected : true,\r\n matchAbsence: aiQuestion !== null ? aiQuestion.matchAbsence : false,\r\n aIQuestionType: aiQuestion?.aIQuestionType ?? \"AIQuestion\",\r\n //versions\r\n selectedOtherVersion: false,\r\n selectedVersion: aiQuestion !== null ? aiQuestion.id : null\r\n };\r\n }\r\n\r\n\r\n\r\n\r\n\r\n\r\n componentDidMount() {\r\n this.refreshVersions()\r\n }\r\n\r\n refetchQueryVersions = null;\r\n numberOfVersions = 1\r\n\r\n refreshVersions = () => {\r\n if (this.refetchQueryVersions !== null) {\r\n this.refetchQueryVersions()\r\n }\r\n }\r\n\r\n changeText = (e, value) => {\r\n this.setState({\r\n [e.target.id]: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n changeMatchAbsence = (e, value) => {\r\n this.setState({\r\n matchAbsence: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n isValid = () => {\r\n return this.state.name !== \"\" && this.state.question !== \"\";\r\n }\r\n\r\n cancel = () => {\r\n this.props.closePanel()\r\n }\r\n\r\n save = (saveAsTemplate) => {\r\n this.setState({ processing: true })\r\n const auth = this.props.auth\r\n const aiQuestion = {\r\n id: this.state.id,\r\n name: this.state.name,\r\n description: this.state.description,\r\n question: this.state.question,\r\n tenantId: this.state.tenantId,\r\n // manage version\r\n version: this.numberOfVersions,\r\n aiQuestionGroup: { id: this.state.aiQuestionGroup, generalGroup: this.state.generalGroup },\r\n masterItemId: this.state.masterItemId,\r\n selected: this.state.selected,\r\n matchAbsence: this.state.matchAbsence,\r\n aIQuestionType: this.state.aIQuestionType\r\n }\r\n this.props.apol\r\n .mutate({\r\n mutation: saveAsTemplate ? QueryAI.createAIQuestionAsTemplate : QueryAI.createAIQuestion,\r\n variables: { auth, aiQuestion }\r\n })\r\n .then((result) => {\r\n var resultData = saveAsTemplate ? result.data.upsertAIQuestionAsTemplate : result.data.upsertAIQuestion\r\n var state = {}\r\n if (resultData.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshAIQuestions()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", resultData.text))\r\n \r\n\r\n }\r\n this.setState({ ...state, processing: false })\r\n });\r\n }\r\n\r\n onChangeVersion = (e, item) => {\r\n //get specific version to fill the fields\r\n this.setState({ processing: true })\r\n let id = item.key\r\n let auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: QueryAI.queryGetAIQuestion,\r\n variables: { auth, id }\r\n })\r\n .then(({ loading, error, data, refetch }) => {\r\n let oldVersion = data.getAIQuestion;\r\n this.setState({\r\n name: oldVersion.name,\r\n description: oldVersion.description,\r\n question: oldVersion.question,\r\n tenantId: oldVersion.tenantId,\r\n selectedVersion: id,\r\n selectedOtherVersion: true,\r\n processing: false\r\n })\r\n });\r\n }\r\n\r\n restoreVersion = () => {\r\n this.setState({ processing: true })\r\n //restoreAdherencePhrase -> id vesrion to restore\r\n let id = this.state.selectedVersion\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryAI.restoreAIQuestion,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.restoreAIQuestion.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshAIQuestions()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.restoreAIQuestion.text))\r\n }\r\n this.setState({\r\n selectedOtherVersion: false,\r\n processing: false\r\n })\r\n });\r\n }\r\n\r\n\r\n render() {\r\n let masterItemId = this.state.masterItemId\r\n var saveAsTemplateStyle = { marginTop: \"30px\", marginLeft: \"15px\" }\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"questionTooltipTitle\")}\r\n
\r\n \r\n {this.context.getTranslation(\"compliance\", \"questionTooltipSubtitle\")}\r\n
\r\n - \r\n
- {this.context.getTranslation(\"compliance\", \"questionTooltipRow1\")} \r\n
- {this.context.getTranslation(\"compliance\", \"questionTooltipRow2\")} \r\n
- {this.context.getTranslation(\"compliance\", \"questionTooltipRow3\")} \r\n
- {this.context.getTranslation(\"compliance\", \"questionTooltipRow4\")} \r\n
\r\n {/*QUERY ALL VERSIONS*/}\r\n \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n {/*\r\n \r\n \r\n \r\n\r\n {/*FOOTER BUTTONS*/}\r\n \r\n this.save(false)} style={{ marginTop: \"30px\", marginLeft: \"15px\" }} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {(this.props.userRules.userTemplateAllowed && (!this.state.selectedOtherVersion || this.state.id === this.state.selectedVersion)) &&\r\n this.save(true)} style={!this.isValid() || this.state.processing ? saveAsTemplateStyle : { ...saveAsTemplateStyle, background: \"red\", color: \"white\" }} allowDisabledFocus={true} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {this.state.selectedOtherVersion && this.state.id !== this.state.selectedVersion &&\r\n \r\n
\r\n );\r\n }\r\n}","import { MessageBar, MessageBarType, Spinner } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../../context';\r\nimport * as QueryAI from '../AIQuestionQuery';\r\nimport EditAIQuestion from './EditAIQuestion';\r\n\r\nexport default class EditAIQuestionContainer extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {};\r\n }\r\n\r\n render() {\r\n const { auth, apol, hidePanel } = this.props\r\n const id = this.props.aiQuestionId\r\n return (\r\n \r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n \r\n */}\r\n {/* {this.context.getTranslation(\"compliance\", \"complianceQuestionsMatchSectionCaption\")}*/}\r\n {/*
*/}\r\n\r\n \r\n
\r\n \r\n {/*Edit AI Question*/}\r\n {id !== null && (\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getAIQuestion == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noData\")}\r\n )\r\n }\r\n return (
\r\n );\r\n }\r\n}\r\n","import { CommandBarButton, PanelType, Spinner, Stack, Panel } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../context';\r\nimport AIQuestionsListView from './AIQuestionsListView';\r\nimport * as query from './AIQuestionQuery';\r\nimport EditAIQuestionContainer from '../AIQuestion/Panels/EditAIQuestionContainer'\r\nimport AlertBar from '../../CustomComponents/AlertBar';\r\nimport SafetyDialog from '../../CustomComponents/SafetyDialog'\r\nimport Utils from '../../common/Utils'\r\n\r\nconst orderAlphabetically = Utils.orderAlphabetically\r\n\r\nexport default class AIQuestions extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isPanelOpen: false,\r\n aiQuestionId: null,\r\n warningMessage: \"\",\r\n panelTitle: null,\r\n alertMessagePanel: \"\",\r\n hideDialogDelete: true,\r\n isProcessing: false\r\n };\r\n }\r\n\r\n groupsCollapsed = []\r\n\r\n openPanel = (title, aiQuestionId) => {\r\n if (title === \"addAIQuestion\" || (title === \"editAIQuestion\" && aiQuestionId !== null)) {\r\n this.setState({\r\n isPanelOpen: true,\r\n panelTitle: title,\r\n warningMessage: \"\"\r\n })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectAIQuestion\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n\r\n }\r\n\r\n getHeaderPanel = () => {\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n )\r\n }\r\n {/*Create question*/}\r\n {\r\n id === null && (\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n\r\n hidePanel = () => {\r\n this.setState({ isPanelOpen: false, alertMessagePanel: \"\" });\r\n };\r\n\r\n selectAIQuestion = (id) => {\r\n this.setState({\r\n aiQuestionId: id,\r\n warningMessage: \"\"\r\n });\r\n }\r\n\r\n setMessageError = (message) => {\r\n this.setState({\r\n alertMessagePanel: message\r\n })\r\n }\r\n\r\n refreshAIQuestions = () => {\r\n this.refetchQueryAIQuestions()\r\n }\r\n\r\n refetchQueryAIQuestions = null;\r\n\r\n deleteAIQuestion = () => {\r\n this.setState({ hideDialogDelete: true, isProcessing: true })\r\n if (this.state.aiQuestionId !== null) {\r\n const id = this.state.aiQuestionId\r\n this.props.apol\r\n .mutate({\r\n mutation: query.deleteAIQuestion,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.deleteAIQuestion.status !== \"ok\") {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", result.data.deleteAIQuestion.text),\r\n alertType: \"error\",\r\n isProcessing: false\r\n })\r\n } else {\r\n this.setState({\r\n aiQuestionId: null,\r\n isProcessing: false\r\n })\r\n this.refetchQueryAIQuestions();\r\n }\r\n });\r\n }\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this.state.aiQuestionId !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectAIQuestion\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n getAIQuestionGroups = (data) => {\r\n //unique groups id\r\n let allGroupsIds = [...new Set(data.map(aiQ => aiQ.aiQuestionGroup.id))];\r\n let allTemplateGroupsIds = [...new Set(data.filter(aiQ => aiQ.aiQuestionGroup.generalGroup).map(aiQ => aiQ.aiQuestionGroup.id))];\r\n //create groups for dataillist\r\n let groups = allGroupsIds.map(groupId => {\r\n var startIndex = \"\";\r\n var endIndex = \"\";\r\n var name = \"\";\r\n var expandedGroup = \"\";\r\n for (var i = 0; i < data.length; i++) {\r\n if (data[i].aiQuestionGroup.id === groupId) {\r\n name = data[i].aiQuestionGroup.name\r\n startIndex = startIndex === \"\" ? i : startIndex\r\n endIndex = i + 1\r\n expandedGroup = this.groupsCollapsed.length === 0 ?\r\n (allTemplateGroupsIds.includes(groupId) ? true : false) :\r\n this.groupsCollapsed.filter(g => g.key === groupId)[0]?.isCollapsed\r\n }\r\n }\r\n return ({\r\n \"key\": groupId,\r\n \"name\": allTemplateGroupsIds.includes(groupId) ? this.context.getTranslation(\"compliance\", \"TemplateGroupNameAIQuestion\") : this.context.getTranslation(\"compliance\", \"CustomGroupNameAIQuestion\"),\r\n \"startIndex\": startIndex,\r\n \"count\": endIndex - startIndex,\r\n \"level\": 0,\r\n \"isCollapsed\": expandedGroup\r\n })\r\n })\r\n this.groupsCollapsed = groups.map(g => {\r\n return (\r\n {\r\n key: g.key,\r\n isCollapsed: g.isCollapsed\r\n }\r\n )\r\n })\r\n return groups;\r\n }\r\n\r\n render() {\r\n return ({this.context.getTranslation(\"compliance\", this.state.panelTitle)}
\r\n \r\n\r\n {/*Manage button add, edit and delete*/}\r\n \r\n { this.openPanel(\"addAIQuestion\", null) }}\r\n />\r\n { this.openPanel(\"editAIQuestion\", this.state.aiQuestionId) }}\r\n />\r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isProcessing && \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryAIQuestions = refetch\r\n if (loading) return (\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deleteAIQuestion}\r\n />\r\n
)\r\n }\r\n}","import gql from 'graphql-tag';\r\n\r\n\r\nexport const queryAllAICategorizations = gql`query {\r\n getAICategorizations {\r\n id\r\n name\r\n tenantId\r\n }\r\n }`\r\n\r\nexport const queryGetAICategorization = gql`query ent ($id: String) {\r\n getAICategorization (id: $id) {\r\n id\r\n name\r\n userId\r\n tenantId\r\n aiCategorizationList{\r\n id\r\n name\r\n priority\r\n conversationIds\r\n deleted\r\n linkedCategorization\r\n userId\r\n tenantId\r\n }\r\n }\r\n }`\r\n\r\nexport const upsertAICategorization = gql`mutation ent($aiCategorization: AICategorizationInputType){\r\n upsertAICategorization(aiCategorization: $aiCategorization) {\r\n id\r\n text\r\n status\r\n }\r\n }`\r\n\r\nexport const deleteAICategorization = gql`mutation ent ($id: String) {\r\n deleteAICategorization(id: $id) {\r\n id\r\n text\r\n status\r\n }\r\n }`","import React from \"react\";\r\nimport {DetailsList, Selection} from \"office-ui-fabric-react\";\r\n\r\nclass ASCDetailsList extends React.Component {\r\n _selection = new Selection({\r\n onSelectionChanged: (item) => console.log(item, \"all items selectable\"),\r\n });\r\n _selectionOnlyFavorite = new Selection({\r\n canSelectItem: (e, i) => !e.priority,\r\n onSelectionChanged: () => console.log(\"only favorites\"),\r\n });\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n this.props?.selectionAfterMergeContainerIsRenamed?.forEach(e=>{\r\n\r\n this.props.selection.setKeySelected(e.id, true, false)\r\n }) ?? null\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {\r\n this.groupsCollapsed = groupsCollapsed\r\n this.setState({ groupsCollapsed })\r\n }}\r\n groupsCollapsed={this.groupsCollapsed}\r\n />\r\n
\r\n )\r\n }}\r\n \r\n }\r\n\r\n {/*Phrase panel*/}\r\n \r\n {this.props.selection.label == \"favoritesOnly\" ? (\r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default ASCDetailsList","import React, { Component } from \"react\";\r\nimport { Stack, CommandBar, ContextualMenuItemType, Icon, FontSizes } from \"office-ui-fabric-react\";\r\nimport { MyContext } from \"../../../../../context\"\r\n\r\n\r\nexport class MergePivotAccordionHeader extends Component {\r\n\r\n\tstatic contextType = MyContext;\r\n\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t\tthis.state = { mergeParent: this.props.parent }\r\n\t}\r\n\r\n\trender() {\r\n\r\n\t\tconst menuItems = [\r\n\t\t\t{\r\n\t\t\t\tkey: 'Delete',\r\n\t\t\t\thidden: false,\r\n\t\t\t\ticonProps: {\r\n\t\t\t\t\ticonName: 'Delete',\r\n\t\t\t\t},\r\n\t\t\t\ttext: this.context.getTranslation(\"compliance\", \"unlinkWholeContainer\"),\r\n\t\t\t\tdisabled: false,\r\n\t\t\t\tonClick: (e) => {\r\n\t\t\t\t\t// console.log('schiaccio bottone unlink parent', this.props.id, this.props.childrenItems)\r\n\t\t\t\t\tthis.props.updateParentComponentState(this.props.id, this.props.childrenItems)\r\n\t\t\t\t},\r\n\t\t\t}\r\n\t\t]\r\n\t\treturn (\r\n\t\t\t<>\r\n\t\t\t\t e.stopPropagation()}>\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t \r\n\t\t\t\t\t\t \r\n\t\t\t\t
\r\n\t\t\t\r\n\t\t);\r\n\t}\r\n}","import React, { Component } from 'react'\r\nimport { MyContext } from '../../../../context';\r\nimport {\r\n TextField,\r\n DefaultButton,\r\n PrimaryButton,\r\n Stack,\r\n DetailsList,\r\n SelectionMode,\r\n Label,\r\n ScrollablePane,\r\n ScrollbarVisibility,\r\n IconButton,\r\n mergeStyleSets,\r\n ActionButton,\r\n Selection,\r\n FontIcon,\r\n Pivot, PivotItem\r\n} from 'office-ui-fabric-react';\r\nimport * as QueryAICat from \"../AICategorizationQuery\"\r\nimport AlertBar from '../../../CustomComponents/AlertBar';\r\nimport ASCDetailsList from \"./ASCDetailsList\";\r\nimport './EditAICategorization.css'\r\nimport RIAccordion from \"../../../ConversationSafe/Accordion/RIAccordion\";\r\nimport {MergePivotAccordionHeader} from \"./MergePivot/MergePivotAccordionHeader\";\r\nimport {StackItem} from \"office-ui-fabric-react/lib\";\r\n\r\n\r\nexport default class EditAICategorization extends Component {\r\n\r\n static contextType = MyContext\r\n _selection = new Selection({\r\n getKey:(item)=>item.id,\r\n selectionPreservedOnEmptyClick: true,\r\n onSelectionChanged: (item) => console.log(item,'all items selectable')\r\n })\r\n\r\n\r\n\r\n _selectionOnlyFavorite = new Selection({\r\n selectionPreservedOnEmptyClick: true,\r\n canSelectItem: (e, i) => !e.priority,\r\n onSelectionChanged: () => console.log('only favorites')\r\n })\r\n _selectionOnlyNonIgnored = new Selection({\r\n selectionPreservedOnEmptyClick: true,\r\n canSelectItem: (e, i) => !e.deleted,\r\n onSelectionChanged: () => console.log('only non ignored')\r\n })\r\n\r\n selection3 = new Selection()\r\n\r\n //Names of selection arrays\r\n selectionNames = {\r\n addToFavorite: \"addToFavorite\",\r\n removeFromFavorites: \"removeFromFavorites\",\r\n merge: \"merge\",\r\n ignoreCategorization: \"ignoreCategorization\",\r\n removeFromIgnored: \"removeFromIgnored\",\r\n unlink: \"unlink\",\r\n }\r\n\r\n //Names of the input text fields\r\n inputFormNames = {\r\n aiCategorizationName: \"aiCategorizationName\",\r\n newAICategorizationItem: \"newAICategorizationItem\",\r\n mergeAICategorizationName: \"mergeAICategorizationName\"\r\n }\r\n\r\n constructor(props) {\r\n super(props)\r\n\r\n this._selection.label = \"all\";\r\n this._selectionOnlyFavorite.label = \"favoritesOnly\"\r\n this._selectionOnlyNonIgnored.label = \"notIgnoredOnly\"\r\n\r\n const aiCat = this.props.data !== undefined ? this.props.data : null\r\n const aiCategorizationList = aiCat !== null ? aiCat.aiCategorizationList\r\n .sort((a, b) => { return (a === b) ? 0 : a ? -1 : 1; })\r\n .map(e => ({...e, key: e.id}))\r\n : []\r\n this.state = {\r\n selectionForDetailsList: this._selection,\r\n columns: [],\r\n id: aiCat !== null ? aiCat.id : null,\r\n userId: aiCat !== null ? aiCat.userId : \"\",\r\n tenantId: aiCat !== null ? aiCat.tenantId : \"\",\r\n aiCategorizationList: aiCategorizationList,\r\n //list of items to be unlinked from merged categories items\r\n itemsToBeUnlinked: {parent:[],child:[]},\r\n processing: false,\r\n selectionMode: SelectionMode.none,\r\n actionButtonPressed: \"\",\r\n form: {\r\n //The name of Categorization\r\n [this.inputFormNames.aiCategorizationName]: aiCat !== null ? aiCat.name : \"\",\r\n\r\n //Form to add new items by user\r\n //The name of new categorization item in the input field\r\n [this.inputFormNames.newAICategorizationItem]: \"\",\r\n //List of new items that user want to add\r\n aICategorizationItems: [],\r\n //End\r\n\r\n //The name of merged ai categorization\r\n [this.inputFormNames.mergeAICategorizationName]: \"\"\r\n },\r\n selections: {\r\n [this.selectionNames.addToFavorite]: [],\r\n [this.selectionNames.removeFromFavorites]: [],\r\n [this.selectionNames.removeFromIgnored]: [],\r\n [this.selectionNames.merge]: [],\r\n [this.selectionNames.ignoreCategorization]: [],\r\n [this.selectionNames.unlink]: {\r\n parent:[],\r\n child: []\r\n }\r\n },\r\n error: \"\"\r\n };\r\n\r\n this.flattenedLinkedItems = new Set(aiCategorizationList.map(e=>e.linkedCategorization).filter(e=>e!=null).flat())\r\n console.log(\"this.flattenedLinkedItems\", this.flattenedLinkedItems)\r\n this.mergedParentsWithChildren = aiCategorizationList.map((e, i, array) => {\r\n // let onlyParents = array.filter(e => (e.linkedCategorization?.length ?? 0) > 0)\r\n if( (e.linkedCategorization?.length ?? 0) > 0){\r\n return ({\r\n name: e.name,\r\n id: e.id,\r\n count: 0,\r\n children: [...array.filter((j,i,arr) => e.linkedCategorization?.includes(j.id)) ?? false]\r\n })\r\n }\r\n else return null\r\n }).filter(e => e!=null)\r\n console.log(\"this.mergedParentsWithChildren\", this.mergedParentsWithChildren)\r\n }\r\n\r\n componentDidMount() {\r\n this.setState({\r\n columns: [\r\n {\r\n key: 'priority',\r\n name: \"#\",\r\n fieldName: 'priority',\r\n maxWidth: 50,\r\n isResizable: true,\r\n onRender: (item, i) => {\r\n return ++i\r\n },\r\n },\r\n {\r\n key: 'name',\r\n name: this.context.getTranslation(\"compliance\", \"name\"),\r\n isCollapsible:true,\r\n fieldName: 'name',\r\n minWidth: 100,\r\n isSortable: true,\r\n onColumnClick: (ev, column)=>{\r\n let isSortedDescending = column.isSortedDescending;\r\n\r\n // If we've sorted this column, flip it.\r\n if (column.isSorted) {\r\n isSortedDescending = !isSortedDescending;\r\n }\r\n const itemsSortByName = [...this.state.aiCategorizationList].sort((a,b)=>{\r\n return a.name.localeCompare(b.name)\r\n })\r\n if (!isSortedDescending) itemsSortByName.reverse()\r\n this.setState({\r\n aiCategorizationList: itemsSortByName,\r\n columns: this.state.columns.map(col => {\r\n col.isSorted = col.key === column.key;\r\n\r\n if (col.isSorted) {\r\n col.isSortedDescending = isSortedDescending;\r\n }\r\n\r\n return col;\r\n })\r\n\r\n })\r\n },\r\n maxWidth: 200,\r\n isResizable: true,\r\n onRender: (item) => {\r\n return ( \r\n\t\t\t\t\t\t
\r\n\t\t\t\t\t\t{this.props.name}
\r\n\t\t\t\t\t\r\n {item.priority\r\n && !this.state.selections.removeFromFavorites.includes(item.id)\r\n && (\r\n \r\n { \r\n )}\r\n {this.state.selections.removeFromIgnored.includes(item.id) && (\r\n \r\n { \r\n )}\r\n {this.state.selections.addToFavorite.includes(item.id) && (\r\n \r\n { \r\n )}\r\n { this.state.selections.removeFromFavorites.includes(item.id) && (\r\n \r\n { \r\n )}\r\n {this.state.selections.ignoreCategorization.includes(item.id) && (\r\n \r\n { \r\n )}\r\n {this.state.selections.merge.includes(item.id) && (\r\n \r\n { \r\n )}\r\n {item.linkedCategorization && item.linkedCategorization.length > 0 && (\r\n \r\n { \r\n )}\r\n\r\n
\r\n )\r\n }\r\n\r\n renderAddAICategorization = () => {\r\n return (\r\n \r\n \r\n {`${this.context.getTranslation(\"compliance\", \"addNewAICategorization\")} (${this.state.form.aICategorizationItems.length})`}\r\n \r\n \r\n \r\n this.changeName(e, value, this.inputFormNames.newAICategorizationItem)} />\r\n \r\n \r\n \r\n \r\n {this.state.error != \"\" &&\r\n \r\n \r\n {this.state.error}\r\n \r\n \r\n }\r\n
\r\n )\r\n }\r\n\r\n isValid = () => {\r\n return this.state.name !== \"\" && !this.anyActionPressed()\r\n }\r\n\r\n getAction = () => {\r\n const { addToFavorite, merge, ignoreCategorization, removeFromFavorites, removeFromIgnored } = this.state.selections\r\n let dic = {\r\n [this.selectionNames.addToFavorite]: addToFavorite,\r\n [this.selectionNames.removeFromFavorites]: removeFromFavorites,\r\n [this.selectionNames.removeFromIgnored]: removeFromIgnored,\r\n [this.selectionNames.merge]: merge,\r\n [this.selectionNames.ignoreCategorization]: ignoreCategorization\r\n }\r\n for (var k in dic) {\r\n if (dic[k].length > 0) {\r\n return {[k]: dic[k]}\r\n }\r\n }\r\n }\r\n\r\n //Fill the given aiCategorizationItemList with the new items created by the user\r\n prepareAICategorizationList = () => {\r\n let result = this.state.aiCategorizationList.map(e=>{delete e.key;return e});\r\n result.forEach(x=> delete x.__typename)\r\n if (this.state.form.aICategorizationItems.length > 0) {\r\n this.state.form.aICategorizationItems.forEach(el => {\r\n const newItem = {\r\n \"id\": null,\r\n \"name\": el,\r\n \"priority\": true,\r\n \"conversationIds\": [],\r\n \"linkedCategorization\": []\r\n\r\n }\r\n result.push(newItem)\r\n })\r\n }\r\n console.log(result)\r\n return result;\r\n }\r\n\r\n save = () => {\r\n this.setState({ processing: true })\r\n const auth = this.props.auth\r\n var res = this.getAction();\r\n var act = res != undefined ? Object.keys(res)[0] : (this.state.selections.unlink.child ? \"unlink\" : null)\r\n var actList = res != undefined ? Object.values(res)[0] : []\r\n const aiCategorization = {\r\n id: this.state.id,\r\n name: this.state.form.aiCategorizationName,\r\n aICategorizationItemMergedName : this.state.form.mergeAICategorizationName,\r\n userId: this.state.userId,\r\n tenantId: this.state.tenantId,\r\n aiCategorizationList: this.prepareAICategorizationList(),\r\n unlinkChildrenList: this.state.selections.unlink.child,\r\n unlinkParentList: this.state.selections.unlink.parent,\r\n action: act,\r\n actionList: actList\r\n }\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryAICat.upsertAICategorization,\r\n variables: { auth, aiCategorization }\r\n })\r\n .then((result) => {\r\n var state = {}\r\n if (result.data.upsertAICategorization.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshAICat()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.upsertAICategorization.text))\r\n }\r\n this.setState({ ...state, processing: false })\r\n });\r\n }\r\n\r\n onColumnClick = (e, column) => {\r\n const { columns, aiCategorizationList } = this.state;\r\n const newColumns = columns.slice();\r\n const currColumn = newColumns.filter(currCol => column.key === currCol.key)[0];\r\n newColumns.forEach((newCol) => {\r\n if (newCol === currColumn) {\r\n currColumn.isSortedDescending = !currColumn.isSortedDescending;\r\n currColumn.isSorted = true;\r\n } else {\r\n newCol.isSorted = false;\r\n newCol.isSortedDescending = true;\r\n }\r\n });\r\n let key = currColumn.fieldName\r\n let newItems = []\r\n switch (key) {\r\n case \"count\": {\r\n newItems = aiCategorizationList.slice(0).sort(\r\n (a, b) => ((currColumn.isSortedDescending ? a.conversationIds.length < b.conversationIds.length : a.conversationIds.length > b.conversationIds.length) ? 1 : -1));\r\n break;\r\n }\r\n default: {\r\n newItems = aiCategorizationList.slice(0).sort((a, b) => ((currColumn.isSortedDescending ? a[key] < b[key] : a[key] > b[key]) ? 1 : -1));\r\n break;\r\n }\r\n }\r\n this.setState({\r\n columns: newColumns,\r\n aiCategorizationList: newItems,\r\n });\r\n }\r\n\r\n performAction = (act, selection = this._selection) => {\r\n this.setState(prevState => {\r\n return {\r\n ...prevState,\r\n selectionForDetailsList: selection,\r\n actionButtonPressed: act,\r\n selectionMode: SelectionMode.multi,\r\n }\r\n })\r\n }\r\n\r\n\r\n anyActionPressed = () => {\r\n return this.state.actionButtonPressed.length > 0\r\n }\r\n\r\n\r\n storeArrays = (selection) => {\r\n let name = this.state.actionButtonPressed\r\n let resultingArray = selection.getSelection().length > 0 ? selection.getSelection().map(x => x.id) : []\r\n this.setState(prevState => {\r\n return {\r\n ...prevState,\r\n selections: { ...prevState.selections, [name]: resultingArray },\r\n actionButtonPressed: \"\",\r\n selectionMode: SelectionMode.none\r\n }\r\n })\r\n this._selection.setAllSelected(false);\r\n }\r\n\r\n editSelection(newSelection){\r\n this.selection3 = newSelection\r\n }\r\n getSelection(){\r\n return this.selection3\r\n }\r\n\r\n render() {\r\n var classNames = mergeStyleSets({\r\n wrapper: {\r\n height: this.props.height,\r\n position: 'relative',\r\n minHeight: '400px'\r\n },\r\n pane: {\r\n }\r\n });\r\n\r\n return (\r\n \r\n {this.state.form.aICategorizationItems.map(w => {\r\n return (\r\n { this.deleteAICategorizationItem(w) }} disabled={this.props.disabled} /> \r\n {w} \r\n )\r\n })}\r\n
\r\n \r\n this.changeName(e, value, this.inputFormNames.aiCategorizationName)}\r\n required />\r\n {this.state.id !== null &&\r\n \r\n { this.props.closePanel() }}\r\n style={{ marginTop: \"30px\", marginLeft: \"15px\" }}\r\n disabled={this.state.processing}\r\n />\r\n\r\n \r\n
)\r\n }\r\n\r\n addAICategorization = () => {\r\n let newAiCategorizationItemName = this.state.form.newAICategorizationItem\r\n if (newAiCategorizationItemName === \"\") {\r\n this.setState({\r\n error: this.context.getTranslation(\"compliance\", \"errorEmptyKeywords\")\r\n })\r\n } else if (this.state.form.aICategorizationItems.includes(newAiCategorizationItemName)) {\r\n this.setState({\r\n error: this.context.getTranslation(\"compliance\", \"errorDuplicatedKeywords\")\r\n })\r\n } else {\r\n this.setState(prevState => {\r\n return {\r\n ...prevState,\r\n form: { ...prevState.form, newAICategorizationItem: \"\", aICategorizationItems: [...prevState.form.aICategorizationItems, this.state.form.newAICategorizationItem] }\r\n }\r\n })\r\n }\r\n }\r\n\r\n isActionDisabled = (name) => {\r\n const { addToFavorite, removeFromFavorites, merge, ignoreCategorization, unlink } = this.state.selections\r\n let arr = []\r\n let dic = {\r\n [this.selectionNames.addToFavorite]: addToFavorite,\r\n [this.selectionNames.merge]: merge,\r\n [this.selectionNames.removeFromFavorites]: removeFromFavorites,\r\n [this.selectionNames.ignoreCategorization]: ignoreCategorization,\r\n [this.selectionNames.unlink]: unlink.child\r\n }\r\n for (var k in dic) {\r\n if (k != name)\r\n arr.push(...dic[k])\r\n }\r\n\r\n return arr.length > 0\r\n }\r\n\r\n\r\n deleteAICategorizationItem = (value) => {\r\n this.setState(prevState => {\r\n return {\r\n ...prevState,\r\n error: \"\",\r\n form: { ...prevState.form, aICategorizationItems: prevState.form.aICategorizationItems.filter(ai => ai != value) }\r\n }\r\n })\r\n }\r\n\r\n changeName = (e, value, fieldName, selection) => {\r\n\r\n this.setState(prevState => {\r\n return {\r\n ...prevState,\r\n selectionAfterMergeContainerIsRenamed: selection?.getSelection() ?? [],\r\n form: { ...prevState.form, [fieldName]: value }\r\n }\r\n })\r\n }\r\n\r\n}","import React, { Component } from 'react';\r\nimport { MyContext } from '../../../../context';\r\nimport EditAICategorization from './EditAICategorization';\r\nimport { Spinner, MessageBar, MessageBarType } from 'office-ui-fabric-react';\r\nimport { Query } from \"react-apollo\";\r\nimport * as QueryAICat from \"../AICategorizationQuery\"\r\n\r\n\r\nexport default class EditAICategorizationContainer extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n\r\n };\r\n\r\n }\r\n\r\n render() {\r\n const { auth, id, apol, hidePanel } = this.props\r\n return (\r\n {this.renderAddAICategorization()}\r\n
\r\n\r\n }\r\n {this.state.id !== null &&\r\n \r\n {this.state.aiCategorizationList.length <= 0 &&\r\n
\r\n }\r\n\r\n\r\n {/*FOOTER BUTTONS*/}\r\n \r\n\r\n
\r\n }\r\n \r\n\r\n \r\n \r\n {/*Buttons*/}\r\n {!this.anyActionPressed() && (\r\n \r\n {this.state.actionButtonPressed == this.selectionNames.merge && (\r\n \r\n (\r\n this.changeName(e, value, this.inputFormNames.mergeAICategorizationName, this._selection)\r\n )}\r\n />\r\n )}\r\n \r\n \r\n {this.context.getTranslation(\"compliance\", \"confirmAction\")}\r\n \r\n \r\n )}\r\n \r\n e.id}\r\n editSelection={this.editSelection}\r\n items={this.state.aiCategorizationList.filter(e => !e.deleted)\r\n // .sort((a,b)=>b.conversationIds.length-a.conversationIds.length)\r\n }\r\n columns={this.state.columns}\r\n // setFatherSelection={(selection)=>this.setState({selectionForDetailsList:selection})}\r\n selectionMode={this.state.selectionMode}\r\n selectionAfterMergeContainerIsRenamed={this.state.selectionAfterMergeContainerIsRenamed}\r\n selectionPreservedOnEmptyClick\r\n selection={this.state.selectionForDetailsList}\r\n >\r\n \r\n\r\n\r\n {/*{this.state.selectionForDetailsList.label == \"favoritesOnly\" ?*/}\r\n {/* !e.deleted)}*/}\r\n {/* columns={this.state.columns}*/}\r\n {/* selectionMode={this.state.selectionMode}*/}\r\n {/* selection={this._selectionOnlyFavorite}*/}\r\n {/*/> : null}*/}\r\n {/* {this.state.selectionForDetailsList.label == \"all\" ?*/}\r\n {/* !e.deleted)}*/}\r\n {/* columns={this.state.columns}*/}\r\n {/* selectionMode={this.state.selectionMode}*/}\r\n {/* selection={this._selection}*/}\r\n {/*/> : null*/}\r\n {/*}*/}\r\n \r\n {/*FAVORITES*/}\r\n \r\n {!this.anyActionPressed() && (\r\n \r\n \r\n \r\n {this.context.getTranslation(\"compliance\", \"confirmAction\")}\r\n \r\n \r\n )}\r\n \r\n e.priority)}\r\n columns={this.state.columns}\r\n selectionMode={this.state.selectionMode}\r\n selection={this._selection}/>\r\n \r\n \r\n {/*IGNORED PIVOT ↓↓↓↓↓↓ */}\r\n \r\n {!this.anyActionPressed() && (\r\n \r\n \r\n \r\n {this.context.getTranslation(\"compliance\", \"confirmAction\")}\r\n \r\n \r\n )}\r\n \r\n {\r\n return e.deleted && ![...this.flattenedLinkedItems].includes(e.id)\r\n })}\r\n columns={this.state.columns}\r\n selectionMode={this.state.selectionMode}\r\n selection={this._selection}/>\r\n \r\n \r\n {/*FAVORITES PIVOT ↓↓↓↓↓↓ */}\r\n \r\n \r\n\r\n\r\n
\r\n \r\n {\r\n console.log('tasto di add to favorites', this._selectionOnlyFavorite.label)\r\n this.performAction(this.selectionNames.addToFavorite, this._selectionOnlyFavorite)\r\n }}>\r\n {this.context.getTranslation(\"compliance\", \"addToFavorite\")}\r\n \r\n\r\n this.performAction(this.selectionNames.ignoreCategorization, this._selectionOnlyNonIgnored)}>\r\n {this.context.getTranslation(\"compliance\", \"ignoreCategorization\")}\r\n \r\n\r\n this.performAction(this.selectionNames.merge)}>\r\n {this.context.getTranslation(\"compliance\", \"mergeCategorization\")}\r\n \r\n
)}\r\n {this.anyActionPressed() && (\r\n \r\n this.performAction(this.selectionNames.removeFromFavorites)}>\r\n {this.context.getTranslation(\"compliance\", \"removeFromFavorites\")}\r\n \r\n
)}\r\n {this.anyActionPressed() && (\r\n \r\n this.performAction(this.selectionNames.removeFromIgnored)}>\r\n {this.context.getTranslation(\"compliance\", \"removeFromList\")}\r\n \r\n
)}\r\n {this.anyActionPressed() && (\r\n \r\n {this.anyActionPressed() && (\r\n \r\n \r\n {\r\n this.setState(prevState=>{\r\n return {\r\n ...prevState,\r\n selections: { ...prevState.selections, unlink: this.state.itemsToBeUnlinked },\r\n actionButtonPressed: \"\",\r\n\r\n }\r\n })\r\n }}>\r\n {this.context.getTranslation(\"compliance\", \"confirmAction\")}\r\n \r\n \r\n )}\r\n\r\n ({\r\n header: (c.id)}\r\n name={e.name}\r\n updateParentComponentState={(unlinkParent, unlinkChildren)=>{\r\n this.setState({\r\n actionButtonPressed: this.selectionNames.unlink,\r\n itemsToBeUnlinked:{\r\n parent: [ ...new Set([...this.state.itemsToBeUnlinked.parent, unlinkParent])],\r\n child: [...new Set([...this.state.itemsToBeUnlinked.child, ...unlinkChildren])]\r\n }\r\n })\r\n\r\n }}\r\n />),\r\n content: (
\r\n \r\n {\r\n e.children.map( (child, i) => {\r\n return (\r\n {child.name} ({child.conversationIds.length}) \r\n \r\n {\r\n this.setState({\r\n actionButtonPressed: this.selectionNames.unlink,\r\n itemsToBeUnlinked:{\r\n parent: [ ...new Set([...this.state.itemsToBeUnlinked.parent, e.id])],\r\n child: [...this.state.itemsToBeUnlinked.child, child.id]\r\n }\r\n })\r\n console.log(\"this will be unlinked\") }}\r\n disabled={this.state.itemsToBeUnlinked.child.includes(child.id)} />\r\n \r\n )\r\n })\r\n }\r\n
) }) )}>\r\n \r\n \r\n {id !== null && (
)\r\n }\r\n}","import { DetailsList, MarqueeSelection, Selection, SelectionMode } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\n\r\nexport default class AICategorizationList extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props);\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.props.selectAICat(this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : null)\r\n }\r\n });\r\n }\r\n\r\n getKey = (item, index) => {\r\n return item.key;\r\n }\r\n\r\n render() {\r\n const columns = [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"name\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n ]\r\n\r\n return (\r\n \r\n {\r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getAICategorization == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noData\")}\r\n )\r\n }\r\n return (\r\n
\r\n )\r\n }\r\n {id === null &&\r\n \r\n
\r\n )\r\n }\r\n\r\n clearAlert = () => {\r\n if (this.state.alertMessagePanel !== \"\") {\r\n this.setState({\r\n alertMessagePanel: \"\"\r\n })\r\n }\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this.state.categorizationId !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectCategorization\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n deleteCategorization = () => {\r\n this.setState({ hideDialogDelete: true, isProcessing: true })\r\n if (this.state.categorizationId !== null) {\r\n const id = this.state.categorizationId\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryAICat.deleteAICategorization,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.deleteAICategorization.status !== \"ok\") {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", result.data.deleteAICategorization.text),\r\n alertType: result.data.deleteAICategorization.status,\r\n isProcessing: false\r\n })\r\n } else {\r\n this.setState({\r\n isProcessing: false\r\n })\r\n this.refreshAICat();\r\n }\r\n });\r\n }\r\n }\r\n\r\n selectAICat = (id) => {\r\n this.setState({\r\n categorizationId: id,\r\n warningMessage: \"\"\r\n });\r\n }\r\n\r\n setMessageError = (message) => {\r\n this.setState({\r\n alertMessagePanel: message\r\n })\r\n }\r\n\r\n\r\n render() {\r\n const { auth } = this.props\r\n return (\r\n {this.context.getTranslation(\"compliance\", this.state.panelTitle)}
\r\n \r\n {(
\r\n )\r\n }\r\n\r\n}\r\n","import React, { Component } from 'react';\r\nimport { IconButton, Stack, TextField, Dropdown, Spinner, Toggle } from 'office-ui-fabric-react';\r\nimport { MyContext } from '../../../../context';\r\nimport { queryAllAdherencePhrases } from \"../../AdherencePhrases/AdherencePhrasesQuery\"\r\nimport { queryAllAIQuestions } from '../../AIQuestion/AIQuestionQuery';\r\nimport { queryAllAdherencePhrases as queryAllAIAdherencePhrases } from \"../../AIAdherencePhrases/AIAdherencePhrasesQuery\"\r\nimport AlertBar from '../../../CustomComponents/AlertBar';\r\nimport { Query } from 'react-apollo';\r\nimport ScorecardFolding from '../../../DetailView/DetailPivot/PivotElements/QualityManagement/ScorecardFolding';\r\n\r\nexport default class EditScorecardSectionEvaluation extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n\r\n render() {\r\n const { indexEvaluation, evaluation } = this.props\r\n const isOpen = this.props.selectedKeyEvaluation.includes(indexEvaluation)\r\n\r\n return (\r\n \r\n {/*Manage button add and edit */}\r\n \r\n this.openPanel(\"create\")}\r\n />\r\n { this.openPanel(\"edit\", this.state.categorizationId) }}\r\n />\r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isProcessing && \r\n \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refreshAICategorization = refetch\r\n if (loading || networkStatus === NetworkStatus.refetch) return (\r\n \r\n }\r\n\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deleteCategorization}\r\n />\r\n
\r\n )}\r\n \r\n \r\n {\r\n this.props.updateSelectedKeyEvaluation([...this.props.selectedKeyEvaluation, indexEvaluation])\r\n }}\r\n close={() => {\r\n this.props.updateSelectedKeyEvaluation(this.props.selectedKeyEvaluation.filter(s => s !== indexEvaluation))\r\n }}\r\n />\r\n this.props.deleteEvaluation(indexEvaluation)}\r\n />\r\n {isOpen &&\r\n \r\n {isOpen &&
\r\n )\r\n }\r\n}","import React, { Component } from 'react';\r\nimport { Separator, IconButton, Stack, TextField, Dropdown, PrimaryButton, Checkbox, Button, CommandBarButton } from 'office-ui-fabric-react';\r\nimport { MyContext } from '../../../../context';\r\nimport ScorecardFolding from '../../../DetailView/DetailPivot/PivotElements/QualityManagement/ScorecardFolding';\r\nimport EditScorecardSectionEvaluation from './EditScorecardSectionEvaluation';\r\n\r\nexport default class EditScorecardSection extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n selectedKeyEvaluation: [],\r\n selectCriteria: null\r\n }\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n if (prevProps.section.evaluationItems.length !== this.props.section.evaluationItems.length) {\r\n this.setState({ selectedKeyEvaluation: [this.props.section.evaluationItems.length - 1] })\r\n }\r\n }\r\n\r\n deleteSection = (e) => {\r\n this.props.updateSection(null, this.props.indexSection, \"delete\")\r\n }\r\n\r\n deleteEvaluation = (indexEvaluation) => {\r\n const newSection = {\r\n ...this.props.section,\r\n evaluationItems: this.props.section.evaluationItems.filter((item, j) => indexEvaluation !== j)\r\n }\r\n this.props.updateSection(newSection, this.props.indexSection, \"update\")\r\n }\r\n\r\n updateSectionField = (e, field) => {\r\n const newSection = { ...this.props.section, [field]: e.target.value }\r\n this.props.updateSection(newSection, this.props.indexSection, \"update\")\r\n }\r\n\r\n updateEvaluationField = (value, indexEvaluation, field) => {\r\n const newSection = {\r\n ...this.props.section,\r\n evaluationItems: this.props.section.evaluationItems.map(\r\n (item, j) => {\r\n if (j === indexEvaluation) {\r\n if (field === \"itemType\") {\r\n return { ...item, itemType: value, itemId: \"\", itemValue: \"\" }\r\n } else {\r\n return { ...item, [field]: value }\r\n }\r\n } else {\r\n return item\r\n }\r\n }\r\n )\r\n }\r\n this.props.updateSection(newSection, this.props.indexSection, \"update\")\r\n }\r\n\r\n render() {\r\n const isChecked = this.props.checkBoxSelected === null ? false : this.props.checkBoxSelected == this.props.indexSection\r\n const { section, indexSection } = this.props\r\n const isOpen = this.props.selectedKeySection.includes(this.props.indexSection)\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"evaluation\")}
\r\n }\r\n {!isOpen &&\r\n{evaluation.itemType == \"\" ? this.context.getTranslation(\"compliance\", \"evaluation\") : this.context.getTranslation(\"compliance\", evaluation.itemType)}
\r\n }\r\n\r\n \r\n \r\n { this.props.updateEvaluationField(item.key, indexEvaluation, \"itemType\") }}\r\n options={this.props.availableAreas}\r\n />\r\n \r\n \r\n {evaluation.itemType !== \"\" &&\r\n \r\n \r\n \r\n \r\n {evaluation.itemType === \"AdherencePhrases\" &&\r\n \r\n {({ loading, error, data, refetch }) => {\r\n if (loading) return {\r\n this.props.updateEvaluationField(item.key, indexEvaluation, \"itemId\")\r\n }}\r\n options={adherencePhrases}\r\n />\r\n )\r\n }}\r\n \r\n }\r\n {evaluation.itemType === \"AIQuestions\" &&\r\n \r\n {({ loading, error, data, refetch }) => {\r\n if (loading) return {\r\n this.props.updateEvaluationField(item.key, indexEvaluation, \"itemId\")\r\n }}\r\n options={aIQuestions}\r\n />\r\n )\r\n }}\r\n }\r\n {evaluation.itemType === \"AIAdherencePhrases\" &&\r\n \r\n {({ loading, error, data, refetch }) => {\r\n if (loading) return {\r\n this.props.updateEvaluationField(item.key, indexEvaluation, \"itemId\")\r\n }}\r\n options={adherencePhrases}\r\n />\r\n )\r\n }}\r\n \r\n }\r\n {evaluation.itemType === \"QMQuestions\" &&\r\n this.props.updateEvaluationField(e.target.value, indexEvaluation, \"itemValue\")}\r\n />\r\n }\r\n {evaluation.itemType === \"ManualQMQuestions\" &&\r\n this.props.updateEvaluationField(e.target.value, indexEvaluation, \"itemValue\")}\r\n />\r\n }\r\n \r\n \r\n {\r\n this.props.updateEvaluationField(parseFloat(newValue), indexEvaluation, \"points\")\r\n }}\r\n />\r\n \r\n \r\n \r\n {(evaluation.itemType === \"AIQuestions\" || evaluation.itemType === \"QMQuestions\" || evaluation.itemType === \"ManualQMQuestions\") &&\r\n \r\n {\r\n this.props.updateEvaluationField(checked, indexEvaluation, \"awareOfPoints\")\r\n }}\r\n />\r\n \r\n }\r\n }\r\n
}\r\n {this.context.getTranslation(\"compliance\", \"section\")}
\r\n{section.name != \"\" ? section.name : `${this.context.getTranslation(\"compliance\", \"section\")}`}
\r\n\r\n this.props.addEvaluation(this.props.section, this.props.indexSection)} />\r\n
}\r\n \r\n this.updateSectionField(e, \"name\")}\r\n />\r\n
\r\n {section.evaluationItems.length > 0 &&\r\n \r\n {\r\n //MANAGE EVALUATIONS\r\n section.evaluationItems.map((evaluation, indexEvaluation) => {\r\n return (\r\n {\r\n this.setState({ selectedKeyEvaluation })\r\n }}\r\n />\r\n )\r\n })\r\n\r\n }\r\n\r\n
\r\n\r\n }\r\n\r\n \r\n {\r\n return {\r\n let newItems = this.props.settingItems.map((s, index) => {\r\n if (index === i) {\r\n s.name = e.target.value\r\n }\r\n return s\r\n })\r\n this.props.updateSettingItems(newItems)\r\n }\r\n }\r\n />\r\n }\r\n },\r\n {\r\n key: 'minRange',\r\n fieldName: 'minRange',\r\n name: this.context.getTranslation(\"settings\", \"ticketFrom\") + \" %\",\r\n minWidth: 50,\r\n maxWidth: 50,\r\n isResizable: true,\r\n onRender: (item) => {\r\n return {\r\n let newItems = this.props.settingItems.map((s, index) => {\r\n if (index === i) {\r\n s.maxRange = e.target.value\r\n this.props.settingItems[index - 1].minRange = parseInt(e.target.value) + 1\r\n }\r\n return s\r\n })\r\n this.props.updateSettingItems(newItems)\r\n }\r\n }\r\n />\r\n }\r\n }\r\n },\r\n {\r\n key: 'color',\r\n fieldName: 'color',\r\n name: this.context.getTranslation(\"compliance\", \"color\"),\r\n minWidth: 30,\r\n maxWidth: 30,\r\n isResizable: true,\r\n onRender: (item, i) => {\r\n return {\r\n this.setState({ showDialogColor: true, id: i, selectedColor: item.color })\r\n }}\r\n >
\r\n }\r\n },\r\n {\r\n key: 'actions',\r\n name: '',\r\n fieldName: 'actions',\r\n minWidth: 100,\r\n maxWidth: 100,\r\n isResizable: false,\r\n onRender: (item) => {\r\n return (\r\n \r\n {item.minRange}\r\n
\r\n }\r\n },\r\n {\r\n key: 'maxRange',\r\n fieldName: 'maxRange',\r\n name: this.context.getTranslation(\"settings\", \"ticketTo\") + \" %\",\r\n minWidth: 50,\r\n maxWidth: 50,\r\n isResizable: true,\r\n onRender: (item, i) => {\r\n if (i === 0) {\r\n return \r\n {item.maxRange}\r\n
\r\n } else {\r\n return \r\n {this.state.processingVersion &&
\r\n\r\n )\r\n }\r\n}","import React, { Component } from 'react';\r\nimport { Spinner } from 'office-ui-fabric-react';\r\nimport { MyContext } from '../../../../context';\r\nimport EditScorecard from './EditScorecard';\r\nimport { queryScorecard } from \"../AIQualityManagementQuery\"\r\nimport { Query } from 'react-apollo';\r\nimport AlertBar from '../../../CustomComponents/AlertBar';\r\n\r\nexport default class EditScorecardContainer extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n render() {\r\n const { auth, id, apol, hidePanel, userRules } = this.props\r\n return (\r\n \r\n
}\r\n {!this.state.processingVersion && \r\n {this.state.masterItemId !== null &&\r\n \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) return this.change(e, \"name\")} required />\r\n this.change(e, \"description\")} />\r\n \r\n {this.state.alertAutomatedEvaluation && {\r\n this.setState({ alertAutomatedEvaluation: false })\r\n }\r\n }}\r\n primaryButtonProps={{\r\n children: this.context.getTranslation(\"common\", \"yes\"),\r\n onClick: () => {\r\n let availableAreas = []\r\n let checked = !this.state.automatedEvaluation\r\n if (!checked) {\r\n availableAreas = this.state.allAvailableAreas.filter(area => area.key === \"QMQuestions\")\r\n } else {\r\n availableAreas = this.state.allAvailableAreas\r\n }\r\n this.setState({\r\n automatedEvaluation: checked,\r\n selectedOtherVersion: false,\r\n availableAreas,\r\n sections: [],\r\n alertAutomatedEvaluation: false\r\n })\r\n }\r\n }}\r\n >\r\n {this.context.getTranslation(\"compliance\", \"alertAutomatedEvaluation\")}\r\n }\r\n {\r\n if (this.state.sections.length > 0) {\r\n this.setState({ alertAutomatedEvaluation: true })\r\n } else {\r\n let availableAreas = []\r\n if (!checked) {\r\n availableAreas = this.state.allAvailableAreas.filter(area => area.key === \"QMQuestions\")\r\n } else {\r\n availableAreas = this.state.allAvailableAreas\r\n }\r\n this.setState({\r\n automatedEvaluation: checked,\r\n selectedOtherVersion: false,\r\n availableAreas,\r\n sections: []\r\n })\r\n }\r\n }}\r\n />\r\n \r\n \r\n \r\n {\r\n this.setState({\r\n selectedKey: [...this.state.selectedKey, \"elements\"]\r\n })\r\n }}\r\n close={() => {\r\n this.setState({\r\n selectedKey: this.state.selectedKey.filter(s => s !== \"elements\")\r\n })\r\n }}\r\n />\r\n \r\n \r\n \r\n {this.state.selectedKey.includes(\"elements\") && \r\n \r\n \r\n \r\n \r\n {\r\n //MANAGE SECTIONS\r\n this.state.sections.map((section, indexSection) => {\r\n return this.sortSections(section, indexSection, direction)}\r\n addEvaluation={(section, indexSection, criteria) => this.addEvaluation(section, indexSection, criteria)}\r\n indexSection={indexSection}\r\n isLastSection={indexSection === this.state.sections.length - 1}\r\n availableAreas={this.state.availableAreas}\r\n updateSection={(sec, index, action) => {\r\n let newSections = null\r\n if (action === \"delete\") {\r\n newSections = this.state.sections.filter((item, i) => i !== index)\r\n }\r\n if (action === \"update\") {\r\n newSections = this.state.sections.map((item, i) => {\r\n if (i === index) {\r\n return sec\r\n } else {\r\n return item\r\n }\r\n })\r\n }\r\n this.setState({ sections: newSections, selectedOtherVersion: false })\r\n }}\r\n selectedKeySection={this.state.selectedKeySection}\r\n updateSelectedKeySection={(selectedKeySection) => {\r\n this.setState({ selectedKeySection })\r\n }}\r\n />\r\n })\r\n }\r\n \r\n }\r\n \r\n \r\n {\r\n this.setState({\r\n selectedKey: [...this.state.selectedKey, \"settings\"]\r\n })\r\n }}\r\n close={() => {\r\n this.setState({\r\n selectedKey: this.state.selectedKey.filter(s => s !== \"settings\")\r\n })\r\n }}\r\n />\r\n \r\n\r\n \r\n \r\n \r\n {this.state.selectedKey.includes(\"settings\") &&\r\n \r\n \r\n {\r\n this.setState((prevState) => {\r\n const lastItem = prevState.settingItems[prevState.settingItems.length - 1];\r\n const newSettingItem = {\r\n name: \"\",\r\n position: prevState.settingItems.length,\r\n maxRange: 1,\r\n minRange: 0,\r\n color: \"#ffffff\"\r\n };\r\n let newSettings = prevState.settingItems.map(x => ({ ...x, minRange: x.position === lastItem.position ? 1 : x.minRange }))\r\n return {\r\n settingItems: [...newSettings, newSettingItem]\r\n };\r\n });\r\n }}\r\n />\r\n \r\n this.setState({ settingItems })}\r\n deleteSettingItem={(deletedItem) => {\r\n let newItems = this.state.settingItems.filter(s => s.position !== deletedItem.position)\r\n newItems = newItems.map((item, i) => {\r\n return {\r\n ...item,\r\n position: i,\r\n maxRange: item.position == deletedItem.position + 1 ? deletedItem.maxRange : item.maxRange,\r\n minRange: deletedItem.position == this.state.settingItems.length - 1 && item.position == newItems.length - 1 ? deletedItem.minRange : item.minRange\r\n };\r\n });\r\n this.setState({ settingItems: newItems })\r\n }}\r\n />\r\n \r\n }\r\n {/*FOOTER BUTTONS*/}\r\n \r\n { this.props.hidePanel() }}\r\n style={{ marginTop: \"30px\", marginLeft: \"15px\" }}\r\n disabled={this.state.processing}\r\n />\r\n {(!this.state.selectedOtherVersion || this.state.id === this.state.selectedVersion) &&\r\n this.save(false, false)}\r\n style={{ marginTop: \"30px\", marginLeft: \"15px\" }}\r\n disabled={!this.isValid() || this.state.processing}\r\n />\r\n }\r\n {(!this.state.selectedOtherVersion || this.state.id === this.state.selectedVersion) &&\r\n this.state.id !== null &&\r\n this.save(false, true)}\r\n style={{ marginTop: \"30px\", marginLeft: \"15px\" }}\r\n disabled={!this.isValid() || this.state.processing}\r\n />\r\n }\r\n {(this.props.userRules.userTemplateAllowed && (!this.state.selectedOtherVersion || this.state.id === this.state.selectedVersion)) &&\r\n this.save(true, false)}\r\n style={!this.isValid() || this.state.processing ?\r\n { marginTop: \"30px\", marginLeft: \"15px\" } :\r\n { marginTop: \"30px\", marginLeft: \"15px\", background: \"red\", color: \"white\" }}\r\n allowDisabledFocus={true}\r\n disabled={!this.isValid() || this.state.processing}\r\n />\r\n }\r\n {this.state.selectedOtherVersion && this.state.id !== this.state.selectedVersion &&\r\n \r\n
}\r\n \r\n {versions.length > 0 &&\r\n
\r\n )\r\n }}\r\n }\r\n {this.context.getTranslation(\"compliance\", \"criteria\")}
\r\n{this.context.getTranslation(\"compliance\", \"scorecardSettings\")}
\r\n\r\n {id !== null && \r\n {({ loading, error, data }) => {\r\n if (loading) { return
\r\n )\r\n }\r\n}","/* eslint-disable no-underscore-dangle */\r\nimport React, { Component } from 'react'\r\nimport { Stack, CommandBarButton, Panel, PanelType, Spinner, MarqueeSelection, DetailsList, SelectionMode, Selection, GroupHeader } from 'office-ui-fabric-react';\r\nimport { MyContext } from '../../../context';\r\nimport SafetyDialog from '../../CustomComponents/SafetyDialog';\r\nimport AlertBar from '../../CustomComponents/AlertBar';\r\nimport { queryAllScorecards, deleteScorecardQuery } from \"./AIQualityManagementQuery\";\r\nimport { Query } from 'react-apollo';\r\nimport { NetworkStatus } from 'apollo-boost';\r\nimport EditScorecardContainer from './Panels/EditScorecardContainer';\r\n\r\nexport default class AIQualityManagement extends Component {\r\n\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n\r\n this.selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.setState({\r\n scorecardId: this.selection.getSelection().length > 0 ? this.selection.getSelection()[0].id : null,\r\n warningMessage: \"\",\r\n });\r\n }\r\n });\r\n\r\n this.state = {\r\n isProcessing: false,\r\n hideDialogDelete: true,\r\n warningMessage: \"\",\r\n alertType: \"warning\",\r\n scorecardId: null,\r\n isPanelOpen: false,\r\n panelTitle: \"\",\r\n action: \"create\",\r\n alertMessagePanel: \"\",\r\n scorecards: [],\r\n columns: []\r\n };\r\n }\r\n groupsCollapsed = []\r\n refetchQueryScorecards = null\r\n\r\n componentDidMount() {\r\n const columns = [\r\n {\r\n key: 'name',\r\n name: this.context.getTranslation(\"compliance\", \"name\"),\r\n fieldName: 'name',\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n },\r\n {\r\n key: 'description',\r\n name: this.context.getTranslation(\"compliance\", \"description\"),\r\n fieldName: 'description',\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n },\r\n {\r\n key: \"automatedEvaluation\",\r\n name: this.context.getTranslation(\"compliance\", \"evaluationType\"),\r\n fieldName: \"automatedEvaluation\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true,\r\n onRender: (item) => {\r\n return {item.automatedEvaluation ?\r\n this.context.getTranslation(\"compliance\", \"automated\") :\r\n this.context.getTranslation(\"compliance\", \"manual\")}\r\n \r\n }\r\n },\r\n {\r\n key: \"version\",\r\n name: this.context.getTranslation(\"compliance\", \"version\"),\r\n fieldName: \"version\",\r\n minWidth: 60,\r\n maxWidth: 60,\r\n isResizable: true\r\n },\r\n {\r\n key: \"creator\",\r\n name: this.context.getTranslation(\"compliance\", \"creator\"),\r\n fieldName: \"creator\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n },\r\n {\r\n key: \"creationDate\",\r\n name: this.context.getTranslation(\"compliance\", \"creationDate\"),\r\n fieldName: \"creationDate\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n },\r\n {\r\n key: \"lastUpdateDate\",\r\n name: this.context.getTranslation(\"compliance\", \"lastUpdateDate\"),\r\n fieldName: \"lastUpdateDate\",\r\n minWidth: 100,\r\n maxWidth: 150,\r\n isResizable: true\r\n }\r\n ]\r\n this.setState({ columns })\r\n }\r\n\r\n getHeaderPanel = () => {\r\n return (\r\n \r\n {\r\n if (this.state.alertMessagePanel !== \"\")\r\n this.setState({ alertMessagePanel: \"\" })\r\n }}\r\n />\r\n
\r\n )\r\n }\r\n\r\n openPanel = (type, scorecardId = null) => {\r\n if (type === \"create\") {\r\n this.setState({\r\n panelTitle: \"createScorecardPanel\",\r\n action: \"create\",\r\n isPanelOpen: true,\r\n warningMessage: \"\"\r\n })\r\n } else {\r\n if (scorecardId !== null) {\r\n this.setState({\r\n panelTitle: \"editScorecardPanel\",\r\n action: \"edit\",\r\n isPanelOpen: true\r\n })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectScorecard\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n }\r\n\r\n renderItemColumn = (item, index, column) => {\r\n //console.log(item, index, column)\r\n const fieldName = column.fieldName\r\n switch (fieldName) {\r\n case \"automatedEvaluation\":\r\n return {item[fieldName] ? this.context.getTranslation(\"common\", \"yes\") : this.context.getTranslation(\"common\", \"no\")}\r\n case \"creationDate\": {\r\n let date = new Date(item[fieldName])\r\n return {date.toLocaleString()}\r\n }\r\n case \"lastUpdateDate\": {\r\n let date = new Date(item[fieldName])\r\n return {date.toLocaleString()}\r\n }\r\n default: return {item[fieldName]}\r\n }\r\n }\r\n\r\n\r\n\r\n deleteScorecard = () => {\r\n this.setState({ hideDialogDelete: true, isProcessing: true })\r\n if (this.state.scorecardId !== null) {\r\n //console.log(\"delete scorecard\", scorecardId)\r\n this.props.apol.mutate({\r\n mutation: deleteScorecardQuery,\r\n variables: { id: this.state.scorecardId }\r\n }).then((result) => {\r\n if (result.data.deleteScorecard.status !== \"ok\") {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", result.data.deleteScorecard.text),\r\n alertType: result.data.deleteScorecard.status,\r\n isProcessing: false\r\n })\r\n } else {\r\n this.setState({ isProcessing: false })\r\n this.refetchQueryScorecards();\r\n }\r\n\r\n });\r\n }\r\n }\r\n\r\n render() {\r\n return \r\n {this.context.getTranslation(\"compliance\", this.state.panelTitle)}\r\n
\r\n \r\n {/*Manage button add, edit and delete*/}\r\n \r\n this.openPanel(\"create\")}\r\n />\r\n { this.openPanel(\"edit\", this.state.scorecardId) }}\r\n />\r\n {\r\n if (this.state.scorecardId !== null)\r\n this.setState({ hideDialogDelete: false })\r\n else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectScorecard\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }}\r\n />\r\n \r\n {/*SafetyDialog for delete*/}\r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deleteScorecard}\r\n />\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n {this.state.isProcessing && \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryScorecards = refetch;\r\n if (loading || networkStatus === NetworkStatus.refetch) return (\r\n {\r\n this.setState({ isPanelOpen: false, alertMessagePanel: \"\" })\r\n }}\r\n isFooterAtBottom={false}\r\n onRenderHeader={this.getHeaderPanel}\r\n type={PanelType.medium}\r\n >\r\n { this.setState({ isPanelOpen: false, alertMessagePanel: \"\" }) }}\r\n updateScorecardId={(scorecardId) => { this.setState({ scorecardId }) }}\r\n id={this.state.action === \"create\" ? null : this.state.scorecardId}\r\n refreshScorecards={() => { this.refetchQueryScorecards() }}\r\n userRules={this.props.userRules}\r\n setMessageError={(message) => { this.setState({ alertMessagePanel: message }) }}\r\n />\r\n \r\n
\r\n }\r\n}\r\n","import { DetailsList, MarqueeSelection, Selection, SelectionMode, GroupHeader } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { MyContext } from '../../../context';\r\n\r\nexport default class AIAssistantsListView extends Component {\r\n static contextType = MyContext\r\n _selection: Selection;\r\n\r\n constructor(props) {\r\n super(props);\r\n this._selection = new Selection({\r\n onSelectionChanged: () => {\r\n this.props.selectAIAssistant(this._selection.getSelection().length > 0 ? this._selection.getSelection()[0].id : null)\r\n }\r\n });\r\n }\r\n\r\n _getKey = (item, index) => {\r\n return item.key;\r\n }\r\n\r\n render() {\r\n var columns = [\r\n { key: 'name', name: this.context.getTranslation(\"compliance\", \"detailPolicyName\"), fieldName: 'name', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'description', name: this.context.getTranslation(\"compliance\", \"detailPolicyDescription\"), fieldName: 'description', minWidth: 100, maxWidth: 200, isResizable: true },\r\n { key: 'question', name: this.context.getTranslation(\"configuration\", \"QuestionColumn\"), fieldName: 'question', minWidth: 100, maxWidth: 200, isResizable: true },\r\n {\r\n key: 'active',\r\n name: this.context.getTranslation(\"compliance\", \"detailPolicyActive\"),\r\n fieldName: 'active',\r\n minWidth: 50,\r\n maxWidth: 80,\r\n onRender: (item: IDocument) => {\r\n return {item.active ? this.context.getTranslation(\"common\", \"yes\") : this.context.getTranslation(\"common\", \"no\")}\r\n }\r\n },\r\n {\r\n key: 'logInteraction',\r\n name: this.context.getTranslation(\"compliance\", \"logInteraction\"),\r\n fieldName: 'logInteraction',\r\n minWidth: 50,\r\n maxWidth: 100,\r\n onRender: (item: IDocument) => {\r\n return {item.logInteraction ? this.context.getTranslation(\"common\", \"yes\") : this.context.getTranslation(\"common\", \"no\")}\r\n }\r\n }, \r\n {\r\n key: 'automated',\r\n name: this.context.getTranslation(\"compliance\", \"automated\") + \" / \" + this.context.getTranslation(\"compliance\", \"ondemand\"),\r\n fieldName: 'automated',\r\n minWidth: 100,\r\n maxWidth: 160,\r\n onRender: (item: IDocument) => {\r\n return {item.automated ? this.context.getTranslation(\"compliance\", \"automated\") : this.context.getTranslation(\"compliance\", \"ondemand\")}\r\n }\r\n }\r\n ]\r\n\r\n if (this.props.userRules.ruleAccess.userComplianceAIAssistant && this.props.userRules.visibilityDetailsAIAssistantHistory) {\r\n columns = [...columns, {\r\n key: 'saveResult',\r\n name: this.context.getTranslation(\"compliance\", \"saveResult\"),\r\n fieldName: 'saveResult',\r\n minWidth: 50,\r\n maxWidth: 50,\r\n onRender: (item: IDocument) => {\r\n return {item.saveResult ? this.context.getTranslation(\"common\", \"yes\") : this.context.getTranslation(\"common\", \"no\")}\r\n }\r\n }]\r\n }\r\n\r\n return (\r\n \r\n \r\n {\r\n return (\r\n {\r\n this.groupsCollapsed = this.groupsCollapsed.map(g => {\r\n return g.key === group.key ? { ...g, isCollapsed: !g.isCollapsed } : g\r\n })\r\n if (props.onToggleCollapse) {\r\n props.onToggleCollapse(group)\r\n }\r\n }}\r\n />\r\n )\r\n }\r\n }}\r\n columns={this.state.columns}\r\n selectionMode={SelectionMode.single}\r\n selection={this.selection}\r\n setKey=\"single\"\r\n onRenderItemColumn={this.renderItemColumn}\r\n />\r\n \r\n
\r\n )\r\n }}\r\n \r\n }\r\n {/*Scorecard panel*/}\r\n \r\n
\r\n ),\r\n };\r\n\r\n tooltipPropsAutomatedOnDemand: ITooltipProps = {\r\n onRenderContent: () => (\r\n \r\n {this.context.getTranslation(\"compliance\", \"questionTooltipTitle\")}\r\n
\r\n \r\n {this.context.getTranslation(\"compliance\", \"questionTooltipSubtitle\")}\r\n
\r\n - \r\n
- {this.context.getTranslation(\"compliance\", \"AIquestionTooltipRow1\")} \r\n
- {this.context.getTranslation(\"compliance\", \"AIquestionTooltipRow2\")} \r\n
- {this.context.getTranslation(\"compliance\", \"AIquestionTooltipRow3\")} \r\n
- {this.context.getTranslation(\"compliance\", \"AIquestionTooltipRow4\")} \r\n
\r\n
\r\n ),\r\n };\r\n\r\n constructor(props) {\r\n super(props);\r\n const aiQuestion = this.props.data !== undefined ? this.props.data : null\r\n this.state = {\r\n //page data\r\n processing: false,\r\n //phrase data\r\n id: aiQuestion !== null ? aiQuestion.id : null,\r\n name: aiQuestion !== null ? aiQuestion.name : \"\",\r\n description: aiQuestion !== null ? aiQuestion.description : \"\",\r\n question: aiQuestion !== null ? aiQuestion.question : \"\",\r\n tenantId: aiQuestion !== null ? aiQuestion.tenantId : null,\r\n version: aiQuestion !== null ? aiQuestion.version : 0,\r\n aiQuestionGroup: aiQuestion !== null ? aiQuestion.aiQuestionGroup.id : null,\r\n generalGroup: aiQuestion !== null ? aiQuestion.aiQuestionGroup.generalGroup : false,\r\n masterItemId: aiQuestion !== null ? aiQuestion.masterItemId : null,\r\n selected: aiQuestion !== null ? aiQuestion.selected : true,\r\n matchAbsence: aiQuestion !== null ? aiQuestion.matchAbsence : false,\r\n //versions\r\n selectedOtherVersion: false,\r\n selectedVersion: aiQuestion !== null ? aiQuestion.id : null,\r\n //AIAssistant fields\r\n aIQuestionType: aiQuestion !== null ? aiQuestion.aIQuestionType : \"AIAssistantQuestion\",\r\n active: aiQuestion !== null ? aiQuestion.active : false,\r\n logInteraction: aiQuestion !== null ? aiQuestion.logInteraction : false,\r\n automated: aiQuestion !== null ? aiQuestion.automated : false,\r\n saveResult: aiQuestion !== null ? aiQuestion.saveResult : false\r\n };\r\n }\r\n\r\n\r\n changeAIAssistantField = (e, value) => {\r\n if (e.target.id == \"automated\" && value) {\r\n this.setState({\r\n [e.target.id]: value,\r\n selectedOtherVersion: false,\r\n saveResult: true\r\n })\r\n } else if (e.target.id == \"automated\" && !value)\r\n { \r\n this.setState({\r\n [e.target.id]: value,\r\n selectedOtherVersion: false,\r\n saveResult: false\r\n })\r\n }\r\n this.setState({\r\n [e.target.id]: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n componentDidMount() {\r\n this.refreshVersions()\r\n }\r\n\r\n refetchQueryVersions = null;\r\n numberOfVersions = 1\r\n\r\n refreshVersions = () => {\r\n if (this.refetchQueryVersions !== null) {\r\n this.refetchQueryVersions()\r\n }\r\n }\r\n\r\n changeText = (e, value) => {\r\n this.setState({\r\n [e.target.id]: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n changeMatchAbsence = (e, value) => {\r\n this.setState({\r\n matchAbsence: value,\r\n selectedOtherVersion: false\r\n })\r\n }\r\n\r\n isValid = () => {\r\n return this.state.name !== \"\" && this.state.question !== \"\";\r\n }\r\n\r\n cancel = () => {\r\n this.props.closePanel()\r\n }\r\n\r\n save = (saveAsTemplate) => {\r\n this.setState({ processing: true })\r\n const auth = this.props.auth\r\n const aiQuestion = {\r\n id: this.state.id,\r\n name: this.state.name,\r\n description: this.state.description,\r\n question: this.state.question,\r\n tenantId: this.state.tenantId,\r\n // manage version\r\n version: this.numberOfVersions,\r\n aiQuestionGroup: { id: this.state.aiQuestionGroup, generalGroup: this.state.generalGroup },\r\n masterItemId: this.state.masterItemId,\r\n selected: this.state.selected,\r\n matchAbsence: this.state.matchAbsence,\r\n //manage field of AIAssistant\r\n aIQuestionType: this.state.aIQuestionType,\r\n active: this.state.active,\r\n logInteraction: this.state.logInteraction,\r\n automated: this.state.automated,\r\n saveResult: this.state.saveResult\r\n }\r\n this.props.apol\r\n .mutate({\r\n mutation: saveAsTemplate ? QueryAI.createAIQuestionAsTemplate : QueryAI.createAIQuestion,\r\n variables: { auth, aiQuestion }\r\n })\r\n .then((result) => {\r\n var resultData = saveAsTemplate ? result.data.upsertAIQuestionAsTemplate : result.data.upsertAIQuestion\r\n var state = {}\r\n if (resultData.status === \"ok\") {\r\n this.props.closePanel()\r\n console.log(this.props.refreshAIAssistant())\r\n this.props.refreshAIAssistant()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", resultData.text))\r\n \r\n\r\n }\r\n this.setState({ ...state, processing: false })\r\n });\r\n }\r\n\r\n onChangeVersion = (e, item) => {\r\n //get specific version to fill the fields\r\n this.setState({ processing: true })\r\n let id = item.key\r\n let auth = this.props.auth\r\n this.props.apol\r\n .query({\r\n query: QueryAIAssistant.queryGetAIAssistant,\r\n variables: { auth, id }\r\n })\r\n .then(({ loading, error, data, refetch }) => {\r\n let oldVersion = data.getAIQuestion;\r\n this.setState({\r\n name: oldVersion.name,\r\n description: oldVersion.description,\r\n question: oldVersion.question,\r\n tenantId: oldVersion.tenantId,\r\n selectedVersion: id,\r\n selectedOtherVersion: true,\r\n processing: false,\r\n active: oldVersion.active,\r\n logInteraction: oldVersion.logInteraction,\r\n automated: oldVersion.automated,\r\n saveResult: oldVersion.saveResult\r\n })\r\n });\r\n }\r\n\r\n restoreVersion = () => {\r\n this.setState({ processing: true })\r\n //restoreAdherencePhrase -> id vesrion to restore\r\n let id = this.state.selectedVersion\r\n this.props.apol\r\n .mutate({\r\n mutation: QueryAI.restoreAIQuestion,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.restoreAIQuestion.status === \"ok\") {\r\n this.props.closePanel()\r\n this.props.refreshAIAssistant()\r\n } else {\r\n this.props.setMessageError(this.context.getTranslation(\"compliance\", result.data.restoreAIQuestion.text))\r\n }\r\n this.setState({\r\n selectedOtherVersion: false,\r\n processing: false\r\n })\r\n });\r\n }\r\n\r\n\r\n render() {\r\n let masterItemId = this.state.masterItemId\r\n var saveAsTemplateStyle = { marginTop: \"30px\", marginLeft: \"15px\" }\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"automatedOnDemandTooltip\")}\r\n
\r\n \r\n {/*QUERY ALL VERSIONS*/}\r\n \r\n {({ loading, error, data, refetch }) => {\r\n this.refetchQueryVersions = refetch\r\n if (loading) {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {!this.props.userRules.visibilityDetails || (this.props.userRules.ruleAccess.userComplianceAIAssistant && this.props.userRules.visibilityDetailsAIAssistantHistory) && (\r\n \r\n \r\n \r\n )}\r\n\r\n {/*FOOTER BUTTONS*/}\r\n \r\n this.save(false)} style={{ marginTop: \"30px\", marginLeft: \"15px\" }} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {(this.props.userRules.userTemplateAllowed && (!this.state.selectedOtherVersion || this.state.id === this.state.selectedVersion)) &&\r\n this.save(true)} style={!this.isValid() || this.state.processing ? saveAsTemplateStyle : { ...saveAsTemplateStyle, background: \"red\", color: \"white\" }} allowDisabledFocus={true} disabled={!this.isValid() || this.state.processing} />\r\n }\r\n {this.state.selectedOtherVersion && this.state.id !== this.state.selectedVersion &&\r\n \r\n
\r\n );\r\n }\r\n}","import { MessageBar, MessageBarType, Spinner } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../../context';\r\nimport * as QueryAI from '../../AIQuestion/AIQuestionQuery';\r\nimport * as QueryAIAssistant from '../AIAssistantQuery';\r\nimport EditAIAssistant from './EditAIAssistant';\r\n\r\nexport default class EditAIQAssistantContainer extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {};\r\n }\r\n\r\n render() {\r\n const { auth, apol, hidePanel } = this.props\r\n const id = this.props.aiAssistantId\r\n return (\r\n \r\n {versions.length > 0 && \r\n \r\n \r\n }\r\n
\r\n )\r\n }}\r\n \r\n \r\n {/*Edit AI Question*/}\r\n {id !== null && (\r\n \r\n {({ loading, error, data }) => {\r\n if (loading) {\r\n return (\r\n \r\n {this.context.getTranslation(\"compliance\", \"error\")}\r\n \r\n )\r\n }\r\n if (data.getAIQuestion == null) {\r\n return (\r\n {this.context.getTranslation(\"compliance\", \"noData\")}\r\n )\r\n }\r\n return (
\r\n );\r\n }\r\n}\r\n","import { CommandBarButton, PanelType, Spinner, Stack, Panel } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Query } from 'react-apollo';\r\nimport { MyContext } from '../../../context';\r\nimport AIAssistantsListView from './AIAssistantsListView';\r\nimport * as query from '../AIQuestion/AIQuestionQuery';\r\nimport * as queryAIAssistant from './AIAssistantQuery';\r\nimport EditAIAssistantContainer from '../AIAssistant/Panels/EditAIAssistantContainer'\r\nimport AlertBar from '../../CustomComponents/AlertBar';\r\nimport SafetyDialog from '../../CustomComponents/SafetyDialog'\r\nimport Utils from '../../common/Utils'\r\n\r\nconst orderAlphabetically = Utils.orderAlphabetically\r\n\r\nexport default class AIAssistants extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isPanelOpen: false,\r\n aiAssistantId: null,\r\n warningMessage: \"\",\r\n panelTitle: null,\r\n alertMessagePanel: \"\",\r\n hideDialogDelete: true,\r\n isProcessing: false\r\n };\r\n }\r\n\r\n groupsCollapsed = []\r\n\r\n openPanel = (title, aiAssistantId) => {\r\n if (title === \"addAIAssistant\" || (title === \"editAIAssistant\" && aiAssistantId !== null)) {\r\n this.setState({\r\n isPanelOpen: true,\r\n panelTitle: title,\r\n warningMessage: \"\"\r\n })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectAIAssistant\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n\r\n }\r\n\r\n getHeaderPanel = () => {\r\n return (\r\n \r\n
\r\n )\r\n }}\r\n \r\n )\r\n }\r\n {/*Create question*/}\r\n {\r\n id === null && (\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n )\r\n }\r\n\r\n hidePanel = () => {\r\n this.setState({ isPanelOpen: false, alertMessagePanel: \"\" });\r\n };\r\n\r\n selectAIAssistant = (id) => {\r\n this.setState({\r\n aiAssistantId: id,\r\n warningMessage: \"\"\r\n });\r\n }\r\n\r\n setMessageError = (message) => {\r\n this.setState({\r\n alertMessagePanel: message\r\n })\r\n }\r\n\r\n refreshAIAssistant = () => {\r\n this.refetchQueryAIAssistant()\r\n }\r\n\r\n refetchQueryAIAssistant = null;\r\n\r\n deleteAIAssistant = () => {\r\n this.setState({ hideDialogDelete: true, isProcessing: true })\r\n if (this.state.aiAssistantId !== null) {\r\n const id = this.state.aiAssistantId\r\n this.props.apol\r\n .mutate({\r\n mutation: query.deleteAIQuestion,\r\n variables: { id }\r\n })\r\n .then((result) => {\r\n if (result.data.deleteAIQuestion.status !== \"ok\") {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", result.data.deleteAIQuestion.text),\r\n alertType: \"error\",\r\n isProcessing: false\r\n })\r\n } else {\r\n this.setState({\r\n aiAssistantId: null,\r\n isProcessing: false\r\n })\r\n this.refetchQueryAIAssistant();\r\n }\r\n });\r\n }\r\n }\r\n\r\n openDialogDelete = () => {\r\n if (this.state.aiAssistantId !== null) {\r\n this.setState({ hideDialogDelete: false })\r\n } else {\r\n this.setState({\r\n warningMessage: this.context.getTranslation(\"compliance\", \"selectAIAssistant\"),\r\n alertType: \"warning\"\r\n })\r\n }\r\n }\r\n\r\n getAIAssistantGroups = (data) => {\r\n //unique groups id\r\n let allGroupsIds = [...new Set(data.map(aiQ => aiQ.aiQuestionGroup.id))];\r\n let allTemplateGroupsIds = [... new Set(data.filter(aiQ => aiQ.aiQuestionGroup.generalGroup).map(aiQ => aiQ.aiQuestionGroup.id))]\r\n //create groups for dataillist\r\n let groups = allGroupsIds.map(groupId => {\r\n var startIndex = \"\";\r\n var endIndex = \"\";\r\n var name = \"\";\r\n var expandedGroup = \"\";\r\n for (var i = 0; i < data.length; i++) {\r\n if (data[i].aiQuestionGroup.id === groupId) {\r\n name = data[i].aiQuestionGroup.name\r\n startIndex = startIndex === \"\" ? i : startIndex\r\n endIndex = i + 1\r\n expandedGroup = this.groupsCollapsed.length === 0 ?\r\n (allTemplateGroupsIds.includes(groupId) ? true : false) :\r\n this.groupsCollapsed.filter(g => g.key === groupId)[0]?.isCollapsed\r\n }\r\n }\r\n return ({\r\n \"key\": groupId,\r\n \"name\": name,\r\n \"startIndex\": startIndex,\r\n \"count\": endIndex - startIndex,\r\n \"level\": 0,\r\n \"isCollapsed\": expandedGroup\r\n })\r\n })\r\n this.groupsCollapsed = groups.map(g => {\r\n return (\r\n {\r\n key: g.key,\r\n isCollapsed: g.isCollapsed\r\n }\r\n )\r\n })\r\n return groups;\r\n }\r\n\r\n render() {\r\n let aIQuestionType = \"AIAssistantQuestion\";\r\n return ({this.context.getTranslation(\"compliance\", this.state.panelTitle)}
\r\n \r\n\r\n {/*Manage button add, edit and delete*/}\r\n \r\n { this.openPanel(\"addAIAssistant\", null) }}\r\n />\r\n { this.openPanel(\"editAIAssistant\", this.state.aiAssistantId) }}\r\n />\r\n \r\n\r\n {/*Warning and error message*/}\r\n { this.setState({ warningMessage: \"\" }) }}\r\n />\r\n\r\n {this.state.isProcessing && \r\n {({ loading, error, data, refetch, networkStatus }) => {\r\n this.refetchQueryAIAssistant = refetch\r\n if (loading) return (\r\n \r\n { this.setState({ hideDialogDelete: true }) }}\r\n ok={this.deleteAIAssistant}\r\n />\r\n
)\r\n }\r\n}","import { Pivot, PivotItem, Stack, Text } from 'office-ui-fabric-react';\r\nimport { Icon } from 'office-ui-fabric-react/lib/Icon';\r\nimport { CommandBarButton } from 'office-ui-fabric-react';\r\nimport React, { Component } from 'react';\r\nimport { Depths } from '@uifabric/fluent-theme/lib/fluent/FluentDepths';\r\nimport './ComplianceView.scss';\r\nimport { MyContext } from '../../context';\r\nimport PolicyRules from './PolicyRules/PolicyRules';\r\nimport Policies from './Policy/Policies';\r\nimport PatternDetection from './PatternDetection/PatternDetection';\r\nimport CategoryWrapper from '../RuleSetter/CategoryWrapper';\r\nimport AdherencePhrases from './AdherencePhrases/AdherencePhrases';\r\nimport AIAdherencePhrases from './AIAdherencePhrases/AIAdherencePhrases';\r\nimport ConversationSafe from \"../ConversationSafe/ConversationSafe\";\r\nimport AIQuestions from './AIQuestion/AIQuestions';\r\nimport AICategorization from './AICategorization/AICategorization';\r\nimport AIQualityManagement from './AIQualityManagement/AIQualityManagement';\r\nimport AIAssistants from './AIAssistant/AIAssistants';\r\nimport AIAssistantIcon from './AIAssistant/AIAssistantIcon';\r\n\r\n// Styles definition\r\nconst stackContainerStyles: IStackStyles = {\r\n root: {\r\n paddingTop: 50\r\n }\r\n};\r\nconst stackStyles: IStackStyles = {\r\n root: {\r\n maxWidth: 660,\r\n marginBottom: 50\r\n }\r\n};\r\nconst stackTokens: IStackTokens = { childrenGap: 5 };\r\n\r\n\r\nexport default class ComplianceView extends Component {\r\n static contextType = MyContext\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n helpPanel: false,\r\n query: 0,\r\n openCategory: true,\r\n openAdherencePhrase: true,\r\n selectedKey: \"Policies\"\r\n };\r\n this.data = null;\r\n }\r\n\r\n getPivotSelectCategory = () => {\r\n let option = [\r\n {\r\n \"key\": true,\r\n \"text\": this.context.getTranslation(\"compliance\", \"categoriesTabName\"),\r\n \"onClick\": () => this.setState({ openCategory: true, selectedKey: \"Cat\" })\r\n },\r\n {\r\n \"key\": false,\r\n \"text\": this.context.getTranslation(\"compliance\", \"categorizationTabName\"),\r\n \"onClick\": () => this.setState({ openCategory: false, selectedKey: \"Cat\" })\r\n }\r\n ]\r\n const optionTypePattern = {\r\n items: option,\r\n directionalHintFixed: true,\r\n };\r\n\r\n return (\r\n \r\n {\r\n this.groupsCollapsed = groupsCollapsed\r\n this.setState({ groupsCollapsed })\r\n }}\r\n groupsCollapsed={this.groupsCollapsed}\r\n />\r\n
\r\n )\r\n }}\r\n \r\n }\r\n\r\n {/*Phrase panel*/}\r\n \r\n
)\r\n }\r\n\r\n getPivotSelectAdherencePhrase = () => {\r\n let option = [\r\n {\r\n \"key\": true,\r\n \"text\": this.context.getTranslation(\"compliance\", \"AdherencePhrases\"),\r\n \"onClick\": () => this.setState({ openAdherencePhrase: true, selectedKey: \"AdherencePhrases\" })\r\n },\r\n {\r\n \"key\": false,\r\n \"text\": this.context.getTranslation(\"compliance\", \"AIAdherencePhrases\"),\r\n \"onClick\": () => this.setState({ openAdherencePhrase: false, selectedKey: \"AdherencePhrases\" })\r\n }\r\n ]\r\n\r\n const optionTypePattern = {\r\n items: option,\r\n directionalHintFixed: true,\r\n };\r\n\r\n return (\r\n \r\n
)\r\n }\r\n\r\n getPivotAiAssistant = () => {\r\n return (\r\n \r\n
\r\n )\r\n }\r\n\r\n render() {\r\n return (\r\n window.innerWidth > 750 ?\r\n \r\n \r\n { this.setState({ selectedKey: e.props.itemKey }) }}>\r\n \r\n \r\n {this.props.userRules.addOnQualityManagement && this.props.userRules.ruleAccess.userComplianceQM &&\r\n \r\n \r\n }\r\n \r\n \r\n \r\n \r\n \r\n {this.state.openAdherencePhrase && \r\n {this.props.userRules.ruleAccess.userComplianceAIQuestions &&\r\n \r\n }\r\n {/*TODO change the field used for visibility*/}\r\n {this.props.userRules.ruleAccess.userComplianceAIAssistant &&\r\n \r\n }\r\n \r\n {this.state.openCategory && \r\n {this.props.userRules.ruleAccess.userSafe != \"No\" &&\r\n \r\n }\r\n\r\n \r\n \r\n
\r\n :\r\n \r\n \r\n \r\n \r\n {this.context.getTranslation(\"compliance\", \"frameToSmallTitle\")} \r\n {this.context.getTranslation(\"compliance\", \"frameToSmallText\")} \r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n}\r\n","import React, { Component } from 'react';\r\nimport { Stack, Text } from 'office-ui-fabric-react';\r\nimport { MyContext } from '../../context';\r\n\r\n// Styles definition\r\nconst stackContainerStyles: IStackStyles = {\r\n root: {\r\n paddingTop: 50\r\n }\r\n};\r\nconst stackStyles: IStackStyles = {\r\n root: {\r\n maxWidth: 660,\r\n marginBottom: 50\r\n }\r\n};\r\nconst stackTokens: IStackTokens = { childrenGap: 5 };\r\n\r\nexport default class ComplianceLicense extends Component {\r\n static contextType = MyContext\r\n\r\n render() {\r\n return (\r\n \r\n \r\n \r\n {this.context.getTranslation(\"compliance\", \"noLicense\")} \r\n {this.context.getTranslation(\"compliance\", \"noLicenseMessage\")} \r\n \r\n \r\n \r\n
\r\n )\r\n }\r\n}","import 'devextreme/dist/css/dx.common.css';\r\nimport 'devextreme/dist/css/dx.light.css';\r\n//React\r\nimport React, { Component } from 'react';\r\n//import * as ReactDOM from 'react-dom';\r\nimport { Route } from 'react-router-dom';\r\n//Apollo\r\nimport ApolloClient from \"apollo-client\";\r\nimport { ApolloProvider } from \"react-apollo\";\r\nimport { Query } from \"react-apollo\";\r\nimport 'whatwg-fetch';\r\n//Components\r\nimport LiveView from './components/DetailView/LiveView'\r\nimport LiveViewOnly from './components/DetailView/LiveViewOnly'\r\nimport DetailContainerStandalone from './components/DetailView/DetailContainerStandalone'\r\nimport Setter from './components/RuleSetter/Setter'\r\nimport SetterTenant from './components/RuleSetter/SetterTenant'\r\nimport SetterTicket from './components/RuleSetter/SetterTicket'\r\n//Fabric IO\r\nimport FilterBox from './components/SearchBox/FilterBox'\r\nimport { Icon } from 'office-ui-fabric-react/lib/Icon';\r\nimport * as microsoftTeams from \"@microsoft/teams-js\";\r\nimport Utils from \"./components/common/Utils\";\r\nimport { Depths } from '@uifabric/fluent-theme/lib/fluent/FluentDepths';\r\nimport { FontSizes, Stack } from 'office-ui-fabric-react/lib';\r\nimport { Text } from 'office-ui-fabric-react/lib/Text';\r\nimport { Spinner } from 'office-ui-fabric-react/lib/Spinner';\r\nimport { Pivot, PivotItem, Label } from 'office-ui-fabric-react/lib';\r\nimport ProductLicense from './components/Legal/ProductLicense'\r\n\r\n//STYLE\r\nimport './App.scss'\r\nimport DayView from \"./components/DayView/DayView\";\r\nimport DashboardView from \"./components/DashboardView/DashboardView\";\r\nimport SettingsView from \"./components/SettingsView/SettingsView\";\r\nimport ReportView from \"./components/ReportView/ReportView\";\r\nimport Upload from \"./components/UploadView/UpLoad\";\r\nimport Login from \"./components/Login/Login\";\r\nimport Logout from \"./components/Login/Logout\";\r\nimport LoginResult from \"./components/Login/LoginResult\";\r\nimport Config from \"./components/Login/Config\";\r\nimport { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';\r\nimport { TooltipDelay } from 'office-ui-fabric-react/lib/Tooltip';\r\nimport Termsofuse from \"./components/Legal/Termsofuse\";\r\nimport Product from \"./components/Legal/Product\";\r\nimport Privacy from \"./components/Legal/Privacy\";\r\nimport BotRegistration from \"./components/Legal/BotRegistration\";\r\nimport TransactableView from \"./components/Transactable/TransactableView\";\r\nimport Impressum from \"./components/Legal/Impressum\";\r\nimport AuthenticationContext from \"adal-angular\";\r\nimport jwt_decode from \"jwt-decode\";\r\nimport solutenLogo from './styles/images/asc-logo.svg';\r\n\r\n\r\n//import ShopControler from \"./components/ShopView/ShopControler\";\r\n\r\nimport { createHttpLink } from 'apollo-link-http';\r\nimport { setContext } from 'apollo-link-context';\r\nimport { InMemoryCache } from 'apollo-cache-inmemory';\r\n\r\nimport {\r\n renderSearchTeams,\r\n renderZoomAuthorize\r\n} from \"./queries/queryRecordings\";\r\nimport { queryGetAuth } from \"./queries/querySettings\";\r\nimport { renderPanelRecording, renderPanelRules, renderPanelSettings, renderPanelUpload, renderPanelTenant, renderPanelDashboard, renderPanelCompliance, renderPanelNewsFeed, renderPanelTicket } from \"./panel/helpPanel\";\r\nimport { iniApplicationId, iniGraphqlUrl, iniGraphMicrosoft } from \"./ini/ini\";\r\nimport { Providers, SimpleProvider, ProviderState } from '@microsoft/mgt/dist/commonjs';\r\n\r\nimport { initializeIcons } from 'office-ui-fabric-react/lib/Icons';\r\nimport Contact from \"./components/Legal/Contact\";\r\n//import Pricing from \"./components/ShopView/SubPages/Pricing\";\r\nimport { MyContext } from '../src/context';\r\nimport { ThemeProvider, PartialTheme } from '@fluentui/react-theme-provider';\r\nimport ComplianceView from './components/ComplianceView/ComplianceView';\r\nimport ComplianceLicense from './components/ComplianceView/ComplianceLicense';\r\nimport ConversationSafe from './components/ConversationSafe/ConversationSafe';\r\n\r\n\r\ninitializeIcons('https://res-1.cdn.office.net/files/fabric/assets/icons/');\r\n\r\n// Read DarkMode\r\nconst ASCThemeNormal: PartialTheme = {\r\n palette: {\r\n themePrimary: '#00315e',\r\n themeLighterAlt: '#cfdeec',\r\n themeLighter: '#a8c2da',\r\n themeLight: '#84a7c8',\r\n themeTertiary: '#648fb7',\r\n themeSecondary: '#4978a5',\r\n themeDarkAlt: '#316493',\r\n themeDark: '#1d5182',\r\n themeDarker: '#0c4070',\r\n neutralLighterAlt: '#f1f1f1',\r\n neutralLighter: '#ededed',\r\n neutralLight: '#e3e3e3',\r\n neutralQuaternaryAlt: '#d3d3d3',\r\n neutralQuaternary: '#cacaca',\r\n neutralTertiaryAlt: '#c2c2c2',\r\n neutralTertiary: '#595959',\r\n neutralSecondary: '#373737',\r\n neutralPrimaryAlt: '#2f2f2f',\r\n neutralPrimary: '#000000',\r\n neutralDark: '#151515',\r\n black: '#0b0b0b',\r\n white: '#f7f7f7',\r\n },\r\n type: \"normal\"\r\n};\r\n\r\nconst ASCThemeContrast: PartialTheme = {\r\n palette: {\r\n themePrimary: '#71a2d2',\r\n themeLighterAlt: '#050608',\r\n themeLighter: '#121a21',\r\n themeLight: '#22303f',\r\n themeTertiary: '#44617d',\r\n themeSecondary: '#638eb8',\r\n themeDarkAlt: '#7da9d6',\r\n themeDark: '#8fb6dc',\r\n themeDarker: '#aac8e5',\r\n neutralLighterAlt: '#0b0b0b',\r\n neutralLighter: '#151515',\r\n neutralLight: '#252525',\r\n neutralQuaternaryAlt: '#2f2f2f',\r\n neutralQuaternary: '#373737',\r\n neutralTertiaryAlt: '#595959',\r\n neutralTertiary: '#c8c8c8',\r\n neutralSecondary: '#d0d0d0',\r\n neutralPrimaryAlt: '#dadada',\r\n neutralPrimary: '#ffffff',\r\n neutralDark: '#f4f4f4',\r\n black: '#f8f8f8',\r\n white: '#000000'\r\n },\r\n type: \"contrast\"\r\n};\r\n\r\nconst ASCThemeDark: PartialTheme = {\r\n palette: {\r\n themePrimary: '#71a2d2',\r\n themeLighterAlt: '#050608',\r\n themeLighter: '#121a21',\r\n themeLight: '#22303f',\r\n themeTertiary: '#44617d',\r\n themeSecondary: '#638eb8',\r\n themeDarkAlt: '#7da9d6',\r\n themeDark: '#8fb6dc',\r\n themeDarker: '#aac8e5',\r\n neutralLighterAlt: '#2b2b2b',\r\n neutralLighter: '#333333',\r\n neutralLight: '#414141',\r\n neutralQuaternaryAlt: '#4a4a4a',\r\n neutralQuaternary: '#515151',\r\n neutralTertiaryAlt: '#6f6f6f',\r\n neutralTertiary: '#e0e0e0',\r\n neutralSecondary: '#e5e5e5',\r\n neutralPrimaryAlt: '#eaeaea',\r\n neutralPrimary: '#d1d1d1',\r\n neutralDark: '#f4f4f4',\r\n black: '#f9f9f9',\r\n white: '#202020',\r\n },\r\n type: \"dark\"\r\n};\r\n\r\nlet theme = (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) ? ASCThemeDark : ASCThemeNormal;\r\ndocument.body.style.backgroundColor = theme.palette.neutralLighterAlt;\r\n\r\nlet config = {\r\n clientId: iniApplicationId,\r\n redirectUri: window.location.origin + \"/loginResult\",\r\n cacheLocation: \"localStorage\",\r\n navigateToLoginRequestUrl: false,\r\n extraQueryParameter: \"scope=openid+profile\"\r\n};\r\nlet authContext = new AuthenticationContext(config); // from the ADAL.js library\r\n\r\nlet timerId = null;\r\n\r\nlet authTokenSuccess = (result) => {\r\n Utils.lsSet(\"access_token\", result);\r\n console.log(\"SSO login successfull\");\r\n};\r\n\r\nlet authTokenRequest = {\r\n successCallback: authTokenSuccess,\r\n failureCallback: function (error) { console.log(\"Failure: \" + error); },\r\n};\r\n\r\nconst authLink = setContext((_, { headers }) => {\r\n if (window.location.pathname.includes(\"shop\")||window.location.pathname.includes(\"callDetail\")) {\r\n return;\r\n }\r\n // get the authentication token from local storage if it exists \r\n\r\n const token = Utils.lsGet(\"access_token\");\r\n // Check Token Validation\r\n var decoded = jwt_decode(token);\r\n var expire = decoded.exp;\r\n var remaining = parseInt(decoded.exp - Date.now() / 1000);\r\n console.log(\"Valid for \" + remaining + \" seconds\");\r\n if (remaining < 300) {\r\n // Renew token\r\n console.log(\"Renew Token\");\r\n microsoftTeams.authentication.getAuthToken(authTokenRequest);\r\n var tokenId = authContext.getCachedToken(iniApplicationId);\r\n authContext._renewIdToken(function (err, tokenId) {\r\n if (err) {\r\n console.log(\"Renewal access token failed: \" + err);\r\n }\r\n else {\r\n let token = authContext.getCachedToken(iniApplicationId);\r\n Utils.lsSet(\"access_token\", token);\r\n };\r\n });\r\n }\r\n // return the headers to the context so httpLink can read them\r\n return {\r\n headers: {\r\n ...headers,\r\n authorization: token ? `Bearer ${token}` : \"\",\r\n }\r\n }\r\n});\r\n\r\nconst httpLink = createHttpLink({\r\n uri: iniGraphqlUrl\r\n});\r\n\r\nconst client = new ApolloClient({\r\n link: authLink.concat(httpLink),\r\n cache: new InMemoryCache()\r\n});\r\n\r\n\r\nlet pp = window.location.href;\r\n\r\nfunction getAccessToken(scopes) {\r\n return authContext.getCachedToken(iniGraphMicrosoft);\r\n}\r\n\r\nfunction login() {\r\n microsoftTeams.authentication.authenticate({\r\n url: window.location.origin + \"/login\",\r\n width: 600,\r\n height: 535,\r\n successCallback: function (result) {\r\n console.log(\"authentication succeeded: \", result);\r\n window.location.reload();\r\n },\r\n failureCallback: function (reason) {\r\n console.log(\"authentication failed: \", reason);\r\n window.location.reload();\r\n }\r\n });\r\n}\r\n\r\nfunction logout() {\r\n authContext.clearCache();\r\n authContext._user = null;\r\n window.location.href = window.location.origin + \"/logout\";\r\n}\r\n\r\nlet provider = new SimpleProvider(getAccessToken, login, logout);\r\nprovider.setState(ProviderState.SignedOut);\r\nProviders.globalProvider = provider;\r\n\r\nexport default class App extends Component {\r\n\r\n\r\n constructor(props) {\r\n super(props);\r\n this.handler = this.handler.bind(this);\r\n this.LiveViewRef = React.createRef();\r\n // Delete access_token\r\n Utils.lsRemove(\"access_token\");\r\n Utils.lsSet(\"adal_authentication\", \"0\");\r\n this.timerID = null;\r\n }\r\n displayName = App.name;\r\n commandBarSync = React.createRef();\r\n\r\n state = {\r\n isDebug: true,\r\n isteams: false,\r\n userContext: null,\r\n loginChecked: false,\r\n loginChecked2: false,\r\n auth: null,\r\n id: \"0\",\r\n val: \"\",\r\n withSave: false,\r\n backgroundColor: \"#F7F7F7\",\r\n shopState: null,\r\n helpMode: Utils.lsGet(\"helpMode\") === \"true\" ? true : false,\r\n helpPanel: false,\r\n configurationPanel: false,\r\n newsPanelIsOpen: false,\r\n access_token: null,\r\n selectedPivot: Utils.lsGet(\"selectedPivot\") != null ? (Utils.lsGet(\"selectedPivot\")) : \".0\",\r\n iconView: true,\r\n isRefresh: true,\r\n isConversationSafeNew: true,\r\n searchIn: []\r\n };\r\n\r\n handler(search, filter, save, searchIn) {\r\n this.setState({ id: \"1\", val: search, filter: filter, withSave: save, searchIn: searchIn })\r\n }\r\n switchView = () => {\r\n if (this.state.isRefresh) {\r\n this.setState({ isRefresh: false })\r\n }\r\n //isConversationSafeNew is true only if the conversation safe was not accessed\r\n if (this.state.isConversationSafeNew && this.state.id == \"2\") {\r\n this.setState({ isConversationSafeNew: false })\r\n }\r\n this.setState({ iconView: this.state.iconView ? false : true, backgroundColor: '#F7F7F7' })\r\n };\r\n\r\n newsPanelOpen = () => {\r\n this.setState({ newsPanelIsOpen: true });\r\n }\r\n\r\n newsPanelClose = () => {\r\n this.setState({ newsPanelIsOpen: false });\r\n }\r\n\r\n authTokenSuccess = (result) => {\r\n Utils.lsSet(\"access_token\", result);\r\n console.log(\"SSO login successfull\");\r\n Utils.lsSet(\"adal_authentication\", \"0\");\r\n this.setState({ access_token: result });\r\n };\r\n\r\n authTokenRequest = {\r\n successCallback: this.authTokenSuccess,\r\n failureCallback: function (error) { console.log(\"Failure: \" + error); },\r\n };\r\n\r\n componentDidMount() {\r\n microsoftTeams.initialize();\r\n document.title = \"ASC Recording Insights\";\r\n // Try Teams approach to get token\r\n microsoftTeams.authentication.getAuthToken(this.authTokenRequest);\r\n Utils.lsSet(\"refreshView\", \"no\");\r\n microsoftTeams.getContext((context => {\r\n // Read if Dark Mode\r\n console.log(\"Theme: \" + context.theme);\r\n theme = context.theme === \"dark\" ? ASCThemeDark : (context.theme === \"contrast\" ? ASCThemeContrast : ASCThemeNormal)\r\n document.body.style.backgroundColor = theme.palette.neutralLighterAlt;\r\n\r\n if (authContext.getCachedUser() != null && authContext.getCachedUser().profile.upn !== context.loginHint) {\r\n // Then delete old user and force new check\r\n console.log(\"Clear Cache\");\r\n // User doesn't match, clear the cache\r\n authContext.clearCache();\r\n window.location.reload();\r\n } else {\r\n this.setState({ isteams: true, userContext: context });\r\n }\r\n }));\r\n var isState = window.localStorage.getItem(\"saved_state\");\r\n if (isState) {\r\n this.setState({ id: isState });\r\n window.localStorage.setItem(\"saved_state\", \"0\");\r\n }\r\n };\r\n\r\n // Check Authentication\r\n checkTeamsAuthentication = () => {\r\n console.log(\"checkTeamsAuthentication: \", this.timerID);\r\n if (this.state.access_token == null) {\r\n // Then use old Authentication\r\n console.log(\"Use old authentication\");\r\n Utils.lsSet(\"adal_authentication\", \"1\");\r\n this.authenticateUser();\r\n }\r\n else {\r\n clearInterval(this.timerID);\r\n }\r\n }\r\n\r\n componentDidUpdate() {\r\n\r\n window.localStorage.setItem(\"saved_state\", this.state.id);\r\n }\r\n\r\n // Old Adal Login\r\n authenticateUser = () => {\r\n if (!this.state.loginChecked || !this.state.loginChecked2) {\r\n if (!this.state.loginChecked) {\r\n console.log(\"Authenticate User 1\");\r\n this.setState({ loginChecked: true });\r\n }\r\n else {\r\n console.log(\"Authenticate User 2\");\r\n this.setState({ loginChecked2: true });\r\n clearInterval(this.timerID);\r\n }\r\n let user = authContext.getCachedUser();\r\n if (this.state.userContext != null && this.state.userContext.loginHint) {\r\n if (user) {\r\n console.log(\"LoginHint: \" + this.state.userContext.loginHint + \" UserName: \" + user.profile.upn);\r\n\r\n if (user.profile.upn !== this.state.userContext.loginHint) {\r\n console.log(\"Clear Cache\");\r\n // User doesn't match, clear the cache\r\n authContext.clearCache();\r\n window.location.reload();\r\n }\r\n }\r\n }\r\n let token = authContext.getCachedToken(iniApplicationId);\r\n if (token) {\r\n let accessToken = authContext.getCachedToken(iniGraphMicrosoft);\r\n if (accessToken == null) {\r\n authContext.acquireToken(iniGraphMicrosoft, function (error, access_token) {\r\n if (error || !access_token) {\r\n console.log('ADAL error occurred: ' + error);\r\n }\r\n else {\r\n provider.setState(ProviderState.SignedIn);\r\n this.setState({ auth: { tenantId: user.profile.tid, userId: user.profile.oid, sessionToken: token, locale: user.profile.locale, timeZone: new Date().getTimezoneOffset(), timeZoneId: new Intl.DateTimeFormat().resolvedOptions().timeZone } });\r\n Utils.lsSet(\"access_token\", token);\r\n\r\n }\r\n }.bind(this)\r\n );\r\n } else {\r\n provider.setState(ProviderState.SignedIn);\r\n this.setState({ auth: { tenantId: user.profile.tid, userId: user.profile.oid, sessionToken: token, locale: user.profile.locale, timeZone: new Date().getTimezoneOffset(), timeZoneId: new Intl.DateTimeFormat().resolvedOptions().timeZone } });\r\n Utils.lsSet(\"access_token\", token);\r\n\r\n }\r\n } else {\r\n // No token, or token is expired\r\n console.log(\"Renew 2 Token\");\r\n authContext._renewIdToken(function (err, idToken) {\r\n if (err) {\r\n console.log(\"Renewal 2 failed: \" + err);\r\n } else {\r\n if (idToken) {\r\n authContext.acquireToken(iniGraphMicrosoft, function (error, access_token) {\r\n if (error || !access_token) {\r\n console.log('ADAL 2 error occurred: ' + error);\r\n\r\n }\r\n else {\r\n provider.setState(ProviderState.SignedIn);\r\n this.setState({ auth: { tenantId: user.profile.tid, userId: user.profile.oid, sessionToken: token, locale: user.profile.locale, timeZone: new Date().getTimezoneOffset(), timeZoneId: new Intl.DateTimeFormat().resolvedOptions().timeZone } });\r\n Utils.lsSet(\"access_token\", token);\r\n }\r\n }.bind(this)\r\n );\r\n }\r\n }\r\n });\r\n }\r\n }\r\n };\r\n\r\n render() {\r\n\r\n // If login related things immediately return Object\r\n if (window.location.pathname == \"/loginResult\")\r\n return (\r\n\r\n \r\n {/* Main Routing */}\r\n { return { return { return { return { return { return { return { return {\r\n return { return { return { return { return { return { return { return { return { return { return { return { return { return { return { return { return { return { return { return { return \r\n
\r\n {this.updateState(false, \"/\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n\r\n {/* Other Routing */}\r\n {this.updateState(false, \"/rules\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(false, \"/tenant\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(false, \"/ticket\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(false, \"/day\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(false, \"/upload\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(false, \"/compliance\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(false, \"/dashboard\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(false, \"/liveView\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n\r\n {this.updateState(false, \"/settings\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {/* {this.updateState(true, \"/\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(true, \"/\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(true, \"/\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(true, \"/\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n {this.updateState(true, \"/zoom\", this.state, this.handler, this.switchView, this.ruleView, this.shopView, client)}
}} />\r\n\r\n\r\n {/* Legal Routing */}\r\n \r\n \r\n \r\n \r\n \r\n \r\n {type === \"/rules\" && {context.getTranslation(\"configuration\", \"configurationTitle\")} }\r\n {type === \"/zoom\" && {context.getTranslation(\"configuration\", \"zoomAuthentication\")} }\r\n {type === \"/tenant\" && {context.getTranslation(\"tenants\", \"tenantsTitle\")} }\r\n {type === \"/ticket\" && {context.getTranslation(\"settings\", \"ticket\")} }\r\n {type === \"/settings\" && {context.getTranslation(\"settings\", \"settingsTitle\")} }\r\n {type === \"/upload\" && {context.getTranslation(\"upload\", \"uploadTitle\")} }\r\n {type === \"/dashboard\" && {context.getTranslation(\"dashboard\", \"dashboardTitle\")} }\r\n {type === \"/liveView\" && {context.getTranslation(\"dashboard\", \"liveView\")} }\r\n {type === \"/main\" && ASC Recording Insights }\r\n {type === \"/compliance\" && {context.getTranslation(\"compliance\", \"complianceTitle\")} }\r\n {type === \"/day\" && DayView {day} }\r\n {type === \"/\" && st.id === \"2\" && {context.getTranslation(\"conversationSafe\", \"conversationSafeTitle\")} }\r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n
)}\r\n \r\n {\r\n if (type === \"/\") {\r\n if (!this.state.iconView) {\r\n Utils.lsSet(\"refreshView\", \"list\")\r\n } else {\r\n Utils.lsSet(\"refreshView\", \"icon\")\r\n }\r\n }\r\n window.location.reload(false);\r\n }\r\n } iconName={\"Sync\"}\r\n title={context.getTranslation(\"common\", \"refresh\")}\r\n />\r\n
\r\n \r\n \r\n {({ loading, error, data }) => {\r\n if (loading) return
)}\r\n \r\n {type !== \"/liveView\" && \r\n {withMainMenu && type !== \"/zoom\" && \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {(data.getAuth != null && data.getAuth.ruleAccess != null && (data.getAuth.ruleAccess.confAddUser || data.getAuth.ruleAccess.confListUser)) &&\r\n \r\n \r\n }\r\n {(data.getAuth != null && data.getAuth.ruleAccess != null && (data.getAuth.ruleAccess.tenantCreate || data.getAuth.ruleAccess.tenantChange)) &&\r\n\r\n \r\n \r\n }\r\n {(data.getAuth != null && data.getAuth.ruleAccess != null && (data.getAuth.ruleAccess.confTicket)) &&\r\n \r\n \r\n }\r\n \r\n }\r\n \r\n {(type === \"/\" && ((this.state.selectedPivot === \".0\" && st.id !== \"2\") || this.state.selectedPivot === \".2\")) && \r\n {(type !== \"/\" || st.id === \"2\" || this.state.selectedPivot != \".0\") && \r\n \r\n \r\n \r\n }\r\n
);\r\n }\r\n }\r\n \r\n {(window.innerWidth < 600) &&
\r\n }\r\n\r\n \r\n {!loginValid && ASC Recording Insights }\r\n {loginValid && type === \"/rules\" && {context.getTranslation(\"configuration\", \"configurationTitle\")} }\r\n {loginValid && type === \"/zoom\" && {context.getTranslation(\"configuration\", \"zoomAuthentication\")} }\r\n {loginValid && type === \"/tenant\" && {context.getTranslation(\"tenants\", \"tenantsTitle\")} }\r\n {loginValid && type === \"/ticket\" && {context.getTranslation(\"settings\", \"ticket\")} }\r\n {loginValid && type === \"/settings\" && {context.getTranslation(\"settings\", \"settingsTitle\")} }\r\n {loginValid && type === \"/upload\" && {context.getTranslation(\"upload\", \"uploadTitle\")} }\r\n {loginValid && type === \"/dashboard\" && {context.getTranslation(\"dashboard\", \"dashboardTitle\")} }\r\n {loginValid && type === \"/liveView\" && {context.getTranslation(\"dashboard\", \"liveView\")} }\r\n {loginValid && type === \"/compliance\" && {context.getTranslation(\"compliance\", \"complianceTitle\")} }\r\n {loginValid && type === \"/day\" && DayView {day} }\r\n {loginValid && type === \"/\" && this.state.selectedPivot == \".0\" && st.id === \"2\" && {context.getTranslation(\"conversationSafe\", \"conversationSafeTitle\")} }\r\n\r\n
}\r\n \r\n {(type === \"/\" && this.state.selectedPivot == \".0\") && data.getAuth != null && data.getAuth.ruleAccess != null && data.getAuth.ruleAccess.userLiveView && {\r\n this.showLiveView();\r\n }\r\n }\r\n iconName={\"InternetSharing\"}\r\n title={context.getTranslation(\"common\", \"liveView\")}\r\n />}\r\n {(type === \"/\" && this.state.selectedPivot == \".0\") && data.getAuth != null && data.getAuth.ruleAccess != null\r\n && data.getAuth.ruleAccess.userSafe !== \"No\" && st.id !== \"2\" &&\r\n {\r\n this.setState({ id: \"2\", backgroundColor: '#F7F7F7', iconView: viewSetting });\r\n }}\r\n iconName={\"LockSolid\"}\r\n title={context.getTranslation(\"detailContainer\", \"conversationSafe\")}\r\n />}\r\n {type === \"/day\" && {\r\n this.onCkHome();\r\n }\r\n }\r\n iconName={\"Home\"} />}\r\n\r\n {loginValid && {\r\n this.setState({ helpPanel: true });\r\n }\r\n } iconName={\"Help\"}\r\n title={context.getTranslation(\"common\", \"help\")}\r\n />}\r\n {\r\n if (st.id === \"2\") {\r\n if (!this.state.iconView) {\r\n Utils.lsSet(\"refreshView\", \"list\");\r\n } else {\r\n Utils.lsSet(\"refreshView\", \"icon\");\r\n }\r\n window.localStorage.setItem(\"saved_state\", \"2\");\r\n window.location.reload(false);\r\n } else {\r\n if (!this.state.iconView) {\r\n Utils.lsSet(\"refreshView\", \"list\")\r\n } else {\r\n Utils.lsSet(\"refreshView\", \"icon\")\r\n }\r\n Utils.lsSet(\"selectedPivot\", this.state.selectedPivot);\r\n window.location.reload(false);\r\n }\r\n }\r\n } iconName={\"Sync\"}\r\n title={context.getTranslation(\"common\", \"refresh\")}\r\n />\r\n {(type === \"/\" && this.state.selectedPivot == \".0\" && st.id === \"2\") && {\r\n if (!this.state.iconView) {\r\n Utils.lsSet(\"refreshView\", \"list\")\r\n } else {\r\n Utils.lsSet(\"refreshView\", \"icon\")\r\n }\r\n window.localStorage.setItem(\"saved_state\", \"0\");\r\n window.location.reload(false);\r\n }\r\n }\r\n iconName={\"Cancel\"} />\r\n }\r\n {(type == \"/rules\" || type == \"/tenant\" || type == \"/ticket\" ) &&\r\n {\r\n if (type === \"/rules\") {\r\n window.location.href = window.location.origin + \"/settings\";\r\n\r\n }\r\n if (type === \"/tenant\") {\r\n window.location.href = window.location.origin + \"/settings\";\r\n\r\n }\r\n if (type === \"/ticket\") {\r\n window.location.href = window.location.origin + \"/settings\";\r\n\r\n }\r\n\r\n }\r\n } iconName={\"Cancel\"} />}\r\n\r\n {!loginValid && renderPanelRecording(this, theme.palette.neutralPrimary)}\r\n {loginValid && (type === \"/\" && this.state.selectedPivot == \".0\") && renderPanelRecording(this, auth, client, data.getAuth, theme.palette.neutralPrimary)}\r\n {loginValid && (type === \"/rules\" || this.state.selectedPivot === \".4\") && renderPanelRules(this, auth, client, data.getAuth, theme)}\r\n {loginValid && (type === \"/tenant\" || this.state.selectedPivot === \".5\") && renderPanelTenant(this, auth, client, data.getAuth, theme)}\r\n {loginValid && (type === \"/settings\" || this.state.selectedPivot === \".3\") && renderPanelSettings(this, auth, client, data.getAuth, theme)}\r\n {loginValid && (type === \"/dashboard\" || this.state.selectedPivot === \".1\") && renderPanelDashboard(this, auth, client, data.getAuth, theme)}\r\n {loginValid && (type === \"/compliance\" || this.state.selectedPivot === \".2\") && renderPanelCompliance(this, auth, client, data.getAuth, theme)}\r\n {loginValid && type === \"/upload\" && renderPanelUpload(this, auth, client, data.getAuth, theme)}\r\n {loginValid && type === \"/day\" && renderPanelRecording(this, auth, client, data.getAuth, theme.palette.neutralPrimary)}\r\n {loginValid && type === \"/ticket\" && renderPanelTicket(this, auth, client, data.getAuth, theme)}\r\n\r\n
\r\n \r\n
\r\n \r\n {!loginValid && }\r\n {loginValid && (type === \"/ticket\" || this.state.selectedPivot === \".6\") && data.getAuth != null && data.getAuth.ruleAccess != null && (data.getAuth.ruleAccess.confTicket) &&
\r\n