mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
fix: make history local to a given excalidraw instance (#3481)
* fix: make history local to a given excalidraw instance * changelog * Update src/packages/excalidraw/CHANGELOG.md
This commit is contained in:
parent
891ac82447
commit
d3106495b2
9 changed files with 33 additions and 411 deletions
|
@ -137,7 +137,7 @@ import {
|
|||
isSelectedViaGroup,
|
||||
selectGroupsForSelectedElements,
|
||||
} from "../groups";
|
||||
import { createHistory, SceneHistory } from "../history";
|
||||
import History from "../history";
|
||||
import { defaultLang, getLanguage, languages, setLanguage, t } from "../i18n";
|
||||
import {
|
||||
CODES,
|
||||
|
@ -203,8 +203,6 @@ const ExcalidrawContainerContext = React.createContext<HTMLDivElement | null>(
|
|||
export const useExcalidrawContainer = () =>
|
||||
useContext(ExcalidrawContainerContext);
|
||||
|
||||
const { history } = createHistory();
|
||||
|
||||
let didTapTwice: boolean = false;
|
||||
let tappedTwiceTimer = 0;
|
||||
let cursorX = 0;
|
||||
|
@ -321,6 +319,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
public library: Library;
|
||||
public libraryItemsFromStorage: LibraryItems | undefined;
|
||||
private id: string;
|
||||
private history: History;
|
||||
|
||||
constructor(props: AppProps) {
|
||||
super(props);
|
||||
|
@ -379,7 +378,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
}
|
||||
this.scene = new Scene();
|
||||
this.library = new Library(this);
|
||||
|
||||
this.history = new History();
|
||||
this.actionManager = new ActionManager(
|
||||
this.syncActionResult,
|
||||
() => this.state,
|
||||
|
@ -388,8 +387,8 @@ class App extends React.Component<AppProps, AppState> {
|
|||
);
|
||||
this.actionManager.registerAll(actions);
|
||||
|
||||
this.actionManager.registerAction(createUndoAction(history));
|
||||
this.actionManager.registerAction(createRedoAction(history));
|
||||
this.actionManager.registerAction(createUndoAction(this.history));
|
||||
this.actionManager.registerAction(createRedoAction(this.history));
|
||||
}
|
||||
|
||||
private renderCanvas() {
|
||||
|
@ -564,13 +563,13 @@ class App extends React.Component<AppProps, AppState> {
|
|||
});
|
||||
this.scene.replaceAllElements(actionResult.elements);
|
||||
if (actionResult.commitToHistory) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
}
|
||||
|
||||
if (actionResult.appState || editingElement) {
|
||||
if (actionResult.commitToHistory) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
|
||||
let viewModeEnabled = actionResult?.appState?.viewModeEnabled || false;
|
||||
|
@ -614,7 +613,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
},
|
||||
() => {
|
||||
if (actionResult.syncHistory) {
|
||||
history.setCurrentState(
|
||||
this.history.setCurrentState(
|
||||
this.state,
|
||||
this.scene.getElementsIncludingDeleted(),
|
||||
);
|
||||
|
@ -689,7 +688,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
};
|
||||
|
||||
private resetHistory = () => {
|
||||
history.clear();
|
||||
this.history.clear();
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -822,6 +821,10 @@ class App extends React.Component<AppProps, AppState> {
|
|||
configurable: true,
|
||||
value: this,
|
||||
},
|
||||
history: {
|
||||
configurable: true,
|
||||
value: this.history,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -1123,7 +1126,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
this.setState({ scrolledOutside });
|
||||
}
|
||||
|
||||
history.record(this.state, this.scene.getElementsIncludingDeleted());
|
||||
this.history.record(this.state, this.scene.getElementsIncludingDeleted());
|
||||
|
||||
// Do not notify consumers if we're still loading the scene. Among other
|
||||
// potential issues, this fixes a case where the tab isn't focused during
|
||||
|
@ -1332,7 +1335,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
);
|
||||
|
||||
this.scene.replaceAllElements(nextElements);
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
this.setState(
|
||||
selectGroupsForSelectedElements(
|
||||
{
|
||||
|
@ -1378,7 +1381,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
element,
|
||||
]);
|
||||
this.setState({ selectedElementIds: { [element.id]: true } });
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
|
||||
// Collaboration
|
||||
|
@ -1452,7 +1455,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
|
||||
public updateScene = withBatchedUpdates((sceneData: SceneData) => {
|
||||
if (sceneData.commitToHistory) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
|
||||
// currently we only support syncing background color
|
||||
|
@ -1595,7 +1598,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
!this.state.editingLinearElement ||
|
||||
this.state.editingLinearElement.elementId !== selectedElements[0].id
|
||||
) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
this.setState({
|
||||
editingLinearElement: new LinearElementEditor(
|
||||
selectedElements[0],
|
||||
|
@ -1789,7 +1792,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
fixBindingsAfterDeletion(this.scene.getElements(), [element]);
|
||||
}
|
||||
if (!isDeleted || isExistingElement) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
|
||||
this.setState({
|
||||
|
@ -1970,7 +1973,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
!this.state.editingLinearElement ||
|
||||
this.state.editingLinearElement.elementId !== selectedElements[0].id
|
||||
) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
this.setState({
|
||||
editingLinearElement: new LinearElementEditor(
|
||||
selectedElements[0],
|
||||
|
@ -2687,7 +2690,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
event,
|
||||
this.state,
|
||||
(appState) => this.setState(appState),
|
||||
history,
|
||||
this.history,
|
||||
pointerDownState.origin,
|
||||
);
|
||||
if (ret.hitElement) {
|
||||
|
@ -3379,7 +3382,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
|
||||
if (isLinearElement(draggingElement)) {
|
||||
if (draggingElement!.points.length > 1) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
const pointerCoords = viewportCoordsToSceneCoords(
|
||||
childEvent,
|
||||
|
@ -3463,7 +3466,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
}
|
||||
|
||||
if (resizingElement) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
|
||||
if (resizingElement && isInvisiblySmallElement(resizingElement)) {
|
||||
|
@ -3577,7 +3580,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
elementType !== "selection" ||
|
||||
isSomeElementSelected(this.scene.getElements(), this.state)
|
||||
) {
|
||||
history.resumeRecording();
|
||||
this.history.resumeRecording();
|
||||
}
|
||||
|
||||
if (pointerDownState.drag.hasOccurred || isResizing || isRotating) {
|
||||
|
@ -4269,8 +4272,8 @@ declare global {
|
|||
elements: readonly ExcalidrawElement[];
|
||||
state: AppState;
|
||||
setState: React.Component<any, AppState>["setState"];
|
||||
history: SceneHistory;
|
||||
app: InstanceType<typeof App>;
|
||||
history: History;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
@ -4291,10 +4294,6 @@ if (
|
|||
return this.app.scene.replaceAllElements(elements);
|
||||
},
|
||||
},
|
||||
history: {
|
||||
configurable: true,
|
||||
get: () => history,
|
||||
},
|
||||
});
|
||||
}
|
||||
export default App;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue