Revert "Disallow use of console, alert, and debugger"

.cosmos.config.json

@@ -0,0 +1,10 @@
+{
+  "hot": "true",
+  "watchDirs": ["src"],
+  "hostname": "0.0.0.0",
+  "port": "8080",
+  "publicUrl": "./",
+  "webpack": {
+    "configPath": ".cosmos.webpack.js"
+  }
+}

.cosmos.webpack.js

@@ -0,0 +1,43 @@
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const path = require('path')
+
+
+module.exports = {
+  mode: process.env.NODE_ENV === 'production' ? 'production' : 'development',
+  devServer: {
+    publicPath: '/cosmos/',
+    contentBase: path.join(__dirname, 'docs'),
+    compress: true,
+    port: 8000,
+  },
+  output: {
+    path: path.resolve(__dirname, 'docs'),
+    publicPath: '/cosmos/',
+    filename: 'index.html',
+  },
+  plugins: [new HtmlWebpackPlugin()],
+  module: {
+    rules: [
+      {
+        test: /\.jsx$/,
+        exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: ['@babel/preset-react'],
+          },
+        },
+      },
+      {
+        test: /\.svg$/i,
+        use: ['@svgr/webpack'],
+      },
+    ],
+  },
+  resolve: {
+    extensions: ['.js', '.jsx', '.svg'],
+  },
+  optimization: {
+    minimize: false
+  },
+}

.eslintrc.js

@@ -12,7 +12,6 @@ module.exports = {
     'plugin:react/recommended',
     'plugin:react-hooks/recommended',
     'plugin:jsx-a11y/recommended',
-    'plugin:storybook/recommended',
     'plugin:jsdoc/recommended',
     'plugin:cypress/recommended',
   ],
