\r\n {detailsBody}\r\n
\r\n \r\n \r\n
\r\n onEnterButton(e)}>\r\n \r\n \r\n \r\n
\r\n \r\n Please type to search for documents} arrow>\r\n setShowSuggestions(false)}\r\n onClick={() => {\r\n setShowSuggestions(true);\r\n }}\r\n InputProps={{ disableUnderline: true }}\r\n >\r\n \r\n\r\n \r\n
\r\n {suggestionDiv}\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 React, { useState, useEffect } from \"react\";\r\nimport {decode} from 'html-entities';\r\nimport Tooltip from '@material-ui/core/Tooltip';\r\nimport Highlighter from \"react-highlight-words\";\r\nimport {TextField } from \"@material-ui/core\";\r\n\r\nexport default function SearchTranscript(props) {\r\n // eslint-disable-next-line\r\n const [initalSearchTag, setInitalSearchTag] = useState(props.q.trim());\r\n const [searchtext, setSearchtext] = useState('');\r\n const [searchTags, setSearchTags] = useState([]);\r\n const [isActive, setActive] = useState(true);\r\n const [isActiveTranscript, setActiveTranscript] = useState(true);\r\n\r\n if(props.selectedTab === 1) {\r\n props.renderTranscript(searchTags);\r\n }\r\n\r\n useEffect(() => {\r\n if((initalSearchTag.startsWith(\"\\\"\") && initalSearchTag.endsWith(\"\\\"\"))) {\r\n // searchTags.push(initalSearchTag.substring(1, initalSearchTag.length-1));\r\n if(initalSearchTag.search(/\\bAND\\b/) > 0 || initalSearchTag.search(/\\bOR\\b/) > 0 || initalSearchTag.search(/\\bNOT\\b/) > 0){\r\n if(initalSearchTag.search(/\\bAND\\b/) > 0 || initalSearchTag.search(/\\bOR\\b/) > 0){\r\n const valueOfAndOr =initalSearchTag.replace(/\"/g,'regexOperator').replace(new RegExp(\"\\\\bAND\\\\b\"), \"regexOperator\").replace(new RegExp(\"\\\\bOR\\\\b\"), \"regexOperator\").toLowerCase().split(\"regexoperator\");\r\n for(let index in valueOfAndOr) {\r\n valueOfAndOr[index] = valueOfAndOr[index].trim();\r\n }\r\n setSearchTags(valueOfAndOr.filter(function (obj) { \r\n return !['',' ',null, undefined].includes(obj) \r\n }));\r\n }else{\r\n const valueOfNot = initalSearchTag.replace(/\"/g,'regexOperator').split(\"NOT\")[0].toLowerCase().split(\"regexoperator\");\r\n for(let index in valueOfNot) {\r\n valueOfNot[index] = valueOfNot[index].trim();\r\n }\r\n setSearchTags(valueOfNot.filter(function (obj) {\r\n return !['',' ',null, undefined].includes(obj) }));\r\n }\r\n }else {\r\n const searchWord = initalSearchTag.substring(1, initalSearchTag.length-1).trim();\r\n searchTags.push(searchWord);\r\n }\r\n } else {\r\n setSearchTags(initalSearchTag.replace(/[\"']/g, '').split(\" \"));\r\n }\r\n // eslint-disable-next-line\r\n }, []);\r\n\r\n const onEnterButton = (event) => {\r\n if (event.keyCode === 13) {\r\n searchChange();\r\n }\r\n }\r\n\r\n function onChangeHandler () {\r\n setActiveTranscript(true);\r\n var searchTerm = document.getElementById(\"searchbox\").value;\r\n setSearchtext(searchTerm);\r\n }\r\n\r\n const searchChange = (e) => {\r\n if(searchtext.length) {\r\n setSearchTags(searchtext.split(' '));\r\n } \r\n }\r\n\r\n const searchTagHandler = (tag) => {\r\n setActiveTranscript(true);\r\n const searchIndex = searchTags.indexOf(tag);\r\n if(searchIndex === -1) {\r\n let array = decode(tag.target.innerHTML).replace(/[\\n\\t\\s]+/g, \" \").split(\" \");\r\n array = array.filter(function(str) {\r\n return /\\S/.test(str);\r\n });\r\n setSearchTags(array);\r\n }\r\n }\r\n\r\n const findChunksSearch = ({\r\n autoEscape,\r\n caseSensitive,\r\n sanitize,\r\n searchWords,\r\n textToHighlight\r\n }) => {\r\n const chunks = [];\r\n const textLow = textToHighlight.toLowerCase();\r\n const sep = /[\\s~`!@#$%^&*()-_+=\\{\\}\\[\\]|\\\\:;\"'<,\\/>.?]/;\r\n const singleTextWords = textLow.split(sep);\r\n\r\n // It could be possible that there are multiple spaces between words\r\n // Hence we store the index (position) of each single word with textToHighlight\r\n let fromIndex = 0;\r\n const singleTextWordsWithPos = singleTextWords.map(s => {\r\n const indexInWord = textLow.indexOf(s, fromIndex);\r\n fromIndex = indexInWord;\r\n return {\r\n word: s,\r\n index: indexInWord\r\n };\r\n });\r\n\r\n // Add chunks for every searchWord\r\n searchWords.forEach(sw => {\r\n const swLow = sw.toLowerCase();\r\n // Do it for every single text word\r\n singleTextWordsWithPos.forEach(s => {\r\n if (s.word === swLow) {\r\n const start = s.index;\r\n const end = s.index + swLow.length;\r\n chunks.push({\r\n start,\r\n end\r\n });\r\n }\r\n });\r\n\r\n // The complete word including whitespace should also be handled\r\n if(swLow.split(\" \").length > 1) {\r\n for(let index in textLow) {\r\n let start = parseInt(index);\r\n let end = parseInt(index) + swLow.length;\r\n let sub = textLow.substring(start,end);\r\n let remain = textLow.substring(start,end+1);\r\n if(sub === swLow && (/[^a-zA-Z0-9]/.test( remain[remain.length - 1] ))) {\r\n chunks.push({\r\n start,\r\n end\r\n });\r\n }\r\n }\r\n }\r\n });\r\n\r\n\r\n return chunks;\r\n };\r\n\r\n let doc = props.documented.metadata_storage_file_extension_lower;\r\n let isCAD = (doc === '.dwg' || doc === '.dgn' || doc === '.DWG' || doc === '.DGN');\r\n let transcriptContent = isCAD ? props.documented.dwg_dgn_content : props.documented.translated_content;\r\n let highlightContent = transcriptContent ? transcriptContent : \"\";\r\n\r\n let newContent = [];\r\n if(searchTags[0] !== '*') {\r\n if(highlightContent) {\r\n if(searchTags.length === 1) {\r\n let splitedContent = highlightContent.toLowerCase().split(searchTags[0].toLowerCase(), Number.MAX_SAFE_INTEGER);\r\n if(splitedContent.length > 0) {\r\n if(splitedContent[0] === highlightContent.toLowerCase()) {\r\n splitedContent = [];\r\n }\r\n if(splitedContent.length > 1) {\r\n splitedContent.splice(0, 1);\r\n }\r\n for(let i=0; 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 \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n searchTagHandler(e)}>{name}\r\n
\r\n })\r\n\r\n const expandSeemore = () => {\r\n setActive(!isActive);\r\n };\r\n\r\n const paraChunkSmall = {\r\n maxHeight: \"3vw !important\",\r\n minHeight: \"3vw !important\",\r\n }\r\n\r\n const paraChunkBig = {\r\n maxHeight: \"6vw !important\",\r\n minHeight: \"6vw !important\",\r\n }\r\n\r\n return(\r\n \r\n
\r\n )\r\n}","import React, { useState, useEffect, useRef } from \"react\";\r\nimport CircularProgress from '@material-ui/core/CircularProgress';\r\nimport axios from 'axios';\r\nimport Highlighter from \"react-highlight-words\";\r\nimport DocViewer, { DocViewerRenderers } from \"react-doc-viewer\";\r\nimport saveAs from \"file-saver\";\r\nimport { withStyles, makeStyles } from '@material-ui/core/styles';\r\nimport Table from '@material-ui/core/Table';\r\nimport TableBody from '@material-ui/core/TableBody';\r\nimport TableCell from '@material-ui/core/TableCell';\r\nimport TableContainer from '@material-ui/core/TableContainer';\r\nimport TableRow from '@material-ui/core/TableRow';\r\nimport Paper from '@material-ui/core/Paper';\r\nimport moment from 'moment';\r\nimport { loginRequest } from \"../../authConfig\";\r\nimport { useMsal } from \"@azure/msal-react\";\r\nimport ErrorBoundary from '../../components/Errorlog/ErrorBoundary';\r\nimport { getAppInsights } from '../../TelemetryService';\r\nimport UserStore from '../../UserStore';\r\nimport Tooltip from '@material-ui/core/Tooltip';\r\nimport SearchTranscript from './SearchTranscript/SearchTranscript';\r\nimport { observer } from \"mobx-react-lite\";\r\nimport WebViewer from '@pdftron/webviewer';\r\nimport \"./Details.scss\";\r\nimport { Col, Row } from \"react-bootstrap\";\r\n\r\nconst StyledTableCell = withStyles((theme) => ({\r\n head: {\r\n backgroundColor: theme.palette.common.black,\r\n color: theme.palette.common.white,\r\n },\r\n body: {\r\n fontSize: 14,\r\n },\r\n}))(TableCell);\r\n\r\nconst StyledTableRow = withStyles((theme) => ({\r\n root: {\r\n '&:nth-of-type(odd)': {\r\n backgroundColor: theme.palette.action.hover,\r\n },\r\n },\r\n}))(TableRow);\r\n\r\nconst useStyles = makeStyles({\r\n table: {\r\n minWidth: 500,\r\n },\r\n});\r\n\r\nfunction Details(props) {\r\n // eslint-disable-next-line\r\n const [initalSearchTag, setInitalSearchTag] = useState(props.q.trim());\r\n const classes = useStyles();\r\n const [documented, setDocument] = useState({});\r\n const [selectedTab, setTab] = useState(0);\r\n const [isLoading, setIsLoading] = useState(true);\r\n const { instance, accounts } = useMsal();\r\n const [sasLink, setSasLink] = useState('');\r\n const [docs, setDocs] = useState([]);\r\n const [noRenderer, setNoRenderer] = useState(false);\r\n const [XMLData, setXMLData] = useState('');\r\n const [updateRender, setUpdateRender] = useState([]);\r\n const [CADloader, setCADloader] = useState(true);\r\n let [accountsValue] = accounts;\r\n const API_endpoint = process.env.REACT_APP_API_ENDPOINT;\r\n\r\n useEffect(() => {\r\n setDocument(props.detailsDoc);\r\n setIsLoading(false);\r\n setTimeout(() => {\r\n if(document.getElementById('no-renderer')) {\r\n setNoRenderer(true);\r\n }\r\n }, 2000);\r\n XMLparse(); \r\n // eslint-disable-next-line\r\n }, [noRenderer, sasLink, XMLData, updateRender]);\r\n\r\n useEffect(() => {\r\n if((initalSearchTag.startsWith(\"\\\"\") && initalSearchTag.endsWith(\"\\\"\"))) {\r\n updateRender.push(initalSearchTag.substring(1, initalSearchTag.length-1));\r\n } else {\r\n setUpdateRender(initalSearchTag.replace(/[\"']/g, '').split(\" \"));\r\n }\r\n // eslint-disable-next-line\r\n }, []);\r\n\r\n let path = documented.metadata_storage_path;\r\n\r\n async function generateSasToken() {\r\n const response = await instance.acquireTokenSilent({\r\n ...loginRequest,\r\n scopes: [process.env.REACT_APP_API_SCOPE],\r\n account: accountsValue\r\n });\r\n\r\n const accessToken = response.accessToken;\r\n console.log(\"access Token:-\",accessToken);\r\n const config = {\r\n headers: { Authorization: `Bearer ${accessToken}` }\r\n };\r\n\r\n if(path) {\r\n let res = await axios.get(\r\n API_endpoint + `/GenerateKmSasToken?fileStoragePath=${encodeURIComponent(path)}`, config\r\n );\r\n setSasLink(res.data);\r\n setDocs([{ uri: res.data }]);\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n generateSasToken();\r\n //eslint-disable-next-line\r\n }, [documented, accountsValue]);\r\n\r\n function downloadFile () {\r\n let docID = documented.document_id;\r\n let loggedInUser = UserStore.loggedInUser;\r\n getAppInsights().trackEvent({name: \"Click\", \r\n properties: {\r\n SearchServiceName: process.env.REACT_APP_SEARCH_SERVICE_NAME,\r\n ClickedDocId: docID,\r\n Action: \"Download\",\r\n Userid: loggedInUser\r\n }\r\n });\r\n\r\n if (path != null) {\r\n let link = sasLink;\r\n let fileName = documented.metadata_storage_name;\r\n axios({\r\n url: link, \r\n method: \"GET\",\r\n responseType: \"blob\"\r\n }).then(response => {\r\n var blob = new Blob([response.data], {\r\n type: \"text/plain;charset=utf-8\"\r\n });\r\n saveAs(blob, fileName);\r\n });\r\n }\r\n }\r\n\r\n async function XMLparse() {\r\n var docType = documented.metadata_storage_file_extension_lower;\r\n\r\n if(docType === '.xml' || docType === '.XML') {\r\n let response = await axios.get(sasLink, {\r\n \"Content-Type\": \"application/xml; charset=utf-8\"\r\n });\r\n setXMLData(response.data);\r\n }\r\n }\r\n\r\n const renderTranscript = (searchTags) => {\r\n setUpdateRender(searchTags);\r\n }\r\n\r\n const viewer = useRef(null);\r\n\r\n const findChunksSearch = ({\r\n autoEscape,\r\n caseSensitive,\r\n sanitize,\r\n searchWords,\r\n textToHighlight\r\n }) => {\r\n const chunks = [];\r\n const textLow = textToHighlight.toLowerCase();\r\n const sep = /[\\s~`!@#$%^&*()-_+=\\{\\}\\[\\]|\\\\:;\"'<,\\/>.?]/;\r\n const singleTextWords = textLow.split(sep);\r\n\r\n // It could be possible that there are multiple spaces between words\r\n // Hence we store the index (position) of each single word with textToHighlight\r\n let fromIndex = 0;\r\n const singleTextWordsWithPos = singleTextWords.map(s => {\r\n const indexInWord = textLow.indexOf(s, fromIndex);\r\n fromIndex = indexInWord;\r\n return {\r\n word: s,\r\n index: indexInWord\r\n };\r\n });\r\n\r\n // Add chunks for every searchWord\r\n searchWords.forEach(sw => {\r\n const swLow = sw.toLowerCase();\r\n // Do it for every single text word\r\n singleTextWordsWithPos.forEach(s => {\r\n if (s.word === swLow) {\r\n const start = s.index;\r\n const end = s.index + swLow.length;\r\n chunks.push({\r\n start,\r\n end\r\n });\r\n }\r\n });\r\n\r\n // The complete word including whitespace should also be handled\r\n if(swLow.split(\" \").length > 1) {\r\n for(let index in textLow) {\r\n let start = parseInt(index);\r\n let end = parseInt(index) + swLow.length;\r\n let sub = textLow.substring(start,end);\r\n let remain = textLow.substring(start,end+1);\r\n if(sub === swLow && (/[^a-zA-Z0-9]/.test( remain[remain.length - 1] ))) {\r\n chunks.push({\r\n start,\r\n end\r\n });\r\n }\r\n }\r\n }\r\n });\r\n\r\n\r\n return chunks;\r\n };\r\n\r\n\r\n // PDFTron useEffect\r\n useEffect(() => {\r\n if (WebViewer && viewer && viewer.current) {\r\n setCADloader(true);\r\n\r\n\r\n WebViewer(\r\n {\r\n path: '/webviewer/lib',\r\n // webviewerServerURL: 'https://cad-previewer.azurewebsites.net',\r\n webviewerServerURL: process.env.REACT_APP_PDFTRON_SERVER_URL,\r\n initialDoc: sasLink,\r\n licenseKey: process.env.REACT_APP_PDFTRON_LICENSE_KEY,\r\n },\r\n viewer.current,\r\n ).then((instance) => {\r\n \r\n const { annotationManager, documentViewer, Annotations, DocumentViewer,Search } = instance.Core;\r\n // const cadOpts = new instance.Core.PDFNet.Convert.CADConvertOptions();\r\n // cadOpts.setZoomToExtents(false);\r\n //instance.loadDocument(sasLink,{ cadOptions: cadOpts });\r\n const searchListener = (searchPattern, options, results) => {\r\n // add redaction annotation for each search result\r\n const newAnnotations = results.map(result => {\r\n const annotation = new Annotations.RedactionAnnotation();\r\n annotation.PageNumber = result.pageNum;\r\n annotation.Quads = result.quads.map(quad => quad.getPoints());\r\n annotation.StrokeColor = new Annotations.Color(\"#0000ffff\");\r\n return annotation;\r\n });\r\n \r\n annotationManager.addAnnotations(newAnnotations);\r\n annotationManager.drawAnnotationsFromList(newAnnotations);\r\n };\r\n let wholeword = false;\r\n let regexOperator = \"\";\r\n \r\n documentViewer.addEventListener('documentLoaded', () => {\r\n \r\n let searchPattern = props.q;\r\n\r\n // searchPattern can be something like \"search*m\" with \"wildcard\" option set to true\r\n // searchPattern can be something like \"search1|search2\" with \"regex\" option set to true\r\n let searchTag = [];\r\n if(searchPattern !== '*') {\r\n // eslint-disable-next-line\r\n searchPattern = searchPattern.trim();\r\n if((searchPattern.startsWith(\"\\\"\") && searchPattern.endsWith(\"\\\"\"))) {\r\n if(searchPattern.search(/\\bAND\\b/) > 0 || searchPattern.search(/\\bOR\\b/) > 0 || searchPattern.search(/\\bNOT\\b/) > 0){\r\n if(searchPattern.search(/\\bAND\\b/) > 0 || searchPattern.search(/\\bOR\\b/) > 0){\r\n searchTag = searchPattern.replace(new RegExp(/\\bAND\\b/), \"regexOperator\").replace(new RegExp(/\\bOR\\b/), \"regexOperator\").replace(/\"/g,'regexOperator').toLowerCase().split(\"regexoperator\");\r\n for(let index in searchTag) {\r\n searchTag[index] = searchTag[index].trim();\r\n }\r\n searchTag = searchTag.filter(function (obj) { \r\n // obj = obj.trim();\r\n return !['',' ',null, undefined].includes(obj)\r\n });\r\n }else{\r\n searchTag = searchPattern.replace(/\"/g,'regexOperator').split(\"NOT\")[0].toLowerCase().split(\"regexoperator\");\r\n for(let index in searchTag) {\r\n searchTag[index] = searchTag[index].trim();\r\n }\r\n searchTag = searchTag.filter(function (obj) { \r\n obj = obj.trim();\r\n return !['',' ',null, undefined].includes(obj) });\r\n }\r\n }else {\r\n const searchWord = searchPattern.substring(1, searchPattern.length-1).trim();\r\n wholeword = true;\r\n searchTag.push(searchWord + \"\");\r\n }\r\n \r\n } else {\r\n // eslint-disable-next-line\r\n searchTag = searchPattern.toLowerCase().replace(/[\\n\\t\\s]+/, \" \").split(\" \");\r\n searchTag = searchTag.filter(function (obj) { return !['',' ',null, undefined].includes(obj) });\r\n \r\n }\r\n } else {\r\n searchTag = '';\r\n }\r\n \r\n\r\n \r\n\r\n if((searchPattern.startsWith(\"\\\"\") && searchPattern.endsWith(\"\\\"\"))) {\r\n searchPattern = searchPattern.slice(1,-1);\r\n }\r\n\r\n // options default values are false\r\n let searchOptions = {\r\n caseSensitive: false, // match case\r\n wholeWord: wholeword, // match whole words only\r\n wildcard: false, // allow using '*' as a wildcard value\r\n regex: true, // string is treated as a regular expression\r\n searchUp: false, // search from the end of the document upwards\r\n ambientString: true, // return ambient string as part of the result\r\n };\r\n \r\n instance.UI.addSearchListener(searchListener);\r\n \r\n // start search after document loads\r\n let pattern = \"\";\r\n if(searchTag.length > 0) {\r\n pattern = searchTag[0];\r\n for(let k in searchTag) {\r\n if(k > 0)\r\n pattern = pattern + \"|\" + searchTag[k];\r\n }\r\n }\r\n\r\n instance.UI.searchTextFull(pattern,searchOptions);\r\n instance.UI.disableElements(['annotationDeleteButton']);\r\n instance.UI.disableElements(['annotationStyleEditButton']);\r\n instance.UI.disableElements(['annotationCommentButton']);\r\n instance.UI.disableElements([\"panToolButton\"]);\r\n instance.UI.disableElements([\"stickyToolButton\"]);\r\n instance.UI.disableElements([\"highlightToolButton\"]);\r\n instance.UI.disableElements([\"freeHandToolButton\"]);\r\n instance.UI.disableElements([\"freeHandHighlightToolButton\"]);\r\n instance.UI.disableElements([\"freeTextToolButton\"]);\r\n instance.UI.overrideSearchExecution((searchTerm, options) => {\r\n if(searchTerm.charAt(searchTerm.length - 1) !== \"|\") {\r\n options.regex = true;\r\n instance.UI.searchTextFull(searchTerm,options)\r\n pattern = searchTerm;\r\n searchOptions = options\r\n }\r\n });\r\n instance.UI.searchTextFull(pattern,searchOptions);\r\n });\r\n\r\n documentViewer.setSearchHighlightColors({\r\n searchResult: 'rgba(255, 255, 0, 0.5)',\r\n activeSearchResult: 'rgba(255, 255, 0, 0.5)'\r\n });\r\n setCADloader(false);\r\n // const { documentViewer, DocumentViewer } = instance.Core;\r\n\r\n const fitWidth = () => {\r\n documentViewer.setFitMode(documentViewer.FitMode.FitWidth);\r\n };\r\n\r\n documentViewer.addEventListener(DocumentViewer.Events.DOCUMENT_LOADED, fitWidth);\r\n documentViewer.addEventListener(DocumentViewer.Events.PAGE_NUMBER_UPDATED, fitWidth);\r\n\r\n /* zoom for each page */\r\n instance.Core.documentViewer.getDisplayModeManager().setDisplayMode(new instance.Core.DisplayMode(instance.Core.documentViewer, 'Single'));\r\n instance.UI.disableElements(['ribbons']);\r\n instance.UI.disableElements(['toolsHeader']);\r\n\r\n instance.UI.setHeaderItems(header => {\r\n const items = header.getItems();\r\n const newItems = [items[0], items[1], items[2], items[3], items[4], items[9], items[11], items[12]];\r\n header.update(newItems);\r\n });\r\n }).catch((err) => {\r\n // console.log(err);\r\n })\r\n }\r\n // eslint-disable-next-line\r\n }, [viewer, sasLink, selectedTab]);\r\n\r\n // View default is loading with no active tab\r\n let detailsBody = (\r\n Please type keywords to search in transcript} arrow>\r\n onEnterButton(e)}\r\n onChange={onChangeHandler}\r\n InputProps={{ disableUnderline: true }}\r\n >\r\n \r\n
\r\n {/* Occurences: {occurences} */}\r\n Keyphrases\r\n \r\n \r\n
\r\n \r\n {tagList.length ? tagList : Keyphrases are not available for this document.}\r\n {props.keyphrases.length > 15 && {isActive ? see more... : see less...}}\r\n
\r\n \r\n {highlightContent ? \r\n showTrancript.map((para, key) => (\r\n
\r\n \r\n
\r\n );\r\n }\r\n let transcriptContent = (doc === '.dwg' || doc === '.DWG' || doc === '.dgn' || doc === '.DGN') ? documented.dwg_dgn_content : documented.translated_content;\r\n let highlightContent = transcriptContent ? transcriptContent : \"\";\r\n \r\n // view transcript\r\n if (selectedTab === 1) {\r\n transcriptStyle += \" active\";\r\n detailsBody = (\r\n \r\n
\r\n \r\n Download the document} arrow>\r\n ![\"downloadFile\"](\"/images/Download.svg\")
\r\n \r\n
\r\n \r\n \r\n {(isCAD && CADloader) && \r\n \r\n }\r\n { (noRenderer && !isCAD) &&\r\n
\r\n Please use the download option to view file.
}\r\n \r\n {highlightContent ? \r\n
\r\n )\r\n }\r\n\r\n function createData(name, data) {\r\n return { name, data };\r\n }\r\n\r\n const showKeyphrasesAsString = props.keyphrases.join(', ');\r\n\r\n const rows = [\r\n createData('File name', documented.metadata_storage_name ? documented.metadata_storage_name : \"NA\"),\r\n createData('Extension', documented.metadata_storage_file_extension_lower ? documented.metadata_storage_file_extension_lower : \"NA\"),\r\n createData('Created on', documented.metadata_creation_date ? moment(documented.metadata_creation_date).format('DD-MM-YYYY') : 'NA'),\r\n createData('Language', documented.language ? documented.language : \"NA\"),\r\n createData('Source', documented.metadata_storage_path? documented.metadata_storage_path : \"NA\"),\r\n createData('Keyphrases', documented.keyphrases.length ? showKeyphrasesAsString : \"Keyphrases are not available for this document.\")\r\n ];\r\n \r\n const table = (\r\n \r\n {table}\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 {name.toLowerCase()}\r\n
\r\n );\r\n });\r\n\r\n let dateTime = props.document.metadata_creation_date;\r\n let datestring = moment(dateTime).format(\"DD MMM YYYY\");\r\n if (dateTime == null) {\r\n datestring = \"NA\";\r\n }\r\n\r\n const handleClose = () => setShow(false);\r\n\r\n const handleShow = () => {\r\n setShow(true);\r\n let docID = props.document.document_id;\r\n let loggedInUser = UserStore.loggedInUser;\r\n getAppInsights().trackEvent({\r\n name: \"Click\",\r\n properties: {\r\n SearchServiceName: process.env.REACT_APP_SEARCH_SERVICE_NAME,\r\n ClickedDocId: docID,\r\n Action: \"Preview\",\r\n Userid: loggedInUser,\r\n },\r\n });\r\n };\r\n\r\n const expandSeemore = () => {\r\n setActive(!isActive);\r\n };\r\n\r\n let taglistStyle = {\r\n height: \"2.5rem\",\r\n marginLeft: \"1%\",\r\n };\r\n\r\n let taglistStyle1 = {\r\n height: \"7.8rem\",\r\n marginLeft: \"1%\",\r\n };\r\n\r\n const findChunksSearch = ({\r\n autoEscape,\r\n caseSensitive,\r\n sanitize,\r\n searchWords,\r\n textToHighlight,\r\n }) => {\r\n const chunks = [];\r\n const textLow = textToHighlight.toLowerCase();\r\n const sep = /[\\s~`!@#$%^&*()-_+=\\{\\}\\[\\]|\\\\:;\"'<,\\/>.?]/;\r\n const singleTextWords = textLow.split(sep);\r\n\r\n // It could be possible that there are multiple spaces between words\r\n // Hence we store the index (position) of each single word with textToHighlight\r\n let fromIndex = 0;\r\n const singleTextWordsWithPos = singleTextWords.map((s) => {\r\n const indexInWord = textLow.indexOf(s, fromIndex);\r\n fromIndex = indexInWord;\r\n return {\r\n word: s,\r\n index: indexInWord,\r\n };\r\n });\r\n\r\n // Add chunks for every searchWord\r\n searchWords.forEach((sw) => {\r\n const swLow = sw.toLowerCase();\r\n // Do it for every single text word\r\n singleTextWordsWithPos.forEach((s) => {\r\n if (s.word === swLow) {\r\n const start = s.index;\r\n const end = s.index + swLow.length;\r\n chunks.push({\r\n start,\r\n end,\r\n });\r\n }\r\n });\r\n\r\n // The complete word including whitespace should also be handled\r\n if (swLow.split(\" \").length > 1) {\r\n for (let index in textLow) {\r\n let start = parseInt(index);\r\n let end = parseInt(index) + swLow.length;\r\n let sub = textLow.substring(start, end);\r\n let remain = textLow.substring(start, end + 1);\r\n if (sub === swLow && /[^a-zA-Z0-9]/.test(remain[remain.length - 1])) {\r\n chunks.push({\r\n start,\r\n end,\r\n });\r\n }\r\n }\r\n }\r\n });\r\n\r\n return chunks;\r\n };\r\n\r\n async function downloadFile() {\r\n const response = await instance.acquireTokenSilent({\r\n ...loginRequest,\r\n scopes: [process.env.REACT_APP_API_SCOPE],\r\n account: accountsValue,\r\n });\r\n\r\n const accessToken = response.accessToken;\r\n\r\n const config = {\r\n headers: { Authorization: `Bearer ${accessToken}` },\r\n };\r\n\r\n let path = props.document.metadata_storage_path;\r\n\r\n let res = await axios.get(\r\n API_endpoint +\r\n `/GenerateKmSasToken?fileStoragePath=${encodeURIComponent(path)}`,\r\n config\r\n );\r\n\r\n let docID = props.document.document_id;\r\n let loggedInUser = UserStore.loggedInUser;\r\n getAppInsights().trackEvent({\r\n name: \"Click\",\r\n properties: {\r\n SearchServiceName: process.env.REACT_APP_SEARCH_SERVICE_NAME,\r\n ClickedDocId: docID,\r\n Action: \"Download\",\r\n Userid: loggedInUser,\r\n },\r\n });\r\n if (path != null) {\r\n let link = res.data;\r\n let fileName = props.document.metadata_storage_name;\r\n axios({\r\n url: link,\r\n method: \"GET\",\r\n responseType: \"blob\",\r\n }).then((response) => {\r\n // const url = window.URL.createObjectURL(new Blob([response.data]));\r\n var blob = new Blob([response.data], {\r\n type: \"text/plain;charset=utf-8\",\r\n });\r\n saveAs(blob, fileName);\r\n });\r\n }\r\n }\r\n\r\n return (\r\n \r\n Keyphrases} arrow>\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n Download the document} arrow>\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 {props.document.metadata_storage_name}\r\n
\r\n\r\n
\r\n \r\n \r\n {newContent ? (\r\n
\r\n \r\n {datestring} | {language} {discipline ? `| ${discipline}` : \"\"}{\" \"}\r\n {project ? `| ${project}` : \"\"}\r\n
\r\n \r\n \r\n {tagList}\r\n
\r\n \r\n {isActive ?
\r\n \r\n
\r\n );\r\n};\r\n","import React, {useState, useEffect} from 'react';\r\nimport './Pager.scss';\r\n\r\nexport default function Pager(props) {\r\n\r\n let [selectedPage, setSelectedPage] = useState(props.currentPage);\r\n let totalPages = Math.ceil(props.resultCount / props.resultsPerPage);\r\n\r\n useEffect(_=>{\r\n props.setCurrentPageValue(selectedPage);\r\n }, [selectedPage, props]);\r\n\r\n function goToNextPage() {\r\n setSelectedPage(selectedPage + 1);\r\n }\r\n\r\n function goToPreviousPage() {\r\n setSelectedPage(selectedPage - 1);\r\n }\r\n\r\n var i = 0;\r\n var page_links = [];\r\n\r\n var minPage = 1;\r\n var maxPage = totalPages;\r\n\r\n if (selectedPage - minPage > 2) {\r\n minPage = selectedPage - 2;\r\n }\r\n\r\n if (maxPage - selectedPage > 2) {\r\n maxPage = parseInt(selectedPage) + 2;\r\n }\r\n\r\n\r\n for (i = minPage; i <= maxPage; i++) {\r\n if (i === parseInt(selectedPage)) {\r\n page_links.push(\r\n Showing {beginDocNumber}-{endDocNumber} of {props.count.toLocaleString()} results...
\r\n\r\n
\r\n \r\n {results}\r\n
\r\n \r\n setIsExpanded(!isExpanded)}\r\n style={{ borderBottom: \"1px solid lightgrey\", paddingLeft: \"1.5vw !important\" }}\r\n >\r\n \r\n \r\n \r\n {checkboxes}\r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nconst FacetListItem = styled(ListItem)({\r\n paddingLeft: \"1.5vw !important\",\r\n});\r\n\r\nconst FacetValuesList = styled(List)({\r\n maxHeight: 340,\r\n overflowY: \"auto !important\",\r\n marginRight: \"18px !important\",\r\n});","import React from \"react\";\r\nimport { List } from \"@material-ui/core\";\r\nimport CheckboxFacet from \"./CheckboxFacet/CheckboxFacet\";\r\nimport styled from \"styled-components\";\r\nimport Button from \"@material-ui/core/Button\";\r\nimport Tooltip from \"@material-ui/core/Tooltip\";\r\nimport \"./Facets.scss\";\r\n\r\nexport default function Facets(props) {\r\n function mapFacetName(facetName) {\r\n const capitalizeFirstLetter = (string) =>\r\n string[0] ? `${string[0].toUpperCase()}${string.substring(1)}` : \"\";\r\n facetName = capitalizeFirstLetter(facetName);\r\n facetName = facetName.replace(/_/g, \" \");\r\n if (facetName === \"Metadata storage file extension lower\") {\r\n facetName = facetName.replace(\r\n /Metadata storage file extension lower/,\r\n \"Document Type\"\r\n );\r\n }\r\n if (facetName === \"Metadata storage file extension\") {\r\n facetName = facetName.replace(\r\n /Metadata storage file extension/,\r\n \"Document Type\"\r\n );\r\n }\r\n if (facetName === \"Metadata creation date\") {\r\n facetName = facetName.replace(/Metadata creation date/, \"Time Period\");\r\n }\r\n if (facetName === \"Metadata project\") {\r\n facetName = facetName.replace(/Metadata project/, \"Project\");\r\n }\r\n if (facetName === \"Metadata discipline\") {\r\n facetName = facetName.replace(/Metadata discipline/, \"Discipline\");\r\n }\r\n if (facetName === \"Metadata businessunit\") {\r\n facetName = facetName.replace(/Metadata businessunit/, \"Business Unit\");\r\n }\r\n if (facetName === \"Metadata location\") {\r\n facetName = facetName.replace(/Metadata location/, \"Location\");\r\n }\r\n return facetName;\r\n }\r\n\r\n function addFilter(name, value) {\r\n const newFilters = props.filters.concat({ field: name, value: value });\r\n props.setFilters(newFilters);\r\n }\r\n\r\n function removeFilter(filter) {\r\n const newFilters = props.filters.filter(\r\n (item) => item.value !== filter.value\r\n );\r\n props.setFilters(newFilters);\r\n }\r\n\r\n function resetFilters() {\r\n props.setFilters([]);\r\n }\r\n\r\n function applayFilters() {\r\n props.applayFilters();\r\n }\r\n\r\n var facets;\r\n try {\r\n facets = Object.keys(props.facets).map((key) => {\r\n return (\r\n \r\n
\r\n );\r\n}\r\n\r\nconst FacetList = styled(List)({\r\n marginTop: \"0 !important\",\r\n paddingTop: \"0 !important\",\r\n});\r\n","import React, { useEffect, useState } from 'react';\r\nimport axios from 'axios';\r\nimport LoadingOverlay from 'react-loading-overlay';\r\nimport { useLocation, useHistory } from \"react-router-dom\";\r\nimport AppHeader from '../../components/AppHeader/AppHeader';\r\nimport Results from '../../components/Results/Results';\r\nimport Pager from '../../components/Pager/Pager';\r\nimport Facets from '../../components/Facets/Facets';\r\nimport SearchBar from '../../components/SearchBar/SearchBar';\r\nimport ErrorBoundary from '../../components/Errorlog/ErrorBoundary';\r\nimport { loginRequest } from \"../../authConfig\";\r\nimport { useMsal } from \"@azure/msal-react\";\r\nimport MenuItem from '@material-ui/core/MenuItem';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport Select from '@material-ui/core/Select';\r\nimport { ToastProvider } from 'react-toast-notifications';\r\nimport UserStore from '../../UserStore';\r\n\r\nimport \"./Search.scss\";\r\nimport { Row,Col } from 'react-bootstrap';\r\n\r\nexport default function Search() {\r\n\r\n let location = useLocation();\r\n let history = useHistory();\r\n const { instance, accounts } = useMsal();\r\n let [accountsValue] = accounts;\r\n const [results, setResults] = useState([]);\r\n const [resultCount, setResultCount] = useState(0);\r\n const [currentPage, setCurrentPage] = useState(1);\r\n const [q, setQ] = useState(UserStore.initialQ ?? \"\");\r\n const [top] = useState(new URLSearchParams(location.search).get('top') ?? 10);\r\n const [skip, setSkip] = useState(new URLSearchParams(location.search).get('skip') ?? 0);\r\n const [filters, setFilters] = useState([]);\r\n const [facets, setFacets] = useState({});\r\n const [isLoading, setIsLoading] = useState(true);\r\n const [sort, setSort] = useState('relevance');\r\n\r\n let resultsPerPage = top;\r\n\r\n const API_endpoint = process.env.REACT_APP_API_ENDPOINT;\r\n const groupBy = (arr, key) => {\r\n const initialValue = {};\r\n return arr.reduce((acc, cval) => {\r\n const myAttribute = cval[key];\r\n acc[myAttribute] = [...(acc[myAttribute] || []), cval]\r\n return acc;\r\n }, initialValue);\r\n }; \r\n \r\n // creates filters in odata syntax\r\n const createFilterExpression = (filterList) => {\r\n let filterExpressions = [];\r\n if(filterList.length) {\r\n \r\n const facetsGroup = groupBy(filterList, \"field\");\r\n for(let input in facetsGroup){\r\n if (input === 'metadata_location') {\r\n filterExpressions.push(facetsGroup[input].map(e => `${input} eq '${e.value}'`).join(\" or \"));\r\n }\r\n if (input === 'language') {\r\n filterExpressions.push(facetsGroup[input].map(e => `${input} eq '${e.value}'`).join(\" or \"));\r\n }\r\n if (input === 'metadata_storage_file_extension_lower') {\r\n filterExpressions.push(facetsGroup[input].map(e => `${input} eq '${e.value}'`).join(\" or \"));\r\n }\r\n if (input === 'metadata_creation_date') {\r\n filterExpressions.push(facetsGroup[input].map(e => `(${input} ge ${e.value}-01-01T00:00:00Z and ${input} le ${e.value}-12-31T23:59:59Z)`).join(\" or \"));\r\n }\r\n if (input === 'metadata_project') {\r\n filterExpressions.push(facetsGroup[input].map(e => `${input} eq '${e.value}'`).join(\" or \"));\r\n }\r\n if (input === 'metadata_discipline') {\r\n filterExpressions.push(facetsGroup[input].map(e => `${input} eq '${e.value}'`).join(\" or \"));\r\n }\r\n if (input === 'metadata_businessunit') {\r\n filterExpressions.push(facetsGroup[input].map(e => `${input} eq '${e.value}'`).join(\" or \"));\r\n }\r\n }\r\n const addbraces = `(${ filterExpressions.join(') and (')})`;\r\n return addbraces;\r\n }else {\r\n return filterExpressions.join(' and ');\r\n }\r\n }\r\n\r\n // If search term is empty, search everything\r\n if (!q || q === \"\" || q === \" \" || !q.trim().length) {\r\n setQ('*');\r\n }\r\n\r\n let apiFilters = encodeURIComponent(createFilterExpression(filters, facets).toString());\r\n const handleChange = (e) => {\r\n setSort(e.target.value);\r\n }\r\n\r\n async function searchResultsCall() {\r\n setIsLoading(true);\r\n const response = await instance.acquireTokenSilent({\r\n ...loginRequest,\r\n scopes: [process.env.REACT_APP_API_SCOPE],\r\n account: accountsValue\r\n });\r\n const accessToken = response.accessToken;\r\n const config = {\r\n headers: { Authorization: `Bearer ${accessToken}` }\r\n };\r\n \r\n if (currentPage > 0 && sort === 'recent') {\r\n let res = await axios.get(\r\n API_endpoint + `/GetKmSearch?searchText=${encodeURIComponent(q)}&size=${top}&skip=${skip}&filter=${apiFilters}&orderby=metadata_creation_date desc`,\r\n config\r\n );\r\n setResults(res.data.value);\r\n setFacets(res.data.facets);\r\n setResultCount(res.data.totalCount);\r\n setIsLoading(false);\r\n } else {\r\n let res = await axios.get(\r\n API_endpoint + `/GetKmSearch?searchText=${encodeURIComponent(q)}&size=${top}&skip=${skip}&filter=${apiFilters}`,\r\n config\r\n );\r\n\r\n setResults(res.data.value);\r\n setFacets(res.data.facets);\r\n setResultCount(res.data.totalCount);\r\n setIsLoading(false);\r\n }\r\n }\r\n\r\n useEffect(() => {\r\n if(accountsValue) { searchResultsCall(); }\r\n //eslint-disable-next-line \r\n }, [q, top, skip, currentPage, sort, accountsValue]);\r\n \r\n useEffect(() => {\r\n setCurrentPage(1);\r\n if(filters.length === 0) {\r\n searchResultsCall();\r\n }\r\n \r\n }, [filters]);\r\n \r\n // pushing the new search term to history when q is updated\r\n useEffect(() => {\r\n history.push('/search?q=' + q);\r\n setCurrentPage(1);\r\n setFilters([]);\r\n // eslint-disable-next-line \r\n }, [q]);\r\n\r\n let postSearchHandler = (searchTerm) => {\r\n setQ(searchTerm);\r\n }\r\n\r\n let updatePagination = (newPageNumber) => {\r\n setCurrentPage(newPageNumber);\r\n setSkip((newPageNumber - 1) * top);\r\n }\r\n\r\n var body;\r\n if (isLoading) {\r\n body = (\r\n \r\n \r\n {facets}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n ![](\"/images/Settings.svg\")
*/}\r\n
\r\n FILTERS
\r\n \r\n apply filter} arrow>\r\n \r\n APPLY\r\n \r\n \r\n Reset Filters} arrow>\r\n \r\n
\r\n {/* */}\r\n \r\n {/*
);\r\n } else {\r\n body = (\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 \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 {body}\r\n
\r\n \r\n ![\"icon_delete\"](\"/images/icon_delete.svg\"){kind=icon}
\r\n \r\n \r\n \r\n\r\n \r\n {editRowData ? (\r\n Edit Expression \r\n ) : (\r\n Add Expression \r\n )}\r\n \r\n \r\n \r\n Save\r\n \r\n \r\n Cancel\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {\" \"}\r\n handleLOCPurge(e)}\r\n style={{\r\n padding: \"0\",\r\n background: \"#0C629B\",\r\n color: \"white\",\r\n position: \"absolute\",\r\n right: \"2%\",\r\n width: \"2vw\",\r\n height: \"2vw\",\r\n }}\r\n >\r\n {\" \"}\r\n \r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from 'react';\r\nimport { BrowserRouter as Router, Switch, Route } from 'react-router-dom';\r\nimport { getAppInsights } from '../TelemetryService';\r\nimport TelemetryProvider from '../telemetry-provider';\r\n\r\n// React Router page components\r\nimport Home from '../pages/Home/Home';\r\nimport Search from '../pages/Search/Search';\r\nimport Details from '../pages/Details/Details';\r\nimport Regex from '../pages/Regex/Regex';\r\n\r\n// Bootstrap styles, optionally with jQuery and Popper\r\nimport 'bootstrap/dist/css/bootstrap.min.css';\r\n\r\n// Custom app styles\r\nimport './App.scss';\r\n\r\nexport default function App() {\r\n\r\n let appInsights = null;\r\n const instrumentationKey = process.env.REACT_APP_INSTRUMENTATION_KEY;\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n Reset Skill\r\n \r\n\r\n \r\n Add row\r\n \r\n
\r\n \r\n \r\n
\r\n Regular Expression
\r\n \r\n
\r\n\r\n *Edit regular expression will reset the skill.
\r\n ) : (\r\n *Adding new regular expression will reset the skill.
\r\n )}\r\n {regexValueError ? (\r\n \r\n Please enter Regular Expression\r\n
\r\n ) : (\r\n \r\n )}\r\n \r\n Are you sure to delete?
\r\n \r\n \r\n {/* eslint-disable-next-line */}\r\n { appInsights = getAppInsights() }}>\r\n \r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n","import React from 'react';\r\nimport ReactDOM from 'react-dom'\r\nimport App from './App/App';\r\nimport { PublicClientApplication } from \"@azure/msal-browser\";\r\nimport { MsalProvider } from \"@azure/msal-react\";\r\nimport { msalConfig } from \"./authConfig\";\r\n\r\n/**\r\n * Initialize a PublicClientApplication instance which is provided to the MsalProvider component\r\n * We recommend initializing this outside of your root component to ensure it is not re-initialized on re-renders\r\n */\r\nconst msalInstance = new PublicClientApplication(msalConfig);\r\n\r\nReactDOM.render(\r\n