diff --git a/gatsby-config.js b/gatsby-config.js
index 3fb0800..11086ff 100755
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -28,6 +28,14 @@ module.exports = {
//icon: `src/images/gatsby-icon.png`, // This path is relative to the root of the site.
},
},
+ // {
+ // resolve: 'gatsby-plugin-typescript',
+ // options: {
+ // isTSX: true,
+ // jsxPragma: `jsx`,
+ // allExtensions: true,
+ // },
+ // },
// this (optional) plugin enables Progressive Web App + Offline functionality
// To learn more, visit: https://gatsby.dev/offline
// `gatsby-plugin-offline`,
diff --git a/package-lock.json b/package-lock.json
index 1fc864c..49a97c4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2077,9 +2077,9 @@
}
},
"@types/node": {
- "version": "14.0.14",
- "resolved": "https://registry.npmjs.org/@types/node/-/node-14.0.14.tgz",
- "integrity": "sha512-syUgf67ZQpaJj01/tRTknkMNoBBLWJOBODF0Zm4NrXmiSuxjymFrxnTu1QVYRubhVkRcZLYZG8STTwJRdVm/WQ=="
+ "version": "14.0.24",
+ "resolved": "https://registry.npmjs.org/@types/node/-/node-14.0.24.tgz",
+ "integrity": "sha512-btt/oNOiDWcSuI721MdL8VQGnjsKjlTMdrKyTcLCKeQp/n4AAMFJ961wMbp+09y8WuGPClDEv07RIItdXKIXAA=="
},
"@types/parse-json": {
"version": "4.0.0",
@@ -2106,9 +2106,9 @@
}
},
"@types/react": {
- "version": "16.9.41",
- "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.41.tgz",
- "integrity": "sha512-6cFei7F7L4wwuM+IND/Q2cV1koQUvJ8iSV+Gwn0c3kvABZ691g7sp3hfEQHOUBJtccl1gPi+EyNjMIl9nGA0ug==",
+ "version": "16.9.43",
+ "resolved": "https://registry.npmjs.org/@types/react/-/react-16.9.43.tgz",
+ "integrity": "sha512-PxshAFcnJqIWYpJbLPriClH53Z2WlJcVZE+NP2etUtWQs2s7yIMj3/LDKZT/5CHJ/F62iyjVCDu2H3jHEXIxSg==",
"requires": {
"@types/prop-types": "*",
"csstype": "^2.2.0"
@@ -11795,21 +11795,6 @@
"resolved": "https://registry.npmjs.org/mobx/-/mobx-5.15.4.tgz",
"integrity": "sha512-xRFJxSU2Im3nrGCdjSuOTFmxVDGeqOHL+TyADCGbT0k4HHqGmx5u2yaHNryvoORpI4DfbzjJ5jPmuv+d7sioFw=="
},
- "mobx-react": {
- "version": "4.4.3",
- "resolved": "https://registry.npmjs.org/mobx-react/-/mobx-react-4.4.3.tgz",
- "integrity": "sha1-uqnsQRZe41rnud8ZvKEBkPNvEX4=",
- "requires": {
- "hoist-non-react-statics": "^2.3.1"
- },
- "dependencies": {
- "hoist-non-react-statics": {
- "version": "2.5.5",
- "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
- "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
- }
- }
- },
"moment": {
"version": "2.27.0",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.27.0.tgz",
@@ -14405,24 +14390,6 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
- "react-mobx": {
- "version": "0.0.4",
- "resolved": "https://registry.npmjs.org/react-mobx/-/react-mobx-0.0.4.tgz",
- "integrity": "sha512-dFvnbL3JryzmNkVPfb5klhGXFsEPD+X1yNHIOiLNTGFLXNHB7kLMghPHjenilKBMqg6ZIJ2mmo/9u6HBvBBUQg==",
- "requires": {
- "mobx": "^3.5.1",
- "mobx-react": "^4.4.2",
- "react": "^16.2.0",
- "react-dom": "^16.2.0"
- },
- "dependencies": {
- "mobx": {
- "version": "3.6.2",
- "resolved": "https://registry.npmjs.org/mobx/-/mobx-3.6.2.tgz",
- "integrity": "sha512-Dq3boJFLpZEvuh5a/MbHLUIyN9XobKWIb0dBfkNOJffNkE3vtuY0C9kSDVpfH8BB0BPkVw8g22qCv7d05LEhKg=="
- }
- }
- },
"react-reconciler": {
"version": "0.25.1",
"resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.25.1.tgz",
diff --git a/src/pages/index/indexConsole/commands.js b/src/components/index/indexConsole/commands/commands.js
similarity index 83%
rename from src/pages/index/indexConsole/commands.js
rename to src/components/index/indexConsole/commands/commands.js
index 49810cf..33fb9ae 100644
--- a/src/pages/index/indexConsole/commands.js
+++ b/src/components/index/indexConsole/commands/commands.js
@@ -1,5 +1,7 @@
import React from 'react'
+import ConsoleLoad from '../consoleLoad'
+
const help = () => {
return "register - register user by form \n"
+ "login - login user by form \n"
@@ -17,26 +19,10 @@ const register = () => {
)
}
-const login = () => {
- return (
-
-
-
- )
-}
-
-const logout = () => {
- return (
-
-
-
- )
-}
-
const startApp = () => {
return (
-
+
)
}
@@ -49,8 +35,6 @@ const undefined = (command) => {
export default {
help,
register,
- login,
- logout,
startApp,
undefined
}
\ No newline at end of file
diff --git a/src/components/index/indexConsole/commands/fetchCommands/Login.tsx b/src/components/index/indexConsole/commands/fetchCommands/Login.tsx
new file mode 100644
index 0000000..b692f60
--- /dev/null
+++ b/src/components/index/indexConsole/commands/fetchCommands/Login.tsx
@@ -0,0 +1,48 @@
+import React from 'react'
+import { connect } from 'react-redux'
+
+import UserService from '../../../../../stores/user/duck/operations'
+
+const loginInput: any = React.createRef()
+const passwInput: any = React.createRef()
+
+const Login = ( user) => {
+
+
+ const login = (event) => {
+ event.preventDefault()
+ UserService.postAuth(
+ loginInput.current.value,
+ passwInput.current.value
+ )
+ }
+
+ return (
+
+
+
+ )
+}
+
+const mapStateToProps = state => ({
+ user: state.user
+})
+
+// const mapDispatchToProps = dispatch => ({
+// postAuth: user => dispatch( UserService.postAuth(user.name, user.pass) )
+// })
+
+export default connect(mapStateToProps) (Login)
\ No newline at end of file
diff --git a/src/components/index/indexConsole/commands/fetchCommands/Logout.js b/src/components/index/indexConsole/commands/fetchCommands/Logout.js
new file mode 100644
index 0000000..21cc10a
--- /dev/null
+++ b/src/components/index/indexConsole/commands/fetchCommands/Logout.js
@@ -0,0 +1,21 @@
+import React from 'react'
+import { connect } from 'react-redux'
+import { UserService } from '../../../../../stores/user/duck/operations'
+
+const Logout = () => {
+ return (
+
+
+
+ )
+}
+
+const mapStateToProps = state => ({
+ user: state.user
+})
+
+const mapDispatchToProps = dispatch => ({
+ UserService: user => dispatch( UserService(user) )
+})
+
+export default connect(mapStateToProps, mapDispatchToProps) (Logout)
\ No newline at end of file
diff --git a/src/pages/index/indexConsole/consoleLoad.js b/src/components/index/indexConsole/consoleLoad.js
similarity index 100%
rename from src/pages/index/indexConsole/consoleLoad.js
rename to src/components/index/indexConsole/consoleLoad.js
diff --git a/src/pages/index/indexConsole/indexConsole.js b/src/components/index/indexConsole/indexConsole.js
similarity index 68%
rename from src/pages/index/indexConsole/indexConsole.js
rename to src/components/index/indexConsole/indexConsole.js
index 543cd8b..7233755 100644
--- a/src/pages/index/indexConsole/indexConsole.js
+++ b/src/components/index/indexConsole/indexConsole.js
@@ -1,10 +1,13 @@
import React, { useEffect, useState } from 'react'
-import commands from './commands'
+import commands from './commands/commands'
+import Login from './commands/fetchCommands/Login.tsx'
+// import Logout from './commands/fetchCommands/Logout'
import '../../../styles/general.scss'
-const IndexConsole = () => {
+
+const IndexConsole = ( user ) => {
useEffect( () => resizeConsoleDiv(), [])
@@ -20,6 +23,9 @@ const IndexConsole = () => {
const [consoleHistory, setConsoleHistory] = useState('')
+ const [loginCommand, setVisibleLoginForm] = useState(false)
+ const [logoutCommand, setVisibleLogoutForm] = useState(false)
+
const consoleInput = React.createRef()
let consoleUser = 'guest@00x097 * > '
@@ -30,6 +36,9 @@ const IndexConsole = () => {
consoleUser += inputValue + '\n'
if ( inputValue === 'help' )
setConsoleHistory( consoleHistory + consoleUser + commands.help() )
+ if ( inputValue === 'login' ) {
+ setVisibleLoginForm( !loginCommand )
+ }
else if ( inputValue === 'clean' )
setConsoleHistory( '' )
else
@@ -50,7 +59,7 @@ const IndexConsole = () => {
{ consoleHistory }
+
)
}
diff --git a/src/pages/index/indexInterface.js b/src/components/index/indexInterface.js
similarity index 100%
rename from src/pages/index/indexInterface.js
rename to src/components/index/indexInterface.js
diff --git a/src/pages/index/indexPanel/indexPanel.js b/src/components/index/indexPanel/indexPanel.js
similarity index 100%
rename from src/pages/index/indexPanel/indexPanel.js
rename to src/components/index/indexPanel/indexPanel.js
diff --git a/src/pages/index/indexPanel/panels/albumPanel.js b/src/components/index/indexPanel/panels/albumPanel.js
similarity index 100%
rename from src/pages/index/indexPanel/panels/albumPanel.js
rename to src/components/index/indexPanel/panels/albumPanel.js
diff --git a/src/pages/index/indexPanel/panels/songPanel.js b/src/components/index/indexPanel/panels/songPanel.js
similarity index 100%
rename from src/pages/index/indexPanel/panels/songPanel.js
rename to src/components/index/indexPanel/panels/songPanel.js
diff --git a/src/pages/index/playerInterface/audioPlayer.js b/src/components/index/playerInterface/audioPlayer.js
similarity index 98%
rename from src/pages/index/playerInterface/audioPlayer.js
rename to src/components/index/playerInterface/audioPlayer.js
index e27963a..b86e2b7 100755
--- a/src/pages/index/playerInterface/audioPlayer.js
+++ b/src/components/index/playerInterface/audioPlayer.js
@@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react'
import '../../../styles/audioVisualizer.scss'
-import { alphabeth } from '../../../components/alphabeth'
+import { alphabeth } from '../../alphabeth'
import audioTest from '../../../images/audioTest0.wav'
diff --git a/src/pages/app.js b/src/pages/app.js
deleted file mode 100644
index 46b7e32..0000000
--- a/src/pages/app.js
+++ /dev/null
@@ -1,15 +0,0 @@
-// import React from 'react'
-// import
-// import { observer } from 'react-mobx'
-// import { render } from 'node-sass'
-
-// import Guest from './../stores/guest'
-
-// @observer
-// class App {
-
-// render() {
-//
-// }
-// }
-
diff --git a/src/pages/index.js b/src/pages/index.js
new file mode 100644
index 0000000..41b096c
--- /dev/null
+++ b/src/pages/index.js
@@ -0,0 +1,12 @@
+import React from 'react'
+import IndexConsole from '../components/index/indexConsole/indexConsole'
+import { store } from '../stores/store.ts'
+import { Provider } from 'react-redux'
+
+const IndexPage = () => (
+
+
+
+)
+
+export default IndexPage
diff --git a/src/stores/loadStore.ts b/src/stores/loadStore.ts
new file mode 100644
index 0000000..220e3b2
--- /dev/null
+++ b/src/stores/loadStore.ts
@@ -0,0 +1,23 @@
+export const loadState = () => {
+ try {
+ const serializedState = localStorage.getItem('state');
+
+ if (serializedState === null) {
+ return undefined;
+ }
+
+ return JSON.parse(serializedState);
+
+ } catch (err) {
+ return undefined;
+ }
+ };
+
+ export const saveState = (state) => {
+ try {
+ const serializedState = JSON.stringify(state);
+ localStorage.setItem('state', serializedState);
+ } catch (err) {
+ console.log('save in local storage error');
+ }
+ };
\ No newline at end of file
diff --git a/src/stores/reducers.ts b/src/stores/reducers.ts
new file mode 100644
index 0000000..49307d6
--- /dev/null
+++ b/src/stores/reducers.ts
@@ -0,0 +1,9 @@
+import { combineReducers } from 'redux'
+
+import userReducer from './user/duck'
+
+const rootReducer = combineReducers({
+ user: userReducer
+})
+
+export default rootReducer
\ No newline at end of file
diff --git a/src/stores/store.ts b/src/stores/store.ts
new file mode 100644
index 0000000..aa15843
--- /dev/null
+++ b/src/stores/store.ts
@@ -0,0 +1,24 @@
+import { createStore } from 'redux'
+import { saveState, loadState } from './loadStore'
+import rootReducer from './reducers'
+import loadash from 'lodash'
+
+const persistedState = loadState()
+
+export const store = createStore(rootReducer, persistedState)
+
+store.subscribe( () => {
+ saveState({
+ user: store.getState().user
+ })
+})
+
+store.subscribe( loadash.throttle( () => {
+ saveState({
+ user: store.getState().user
+ })
+}, 1000))
+
+export default preloadedState => {
+ return createStore(rootReducer, preloadedState)
+}
\ No newline at end of file
diff --git a/src/stores/user/duck/index.ts b/src/stores/user/duck/index.ts
index e69de29..8833653 100644
--- a/src/stores/user/duck/index.ts
+++ b/src/stores/user/duck/index.ts
@@ -0,0 +1,5 @@
+import userReducer from './reducers'
+export { default as userTypes } from './types'
+export { default as userActions } from './actions'
+
+export default userReducer
\ No newline at end of file
diff --git a/src/stores/user/duck/operations.ts b/src/stores/user/duck/operations.ts
index c9694b0..780b79c 100644
--- a/src/stores/user/duck/operations.ts
+++ b/src/stores/user/duck/operations.ts
@@ -7,18 +7,16 @@ import User from './class'
export default class UserService {
- constructor(
- private service: AppService,
- private serviceUser: User,
- private response: any
- ){}
+ private static service: AppService
+ private static serviceUser: User
+ private static response: any
- private endpoint: string = 'user/'
- private dispatch: any = useDispatch()
+ private static endpoint: string = 'user/'
+ private static dispatch: any = useDispatch()
// Authorization
- public async postAuth(username: string, password: string) {
+ public static async postAuth(username: string, password: string) {
const body = {
username: username,
password: password
@@ -40,7 +38,7 @@ export default class UserService {
this.dispatch(actions.login(this.serviceUser))
}
- public async deleteAuth(token: string) {
+ public static async deleteAuth(token: string) {
this.response = await this.service.delete(
this.endpoint + 'auth',
token
@@ -50,7 +48,7 @@ export default class UserService {
// User CRUD
- public async registerUser(user: any) {
+ public static async registerUser(user: any) {
this.response = await this.service.post(
this.endpoint,
user,
@@ -58,7 +56,7 @@ export default class UserService {
)
}
- public async updateUser(user: any, id: number, token: string) {
+ public static async updateUser(user: any, id: number, token: string) {
this.response = await this.service.patch(
this.endpoint + id,
user,
@@ -76,11 +74,11 @@ export default class UserService {
this.dispatch(actions.login(this.serviceUser))
}
- public async deleteUser(id: number, token: string) {
+ public static async deleteUser(id: number, token: string) {
this.response = await this.service.delete(
this.endpoint + id,
token
)
this.deleteAuth(token)
}
-}
\ No newline at end of file
+}