import React, { useState } from 'react'
import fetch from 'unfetch'
import Head from 'next/head'
import Button from '../components/Button.js'
import styles from './feedback.module.css'
import constants from '../constants.json'
const results = {
success: 'SUCCESS',
error: 'ERROR',
notSent: 'NOTSENT',
invalid: 'INVALID',
}
export default function Feedback(props) {
const [form, setForm] = useState({})
const [file, setFile] = useState(undefined)
const [result, setResult] = useState(results.notSent)
const [fileResult, setFileResult] = useState(results.notSent)
const onChange = (e) => {
setForm({
...form,
[e.target.name]: e.target.value,
})
}
const renderTextInputArea = (params) => {
return (
)
}
const onFileChangeHandler = (e) => {
setForm({
...form,
file: e.target.files[0].name,
})
setFile(e.target.files[0])
}
const renderFileUploader = () => {
return (
)
}
const handleSubmit = async () => {
if (!form.description) {
setResult(results.invalid)
}
const t = document.getElementById('cid').value
let cid = ''
let version = ''
if (t) {
cid = t.split('|')[0]
version = t.split('|')[1]
}
const rawResponse = await fetch(constants.apiUrl + 'postfeedback', {
method: 'POST',
credentials: 'include',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
...form,
cid: cid,
version: version,
}),
})
rawResponse
.json()
.then((resp) => {
if (resp.success) {
setResult(results.success)
} else {
console.log(resp)
setResult(results.error)
}
})
.catch((e) => {
setResult(results.error)
console.log(e)
})
if (file) {
const formData = new FormData() // eslint-disable-line
formData.append('file', file)
const rawFileResponse = await fetch(
constants.apiUrl + 'postfeedbackfile',
{
method: 'POST',
credentials: 'include',
headers: {
Accept: 'application/json',
},
body: formData,
}
)
rawFileResponse
.json()
.then((resp) => {
if (resp.success) {
setFileResult(results.success)
} else {
console.log(resp)
setFileResult(results.error)
}
})
.catch((e) => {
setFileResult(results.error)
console.log('FILE', e)
})
}
}
const renderResult = () => {
if (results === result.success) {
return sucess
} else if (results === result.error) {
return error
} else if (results === result.invalid) {
return invalid
} else {
return null
}
}
// action={constants.apiUrl + 'badtestsender'} encType='multipart/form-data' method='post'
const renderForm = (props) => {
return (
{props.noDesc ? (
Mező kitöltése kötelező!
) : null}
{renderTextInputArea({
text: 'Rövid leírás',
name: 'description',
onChange: onChange,
})}
Főoldalon lesz rá válasz MOTD-ben, amit csak te látsz (ha kell rá
válasz)
Küldés
Az alábbi mezők kitöltése opcionális, de hiba leírásnál nagyon sokat
tud segíteni!{' '}
Legnagyobb segítség ha azt a kérdés oldalt és a hozzátartozó
eredmények oldalt ahol nem helyesen működnek a dolgok Ctrl+S -el
lemented, és egy zip-ben feltöltöd a .html fájlt!
{' '}
Így egyszerűen reprodukálni tudom a hibát. TY!
{renderTextInputArea({
text: 'Lépések amikkel előáll a hiba',
name: 'steps',
onChange: onChange,
})}
{renderTextInputArea({
text: 'Elvárt működés',
name: 'expected',
onChange: onChange,
})}
{renderTextInputArea({
text: 'Ami történik helyette',
name: 'current',
onChange: onChange,
})}
{renderFileUploader()}
{renderResult()}
)
}
const renderStuff = () => {
if (result === results.notSent && fileResult === results.notSent) {
console.log('both not sent')
return {renderForm({})}
} else if (result === results.invalid) {
console.log('result is invalid')
return (
{renderForm({ noDesc: true })}
)
} else if (result === results.success && !file) {
console.log('text sucess, no file')
return Visszajelzés elküldve c:
} else if (result === results.error && fileResult === results.success) {
console.log('file sucess only')
return Hiba küldés közben :c
} else if (result === results.success && fileResult === results.error) {
console.log('text sucess only')
return (
Visszajelzés elküldve, de fájlt nem sikerült elküldeni :c
)
} else if (result === results.success && fileResult === results.success) {
console.log('both sucess')
return Visszajelzés elküldve c:
} else {
return Bit of a fuckup here
}
}
return (
Qmining - Feedback
{renderStuff()}
)
}