Skip to content

Commit

Permalink
fix: fixed issues with state on slides
Browse files Browse the repository at this point in the history
  • Loading branch information
@pksorensen
pksorensen committed Feb 7, 2024
1 parent 755dd27 commit 7c3417e
Show file tree
Hide file tree
Showing 3 changed files with 155 additions and 89 deletions.
59 changes: 57 additions & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 4 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,15 +13,17 @@
"scripts": {
"link": "concurrently \"npm:link-*\"",
"link-core": "npm --workspace packages/core link",
"link-designer": "npm --workspace packages/core designer",
"link-designer": "npm --workspace packages/designer link",

"publish": "npm-run-all --continue-on-error publish-*",
"publish-core": "npm --workspace packages/core publish --access public",
"publish-designer": "npm --workspace packages/designer publish --access public",

"release": "npm-run-all --continue-on-error release-*",
"release-core": "npm run release --workspace packages/core",
"release-designer": "npm run release --workspace packages/designer"
"release-designer": "npm run release --workspace packages/designer",

"eavfw-link": "npm link @eavfw/apps @eavfw/next @eavfw/expressions @eavfw/manifest @eavfw/hooks @eavfw/forms @eavfw/utils @eavfw/designer @eavfw/designer-core @eavfw/designer-nodes"
},
"config": {
"force": true
Expand Down
179 changes: 94 additions & 85 deletions packages/designer/src/Components/Views/QuickFormLayoutView.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,13 @@
import { mergeClasses } from "@fluentui/react-components";
import { useViewStyles } from "../Styles/useViewStyles.styles"
import { PageDesignEditor, CraftEditor, CraftViewPort, useEditorChanges } from "@eavfw/designer";
import { QuickFormDef } from "../../QuickFormDesigner";


import { useEffect, useMemo } from "react";
import { removeNonAlphanumeric } from "@eavfw/utils";
import { SerializedNodes } from "@craftjs/core"
import { QuickFormDef } from "../../Types/QuickFormDefinition";



const initial = JSON.stringify(
{
Expand Down Expand Up @@ -60,7 +62,88 @@ export const QuickFormLayoutView = ({ dispatch, slideId, layout }: {


useEffect(() => {
console.log("CraftEditor6", [slideId, store.history.timeline, nodes]);



//console.log("CraftEditor11", [slideId, layout, JSON.parse(JSON.stringify(store.history.timeline))]);
//let last = store.history.timeline[store.history.timeline.length - 1];
//let lastPatch = last && last.patches[last.patches.length - 1];
//if (lastPatch && lastPatch.op === "replace" && lastPatch.path[lastPatch.path.length - 1] === "displayName") {
// return;
//}


{
const rownodes = slideId && layout.slides[slideId]?.rows ?
Object.fromEntries(
Object.entries(
layout.slides[slideId]?.rows ?? {
}).map(([rowid, row]) => [rowid, {
"type": { "resolvedName": "Question" },
"isCanvas": true, "props": { questionid: row.columns["column1"]["q"].ref },
"displayName": "Question",
"custom": { "displayName": "Question" },
"parent": "ROOT",
"hidden": false,
"nodes": [],
"linkedNodes": {}
}])) : {
"GBCxB0dj1x": {
"type": { "resolvedName": "GridNode" },
"isCanvas": true, "props": {},
"displayName": "Grid",
"custom": { "displayName": "Content" },
"parent": "ROOT",
"hidden": false,
"nodes": [],
"linkedNodes": {}
}
};

const data = JSON.stringify({
"ROOT": {
"type": { "resolvedName": "Container" },
"isCanvas": true,
"props": {
"flexDirection": "column",
"alignItems": "flex-start",
"justifyContent": "flex-start",
"fillSpace": "no",
"padding": ["40", "40", "40", "40"],
"margin": ["0", "0", "0", "0"],
"background": { "r": 255, "g": 255, "b": 255, "a": 1 },
"color": { "r": 0, "g": 0, "b": 0, "a": 1 },
"shadow": 0,
"radius": 0,
"width": "90%",
"height": "auto"
},
"displayName": "Container",
"custom": {
renderNode: {
canAddLeft: false,
canAddRight: false,
canAddTop: true,
canAddBottom: true
},
slideId: slideId,
"displayName": slideId && slideId in layout.slides ? layout.slides[slideId].title : 'New Slide *'
},
"hidden": false,
"nodes": Object.keys(rownodes),
"linkedNodes": {}
},
...rownodes
});
console.log("CraftEditor10", [slideId, layout, JSON.parse(data)]);

deserialize(data);
history.clear();
};
}, [slideId]);

useEffect(() => {
console.log("CraftEditor6", [slideId, store.history.timeline, nodes, nodes.ROOT?.custom?.displayName, slideId && layout?.slides?.[slideId]?.title]);


/**
Expand All @@ -80,19 +163,21 @@ export const QuickFormLayoutView = ({ dispatch, slideId, layout }: {
let schemaName = removeNonAlphanumeric(title);
let logicalName = schemaName.toLowerCase();

old.layout.slides[logicalName] = { ...old.layout.slides[oldslideid], title, schemaName, logicalName };
if (logicalName !== oldslideid)
delete old.layout.slides[oldslideid];

old.layout.slides[oldslideid] = { ...old.layout.slides[oldslideid], title, schemaName, logicalName };

if (!old.__designer)
old.__designer = {};

old.__designer.activeSlide = logicalName;
old.__designer.activeSlide = oldslideid;
return { ...old };
});
}
}

/**
* populate the layout based on designer state.
*/

if (nodes?.ROOT && nodes.ROOT.custom.slideId === slideId) {
dispatch(quickform => {
let layout = quickform.layout;
Expand Down Expand Up @@ -131,83 +216,7 @@ export const QuickFormLayoutView = ({ dispatch, slideId, layout }: {

}, [nodes, slideId, layout]);

useEffect(() => {


console.log("CraftEditor11", [slideId, layout, JSON.parse(JSON.stringify(store.history.timeline))]);
let last = store.history.timeline[store.history.timeline.length - 1];
let lastPatch = last && last.patches[last.patches.length - 1];
if (lastPatch && lastPatch.op === "replace" && lastPatch.path[lastPatch.path.length - 1] === "displayName") {
return;
}

const nodes = slideId && layout.slides[slideId]?.rows ?
Object.fromEntries(
Object.entries(
layout.slides[slideId]?.rows ?? {
}).map(([rowid, row]) => [rowid, {
"type": { "resolvedName": "Question" },
"isCanvas": true, "props": { questionid: row.columns["column1"]["q"].ref },
"displayName": "Question",
"custom": { "displayName": "Question" },
"parent": "ROOT",
"hidden": false,
"nodes": [],
"linkedNodes": {}
}])) : {
"GBCxB0dj1x": {
"type": { "resolvedName": "GridNode" },
"isCanvas": true, "props": {},
"displayName": "Grid",
"custom": { "displayName": "Content" },
"parent": "ROOT",
"hidden": false,
"nodes": [],
"linkedNodes": {}
}
};

const data = JSON.stringify( {
"ROOT": {
"type": { "resolvedName": "Container" },
"isCanvas": true,
"props": {
"flexDirection": "column",
"alignItems": "flex-start",
"justifyContent": "flex-start",
"fillSpace": "no",
"padding": ["40", "40", "40", "40"],
"margin": ["0", "0", "0", "0"],
"background": { "r": 255, "g": 255, "b": 255, "a": 1 },
"color": { "r": 0, "g": 0, "b": 0, "a": 1 },
"shadow": 0,
"radius": 0,
"width": "90%",
"height": "auto"
},
"displayName": "Container",
"custom": {
renderNode: {
canAddLeft: false,
canAddRight: false,
canAddTop: true,
canAddBottom: true
},
slideId: slideId,
"displayName": slideId && slideId in layout.slides ? layout.slides[slideId].title : 'New Slide *'
},
"hidden": false,
"nodes": Object.keys(nodes),
"linkedNodes": {}
},
...nodes
});
console.log("CraftEditor10", [slideId, layout, JSON.parse(data)]);

deserialize(data);
history.clear();

}, [slideId]);


if (slideId) {
console.log("CraftEditor9", [layout.slides, slideId]);
Expand Down

0 comments on commit 7c3417e

Please sign in to comment.