GitHub/jsoncrack.com
1
0
Fork 0
mirror of https://github.com/AykutSarac/jsoncrack.com.git synced 2025-01-27 15:22:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: Zoom label not updating on selection/input (#389)

Browse Source 
* fix: Zoom label not updating on selection/input
This commit is contained in:
shahid 2024-02-07 19:30:46 +05:30 committed by GitHub
parent 9a98bc5a68
commit d5482cd50d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 6 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/containers/Views/GraphView/index.tsx
View File

@ -1,6 +1,7 @@
import React from "react";
import dynamic from "next/dynamic";
import styled from "styled-components";
import debounce from "lodash.debounce";
import { toast } from "react-hot-toast";
import { Space } from "react-zoomable-ui";
import { ElkRoot } from "reaflow/dist/layout/useLayout";
@ -96,7 +97,6 @@ const GraphCanvas = ({ isWidget }: GraphProps) => {
const direction = useGraph(state => state.direction);
const nodes = useGraph(state => state.nodes);
const edges = useGraph(state => state.edges);
const [paneWidth, setPaneWidth] = React.useState(2000);
const [paneHeight, setPaneHeight] = React.useState(2000);
@ -156,6 +156,7 @@ function getViewType(nodes: NodeData[]) {
export const Graph = ({ isWidget = false }: GraphProps) => {
const setViewPort = useGraph(state => state.setViewPort);
const viewPort = useGraph(state => state.viewPort);
const loading = useGraph(state => state.loading);
const isPremium = useUser(state => state.premium);
const viewType = useGraph(state => getViewType(state.nodes));
@ -192,6 +193,9 @@ export const Graph = ({ isWidget = false }: GraphProps) => {
if (viewType === "premium" && !isWidget) {
if (!isPremium) return <PremiumView />;
}
const debouncedOnZoomChangeHandler = debounce(() => {
setViewPort(viewPort!);
}, 300);
return (
<>
@ -205,6 +209,7 @@ export const Graph = ({ isWidget = false }: GraphProps) => {
{...bindLongPress()}
>
<Space
onUpdated={() => debouncedOnZoomChangeHandler()}
onCreate={setViewPort}
onContextMenu={e => e.preventDefault()}
treatTwoFingerTrackPadGesturesLikeTouch={gesturesEnabled}