@@ -101,9 +100,6 @@ module.exports = {
     'jsdoc/require-param-type': 'off',
     'require-await': 'error',
     'linebreak-style': ['error', 'unix'],
-    'no-console': 'error',
-    'no-alert': 'error',
-    'no-debugger': 'error'
   },
   settings: {
     react: {

.gitignore

@@ -13,3 +13,5 @@
 
 cypress/videos
 cypress/screenshots
+
+storybook-static

__mocks__/web-ifc-viewer.js

@@ -1,10 +1,12 @@
 jest.mock('three')
 jest.mock('../src/Infrastructure/IfcHighlighter')
+jest.mock('../src/Infrastructure/IfcIsolator')
+jest.mock('../src/Infrastructure/CustomPostProcessor')
 const ifcjsMock = jest.createMockFromModule('web-ifc-viewer')
 
 
 // Not sure why this is required, but otherwise these internal fields
-// are not present in the instantiated IfcViewerAPI.
+// are not present in the instantiated IfcViewerAPIExtended.
 const loadedModel = {
   ifcManager: {
     getSpatialStructure: jest.fn(),
@@ -15,6 +17,9 @@ const loadedModel = {
     boundingBox: {
       getCenter: jest.fn(),
     },
+    attributes: {
+      expressID: 123,
+    },
   },
 }
 
@@ -46,7 +51,6 @@ const impl = {
         },
       },
     },
-    loadIfcUrl: jest.fn(jest.fn(() => loadedModel)),
     setWasmPath: jest.fn(),
     selector: {
       unpickIfcItems: jest.fn(),
@@ -87,13 +91,16 @@ const impl = {
     getRenderer: jest.fn(),
     getScene: jest.fn(),
     getCamera: jest.fn(),
+    getClippingPlanes: jest.fn(() => {
+      return []
+    }),
   },
+  loadIfcUrl: jest.fn(jest.fn(() => loadedModel)),
   getProperties: jest.fn((modelId, eltId) => {
     return loadedModel.ifcManager.getProperties(eltId)
   }),
   setSelection: jest.fn(),
   pickIfcItemsByID: jest.fn(),
-  loadIfcUrl: jest.fn(jest.fn(() => loadedModel)),
 }
 const constructorMock = ifcjsMock.IfcViewerAPI
 constructorMock.mockImplementation(() => impl)
@@ -102,13 +109,13 @@ constructorMock.mockImplementation(() => impl)
 /**
  * @return {object} The single mock instance of IfcViewerAPI.
  */
-function __getIfcViewerAPIMockSingleton() {
+function __getIfcViewerAPIExtendedMockSingleton() {
   return impl
 }
 
 
 export {
   ifcjsMock as default,
   constructorMock as IfcViewerAPI,
-  __getIfcViewerAPIMockSingleton,
+  __getIfcViewerAPIExtendedMockSingleton as __getIfcViewerAPIExtendedMockSingleton,
 }

config/common.js

@@ -33,7 +33,7 @@ export const build = {
   format: 'esm',
   sourcemap: true,
   platform: 'browser',
-  target: ['chrome58', 'firefox57', 'safari11', 'edge18'],
+  target: ['chrome58', 'firefox57', 'safari11', 'edge18', 'es2020'],
   logLevel: 'info',
   define: {
     'process.env.OAUTH2_CLIENT_ID': JSON.stringify(process.env.OAUTH2_CLIENT_ID),

cosmos.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, shrink-to-fit=no"
+    />
+    <title>React Cosmos</title>
+    <link rel="icon" href="/sb/_cosmos.ico" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="/sb/_playground.js"></script>
+  </body>
+</html>

cypress/e2e/hide-feat/hide-feat.cy.js

@@ -0,0 +1,15 @@
+describe('Ifc Hide/Unhide E2E test suite', () => {
+  context('Hide icon toggle', () => {
+    beforeEach(() => {
+      cy.setCookie('isFirstTime', 'false')
+      cy.visit('/')
+    })
+
+    it('should toggle hide icon when clicked', () => {
+      cy.findByTestId('hide-icon').should('exist')
+      cy.findByTestId('hide-icon').should('have.attr', 'data-icon', 'eye')
+      cy.findByTestId('hide-icon').realClick()
+      cy.findByTestId('hide-icon').should('have.attr', 'data-icon', 'eye-slash')
+    })
+  })
+})

package.json

@@ -1,24 +1,25 @@
 {
   "name": "bldrs",
-  "version": "1.0.0-r646",
+  "version": "1.0.0-r677",
   "main": "src/index.jsx",
   "license": "MIT",
   "homepage": "https://github.com/bldrs-ai/Share",
   "bugs": {
     "url": "https://github.com/bldrs-ai/Share/issues"
   },
   "scripts": {
-    "build": "yarn build-share && yarn build-storybook",
-    "build-storybook": "shx mkdir -p docs && build-storybook -o docs/sb",
+    "build": "yarn clean && yarn build-share && yarn build-cosmos",
+    "build-cosmos": "shx rm -rf docs/cosmos; shx mkdir -p docs ; cosmos-export --config .cosmos.config.json && shx mv cosmos-export docs/cosmos",
     "build-share": "yarn write-new-version && node config/build.js && yarn build-share-copy-web-asm",
     "build-share-copy-web-asm": "shx cp node_modules/web-ifc/*.wasm docs/static/js",
+    "clean": "shx rm -rf docs",
     "deps-graph": "npx dependency-cruiser src --include-only 'jsx?' --config --output-type dot | dot -T svg > deps.svg",
     "husky-init": "husky install",
     "lint": "yarn eslint src && tsc",
     "precommit": "yarn lint && yarn test",
     "serve": "yarn serve-share",
+    "serve-cosmos": "cosmos --config .cosmos.config.json",
     "serve-share": "yarn build-share && node config/serve.js",
-    "serve-storybook": "start-storybook -p 6006",
     "test": "jest",
     "cypress": "cypress run",
     "cypress-spec": "cypress run --spec",
@@ -32,13 +33,15 @@
     "@bldrs-ai/ifclib": "^5.3.3",
     "@emotion/react": "^11.10.0",
     "@emotion/styled": "^11.10.0",
-    "@iconscout/react-unicons": "^1.1.6",
-    "@material-ui/core": "^4.12.4",
-    "@mui/icons-material": "^5.8.4",
+    "@iconscout/react-unicons": "^2.0.0",
+    "@fortawesome/fontawesome-svg-core": "^6.3.0",
+    "@fortawesome/free-solid-svg-icons": "^6.3.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
+    "@mui/icons-material": "^5.11.9",
     "@mui/lab": "^5.0.0-alpha.95",
     "@mui/material": "^5.9.2",
     "@mui/styled-engine": "^5.8.7",
-    "@mui/styles": "^5.9.2",
+    "@mui/styles": "^5.11.13",
     "@octokit/rest": "^19.0.3",
     "@sentry/react": "^7.31.1",
     "@sentry/tracing": "^7.31.1",
@@ -72,16 +75,7 @@
     "@bahmutov/cypress-esbuild-preprocessor": "^2.1.3",
     "@mui/types": "^7.2.3",
     "@pablo-mayrgundter/cookies.js": "^1.0.0",
-    "@storybook/addon-actions": "^6.5.10",
-    "@storybook/addon-essentials": "^6.5.10",
-    "@storybook/addon-interactions": "^6.5.10",
-    "@storybook/addon-links": "^6.5.10",
-    "@storybook/addons": "^6.5.10",
-    "@storybook/builder-webpack4": "^6.5.10",
-    "@storybook/manager-webpack4": "^6.5.10",
-    "@storybook/react": "^6.5.10",
-    "@storybook/testing-library": "^0.0.13",
-    "@storybook/theming": "^6.5.10",
+    "@svgr/webpack": "^6.5.1",
     "@testing-library/cypress": "^9.0.0",
     "@testing-library/dom": "^8.19.1",
     "@testing-library/jest-dom": "^5.16.5",
@@ -109,17 +103,17 @@
     "eslint-plugin-jsx-a11y": "^6.6.1",
     "eslint-plugin-react": "^7.30.1",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-storybook": "^0.6.4",
     "eslint-plugin-testing-library": "^5.9.1",
+    "html-webpack-plugin": "^5.5.0",
     "husky": "^8.0.1",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.3.1",
     "jest-environment-jsdom": "^29.3.1",
     "jsdom": "^20.0.3",
     "msw": "^0.47.4",
+    "react-cosmos": "^5.7.2",
     "shx": "^0.3.4",
-    "storybook-addon-material-ui": "^0.9.0-alpha.24",
-    "storybook-addon-turbo-build": "^1.1.0"
+    "webpack": "^5.75.0"
   },
   "msw": {
     "workerDirectory": "public"

src/BaseRoutes.jsx

@@ -63,6 +63,8 @@ export default function BaseRoutes({testElt = null}) {
         if (err.error !== 'login_required') {
           throw err
         }
+
+        console.log(err.error)
       })
     }
   }, [basePath, installPrefix, location, navigation, getAccessTokenSilently, isAuthenticated, isLoading, setAccessToken])

src/Components/About/AboutControl.jsx

@@ -15,7 +15,7 @@ import {Helmet} from 'react-helmet-async'
 /**
  * Button to toggle About panel on and off
  *
- * @return {React.ReactElement}
+ * @return {React.Component}
  */
 export default function AboutControl() {
   const isAboutDialogSuppressed = useStore((state) => state.isAboutDialogSuppressed)
@@ -27,6 +27,8 @@ export default function AboutControl() {
   const setIsDialogDisplayedLocal = (value) => {
     setIsDialogDisplayed(value)
   }
+
+  // eslint-disable-next-line no-unused-vars
   const setIsDialogDisplayedForDialog = () => {
     setIsDialogDisplayed(false)
     setCookieBoolean({component: 'about', name: 'isFirstTime', value: false})
@@ -63,7 +65,7 @@ export default function AboutControl() {
  * @param {Function} setIsDialogDisplayed
  * @return {React.ReactElement} React component
  */
-function AboutDialog({isDialogDisplayed, setIsDialogDisplayed}) {
+export function AboutDialog({isDialogDisplayed, setIsDialogDisplayed}) {
   return (
     <Dialog
       icon={

src/Components/About/AboutDialog.fixture.jsx

@@ -0,0 +1,21 @@
+import React from 'react'
+import {HelmetProvider} from 'react-helmet-async'
+import {ThemeProvider} from '@mui/material/styles'
+import useShareTheme from '../../theme/Theme'
+import {AboutDialog} from './AboutControl'
+
+
+/** @return {React.Component} */
+export default function Example() {
+  return (
+    <HelmetProvider>
+      <ThemeProvider theme={useShareTheme()}>
+        <AboutDialog
+          isDialogDisplayed={true}
+          // eslint-disable-next-line no-empty-function
+          setIsDialogDisplayed={() => {}}
+        />
+      </ThemeProvider>
+    </HelmetProvider>
+  )
+}