86 lines
2.3 KiB
TypeScript
86 lines
2.3 KiB
TypeScript
import React, { useState, useEffect } from 'react';
|
|
|
|
import { Scrollable } from './Scrollable';
|
|
import { BackstoryPageProps } from './BackstoryTab';
|
|
import { Document } from './Document';
|
|
|
|
const AboutPage = (props: BackstoryPageProps) => {
|
|
const { sessionId, submitQuery, setSnack, route, setRoute } = props;
|
|
const [ page, setPage ] = useState<string>("");
|
|
const [ subRoute, setSubRoute] = useState<string>("");
|
|
|
|
useEffect(() => {
|
|
console.log(`AboutPage: ${page}`);
|
|
}, [page]);
|
|
useEffect(() => {
|
|
console.log(`AboutPage: ${page} - subRoute: ${subRoute}`);
|
|
}, [subRoute]);
|
|
|
|
useEffect(() => {
|
|
if (route === undefined) { return; }
|
|
const parts = route.split("/");
|
|
if (parts.length === 0) { return; }
|
|
setPage(parts[0]);
|
|
if (parts.length > 1) {
|
|
parts.shift();
|
|
setSubRoute(parts.join("/"));
|
|
}
|
|
}, [route, setPage, setSubRoute]);
|
|
|
|
const onDocumentExpand = (document: string, open: boolean) => {
|
|
console.log("Document expanded:", document, open);
|
|
if (open) {
|
|
setPage(document);
|
|
} else {
|
|
setPage("");
|
|
}
|
|
/* This is just to quiet warnings for now...*/
|
|
if (route === "never" && subRoute && setRoute) {
|
|
setRoute(document);
|
|
setSubRoute(document);
|
|
}
|
|
}
|
|
|
|
return <Scrollable
|
|
autoscroll={false}
|
|
sx={{
|
|
maxWidth: "1024px",
|
|
height: "calc(100vh - 72px)",
|
|
flexDirection: "column",
|
|
margin: "0 auto",
|
|
p: 1,
|
|
}}
|
|
>
|
|
<Document {...{
|
|
title: "About",
|
|
filepath: "/docs/about.md",
|
|
onExpand: (open: boolean) => { onDocumentExpand('about', open); },
|
|
expanded: page === 'about',
|
|
sessionId,
|
|
submitQuery: submitQuery,
|
|
setSnack,
|
|
}} />
|
|
<Document {...{
|
|
title: "Resume Generation Architecture",
|
|
filepath: "/docs/resume-generation.md",
|
|
onExpand: (open: boolean) => { onDocumentExpand('resume-generation', open); },
|
|
expanded: page === 'resume-generation',
|
|
sessionId,
|
|
submitQuery: submitQuery,
|
|
setSnack,
|
|
}} />
|
|
<Document {...{
|
|
title: "Application Architecture",
|
|
filepath: "/docs/about-app.md",
|
|
onExpand: (open: boolean) => { onDocumentExpand('about-app', open); },
|
|
expanded: page === 'about-app',
|
|
sessionId,
|
|
submitQuery: submitQuery,
|
|
setSnack,
|
|
}} />
|
|
</Scrollable>;
|
|
};
|
|
|
|
export {
|
|
AboutPage
|
|
}; |