Merge pull request #7947 from belfortk/custom-mesh-bug

Custom mesh bug

dist/preview release/what's new.md

@@ -108,6 +108,7 @@
 - Fixed error when downloading async createScene function in playground ([#7926](https://github.com/BabylonJS/Babylon.js/issues/7926)) ([RaananW](https://github.com/RaananW))
 - Fix issue where ThinEngine.prototype.createDynamicEngine is undefined when using VideoTexture with es6 packages ([rvadhavk](https://github.com/rvadhavk))
 - Fix [issue](https://forum.babylonjs.com/t/virtualjoystick-needs-to-set-style-touch-action-none-explicitly/9562) that canvas for `VirtualJoystick` does not have `touch-action: "none"` set by default ([joergplewe](https://github.com/joergplewe))
+- Fix [issue](https://github.com/BabylonJS/Babylon.js/issues/7943) that prevented user from re-loading custom meshes
 
 ## Breaking changes
 

nodeEditor/src/components/preview/previewMeshControlComponent.tsx

@@ -5,7 +5,6 @@ import { Color3, Color4 } from 'babylonjs/Maths/math.color';
 import { PreviewMeshType } from './previewMeshType';
 import { DataStorage } from 'babylonjs/Misc/dataStorage';
 import { OptionsLineComponent } from '../../sharedComponents/optionsLineComponent';
-import * as ReactDOM from 'react-dom';
 
 const popUpIcon: string = require("./svgs/popOut.svg");
 const colorPicker: string = require("./svgs/colorPicker.svg");
@@ -47,10 +46,13 @@ export class PreviewMeshControlComponent extends React.Component<IPreviewMeshCon
 
             this.props.globalState.previewMeshFile = file;
             this.props.globalState.previewMeshType = PreviewMeshType.Custom;
-            this.props.globalState.onPreviewCommandActivated.notifyObservers();        
+            this.props.globalState.onPreviewCommandActivated.notifyObservers();
+            this.props.globalState.listOfCustomPreviewMeshFiles = [file];       
             this.forceUpdate();
         }
-        (ReactDOM.findDOMNode(this.refs["file-picker"]) as HTMLInputElement).value = "";
+        if(this.filePickerRef.current){
+            this.filePickerRef.current.value = ""
+        }
     }
 
     onPopUp() {
@@ -90,7 +92,7 @@ export class PreviewMeshControlComponent extends React.Component<IPreviewMeshCon
             { label: "Load...", value: PreviewMeshType.Custom + 1 }
         ];
 
-        if (this.props.globalState.previewMeshType === PreviewMeshType.Custom) {
+        if (this.props.globalState.listOfCustomPreviewMeshFiles.length > 0) {
             meshTypeOptions.splice(0, 0, {
                 label: "Custom", value: PreviewMeshType.Custom
             });

nodeEditor/src/globalState.ts

@@ -43,6 +43,7 @@ export class GlobalState {
     onGridSizeChanged = new Observable<void>();
     previewMeshType: PreviewMeshType;
     previewMeshFile: File;
+    listOfCustomPreviewMeshFiles: File[] = [];
     rotatePreview: boolean;
     backgroundColor: Color4;
     backFaceCulling: boolean;

nodeEditor/src/nodeEditor.ts

@@ -6,6 +6,8 @@ import { NodeMaterial } from "babylonjs/Materials/Node/nodeMaterial"
 import { Popup } from "../src/sharedComponents/popup"
 import { SerializationTools } from './serializationTools';
 import { Observable } from 'babylonjs/Misc/observable';
+import { DataStorage } from 'babylonjs';
+import { PreviewMeshType } from './components/preview/previewMeshType';
 /**
  * Interface used to specify creation options for the node editor
  */
@@ -75,8 +77,14 @@ export class NodeEditor {
                 if (popupWindow) {
                     popupWindow.close();
                 }
+
             };
         }
+        window.onbeforeunload = () => {
+            if(DataStorage.ReadNumber("PreviewMeshType", PreviewMeshType.Box) === PreviewMeshType.Custom){
+                DataStorage.WriteNumber("PreviewMeshType", PreviewMeshType.Box)
+            }
+        }
     }
 }