feat: Add renderCustomStats prop and expose setToastMessage API via refs to update toast (#3360)

* feat: Add renderCustomStats prop to render extra stats & move storage and version to renderCustomStats

* expose Api to update toast message so single instance of toast is used

* rename to setToastMessage

* update docs
This commit is contained in:
Aakansha Doshi 2021-03-29 20:06:34 +05:30 committed by GitHub
parent 58a7568c9f
commit 0d818f3810
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 126 additions and 75 deletions

View file

@ -281,6 +281,7 @@ export type ExcalidrawImperativeAPI = {
getAppState: () => InstanceType<typeof App>["state"];
setCanvasOffsets: InstanceType<typeof App>["setCanvasOffsets"];
importLibrary: InstanceType<typeof App>["importLibraryFromUrl"];
setToastMessage: InstanceType<typeof App>["setToastMessage"];
readyPromise: ResolvablePromise<ExcalidrawImperativeAPI>;
ready: true;
};
@ -342,6 +343,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
getAppState: () => this.state,
setCanvasOffsets: this.setCanvasOffsets,
importLibrary: this.importLibraryFromUrl,
setToastMessage: this.setToastMessage,
} as const;
if (typeof excalidrawRef === "function") {
excalidrawRef(api);
@ -428,7 +430,12 @@ class App extends React.Component<ExcalidrawProps, AppState> {
viewModeEnabled,
} = this.state;
const { onCollabButtonClick, onExportToBackend, renderFooter } = this.props;
const {
onCollabButtonClick,
onExportToBackend,
renderFooter,
renderCustomStats,
} = this.props;
const DEFAULT_PASTE_X = canvasDOMWidth / 2;
const DEFAULT_PASTE_Y = canvasDOMHeight / 2;
@ -479,6 +486,7 @@ class App extends React.Component<ExcalidrawProps, AppState> {
setAppState={this.setAppState}
elements={this.scene.getElements()}
onClose={this.toggleStats}
renderCustomStats={renderCustomStats}
/>
)}
{this.state.toastMessage !== null && (
@ -1332,6 +1340,10 @@ class App extends React.Component<ExcalidrawProps, AppState> {
this.setState({ toastMessage: null });
};
setToastMessage = (toastMessage: string) => {
this.setState({ toastMessage });
};
restoreFileFromShare = async () => {
try {
const webShareTargetCache = await caches.open("web-share-target");