Skip to content

Commit

Permalink
Zustand (#228)
Browse files Browse the repository at this point in the history
* add zustand store

* move snack message to the global state

* move snack message to the global state

* add zustand test

* add zustand test

* add drawer test

* add side drawer test + change testing library version

* simplified storage

* clean up
  • Loading branch information
OlegMoshkovich committed Jun 17, 2022
1 parent ce71efc commit 0671471
Show file tree
Hide file tree
Showing 7 changed files with 331 additions and 224 deletions.
424 changes: 221 additions & 203 deletions docs/index.js

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions docs/index.js.map

Large diffs are not rendered by default.

6 changes: 4 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "bldrs",
"version": "1.0.0-r301",
"version": "1.0.0-r323",
"main": "src/index.jsx",
"homepage": "https://github.com/bldrs-ai/Share",
"bugs": {
Expand Down Expand Up @@ -33,7 +33,8 @@
"react-router-dom": "^6.0.2",
"three": "^0.135",
"web-ifc-viewer": "^1.0.184",
"web-vitals": "^2.1.0"
"web-vitals": "^2.1.0",
"zustand": "^4.0.0-rc.1"
},
"devDependencies": {
"@alex_neo/jest-expect-message": "^1.0.5",
Expand All @@ -45,6 +46,7 @@
"@testing-library/dom": "^8.11.1",
"@testing-library/jest-dom": "^5.15.0",
"@testing-library/react": "^12.1.2",
"@testing-library/react-hooks": "^8.0.0",
"babel-jest": "^27.4.4",
"esbuild": "^0.14.22",
"esbuild-plugin-svgr": "^1.0.0",
Expand Down
10 changes: 6 additions & 4 deletions src/Containers/CadView.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import OperationsGroup from '../Components/OperationsGroup'
import SearchBar from '../Components/SearchBar'
import SnackBarMessage from '../Components/SnackbarMessage'
import debug from '../utils/debug'
import useStore from '../utils/store'
import * as Privacy from '../privacy/Privacy'
import {assertDefined} from '../utils/assert'
import {computeElementPath, setupLookupAndParentLinks} from '../utils/TreeUtils'
Expand Down Expand Up @@ -65,8 +66,9 @@ export default function CadView({
const [isItemPanelOpen, setIsItemPanelOpen] = useState(false)
const isItemPanelOpenState = {value: isItemPanelOpen, set: setIsItemPanelOpen}
const [isLoading, setIsLoading] = useState(false)
const [loadingMessage, setLoadingMessage] = useState()
const [model, setModel] = useState(null)
const snackMessage = useStore((state) => state.snackMessage)
const setSnackMessage = useStore((state) => state.setSnackMessage)


/* eslint-disable react-hooks/exhaustive-deps */
Expand Down Expand Up @@ -146,7 +148,7 @@ export default function CadView({
filepath = `blob:${l.protocol}//${l.hostname + (l.port ? ':' + l.port : '')}/${filepath}`
}
const loadingMessageBase = `Loading ${filepath}`
setLoadingMessage(loadingMessageBase)
setSnackMessage(loadingMessageBase)
setIsLoading(true)
const model = await viewer.IFC.loadIfcUrl(
filepath,
Expand All @@ -155,7 +157,7 @@ export default function CadView({
if (Number.isFinite(progressEvent.loaded)) {
const loadedBytes = progressEvent.loaded
const loadedMegs = (loadedBytes / (1024 * 1024)).toFixed(2)
setLoadingMessage(`${loadingMessageBase}: ${loadedMegs} MB`)
setSnackMessage(`${loadingMessageBase}: ${loadedMegs} MB`)
debug(3).log(`CadView#loadIfc$onProgress, ${loadedBytes} bytes`)
}
},
Expand Down Expand Up @@ -353,7 +355,7 @@ export default function CadView({
<div className={classes.view} id='viewer-container'></div>
<div className={classes.menusWrapper}>
<SnackBarMessage
message={loadingMessage}
message={snackMessage}
type={'info'}
open={isLoading}/>
<div className={classes.search}>
Expand Down
12 changes: 12 additions & 0 deletions src/utils/store.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import create from 'zustand'


const useStore = create((set) => ({
isDrawerOpen: false,
isCommentsOn: false,
snackMessage: null,
setSnackMessage: (message) => set(() => ({snackMessage: message})),
openDrawer: () => set(() => ({isDrawerOpen: true})),
closeDrawer: () => set(() => ({isDrawerOpen: false})),
}))
export default useStore
23 changes: 23 additions & 0 deletions src/utils/store.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import {act, renderHook} from '@testing-library/react-hooks'
import useStore from './store'


describe('useStore', () => {
it('Set snack message', () => {
const {result} = renderHook(() => useStore((state) => state))
act(() => {
result.current.setSnackMessage(['loading'])
})
expect(result.current.snackMessage).toEqual(['loading'])
})
})

describe('useStore', () => {
it('Set Drawer State', () => {
const {result} = renderHook(() => useStore((state) => state))
act(() => {
result.current.openDrawer()
})
expect(result.current.isDrawerOpen).toEqual(true)
})
})
74 changes: 62 additions & 12 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1807,7 +1807,21 @@
"@svgr/hast-util-to-babel-ast" "^6.2.1"
svg-parser "^2.0.2"

"@testing-library/dom@^8.0.0", "@testing-library/dom@^8.11.1":
"@testing-library/dom@^8.0.0":
version "8.13.0"
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.13.0.tgz#bc00bdd64c7d8b40841e27a70211399ad3af46f5"
integrity sha512-9VHgfIatKNXQNaZTtLnalIy0jNZzY35a4S3oi08YAt9Hv1VsfZ/DfA45lM8D/UhtHBGJ4/lGwp0PZkVndRkoOQ==
dependencies:
"@babel/code-frame" "^7.10.4"
"@babel/runtime" "^7.12.5"
"@types/aria-query" "^4.2.0"
aria-query "^5.0.0"
chalk "^4.1.0"
dom-accessibility-api "^0.5.9"
lz-string "^1.4.4"
pretty-format "^27.0.2"

"@testing-library/dom@^8.11.1":
version "8.11.3"
resolved "https://registry.npmjs.org/@testing-library/dom/-/dom-8.11.3.tgz"
integrity sha512-9LId28I+lx70wUiZjLvi1DB/WT2zGOxUh46glrSNMaWVx849kKAluezVzZrXJfTKKoQTmEOutLes/bHg4Bj3aA==
Expand Down Expand Up @@ -1836,14 +1850,22 @@
lodash "^4.17.15"
redent "^3.0.0"

"@testing-library/react-hooks@^8.0.0":
version "8.0.0"
resolved "https://registry.yarnpkg.com/@testing-library/react-hooks/-/react-hooks-8.0.0.tgz#7d0164bffce4647f506039de0a97f6fcbd20f4bf"
integrity sha512-uZqcgtcUUtw7Z9N32W13qQhVAD+Xki2hxbTR461MKax8T6Jr8nsUvZB+vcBTkzY2nFvsUet434CsgF0ncW2yFw==
dependencies:
"@babel/runtime" "^7.12.5"
react-error-boundary "^3.1.0"

"@testing-library/react@^12.1.2":
version "12.1.3"
resolved "https://registry.npmjs.org/@testing-library/react/-/react-12.1.3.tgz"
integrity sha512-oCULRXWRrBtC9m6G/WohPo1GLcLesH7T4fuKzRAKn1CWVu9BzXtqLXDDTA6KhFNNtRwLtfSMr20HFl+Qrdrvmg==
version "12.1.5"
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-12.1.5.tgz#bb248f72f02a5ac9d949dea07279095fa577963b"
integrity sha512-OfTXCJUFgjd/digLUuPxa0+/3ZxsQmE7ub9kcbW/wi96Bh3o/p5vrETcBGfP17NWPGqeYYl5LTRpwyGoMC4ysg==
dependencies:
"@babel/runtime" "^7.12.5"
"@testing-library/dom" "^8.0.0"
"@types/react-dom" "*"
"@types/react-dom" "<18.0.0"

"@tootallnate/once@1":
version "1.1.2"
Expand Down Expand Up @@ -1952,12 +1974,12 @@
resolved "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz"
integrity sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==

"@types/react-dom@*":
version "17.0.12"
resolved "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.12.tgz"
integrity sha512-SeJ430ndLI15JtRSHuzotn7AIdUtr8bdk6XW8mMfzjZo3vahRgJGHZqHiI4nAzCHTVG4qC21ObfsHBVUEHcDhg==
"@types/react-dom@<18.0.0":
version "17.0.17"
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.17.tgz#2e3743277a793a96a99f1bf87614598289da68a1"
integrity sha512-VjnqEmqGnasQKV0CWLevqMTXBYG9GbwuE6x3VetERLh0cq2LTptFE73MrQi2S7GkKXCf2GgwItB/melLnxfnsg==
dependencies:
"@types/react" "*"
"@types/react" "^17"

"@types/react-is@^16.7.1 || ^17.0.0":
version "17.0.3"
Expand All @@ -1982,6 +2004,15 @@
"@types/scheduler" "*"
csstype "^3.0.2"

"@types/react@^17":
version "17.0.47"
resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.47.tgz#4ee71aaf4c5a9e290e03aa4d0d313c5d666b3b78"
integrity sha512-mk0BL8zBinf2ozNr3qPnlu1oyVTYq+4V7WA76RgxUAtf0Em/Wbid38KN6n4abEkvO4xMTBWmnP1FtQzgkEiJoA==
dependencies:
"@types/prop-types" "*"
"@types/scheduler" "*"
csstype "^3.0.2"

"@types/scheduler@*":
version "0.16.2"
resolved "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz"
Expand Down Expand Up @@ -2162,8 +2193,8 @@ array.prototype.flatmap@^1.2.5:

ast-types-flow@^0.0.7:
version "0.0.7"
resolved "https://registry.npmjs.org/ast-types-flow/-/ast-types-flow-0.0.7.tgz"
integrity sha1-9wtzXGvKGlycItmCw+Oef+ujva0=
resolved "https://registry.yarnpkg.com/ast-types-flow/-/ast-types-flow-0.0.7.tgz#f70b735c6bca1a5c9c22d982c3e39e7feba3bdad"
integrity sha512-eBvWn1lvIApYMhzQMsu9ciLfkBY499mFZlNqG+/9WR7PVlroQw0vG30cOQQbaKz3sCEc44TAOu2ykzqXSNnwag==

asynckit@^0.4.0:
version "0.4.0"
Expand Down Expand Up @@ -4837,6 +4868,13 @@ react-dom@^17.0.2:
object-assign "^4.1.1"
scheduler "^0.20.2"

react-error-boundary@^3.1.0:
version "3.1.4"
resolved "https://registry.yarnpkg.com/react-error-boundary/-/react-error-boundary-3.1.4.tgz#255db92b23197108757a888b01e5b729919abde0"
integrity sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==
dependencies:
"@babel/runtime" "^7.12.5"

react-is@^16.13.1, react-is@^16.7.0:
version "16.13.1"
resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
Expand Down Expand Up @@ -5463,6 +5501,11 @@ uri-js@^4.2.2:
dependencies:
punycode "^2.1.0"

use-sync-external-store@1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.1.0.tgz#3343c3fe7f7e404db70f8c687adf5c1652d34e82"
integrity sha512-SEnieB2FPKEVne66NpXPd1Np4R1lTNKfjuy3XdIoPQKYBAFdzbzSZlSn1KJZUiihQLQC5Znot4SBz1EOTBwQAQ==

v8-compile-cache@^2.0.3:
version "2.3.0"
resolved "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz"
Expand Down Expand Up @@ -5709,3 +5752,10 @@ yargs@^16.2.0:
string-width "^4.2.0"
y18n "^5.0.5"
yargs-parser "^20.2.2"

zustand@^4.0.0-rc.1:
version "4.0.0-rc.1"
resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.0.0-rc.1.tgz#ec30a3afc03728adec7e1bd7bcc3592176372201"
integrity sha512-qgcs7zLqBdHu0PuT3GW4WCIY5SgXdsv30GQMu9Qpp1BA2aS+sNS8l4x0hWuyEhjXkN+701aGWawhKDv6oWJAcw==
dependencies:
use-sync-external-store "1.1.0"

0 comments on commit 0671471

Please sign in to comment.