diff --git a/README.md b/README.md
index c72e16575d5..9031dab07da 100644
--- a/README.md
+++ b/README.md
@@ -101,7 +101,7 @@ Here is what you need to be able to run JSON Crack.
3. Install packages with yarn
```sh
- pnpm
+ pnpm install
```
4. Run the project
diff --git a/src/containers/Views/GraphView/PremiumView.tsx b/src/containers/Views/GraphView/PremiumView.tsx
index ecc8fe9266e..367dfd74ca4 100644
--- a/src/containers/Views/GraphView/PremiumView.tsx
+++ b/src/containers/Views/GraphView/PremiumView.tsx
@@ -159,7 +159,7 @@ export const PremiumView = () => (
- Upgrade JSON Crack to premium and explore full potantial of your data!
+ Upgrade JSON Crack to premium and explore the full potential of your data!
{
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 ;
}
+ const debouncedOnZoomChangeHandler = debounce(() => {
+ setViewPort(viewPort!);
+ }, 300);
return (
<>
@@ -205,6 +209,7 @@ export const Graph = ({ isWidget = false }: GraphProps) => {
{...bindLongPress()}
>
debouncedOnZoomChangeHandler()}
onCreate={setViewPort}
onContextMenu={e => e.preventDefault()}
treatTwoFingerTrackPadGesturesLikeTouch={gesturesEnabled}
diff --git a/src/store/useUser.ts b/src/store/useUser.ts
index 6a32eb16fde..4739e2f0ff0 100644
--- a/src/store/useUser.ts
+++ b/src/store/useUser.ts
@@ -30,14 +30,15 @@ const initialStates: UserStates = {
const useUser = create()(set => ({
...initialStates,
setSession: async session => {
- supabase.rpc("get_subscription_info").then(({ data }) => {
+ supabase.rpc("get_subscription_details").then(({ data }) => {
if (data) {
set({
premium: data.premium,
- organization: data.organization,
+ organization: data.orgPremium,
premiumCancelled: !!data.cancelled,
- orgAdmin: data.org_admin,
+ orgAdmin: data.orgAdmin,
});
+
ReactGA.set({ tier: data.premium ? "premium" : "free" });
}