\r\n
activeTab(0, '#project-basics')}\r\n className={openSecction === 0 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Project Basics\r\n
\r\n
{\r\n activeTab(1, '#problem');\r\n }}\r\n className={openSecction === 1 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Problem\r\n
\r\n
{\r\n activeTab(3, '#proposed-actions');\r\n }}\r\n className={openSecction === 3 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Proposed Actions\r\n
\r\n
{\r\n activeTab(2, '#vendors');\r\n }}\r\n className={openSecction === 2 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Vendors\r\n
\r\n
{\r\n activeTab(4, '#project-roadmap');\r\n }}\r\n className={openSecction === 4 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Project Roadmap\r\n
\r\n {((appUser && appUser.designation && (appUser.designation === ADMIN || appUser.designation === STAFF)) ||\r\n isPartnerLG) && (\r\n
{\r\n activeTab(6, '#project-financials');\r\n }}\r\n className={openSecction === 6 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Project Financials\r\n
\r\n )}\r\n
{\r\n activeTab(8, '#maps');\r\n }}\r\n className={openSecction === 8 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Maps\r\n
\r\n
{\r\n activeTab(9, '#gallery');\r\n }}\r\n className={openSecction === 9 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Gallery\r\n
\r\n
{\r\n activeTab(10, '#attachments');\r\n }}\r\n className={openSecction === 10 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Attachments\r\n
\r\n
{\r\n if (activeScroll) {\r\n activeTab(11, '#links');\r\n }\r\n }}\r\n className={openSecction === 11 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n Links\r\n
\r\n
{\r\n if (activeScroll) {\r\n activeTab(12, '#history');\r\n }\r\n }}\r\n className={openSecction === 12 ? 'detailed-tab detailed-tab-active' : 'detailed-tab'}\r\n style={!activeScroll ? { cursor: 'default' } : { cursor: 'pointer' }}\r\n >\r\n History\r\n
\r\n
\r\n {\r\n setScrollPositionTop(divRef.current?.scrollTop);\r\n if (divRef.current?.scrollTop !== scrollPositionTop) {\r\n setClickOpenPopup(false);\r\n }\r\n if (activeScroll) {\r\n const projectDiv = document.getElementById('project-basics');\r\n const rectProject = projectDiv?.getBoundingClientRect();\r\n if (\r\n rectProject &&\r\n rectProject.top >= 0 &&\r\n rectProject.left >= 0 &&\r\n rectProject.bottom <= window.innerHeight &&\r\n rectProject.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(0);\r\n }\r\n const problemDiv = document.getElementById('problem');\r\n const rectProblem = problemDiv?.getBoundingClientRect();\r\n if (\r\n rectProblem &&\r\n rectProblem.top >= 0 &&\r\n rectProblem.left >= 0 &&\r\n rectProblem.bottom <= window.innerHeight &&\r\n rectProblem.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(1);\r\n }\r\n const vendorsDiv = document.getElementById('vendors');\r\n const rectVendors = vendorsDiv?.getBoundingClientRect();\r\n if (\r\n rectVendors &&\r\n rectVendors.top >= 0 &&\r\n rectVendors.left >= 0 &&\r\n rectVendors.bottom <= window.innerHeight &&\r\n rectVendors.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(2);\r\n }\r\n const solutionsDiv = document.getElementById('proposed-actions');\r\n const rectSolutions = solutionsDiv?.getBoundingClientRect();\r\n if (\r\n rectSolutions &&\r\n rectSolutions.top >= 0 &&\r\n rectSolutions.left >= 0 &&\r\n rectSolutions.bottom <= window.innerHeight &&\r\n rectSolutions.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(3);\r\n }\r\n const roadmapDiv = document.getElementById('project-roadmap');\r\n const rectRoadmap = roadmapDiv?.getBoundingClientRect();\r\n if (\r\n rectRoadmap &&\r\n rectRoadmap.top >= 0 &&\r\n rectRoadmap.left >= 0 &&\r\n rectRoadmap.bottom <= window.innerHeight &&\r\n rectRoadmap.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(4);\r\n }\r\n const projectFinancialsDiv = document.getElementById('project-financials');\r\n const rectProjectFinancials = projectFinancialsDiv?.getBoundingClientRect();\r\n if (\r\n rectProjectFinancials &&\r\n rectProjectFinancials.top >= 0 &&\r\n rectProjectFinancials.left >= 0 &&\r\n rectProjectFinancials.bottom <= window.innerHeight &&\r\n rectProjectFinancials.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(6);\r\n }\r\n const mapDiv = document.getElementById('maps');\r\n const rectMap = mapDiv?.getBoundingClientRect();\r\n if (\r\n rectMap &&\r\n rectMap.top >= 0 &&\r\n rectMap.left >= 0 &&\r\n rectMap.bottom <= window.innerHeight &&\r\n rectMap.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(8);\r\n }\r\n const galleryDiv = document.getElementById('gallery');\r\n const rectGallery = galleryDiv?.getBoundingClientRect();\r\n if (\r\n rectGallery &&\r\n rectGallery.top >= 0 &&\r\n rectGallery.left >= 0 &&\r\n rectGallery.bottom <= window.innerHeight &&\r\n rectGallery.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(9);\r\n }\r\n const attachmentsDiv = document.getElementById('attachments');\r\n const rectAttachments = attachmentsDiv?.getBoundingClientRect();\r\n if (\r\n rectAttachments &&\r\n rectAttachments.top >= 0 &&\r\n rectAttachments.left >= 0 &&\r\n rectAttachments.bottom <= window.innerHeight &&\r\n rectAttachments.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(10);\r\n }\r\n const linksDiv = document.getElementById('links');\r\n const rectlinks = linksDiv?.getBoundingClientRect();\r\n if (\r\n rectlinks &&\r\n rectlinks.top >= 0 &&\r\n rectlinks.left >= 0 &&\r\n rectlinks.bottom <= window.innerHeight &&\r\n rectlinks.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(11);\r\n }\r\n const historyDiv = document.getElementById('history');\r\n const rectHistory = historyDiv?.getBoundingClientRect();\r\n if (\r\n rectHistory &&\r\n rectHistory.top >= 0 &&\r\n rectHistory.left >= 0 &&\r\n rectHistory.bottom <= window.innerHeight &&\r\n rectHistory.right <= window.innerWidth\r\n ) {\r\n setOpenSecction(12);\r\n }\r\n }\r\n }}\r\n ref={divRef}\r\n >\r\n \r\n \r\n \r\n {detailed?.problemid ? (\r\n \r\n {' '}\r\n

\r\n {' '}\r\n
\r\n ) : detailed?.attachments ? (\r\n detailed?.attachments.map((image: string, index: number) => {\r\n return (\r\n {\r\n setOpenImage(true);\r\n setActive(0);\r\n }}\r\n >\r\n

\r\n
\r\n );\r\n })\r\n ) : projectType ? (\r\n {\r\n setOpenImage(true);\r\n setActive(0);\r\n }}\r\n >\r\n {' '}\r\n

