summaryrefslogtreecommitdiff
path: root/components/Sidebar/Link.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'components/Sidebar/Link.tsx')
-rw-r--r--components/Sidebar/Link.tsx92
1 files changed, 60 insertions, 32 deletions
diff --git a/components/Sidebar/Link.tsx b/components/Sidebar/Link.tsx
index 7e966a4..644078d 100644
--- a/components/Sidebar/Link.tsx
+++ b/components/Sidebar/Link.tsx
@@ -16,6 +16,7 @@ import {
} from '@chakra-ui/react'
import React, { ReactElement, useContext, useEffect, useMemo, useState } from 'react'
+import { ProcessedOrg } from '../../util/processOrg'
import unified from 'unified'
//import createStream from 'unified-stream'
import uniorgParse from 'uniorg-parse'
@@ -36,6 +37,8 @@ export interface LinkProps {
nodeByCite: NodeByCite
nodeById: NodeById
openContextMenu: any
+ outline: boolean
+ noUnderline?: boolean
}
export interface NodeLinkProps {
@@ -46,6 +49,7 @@ export interface NodeLinkProps {
children: any
setSidebarHighlightedNode: any
openContextMenu: any
+ noUnderline?: boolean
id?: string
}
export interface NormalLinkProps {
@@ -54,13 +58,15 @@ export interface NormalLinkProps {
}
import { hexToRGBA, getThemeColor } from '../../pages/index'
-import noteStyle from './noteStyle'
+import { defaultNoteStyle, viewerNoteStyle, outlineNoteStyle } from './noteStyle'
import { OrgImage } from './OrgImage'
import { Scrollbars } from 'react-custom-scrollbars-2'
import { ExternalLinkIcon } from '@chakra-ui/icons'
+import { Section } from './Section'
export const NodeLink = (props: NodeLinkProps) => {
const {
+ noUnderline,
id,
setSidebarHighlightedNode,
setPreviewNode,
@@ -85,7 +91,7 @@ export const NodeLink = (props: NodeLinkProps) => {
overflow="hidden"
fontWeight={500}
color={highlightColor}
- textDecoration="underline"
+ textDecoration={noUnderline ? undefined : 'underline'}
onContextMenu={(e) => {
e.preventDefault()
openContextMenu(nodeById[uri], e)
@@ -121,6 +127,8 @@ export const PreviewLink = (props: LinkProps) => {
setPreviewNode,
nodeByCite,
openContextMenu,
+ outline,
+ noUnderline,
} = props
// TODO figure out how to properly type this
// see https://github.com/rehypejs/rehype-react/issues/25
@@ -128,6 +136,7 @@ export const PreviewLink = (props: LinkProps) => {
const [hover, setHover] = useState(false)
const type = href.replaceAll(/(.*?)\:.*/g, '$1')
+ const extraNoteStyle = outline ? outlineNoteStyle : viewerNoteStyle
const getText = () => {
fetch(`http://localhost:35901/file/${file}`)
.then((res) => {
@@ -135,8 +144,7 @@ export const PreviewLink = (props: LinkProps) => {
})
.then((res) => {
if (res !== 'error') {
- const text = processor.processSync(res).result
- setOrgText(text)
+ setOrgText(res)
return
}
})
@@ -187,32 +195,39 @@ export const PreviewLink = (props: LinkProps) => {
const id = getId(type, uri)
const file = encodeURIComponent(encodeURIComponent(nodeById[id]?.file as string))
- const processor = unified()
- .use(uniorgParse)
- .use(uniorg2rehype)
- .use(katex)
- .use(rehype2react, {
- createElement: React.createElement,
- components: {
- // eslint-disable-next-line react/display-name
- a: ({ children, href }) => (
- <PreviewLink
- nodeByCite={nodeByCite}
- setSidebarHighlightedNode={setSidebarHighlightedNode}
- href={href}
- nodeById={nodeById}
- setPreviewNode={setPreviewNode}
- openContextMenu={openContextMenu}
- >
- {children}
- </PreviewLink>
- ),
- img: ({ src }) => {
- return <OrgImage src={src as string} file={nodeById[id]?.file as string} />
- },
- },
- })
-
+ /* const processor = unified()
+ * .use(uniorgParse)
+ * .use(uniorg2rehype)
+ * .use(katex)
+ * .use(rehype2react, {
+ * createElement: React.createElement,
+ * components: {
+ * // eslint-disable-next-line react/display-name
+ * a: ({ children, href }) => (
+ * <PreviewLink
+ * outline={outline}
+ * nodeByCite={nodeByCite}
+ * setSidebarHighlightedNode={setSidebarHighlightedNode}
+ * href={href}
+ * nodeById={nodeById}
+ * setPreviewNode={setPreviewNode}
+ * openContextMenu={openContextMenu}
+ * >
+ * {children}
+ * </PreviewLink>
+ * ),
+ * img: ({ src }) => {
+ * return <OrgImage src={src as string} file={nodeById[id]?.file as string} />
+ * },
+ * section: ({ children, className }) => (
+ * <Section {...{ outline, className }}>{children}</Section>
+ * ),
+ * p: ({ children }) => {
+ * return <p lang="en">{children}</p>
+ * },
+ * },
+ * })
+ */
if (id) {
return (
<>
@@ -234,6 +249,7 @@ export const PreviewLink = (props: LinkProps) => {
children,
nodeByCite,
openContextMenu,
+ noUnderline,
}}
/>
</Box>
@@ -281,10 +297,22 @@ export const PreviewLink = (props: LinkProps) => {
w="100%"
color="black"
px={3}
- sx={noteStyle}
+ sx={{ ...defaultNoteStyle, ...extraNoteStyle }}
//overflowY="scroll"
>
- {orgText}
+ <ProcessedOrg
+ previewText={orgText}
+ {...{
+ nodeById,
+ setSidebarHighlightedNode,
+ setPreviewNode,
+ nodeByCite,
+ previewNode,
+ openContextMenu,
+ outline,
+ }}
+ collapse={false}
+ />
</Box>
</Scrollbars>
</PopoverBody>