diff --git a/src/components/index/indexConsole/commands/fetchCommands/Album/Create.js b/src/components/index/indexConsole/commands/fetchCommands/Album/Create.js
index 52de87a..e24fd7e 100644
--- a/src/components/index/indexConsole/commands/fetchCommands/Album/Create.js
+++ b/src/components/index/indexConsole/commands/fetchCommands/Album/Create.js
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react'
import { connect } from 'react-redux'
import { createAlbum } from '../../../../../../stores/album/duck/operations'
-
+import { progressStream } from '../../../../../../stores/AppService'
const AlbumCreate = ({
user,
@@ -15,8 +15,7 @@ const AlbumCreate = ({
const [message, setMessage] = useState('')
const [image, setImage] = useState('')
const [imageInfo, setImageInfo] = useState('Drop/Click\nfor upload album image...')
- const [progress, setProgress] = useState('')
-
+
const titleInput = React.createRef()
const descriptionInput = React.createRef()
@@ -42,11 +41,9 @@ const AlbumCreate = ({
await createAlbum(
album,
user.token
- ).then(
- setMessage('album create success')
- ).catch(
- setMessage('album create failed')
- )
+ ).then( response => {
+ setMessage( response['info'] )
+ })
}
const generateUrlCode = () => {
@@ -104,7 +101,6 @@ const AlbumCreate = ({
event.preventDefault()
let data = event.target.files[0]
setImage( await toBase64( data ) )
- // uploadListener( data )
setImageInfos(data.name, data.size)
}
@@ -113,22 +109,9 @@ const AlbumCreate = ({
event.persist()
let data = event.dataTransfer.files[0]
setImage( await toBase64( data ) )
- // uploadListener( data )
setImageInfos(data.name, data.size)
}
- const uploadListener = async ( data ) => {
- let progress = new Response(data).arrayBuffer()
- console.log(progress)
- await uploadProgressBar( progress, data.size )
- }
-
- const uploadProgressBar = async ( progress, size ) => {
- let percent = progress / size
- setProgress('upload image [____________________]')
- setProgress( progress + '#' + percent)
- }
-
const setImageInfos = (name, size) => {
setImageInfo(
'name: "'
@@ -157,7 +140,7 @@ const AlbumCreate = ({
autoComplete='off'
ref={ descriptionInput }
/>
-
+
{ imageInfo }
onLoadFile(event) }
/>
- { progress }
diff --git a/src/components/index/indexConsole/commands/fetchCommands/Album/GetAll.js b/src/components/index/indexConsole/commands/fetchCommands/Album/GetAll.js
index 4328711..3b4a24d 100644
--- a/src/components/index/indexConsole/commands/fetchCommands/Album/GetAll.js
+++ b/src/components/index/indexConsole/commands/fetchCommands/Album/GetAll.js
@@ -21,11 +21,10 @@ const AlbumGetAll = ({
getAllAlbum()
.then( response => {
setMessage(
- mapAlbumsToString( response )
- + 'get list success\n'
+ mapAlbumsToString( response['response'] )
+ + response['info']
)
- }).catch( () => {
- setMessage( 'get list failed\n' )
+ console.log( response )
})
setOne( !oneRequest )
} else {
@@ -59,7 +58,6 @@ const AlbumGetAll = ({
return (
-
)
}
diff --git a/src/pages/index.js b/src/pages/index.js
index 216e733..8de445f 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -3,8 +3,8 @@ import IndexConsole from '../components/index/indexConsole/indexConsole'
import { store } from '../stores/store'
import { Provider } from 'react-redux'
-import LogRocket from 'logrocket';
-LogRocket.init('ugbdf9/music-service');
+// import LogRocket from 'logrocket';
+// LogRocket.init('ugbdf9/music-service');
const IndexPage = () => (
diff --git a/src/stores/AppService.js b/src/stores/AppService.js
index de62f1a..0d8e951 100644
--- a/src/stores/AppService.js
+++ b/src/stores/AppService.js
@@ -34,36 +34,55 @@ const _delete = async (endpoint, token) => {
// Fetch methods
const responseGD = async (address, method, token) => {
- const response = await fetch(address, {
- method: method,
- credentials: 'same-origin',
- headers: {
- "Authorization": token,
- "X-CSRFToken": csrftoken,
- "accept": "application/json",
- "Content-Type": "application/json"
- }
- }).then( response => {
- return progressStream( response )
- })
- return response.json()
+ try {
+ const response = await fetch(address, {
+ method: method,
+ credentials: 'same-origin',
+ headers: {
+ "Authorization": token,
+ "X-CSRFToken": csrftoken,
+ "accept": "application/json",
+ "Content-Type": "application/json"
+ }
+ })
+ return await responseExceptions( await response.json() )
+ } catch ( error ) {
+ return { info: error }
+ }
}
const responseCRU = async (address, method, body, token) => {
- const response = await fetch(address, {
- method: method,
- credentials: 'same-origin',
- body: JSON.stringify(body),
- headers: {
- "Authorization": token,
- "X-CSRFToken": csrftoken,
- "accept": "application/json",
- "Content-Type": "application/json"
+ try {
+ const response = await fetch(address, {
+ method: method,
+ credentials: 'same-origin',
+ body: JSON.stringify(body),
+ headers: {
+ "Authorization": token,
+ "X-CSRFToken": csrftoken,
+ "accept": "application/json",
+ "Content-Type": "application/json"
+ }
+ })
+ return await responseExceptions( await response.json() )
+ } catch ( error ) {
+ return { info: error }
+ }
+}
+
+const responseExceptions = async ( response ) => {
+ try {
+ //progressStream( response )
+ return {
+ response: response,
+ info: 'operation success'
}
- }).then( response => {
- return progressStream( response )
- })
- return response.json()
+ } catch {
+ return {
+ response: response,
+ info: 'operation failed'
+ }
+ }
}
// Get CSRF Token
@@ -90,7 +109,7 @@ const csrftoken = getCookie('csrftoken')
* only use with fetch API in `then` statement
* @param response - is a response from fetch
*/
-const progressStream = (response) => {
+export const progressStream = (response) => {
const contentLength = response.headers.get('content-length')
if (!contentLength)
throw Error('Content-Length response header unavailable')
@@ -105,17 +124,18 @@ const progressStream = (response) => {
reader.read()
.then(({ done, value }) => {
if (done) {
- controller.close();
- return;
+ controller.close()
+ return
}
- loaded += value.byteLength;
- console.log({ loaded, total })
- controller.enqueue(value);
- read();
- }).catch(error => {
- console.error(error);
- controller.error(error)
+ loaded += value.byteLength
+ console.log( loaded / total * 100 )
+ controller.enqueue(value)
+ read()
})
+ // .catch(error => {
+ // console.error(error)
+ // controller.error(error)
+ // })
}
}
})
diff --git a/src/stores/album/duck/operations.js b/src/stores/album/duck/operations.js
index e2057dc..ec02046 100644
--- a/src/stores/album/duck/operations.js
+++ b/src/stores/album/duck/operations.js
@@ -29,7 +29,9 @@ export const createAlbum = async (album, token) => {
endpoint,
album,
token
- )
+ ).then( response => {
+ return response
+ })
}
export const updateAlbum = async (id, album, token) => {
@@ -37,14 +39,18 @@ export const updateAlbum = async (id, album, token) => {
endpoint + id + '/',
album,
token
- )
+ ).then( response => {
+ return response
+ })
}
export const deleteAlbum = async (id, token) => {
return await AppService._delete(
endpoint + id + '/',
token
- )
+ ).then( response => {
+ return response
+ })
}
// Album Ratings CRUD
@@ -54,6 +60,7 @@ export const getAllAlbumRating = (id) => async ( dispatch ) => {
endpoint + id + '/ratings/'
).then( response => {
dispatch( actions.getRatings( response ) )
+ return response
})
}
@@ -62,12 +69,16 @@ export const createAlbumRating = (album_id, rating, token) => async ( dispatch )
endpoint + album_id + '/rating/',
rating,
token
- )
+ ).then( response => {
+ return response
+ })
}
export const deleteAlbumRating = (album_id, rating_id, token) => async ( dispatch ) => {
return await AppService._delete(
endpoint + album_id + '/rating/' + rating_id,
token
- )
+ ).then( response => {
+ return response
+ })
}
\ No newline at end of file
diff --git a/src/stores/loadStore.js b/src/stores/loadStore.js
index 220e3b2..5e84d7e 100644
--- a/src/stores/loadStore.js
+++ b/src/stores/loadStore.js
@@ -17,7 +17,7 @@ export const loadState = () => {
try {
const serializedState = JSON.stringify(state);
localStorage.setItem('state', serializedState);
- } catch (err) {
- console.log('save in local storage error');
+ } catch ( error ) {
+ console.log( error );
}
};
\ No newline at end of file
diff --git a/src/stores/user/duck/operations.js b/src/stores/user/duck/operations.js
index 4929d0b..e53762a 100644
--- a/src/stores/user/duck/operations.js
+++ b/src/stores/user/duck/operations.js
@@ -15,79 +15,81 @@ export const postAuth = (username, password) => async (dispatch) => {
username: username,
password: password
}
- try {
- return await AppService._post(
- endpoint + 'auth',
- body,
- AppService.defaultToken
- ).then( response => {
- try {
- serviceUser = {
- id: response.user.id,
- username: response.user.username,
- email: response.user.email,
- ip: response.user.ip,
- city: response.user.city,
- country: response.user.country,
- token: response.Authorization
- }
- dispatch(actions.login(serviceUser))
- return { error: 'login success' }
- } catch {
- return { error: 'login failed' }
+ return await AppService._post(
+ endpoint + 'auth',
+ body,
+ AppService.defaultToken
+ ).then( response => {
+ try {
+ serviceUser = {
+ id: response.user.id,
+ username: response.user.username,
+ email: response.user.email,
+ ip: response.user.ip,
+ city: response.user.city,
+ country: response.user.country,
+ token: response.Authorization
}
- })
- } catch {
- return { error: 'connection failed' }
- }
+ dispatch(actions.login(serviceUser))
+ return { error: 'login success' }
+ } catch {
+ return { error: 'login failed' }
+ }
+ })
}
export const deleteAuth = (token) => async (dispatch) => {
- try {
- response = await AppService._delete(
- endpoint + 'auth',
- token
- ).then( () => {
+ response = await AppService._delete(
+ endpoint + 'auth',
+ token
+ ).then( () => {
+ try {
dispatch(actions.logout())
return { error: 'logout success'}
- })
- } catch {
- return { error: 'connection failed' }
- }
+ } catch {
+ return { error: 'logout failed' }
+ }
+ })
}
// User CRUD
export const registerUser = async (user) => {
- response = await AppService._post(
+ return await AppService._post(
endpoint,
user,
AppService.defaultToken
- )
+ ).then( response => {
+ return response
+ })
}
export const updateUser = (user, id, token) => async (dispatch) => {
- response = await AppService._patch(
+ return await AppService._patch(
endpoint + id,
user,
token
- )
- serviceUser = {
- id: response.user.id,
- username: response.user.username,
- email: response.user.email,
- ip: response.user.ip,
- city: response.user.city,
- country: response.user.country,
- token: token
- }
- dispatch(actions.login(serviceUser))
+ ).then( response => {
+ serviceUser = {
+ id: response.user.id,
+ username: response.user.username,
+ email: response.user.email,
+ ip: response.user.ip,
+ city: response.user.city,
+ country: response.user.country,
+ token: token
+ }
+ dispatch(actions.login(serviceUser))
+ return response
+ })
}
export const deleteUser = async (id, token) => {
- response = await AppService._delete(
+ return await AppService._delete(
endpoint + id,
token
- )
- deleteAuth(token)
+ ).then( response => {
+ deleteAuth(token)
+ return response
+ })
}
\ No newline at end of file
diff --git a/src/styles/general.scss b/src/styles/general.scss
index 44c4104..535c86d 100755
--- a/src/styles/general.scss
+++ b/src/styles/general.scss
@@ -65,7 +65,6 @@ body {
font-size: 16px;
border: 0px;
margin-left: 5px;
- margin-top: 10px;
}
input:focus{
outline: none;