diff options
author | Thomas F. K. Jorna <[email protected]> | 2021-11-02 23:24:07 +0100 |
---|---|---|
committer | GitHub <[email protected]> | 2021-11-02 23:24:07 +0100 |
commit | 78f15c54c2e0d1f61abc9eec4d88ee020b191e95 (patch) | |
tree | 5aa007482d9e6f9e1aeb32429dcedf4f48073e33 /util/processOrg.tsx | |
parent | d7d75c295209acbb9c0f48676b6059ae2fa76aeb (diff) |
Feat/collapse: add collapsible/toggleable headers and outline layout in the preview panel (#139)
* feat(preview): collapsible headings
* feat(preview): collapsible headings
* feat(collapse): change icons for headings
* feat(collapse):
* feat(collapse): use new uniorg and better looks
* feat(collapse): fix typescript errors
* fix(ci): better filter
* feat(collapse): more small adjustments
* feat(collapse): collapse all button
* fix(collapse): fix global css
* fix(cd): remove yarn and add export
* fix(collapse): type-errors
* fix(cd): fix format-all fucking up yml
Diffstat (limited to 'util/processOrg.tsx')
-rw-r--r-- | util/processOrg.tsx | 28 |
1 files changed, 21 insertions, 7 deletions
diff --git a/util/processOrg.tsx b/util/processOrg.tsx index 6d3a380..84eb280 100644 --- a/util/processOrg.tsx +++ b/util/processOrg.tsx @@ -8,15 +8,16 @@ import attachments from 'uniorg-attach' // rehypeHighlight does not have any types // add error thing here // import highlight from 'rehype-highlight' -//import sectionParent from '@agentofuser/rehype-section' import katex from 'rehype-katex' import 'katex/dist/katex.css' import rehype2react from 'rehype-react' import { PreviewLink } from '../components/Sidebar/Link' import { NodeByCite, NodeById } from '../pages' -import React, { useMemo } from 'react' +import React, { createContext, ReactNode, useMemo } from 'react' import { OrgImage } from '../components/Sidebar/OrgImage' +import { Section } from '../components/Sidebar/Section' +import { NoteContext } from './NoteContext' export interface ProcessedOrgProps { nodeById: NodeById @@ -26,6 +27,8 @@ export interface ProcessedOrgProps { nodeByCite: NodeByCite setSidebarHighlightedNode: any openContextMenu: any + outline: boolean + collapse: boolean } export const ProcessedOrg = (props: ProcessedOrgProps) => { @@ -37,17 +40,17 @@ export const ProcessedOrg = (props: ProcessedOrgProps) => { nodeByCite, previewNode, openContextMenu, + outline, + collapse, } = props - //const section = sectionParent.default const processor = unified() .use(uniorgParse) .use(extractKeywords) .use(attachments) .use(uniorgSlug) - .use(uniorg2rehype) + .use(uniorg2rehype, { useSections: true }) //.data('settings', { fragment: true }) - //.use(section) // .use(highlight) .use(katex) .use(rehype2react, { @@ -63,17 +66,28 @@ export const ProcessedOrg = (props: ProcessedOrgProps) => { nodeById={nodeById} setPreviewNode={setPreviewNode} openContextMenu={openContextMenu} + outline={outline} > {children} </PreviewLink> ) }, img: ({ src }) => { - return <OrgImage src={src as string} file={previewNode.file} /> + return <OrgImage src={src as string} file={previewNode?.file} /> + }, + section: ({ children, className }) => ( + <Section {...{ outline, collapse }} className={className as string}> + {children} + </Section> + ), + p: ({ children }) => { + return <p lang="en">{children as ReactNode}</p> }, }, }) const text = useMemo(() => processor.processSync(previewText).result, [previewText]) - return <>{text}</> + return ( + <NoteContext.Provider value={{ collapse, outline }}>{text as ReactNode}</NoteContext.Provider> + ) } |