Page MenuHomec4science
Files F88360807

page.js
No OneTemporary
Actions

File Metadata

Created
Fri, Oct 18, 09:39

page.js
View Options

'use client'
import Header from '../components/header/Header';
import SearchBar from "@/app/components/searchBar/SearchBar";
import ConceptBoxes from "@/app/components/conceptBoxes/ConceptBoxes";
import ForceGraph_bu from "@/app/components/ForceGraph/ForceGraph_bu";
import ToolTip from "@/app/components/toolTip/ToolTip";
import {useState, useLayoutEffect, useRef, useEffect} from "react";
import TabulatorTable from "@/app/components/TabulatorTable/TabulatorTable";
import SemanticMap from "@/app/components/SemanticMap/SemanticMap";
import freeTextSearch from "@/app/utils/utils";
export default function Test() {
// console.log("rendering page")
const [searchData, setSearchData] = useState({
'tableColumnsInRightOrder': [],
'table': [],
'conceptsToAddBoxes': [],
'conceptsOfPeople': {}
});
const [searchTerm, setSearchTerm] = useState('');
const [tableColumnsInRightOrder, setTableColumnsInRightOrder] = useState([]);
const [tableReceived, setTableReceived] = useState([]);
const [searchEntity, setSearchEntity] = useState('courses');
const [activeFilters, setActiveFilters] = useState({});
const [toolTipVisible, setToolTipVisible] = useState(false);
const [toolTipContent, setToolTipContent] = useState(null);
const [dataDisplayed, setDataDisplayed] = useState([]);
const [scrollYPosition, setScrollYPosition] = useState(0);
useEffect(() => {
console.log('datadisplayed', dataDisplayed)
}, [dataDisplayed])
useEffect(() => {
const handleScroll = () => {
setScrollYPosition(window.scrollY);
};
window.addEventListener('scroll', handleScroll);
return () => {
window.removeEventListener('scroll', handleScroll);
};
}, []);
useEffect(() => {
if (searchData !== null) {
setTimeout(() => {
window.scrollTo(0, scrollYPosition);
console.log("Restored scroll position: ", scrollYPosition);
}, 1);
}
}, [searchData]);
const handleSearchData = (data) => {
// setSearchExecuted(prev => !prev)
console.log("data", data)
setSearchData(data);
setTableColumnsInRightOrder(
data['tableColumnsInRightOrder'].filter(function (d) {
return !['CourseCode', 'SectionCode', 'School', 'Level', 'SCIPERprofessors', 'Summary', 'Professors', 'Title', 'courseCode', 'id'].includes(d)
}))
setTableReceived(data['table'])
};
return (
<div className="round-card page-content-table table-responsive padding-20">
<div className="container" style={{display: 'flex', flexDirection: 'column', minHeight: '120vh'}}>
<Header
englishTutorialURL={'https://youtu.be/x8sp1veIp1E'}
frenchTutorialURL={'https://youtu.be/YyIGo-g755I'}/>
<SearchBar
handleSearchData={handleSearchData}
setSearchEntity={setSearchEntity}
searchEntity={searchEntity}
conceptsOrVectors={'vectors'}
freeTextSearch={freeTextSearch}
setRenderForceGraph={()=>{}}
searchData={searchData}
setSearchData={setSearchData}
searchTerm={searchTerm}
setSearchTerm={setSearchTerm}
></SearchBar>
<ToolTip
toolTipVisible={toolTipVisible}
toolTipContent={toolTipContent}
></ToolTip>
<ConceptBoxes
tableColumnsInRightOrder={tableColumnsInRightOrder}
setTableColumnsInRightOrder={setTableColumnsInRightOrder}
setToolTipVisible={setToolTipVisible}
setToolTipContent={setToolTipContent}
freeTextSearch={freeTextSearch}
searchData={searchData}
setSearchData={setSearchData}
>
</ConceptBoxes>
<TabulatorTable data={tableReceived}
tableColumnsInRightOrder={tableColumnsInRightOrder}
searchEntity={searchEntity}
setToolTipVisible={setToolTipVisible}
setToolTipContent={setToolTipContent}
activeFilters={activeFilters}
setDataDisplayed={setDataDisplayed}
searchData={searchData}
conceptsOrVectors={'vectors'}
searchTerm={searchTerm}
></TabulatorTable>
<SemanticMap
dataDisplayed={dataDisplayed}
searchEntity={searchEntity}
></SemanticMap>
</div>
</div>
)
}

Event Timeline

c4science · Help