feat: reopen library menu on import from file (#3383)

Co-authored-by: Thang Vu <thang.huu.vu@mgm-tp.com>

src/components/App.tsx

@@ -3624,7 +3624,9 @@ class App extends React.Component<AppProps, AppState> {
     ) {
       Library.importLibrary(file)
         .then(() => {
+          // Close and then open to get the libraries updated
           this.setState({ isLibraryOpen: false });
+          this.setState({ isLibraryOpen: true });
         })
         .catch((error) =>
           this.setState({ isLoading: false, errorMessage: error.message }),

src/components/LayerUI.tsx

@@ -142,9 +142,9 @@ const LibraryMenuItems = ({
         onClick={() => {
           importLibraryFromJSON()
             .then(() => {
-              // Maybe we should close and open the menu so that the items get updated.
-              // But for now we just close the menu.
+              // Close and then open to get the libraries updated
               setAppState({ isLibraryOpen: false });
+              setAppState({ isLibraryOpen: true });
             })
             .catch(muteFSAbortError)
             .catch((error) => {

src/data/json.ts

@@ -116,5 +116,5 @@ export const importLibraryFromJSON = async () => {
     extensions: [".json", ".excalidrawlib"],
     */
   });
-  Library.importLibrary(blob);
+  await Library.importLibrary(blob);
 };