{' '}\r\n
\r\n ) : (\r\n <>>\r\n )}\r\n \r\n {((typeS === FILTER_PROJECTS_TRIGGER && tabActiveNavbar === MAP) || tabActiveNavbar !== MAP) && (\r\n <>\r\n {\r\n setOpenImage(true);\r\n setActive(2);\r\n }}\r\n >\r\n \r\n
\r\n\r\n \r\n {\r\n carouselRef.current.prev();\r\n }}\r\n />\r\n
\r\n \r\n {\r\n carouselRef.current.next();\r\n }}\r\n />\r\n
\r\n >\r\n )}\r\n \r\n {typeS === 'Problems' ? (\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n ) : (\r\n <> \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n \r\n options={TYPES_TOGGLE}\r\n onChange={(value) => {\r\n setToggle(value);\r\n }}\r\n value={toggle}\r\n />\r\n
\r\n {toggle === \"Schedule\" &&
}\r\n {toggle === \"Phase\" &&
}\r\n
\r\n
\r\n {((appUser &&\r\n appUser.designation &&\r\n (appUser.designation === ADMIN || appUser.designation === STAFF)) ||\r\n isPartnerLG) && (\r\n <>\r\n {project_idS &&
}\r\n >\r\n )}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n >\r\n )}\r\n
\r\n \r\n \r\n {appUser.firstName === '' || appUser.firstName === 'guest' ? (\r\n \r\n ) : openPiney ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n