summaryrefslogtreecommitdiff
path: root/pages/index.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'pages/index.tsx')
-rw-r--r--pages/index.tsx93
1 files changed, 6 insertions, 87 deletions
diff --git a/pages/index.tsx b/pages/index.tsx
index ab78258..00d8473 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -17,9 +17,8 @@ import { useAnimation } from '@lilib/hooks'
import { Button, Box, IconButton, useTheme, useDisclosure, Flex } from '@chakra-ui/react'
import { ChevronLeftIcon, SettingsIcon } from '@chakra-ui/icons'
-import { initialPhysics, initialFilter, initialMouse } from '../components/config'
+import { initialPhysics, initialFilter } from '../components/config'
import { Tweaks } from '../components/tweaks'
-import { Sidebar } from '../components/sidebar'
// react-force-graph fails on import when server-rendered
// https://github.com/vasturiano/react-force-graph/issues/155
@@ -55,10 +54,8 @@ export default function Home() {
export function GraphPage() {
const [physics, setPhysics] = usePersistantState('physics', initialPhysics)
const [filter, setFilter] = usePersistantState('filter', initialFilter)
- const [mouse, setMouse] = usePersistantState('mouse', initialMouse)
const [graphData, setGraphData] = useState<GraphData | null>(null)
const [emacsNodeId, setEmacsNodeId] = useState<string | null>(null)
- const { isOpen, onOpen, onClose } = useDisclosure()
const nodeByIdRef = useRef<NodeById>({})
const linksByNodeIdRef = useRef<LinksByNodeId>({})
@@ -134,7 +131,6 @@ export function GraphPage() {
}, [emacsNodeId])
const [threeDim, setThreeDim] = useState(false)
- const [openNode, setOpenNode] = useState('')
if (!graphData) {
return null
@@ -142,50 +138,16 @@ export function GraphPage() {
return (
<Box display="flex" alignItems="flex-start" flexDirection="row" height="100%">
- <Head>
- <title> Org Roam UI </title>
- <script
- async
- src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS_HTML"
- ></script>
- </Head>
- <Sidebar
- nodeById={nodeByIdRef.current}
- {...{
- isOpen,
- onClose,
- openNode,
- }}
- />
<Tweaks
{...{
physics,
setPhysics,
threeDim,
setThreeDim,
- mouse,
- setMouse,
- initialMouse,
filter,
setFilter,
}}
/>
- <Flex height="100%" flexDirection="column" marginLeft="auto">
- {!isOpen && (
- <IconButton
- icon={<ChevronLeftIcon />}
- height={100}
- aria-label="Open org-viewer"
- position="relative"
- zIndex="overlay"
- colorScheme="purple"
- onClick={onOpen}
- variant="outline"
- marginTop={10}
- />
- )}
- </Flex>
-
<Box position="absolute" alignItems="top">
<Graph
nodeById={nodeByIdRef.current!}
@@ -196,8 +158,6 @@ export function GraphPage() {
threeDim,
emacsNodeId,
filter,
- setOpenNode,
- mouse,
}}
/>
</Box>
@@ -213,22 +173,10 @@ export interface GraphProps {
threeDim: boolean
filter: typeof initialFilter
emacsNodeId: string | null
- mouse: typeof initialMouse
- setOpenNode: any
}
export const Graph = function (props: GraphProps) {
- const {
- physics,
- graphData,
- threeDim,
- linksByNodeId,
- filter,
- emacsNodeId,
- nodeById,
- mouse,
- setOpenNode,
- } = props
+ const { physics, graphData, threeDim, linksByNodeId, filter, emacsNodeId, nodeById } = props
const graph2dRef = useRef<any>(null)
const graph3dRef = useRef<any>(null)
@@ -241,24 +189,6 @@ export const Graph = function (props: GraphProps) {
const [hoverNode, setHoverNode] = useState<NodeObject | null>(null)
const [scope, setScope] = useState<Scope>({ nodeIds: [] })
- const handleMouse = (nodeId: string | number | undefined, num: number) => {
- switch (num) {
- // case mouse.highlight: setHighlightNode(node)
- // case mouse.select: setSelectedNode(node)
- case mouse.open:
- setOpenNode(nodeId as string)
- case mouse.local: {
- setScope((currentScope) => ({
- ...currentScope,
- nodeIds: [...currentScope.nodeIds, nodeId as string],
- }))
- }
- case mouse.follow:
- window.open(('org-protocol://roam-node?node=' + nodeId) as string, '_self')
- default:
- break
- }
- }
useEffect(() => {
if (!emacsNodeId) {
return
@@ -333,9 +263,6 @@ export const Graph = function (props: GraphProps) {
const scopedNodes = useMemo(() => {
return filteredNodes.filter((node) => {
const links = linksByNodeId[node.id as string] ?? []
- /* if (physics.orphans && links.length === 0) {
- * return false
- * } */
return (
scope.nodeIds.includes(node.id as string) ||
links.some((link) => {
@@ -425,18 +352,13 @@ export const Graph = function (props: GraphProps) {
lastNodeClickRef.current = event.timeStamp
if (isDoubleClick) {
- handleMouse(node.id, 3)
window.open('org-protocol://roam-node?node=' + node.id, '_self')
return
}
-
- handleMouse(node.id, 2)
- console.log(mouse)
- /* setScope((currentScope) => ({
- * ...currentScope,
- * nodeIds: [...currentScope.nodeIds, node.id as string],
- * })) */
- return
+ setScope((currentScope) => ({
+ ...currentScope,
+ nodeIds: [...currentScope.nodeIds, nodeId as string],
+ }))
}
const [opacity, setOpacity] = useState<number>(1)
@@ -662,9 +584,6 @@ export const Graph = function (props: GraphProps) {
}
setHoverNode(node)
},
- onNodeRightClick: (node) => {
- handleMouse(node.id, 4)
- },
}
const bg = theme.colors.alt[100]