diff --git a/src/pages/func_group/navigationBar.js b/src/pages/func_group/navigationBar.js new file mode 100644 index 0000000..a6b55d4 --- /dev/null +++ b/src/pages/func_group/navigationBar.js @@ -0,0 +1,236 @@ +import React, { useState, useEffect } from 'react' +import { useSelector, useDispatch } from 'react-redux' + +import { userAuthSelector } from '../../redux/slices/userAuthSlice' +import { userCrudSelector } from '../../redux/slices/userCrudSlice' + +import userCrudAsyncThunk from '../../redux/asyncThunks/userCrudAsyncThunk' + + +const __styleChanger = ( bool ) => { + + let display = { + display: 'block' + } + + let hide = { + display: 'none' + } + + return bool ? display : hide +} + +const NavigationBar = ({ movements }) => { + + const { user_get } = useSelector(userCrudSelector) + const { token, user } = useSelector(userAuthSelector) + + const dispatch = useDispatch() + + useEffect( () => { + if ( user_get !== {} && token !== '' && user.id > 0) + dispatch( + userCrudAsyncThunk.fetchGetOneUser( + { + user_id: user.id, + token: token + } + ) + ) + }) + + const [showAccount, setShowAccount] = useState(false) + const [showModels, setShowModels] = useState(false) + const [showRender, setShowRender] = useState(false) + const [showRenderFunc, setShowRenderFunc] = useState(false) + + return( + <> +
+ Menu +
+
setShowAccount( !showAccount ) }> + ├── Account Settings +
+
+
+ │ ├── User info +
+
+ │ │ ├── { user_get.username } +
+
+ │ │ └── { user_get.email } +
+
+
+
movements.user_view.setUserCrudView( + { + update_user: true, + delete_user: false + } + ) + }> + │ ├── Update User +
+
movements.user_view.setUserCrudView( + { + update_user: false, + delete_user: true + } + ) + }> + │ └── Delete User +
+
+
+
+
setShowModels( !showModels ) }> + ├── Models +
+
+
movements.model_view.setModelCrudView( + { + get_all_models: true, + get_one_model_and_download: false, + upload_model: false + } + ) + }> + │ ├── Get All Models +
+
movements.model_view.setModelCrudView( + { + get_all_models: false, + get_one_model_and_download: true, + upload_model: false + } + ) + }> + │ ├── Get One Model & Download +
+
movements.model_view.setModelCrudView( + { + get_all_models: false, + get_one_model_and_download: false, + upload_model: true + } + ) + }> + │ └── Upload Model +
+
+
+
+
setShowRender( !showRender ) }> + ├── Render +
+
+
movements.model_view.setModelCrudView( + { + show_ready_renders_and_download: true, + render_functionality: { + render_single_image: false, + render_single_set: false, + render_all: false, + render_image_by_vector: false, + render_set_by_vector: false + } + } + ) + }> + │ ├── Show Ready Renders & Download +
+
+
setShowRenderFunc( !showRenderFunc ) }> + │ ├── Render Functionality +
+
+
movements.model_view.setModelCrudView( + { + show_ready_renders_and_download: false, + render_functionality: { + render_single_image: true, + render_single_set: false, + render_all: false, + render_image_by_vector: false, + render_set_by_vector: false + } + } + ) + }> + │ │ ├── Render Single Image +
+
movements.model_view.setModelCrudView( + { + show_ready_renders_and_download: false, + render_functionality: { + render_single_image: false, + render_single_set: true, + render_all: false, + render_image_by_vector: false, + render_set_by_vector: false + } + } + ) + }> + │ │ ├── Render Single Set +
+
movements.model_view.setModelCrudView( + { + show_ready_renders_and_download: false, + render_functionality: { + render_single_image: false, + render_single_set: false, + render_all: true, + render_image_by_vector: false, + render_set_by_vector: false + } + } + ) + }> + │ │ ├── Render All Sets +
+
movements.model_view.setModelCrudView( + { + show_ready_renders_and_download: false, + render_functionality: { + render_single_image: false, + render_single_set: false, + render_all: false, + render_image_by_vector: true, + render_set_by_vector: false + } + } + ) + }> + │ │ ├── Render Image By Vector +
+
movements.model_view.setModelCrudView( + { + show_ready_renders_and_download: false, + render_functionality: { + render_single_image: false, + render_single_set: false, + render_all: false, + render_image_by_vector: false, + render_set_by_vector: true + } + } + ) + }> + │ │ └── Render Set By Vector +
+
+
+
+
+
+ └── Logout +
+
+ + ) +} + +export default NavigationBar \ No newline at end of file diff --git a/src/pages/func_group/rootUtils.js b/src/pages/func_group/rootUtils.js index 8e36a83..d1d3f9a 100644 --- a/src/pages/func_group/rootUtils.js +++ b/src/pages/func_group/rootUtils.js @@ -1,5 +1,6 @@ -import React, { useState, useEffect } from 'react' +import React, { useState } from 'react' import { useSelector } from 'react-redux' + import { userAuthSelector } from '../../redux/slices/userAuthSlice' import UserAuthIndex from './user_auth/userAuthIndex' @@ -8,18 +9,57 @@ import ModelCrudIndex from './model_crud/modelCrudIndex' import RenderCrudIndex from './render_crud/renderCrudIndex' import RenderWebsocketIndex from './render_websocket/renderWebsocketIndex' +import NavigationBar from './navigationBar' + const GeneralView = () => { - const [userAuthView, setUserAuthView] = useState(true) - const [userCrudView, setUserCrudView] = useState(false) - const [modelCrudView, setModelCrudView] = useState(false) - const [renderCrudView, setRenderCrudView] = useState(false) - const [renderWebsocketView, setRenderWebsocketView] = useState(false) + const [userCrudView, setUserCrudView] = useState( + { + update_user: false, + delete_user: false + } + ) + const [modelCrudView, setModelCrudView] = useState( + { + get_all_models: false, + get_one_model_and_download: false, + upload_model: false + } + ) + const [renderCrudView, setRenderCrudView] = useState( + { + show_ready_renders_and_download: false, + render_functionality: { + render_single_image: false, + render_single_set: false, + render_all: false, + render_image_by_vector: false, + render_set_by_vector: false + } + } + ) + + let movements = { + user_view: { + userCrudView: userCrudView, + setUserCrudView: setUserCrudView + }, + model_view: { + modelCrudView: modelCrudView, + setModelCrudView: setModelCrudView + }, + render_view: { + renderView: renderCrudView, + setRenderView: setRenderCrudView + } + } return ( <> - + @@ -29,9 +69,9 @@ const GeneralView = () => { } const __verifyUserSession = (token, user) => { - - if ( user.id > 0 && user.username !== '' && user.email !== '' && token !== '') - return false + + if ( user.id !== 0 && user.username !== '' && user.email !== '' && token !== '' ) + return true else return true @@ -45,8 +85,8 @@ const VerifyUserSession = () => { <> { __verifyUserSession(token, user) - ? - : + ? + : } ) diff --git a/src/pages/index.js b/src/pages/index.js index 03ae8e1..e020124 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -9,7 +9,7 @@ import Root from './func_group/root'; // if you have problem with watchers - use it: // echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p -const Index = () => { +const IndexPage = () => { return ( @@ -17,4 +17,4 @@ const Index = () => { ) } -export default Index \ No newline at end of file +export default IndexPage \ No newline at end of file diff --git a/src/redux/stateLoader.js b/src/redux/stateLoader.js index 5186487..1e7069c 100644 --- a/src/redux/stateLoader.js +++ b/src/redux/stateLoader.js @@ -1,11 +1,8 @@ export const loadState = () => { try { - const stateName = localStorage.getItem('user_key') - const serializedState = localStorage.getItem(stateName) + const serializedState = localStorage.getItem('state') - if (stateName === null) { - return {} - } else if (serializedState === null) { + if (serializedState === undefined || serializedState === null) { return {} } else { return JSON.parse(serializedState) @@ -21,15 +18,12 @@ export const loadState = () => { export const saveState = (state) => { try { - const stateName = localStorage.getItem('user_key') const serializedState = JSON.stringify(state) - if (stateName === null) { - return undefined - } else if (serializedState === null) { + if (serializedState === null) { return undefined } else { - localStorage.setItem(stateName, serializedState) + localStorage.setItem('state', serializedState) } } catch (err) {