56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
import { ReadableItem } from '../../../lib/networking/library_items/useLibraryItems'
|
|
import { UserBasicData } from '../../../lib/networking/queries/useGetViewerQuery'
|
|
import 'react-sliding-pane/dist/react-sliding-pane.css'
|
|
import { NotebookContent } from './Notebook'
|
|
import { NotebookHeader } from './NotebookHeader'
|
|
import { useRouter } from 'next/router'
|
|
import { showErrorToast } from '../../../lib/toastHelpers'
|
|
import { ResizableSidebar } from './ResizableSidebar'
|
|
|
|
type NotebookPresenterProps = {
|
|
viewer: UserBasicData
|
|
|
|
item: ReadableItem
|
|
|
|
open: boolean
|
|
setOpen: (open: boolean) => void
|
|
}
|
|
|
|
export const NotebookPresenter = (props: NotebookPresenterProps) => {
|
|
const router = useRouter()
|
|
|
|
return (
|
|
<ResizableSidebar isShow={props.open} onClose={() => props.setOpen(false)}>
|
|
<NotebookHeader
|
|
viewer={props.viewer}
|
|
item={props.item}
|
|
setShowNotebook={props.setOpen}
|
|
/>
|
|
<NotebookContent
|
|
viewer={props.viewer}
|
|
item={props.item}
|
|
viewInReader={(highlightId) => {
|
|
if (!router || !router.isReady || !props.viewer) {
|
|
showErrorToast('Error navigating to highlight')
|
|
return
|
|
}
|
|
router.push(
|
|
{
|
|
pathname: '/[username]/[slug]',
|
|
query: {
|
|
username: props.viewer.profile.username,
|
|
slug: props.item.slug,
|
|
},
|
|
hash: highlightId,
|
|
},
|
|
`/${props.viewer.profile.username}/${props.item.slug}#${highlightId}`,
|
|
{
|
|
scroll: false,
|
|
}
|
|
)
|
|
}}
|
|
/>
|
|
</ResizableSidebar>
|
|
)
|
|
}
|