Chore: Removed more unused code from r3f

This commit is contained in:
Aria Minaei 2021-06-29 15:15:14 +02:00
parent 02d5f6c9c4
commit 94261107fb
3 changed files with 4 additions and 143 deletions

View file

@ -41,7 +41,6 @@
"@react-three/fiber": "^6.2.2",
"@theatre/core": "workspace:*",
"@theatre/studio": "workspace:*",
"fast-deep-equal": "^3.1.3",
"lodash-es": "^4.17.21",
"prism-react-renderer": "1.2.1",
"react": "^17.0.2",

View file

@ -1,11 +1,5 @@
import type {VFC} from 'react'
import React, {
useEffect,
useLayoutEffect,
useRef,
useState,
Suspense,
} from 'react'
import React, {useEffect, useRef, Suspense} from 'react'
import {Canvas} from '@react-three/fiber'
import {useEditorStore} from '../store'
import {OrbitControls, Environment} from '@react-three/drei'
@ -14,17 +8,7 @@ import root from 'react-shadow'
import styles from '../bundle.css.txt'
import UI from './UI'
import ProxyManager from './ProxyManager'
import {
Button,
Heading,
Code,
PortalManager,
Modal,
ModalHeader,
ModalFooter,
ModalBody,
IdProvider,
} from './elements'
import {Button, Heading, Code, PortalManager, IdProvider} from './elements'
import studio from '@theatre/studio'
const EditorScene = () => {
@ -83,8 +67,6 @@ const Editor: VFC = () => {
initialEditorCamera,
setEditorOpen,
createSnapshot,
isPersistedStateDifferentThanInitial,
applyPersistedState,
] = useEditorStore(
(state) => [
state.sceneSnapshot,
@ -93,22 +75,10 @@ const Editor: VFC = () => {
state.initialEditorCamera,
state.setEditorOpen,
state.createSnapshot,
state.isPersistedStateDifferentThanInitial,
state.applyPersistedState,
],
shallow,
)
const [stateMismatch, setStateMismatch] = useState(false)
useLayoutEffect(() => {
if (initialState) {
setStateMismatch(isPersistedStateDifferentThanInitial())
} else {
applyPersistedState()
}
}, [applyPersistedState, initialState, isPersistedStateDifferentThanInitial])
return (
<root.div>
<div id="react-three-editable-editor-root">
@ -207,31 +177,7 @@ const MyComponent = () => (
</Button>
)}
</div>
<Modal visible={stateMismatch}>
<ModalHeader>Saved state found</ModalHeader>
<ModalBody>
Would you like to use initial state or saved state?
</ModalBody>
<ModalFooter>
<Button
className="flex-1"
onClick={() => {
applyPersistedState()
setStateMismatch(false)
}}
>
Saved
</Button>
<Button
className="flex-1"
onClick={() => {
setStateMismatch(false)
}}
>
Initial
</Button>
</ModalFooter>
</Modal>
<style type="text/css">{styles}</style>
</IdProvider>
</PortalManager>

View file

@ -4,7 +4,6 @@ import type {Object3D, Scene, WebGLRenderer} from 'three'
import {DefaultLoadingManager, Group} from 'three'
import type {MutableRefObject} from 'react'
import type {OrbitControls} from '@react-three/drei'
import deepEqual from 'fast-deep-equal'
// @ts-ignore TODO
import type {ContainerProps} from '@react-three/fiber'
import type {ISheet, ISheetObject} from '@theatre/core'
@ -207,9 +206,6 @@ export type EditorStore = {
proxyObject: Object3D | null,
uniqueName: string,
) => void
serialize: () => {}
isPersistedStateDifferentThanInitial: () => boolean
applyPersistedState: () => void
}
interface PersistedState {
@ -400,72 +396,11 @@ const config: StateCreator<EditorStore> = (set, get) => {
},
}))
},
serialize: () => ({}),
isPersistedStateDifferentThanInitial: () => {
const initialState = get().initialState
const canvasName = get().canvasName!
if (!initialState || !initialPersistedState) {
return false
}
return !deepEqual(
initialPersistedState.canvases[canvasName],
initialState,
)
},
applyPersistedState: () => {
const editables = get().editables
const canvasName = get().canvasName!
if (!initialPersistedState) {
return
}
},
}
}
export const useEditorStore = create<EditorStore>(config)
const initPersistence = (
key: string,
): [PersistedState | null, (() => void) | undefined] => {
let initialPersistedState: PersistedState | null = null
let unsub
if (process.env.NODE_ENV === 'development') {
try {
const rawPersistedState = localStorage.getItem(key)
if (rawPersistedState) {
initialPersistedState = JSON.parse(rawPersistedState)
}
} catch (e) {}
unsub = useEditorStore.subscribe(
() => {
const canvasName = useEditorStore.getState().canvasName
const serialize = useEditorStore.getState().serialize
if (canvasName) {
const editables = serialize()
localStorage.setItem(
key,
JSON.stringify({
canvases: {
[canvasName]: editables,
},
}),
)
}
},
(state) => state.editables,
)
}
return [initialPersistedState, unsub]
}
let [initialPersistedState, unsub] = initPersistence('react-three-editable_')
export type BindFunction = (options: {
allowImplicitInstancing?: boolean
state?: EditableState
@ -473,26 +408,7 @@ export type BindFunction = (options: {
sheet: ISheet
}) => (options: {gl: WebGLRenderer; scene: Scene}) => void
export const configure = ({
localStorageNamespace = '',
enablePersistence = true,
} = {}): BindFunction => {
if (unsub) {
unsub()
}
if (enablePersistence) {
const persistence = initPersistence(
`react-three-editable_${localStorageNamespace}`,
)
initialPersistedState = persistence[0]
unsub = persistence[1]
} else {
initialPersistedState = null
unsub = undefined
}
export const configure = ({} = {}): BindFunction => {
return ({
allowImplicitInstancing = false,
state,