260706c42f
Introducing independent change detection for appState and elements Generalizing object change, cleanup, refactoring, comments, solving typing issues Shaping increment, change, delta hierarchy Structural clone of elements Introducing store and incremental API Disabling buttons for canvas actions, smaller store and changes improvements Update history entry based on latest changes, iterate through the stack for visible changes to limit empty commands Solving concurrency issues, solving (partly) linear element issues, introducing commitToStore breaking change Fixing existing tests, updating snapshots Trying to be smarter on the appstate change detection Extending collab test, refactoring action / updateScene params, bugfixes Resetting snapshots Resetting snapshots UI / API tests for history - WIP Changing actions related to the observed appstate to at least update the store snapshot - WIP Adding skipping of snapshot update flag for most no-breaking changes compatible solution Ignoring uncomitted elements from local async actions, updating store directly in updateScene Bound element issues - WIP
80 lines
2.5 KiB
TypeScript
80 lines
2.5 KiB
TypeScript
import { ExcalidrawElement } from "../../src/element/types";
|
|
import { AppState } from "../../src/types";
|
|
import { arrayToMap } from "../../src/utils";
|
|
import { orderByFractionalIndex } from "../../src/fractionalIndex";
|
|
|
|
export type ReconciledElements = readonly ExcalidrawElement[] & {
|
|
_brand: "reconciledElements";
|
|
};
|
|
|
|
export type BroadcastedExcalidrawElement = ExcalidrawElement;
|
|
|
|
const shouldDiscardRemoteElement = (
|
|
localAppState: AppState,
|
|
local: ExcalidrawElement | undefined,
|
|
remote: BroadcastedExcalidrawElement,
|
|
): boolean => {
|
|
if (
|
|
local &&
|
|
// local element is being edited
|
|
(local.id === localAppState.editingElement?.id ||
|
|
local.id === localAppState.resizingElement?.id ||
|
|
local.id === localAppState.draggingElement?.id || // Is this still valid? As draggingElement is selection element, which is never part of the elements array
|
|
// local element is newer
|
|
local.version > remote.version ||
|
|
// resolve conflicting edits deterministically by taking the one with
|
|
// the lowest versionNonce
|
|
(local.version === remote.version &&
|
|
local.versionNonce < remote.versionNonce))
|
|
) {
|
|
return true;
|
|
}
|
|
return false;
|
|
};
|
|
|
|
export const reconcileElements = (
|
|
localElements: readonly ExcalidrawElement[],
|
|
remoteElements: readonly BroadcastedExcalidrawElement[],
|
|
localAppState: AppState,
|
|
): ReconciledElements => {
|
|
const localElementsData = arrayToMap(localElements);
|
|
const reconciledElements: ExcalidrawElement[] = [];
|
|
const added = new Set<string>();
|
|
|
|
// process remote elements
|
|
for (const remoteElement of remoteElements) {
|
|
if (localElementsData.has(remoteElement.id)) {
|
|
const localElement = localElementsData.get(remoteElement.id);
|
|
|
|
if (
|
|
localElement &&
|
|
shouldDiscardRemoteElement(localAppState, localElement, remoteElement)
|
|
) {
|
|
continue;
|
|
} else {
|
|
if (!added.has(remoteElement.id)) {
|
|
reconciledElements.push(remoteElement);
|
|
added.add(remoteElement.id);
|
|
}
|
|
}
|
|
} else {
|
|
if (!added.has(remoteElement.id)) {
|
|
reconciledElements.push(remoteElement);
|
|
added.add(remoteElement.id);
|
|
}
|
|
}
|
|
}
|
|
|
|
// process local elements
|
|
for (const localElement of localElements) {
|
|
if (!added.has(localElement.id)) {
|
|
reconciledElements.push(localElement);
|
|
added.add(localElement.id);
|
|
}
|
|
}
|
|
|
|
return orderByFractionalIndex(
|
|
reconciledElements,
|
|
) as readonly ExcalidrawElement[] as ReconciledElements;
|
|
};
|