From 03f4d8065bee3cda29c96bcd7dbeef98f97a3e2c Mon Sep 17 00:00:00 2001
From: TBS093A <zukkamil.44@gmail.com>
Date: Wed, 12 Aug 2020 14:45:34 +0200
Subject: [PATCH] restore the Create.js file -> Album

---
 .../commands/fetchCommands/Album/Create.js    | 132 ++++++++++++++++++
 1 file changed, 132 insertions(+)
 create mode 100644 src/components/index/indexConsole/commands/fetchCommands/Album/Create.js

diff --git a/src/components/index/indexConsole/commands/fetchCommands/Album/Create.js b/src/components/index/indexConsole/commands/fetchCommands/Album/Create.js
new file mode 100644
index 0000000..85b01cd
--- /dev/null
+++ b/src/components/index/indexConsole/commands/fetchCommands/Album/Create.js
@@ -0,0 +1,132 @@
+import React, { useState, useEffect } from 'react'
+import { connect } from 'react-redux'
+
+import { createAlbum } from '../../../../../../stores/album/duck/operations'
+import FormGenerator from '../Abstract Utils/FormGenerator'
+
+
+const AlbumCreate = ({ 
+    user,
+    createAlbum, 
+    consoleHistory, setConsoleHistory, 
+    componentVisible, setComponentVisible,
+    activateConsoleInput
+}) => {
+
+    const [message, setMessage] = useState('')
+    const [image, setImage] = useState('')
+    const [imageInfo, setImageInfo] = useState('Drop/Click\nfor upload album image...')
+
+    const titleInput = React.createRef()
+    const descriptionInput = React.createRef()
+
+    let inputList = [
+        {
+            type: 'text',
+            name: 'titleAlbum',
+            ref: titleInput
+        },
+        {
+            type: 'text',
+            name: 'descriptionAlbum',
+            ref: descriptionInput
+        },
+        {
+            type: 'file',
+            name: 'imageAlbum',
+            fileType: 'image',
+            dropInfo: imageInfo,
+            setDropInfo: setImageInfo,
+            file: image,
+            setFile: setImage
+        }
+    ]
+
+    const create = async (event) => {
+        event.preventDefault()
+        let title = titleInput.current.value
+        let description = descriptionInput.current.value
+        if ( title !== '' && description !== '' ) {
+            await createFetch(title, description)
+        } if ( description === '') {
+            document.getElementById('descriptionAlbumInput').focus()
+        }
+    }
+
+    const createFetch = async (title, description) => {
+        let album = {
+            user_id: user.id,
+            title: title,
+            description: description,
+            image: image,
+            url_code: generateUrlCode(),
+        }
+        await createAlbum(
+            album,
+            user.token
+        ).then( response => {
+            setMessage( response['info'] + '\n' )
+        })
+    }
+
+    const generateUrlCode = () => {
+        let code = 'op?album='
+        let hash = [
+            '!', '@', '#', '$', '%', '^', '&', '*',
+            'Q', 'W', 'X', 'S', 'q', 'w', 'x', 's'
+        ]
+        code +=  
+             + hash[ randomInt(7, 14) ] 
+             + hash[ randomInt(7, 14) ] 
+             + hash[ randomInt(7, 14) ] 
+             + hash[ randomInt(0, 7) ] 
+             + hash[ randomInt(0, 7) ]
+             + hash[ randomInt(0, 7) ]
+             + randomInt(0, 9)
+             + randomInt(0, 9) 
+             + randomInt(0, 9)
+        return code
+    }
+
+    const randomInt = (min, max) => {
+        return min + Math.floor((max - min) * Math.random())
+    }
+    
+    useEffect( 
+        () => {
+            if ( componentVisible ) {
+                document.getElementById('titleAlbumInput').focus()
+            } else {
+                activateConsoleInput()         
+            }
+            if ( message !== '' ) {
+
+                titleInput.current.value = ''
+                descriptionInput.current.value = ''
+
+                setConsoleHistory( consoleHistory + message )
+                setComponentVisible( false )
+                setImage('')
+                setImageInfo('Drop/Click\nfor upload album image...')
+                setMessage('')
+            }
+        }
+    )
+
+    return (
+        <FormGenerator 
+            inputList={ inputList }
+            action={ create }
+        />
+    )
+}
+
+const mapStateToProps = state => ({
+    user: state.user
+})
+
+const mapDispatchToProps = dispatch => ({
+    createAlbum: (album, token) => createAlbum(album, token)
+})
+
+export default connect(mapStateToProps, mapDispatchToProps)(AlbumCreate)
\ No newline at end of file