Loader move to simplify CadView. (#751)

* Generalize src/* IFC references to prepare for .obj support.

* Improve MimeTypes api.

* Rename MimeType.js to Filetype.js; improve API; add unit tests.

* ShareRoutes uses new Filetypes API.

* Remove .obj testing for now.

* Alert user of missing filepath or unsupported filetype.

* Restart PR#695 from new base #694.

* Lint fix.

---------

Signed-off-by: Pablo Mayrgundter <pablo.mayrgundter@gmail.com>

package.json

@@ -1,5 +1,6 @@
 {
   "name": "bldrs",
+  "version": "1.0.0-r683",
   "version": "1.0.0-r682",
   "main": "src/index.jsx",
   "license": "MIT",

src/Components/Dialog.fixture.jsx

@@ -13,7 +13,6 @@ export default (
     content={'What you should know about doing the thing'}
     actionTitle={'Do do the thing?'}
     actionCb={() => {
-      // eslint-disable-next-line no-alert
       alert('You did the thing')
     }}
   />

src/Containers/CadView.jsx

@@ -20,6 +20,7 @@ import {IfcViewerAPIExtended} from '../Infrastructure/IfcViewerAPIExtended'
 import * as Privacy from '../privacy/Privacy'
 import debug from '../utils/debug'
 import useStore from '../store/useStore'
+import {loadLocalFile, getUploadedBlobPath} from '../utils/loader'
 import {getDownloadURL, parseGitHubRepositoryURL} from '../utils/GitHub'
 import {computeElementPathIds, setupLookupAndParentLinks} from '../utils/TreeUtils'
 import {assertDefined} from '../utils/assert'
@@ -282,7 +283,7 @@ export default function CadView({
     const uploadedFile = pathPrefix.endsWith('new')
 
     if (uploadedFile) {
-      filepath = getNewModelRealPath(filepath)
+      filepath = getUploadedBlobPath(filepath)
       debug().log('CadView#loadIfc: parsed blob: ', filepath)
       window.addEventListener('beforeunload', handleBeforeUnload)
     }
@@ -338,31 +339,6 @@ export default function CadView({
   }
 
 
-  /** Upload a local IFC file for display. */
-  function loadLocalFile() {
-    const viewerContainer = document.getElementById('viewer-container')
-    const fileInput = document.createElement('input')
-    fileInput.setAttribute('type', 'file')
-    fileInput.addEventListener(
-        'change',
-        (event) => {
-          debug().log('CadView#loadLocalFile#event:', event)
-          let ifcUrl = URL.createObjectURL(event.target.files[0])
-          setLoadedFileInfo({source: 'local', info: event.target.files})
-          debug().log('CadView#loadLocalFile#event: ifcUrl: ', ifcUrl)
-          const parts = ifcUrl.split('/')
-          ifcUrl = parts[parts.length - 1]
-          window.removeEventListener('beforeunload', handleBeforeUnload)
-          navigate(`${appPrefix}/v/new/${ifcUrl}.ifc`)
-        },
-        false,
-    )
-    viewerContainer.appendChild(fileInput)
-    fileInput.click()
-    viewerContainer.removeChild(fileInput)
-  }
-
-
   /**
    * Analyze loaded IFC model to configure UI elements.
    *
@@ -669,9 +645,7 @@ export default function CadView({
         }}
         >
           {isSearchBarVisible &&
-            <SearchBar
-              fileOpen={loadLocalFile}
-            />}
+            <SearchBar fileOpen={() => loadLocalFile(navigate, appPrefix, handleBeforeUnload)}/>}
           {
             modelPath.repo !== undefined &&
             <BranchesControl location={location}/>
@@ -835,17 +809,3 @@ export const getFinalURL = async (url, accessToken) => {
       return url
   }
 }
-
-
-/**
- * @param {string} filepath
- * @return {string}
- */
-export function getNewModelRealPath(filepath) {
-  const l = window.location
-  filepath = filepath.split('.ifc')[0]
-  const parts = filepath.split('/')
-  filepath = parts[parts.length - 1]
-  filepath = `blob:${l.protocol}//${l.hostname + (l.port ? `:${l.port}` : '')}/${filepath}`
-  return filepath
-}

src/Containers/CadView.test.jsx

@@ -4,10 +4,10 @@ import {render, renderHook, act, fireEvent, screen, waitFor} from '@testing-libr
 import {IfcViewerAPIExtended} from '../Infrastructure/IfcViewerAPIExtended'
 import ShareMock from '../ShareMock'
 import useStore from '../store/useStore'
+import * as AllLoader from '../utils/loader'
 import {actAsyncFlush} from '../utils/tests'
 import {makeTestTree} from '../utils/TreeUtils.test'
-import CadView, * as AllCadView from './CadView'
-import {getFinalURL} from './CadView'
+import CadView, {getFinalURL} from './CadView'
 
 
 const mockedUseNavigate = jest.fn()
@@ -163,7 +163,7 @@ describe('CadView', () => {
 
   it('prevent reloading without user approval when loading a model from local', async () => {
     window.addEventListener = jest.fn()
-    jest.spyOn(AllCadView, 'getNewModelRealPath').mockReturnValue('/haus.ifc')
+    jest.spyOn(AllLoader, 'getUploadedBlobPath').mockReturnValue('/haus.ifc')
     const mockCurrLocation = {...defaultLocationValue, pathname: '/haus.ifc'}
     reactRouting.useLocation.mockReturnValue(mockCurrLocation)
     const modelPath = {

src/Share.jsx

@@ -136,6 +136,7 @@ export function getModelPath(installPrefix, pathPrefix, urlParams) {
   let m = null
   let filepath = urlParams['*']
   if (filepath === '') {
+    alert(`Must provide a filepath`)
     return null
   }
   let parts

src/utils/loader.js

@@ -0,0 +1,51 @@
+import debug from '../utils/debug'
+
+
+/**
+ * Upload a local file for display.
+ *
+ * @param {Function} navigate
+ * @param {string} appPrefix
+ * @param {Function} handleBeforeUnload
+ */
+export function loadLocalFile(navigate, appPrefix, handleBeforeUnload) {
+  const viewerContainer = document.getElementById('viewer-container')
+  const fileInput = document.createElement('input')
+  fileInput.setAttribute('type', 'file')
+  fileInput.addEventListener(
+      'change',
+      (event) => {
+        debug().log('loader#loadLocalFile#event:', event)
+        let tmpUrl = URL.createObjectURL(event.target.files[0])
+        debug().log('loader#loadLocalFile#event: url: ', tmpUrl)
+        const parts = tmpUrl.split('/')
+        tmpUrl = parts[parts.length - 1]
+        window.removeEventListener('beforeunload', handleBeforeUnload)
+        // TODO(pablo): detect content and set appropriate suffix.
+        // Alternatively, leave it without suffix, but this also
+        // triggers downstream handling issues.
+        navigate(`${appPrefix}/v/new/${tmpUrl}.ifc`)
+      },
+      false,
+  )
+  viewerContainer.appendChild(fileInput)
+  fileInput.click()
+  viewerContainer.removeChild(fileInput)
+}
+
+
+/**
+ * Construct browser's actual blob URL from app URL for uploaded file.
+ *
+ * @param {string} filepath
+ * @return {string}
+ */
+export function getUploadedBlobPath(filepath) {
+  const l = window.location
+  // TODO(pablo): fix this with the above TODO for ifc suffix.
+  filepath = filepath.split('.ifc')[0]
+  const parts = filepath.split('/')
+  filepath = parts[parts.length - 1]
+  filepath = `blob:${l.protocol}//${l.hostname + (l.port ? `:${l.port}` : '')}/${filepath}`
+  return filepath
+}