diff --git a/src/s2-homeworks/hw05/pages/JuniorPlus.tsx b/src/s2-homeworks/hw05/pages/JuniorPlus.tsx
index c998994..3a8979d 100644
--- a/src/s2-homeworks/hw05/pages/JuniorPlus.tsx
+++ b/src/s2-homeworks/hw05/pages/JuniorPlus.tsx
@@ -2,7 +2,7 @@ import React from 'react'
import HW10 from '../../hw10/HW10'
import HW11 from '../../hw11/HW11'
import HW12 from '../../hw12/HW12'
-// import HW13 from '../../hw13/HW13'
+import HW13 from '../../hw13/HW13'
function JuniorPlus() {
return (
@@ -10,7 +10,7 @@ function JuniorPlus() {
- {/**/}
+
)
}
diff --git a/src/s2-homeworks/hw13/HW13.module.css b/src/s2-homeworks/hw13/HW13.module.css
index cbd9cde..b64da28 100644
--- a/src/s2-homeworks/hw13/HW13.module.css
+++ b/src/s2-homeworks/hw13/HW13.module.css
@@ -2,27 +2,46 @@
display: flex;
flex-direction: row;
gap: 24px;
+ height: 30px;
}
.responseContainer {
display: flex;
- padding: 90px 0 20px 92px;
+ padding: 90px 0 20px 90px;
gap: 87px;
justify-content: center;
align-items: center;
}
-.answer {
+.imageContainer {
+ width: 500px;
+ height: 170px;
+}
+
+.image {
+ height: 150px;
+}
+
+.textContainer{
+ width: 500px;
+}
+
+.code {
font-family: 'Montserrat', sans-serif;
font-weight: 500;
font-size: 30px;
line-height: 37px;
}
+.text {
+ font-family: 'Montserrat', sans-serif;
+ font-weight: 500;
+ font-size: 16px;
+ line-height: 20px;
+}
.info {
font-family: 'Montserrat', sans-serif;
font-weight: 500;
font-size: 16px;
line-height: 20px;
-
}
\ No newline at end of file
diff --git a/src/s2-homeworks/hw13/HW13.tsx b/src/s2-homeworks/hw13/HW13.tsx
index 05141f0..638c826 100644
--- a/src/s2-homeworks/hw13/HW13.tsx
+++ b/src/s2-homeworks/hw13/HW13.tsx
@@ -8,56 +8,74 @@ import error400 from './images/400.svg'
import error500 from './images/500.svg'
import errorUnknown from './images/error.svg'
-axios.interceptors.response.use(
- (response) => response,
- (error) => {
- console.log(error)
- if (typeof error.response === 'undefined') {
- console.log(error)
- }
- return Promise.reject(error)
- }
-)
+/*
+* 1 - дописать функцию send
+* 2 - дизэйблить кнопки пока идёт запрос
+* 3 - сделать стили в соответствии с дизайном
+* */
+
const HW13 = () => {
- const [answer, setAnswer] = useState('')
+ const [code, setCode] = useState('')
+ const [text, setText] = useState('')
const [info, setInfo] = useState('')
const [image, setImage] = useState('')
+
const send = (x?: boolean | null) => () => {
const url =
x === null
- ? 'https://xxxxxx.ccc'
- : 'https://neko-cafe-back.herokuapp.com/auth/test'
+ ? 'https://xxxxxx.ccc' // имитация запроса на не корректный адрес
+ : 'https://incubator-personal-page-back.herokuapp.com/api/3.0/homework/test'
- setAnswer('...loading')
+ setCode('')
+ setImage('')
+ setText('')
setInfo('...loading')
+
axios
.post(url, {success: x})
.then((res) => {
- setAnswer(res.data.errorText)
+ setCode('Код 200!')
+ setImage(success200)
+ // дописать
+ setText(res.data.errorText)
setInfo(res.data.info)
- res.status === 200 && setImage(success200)
})
.catch((e) => {
- console.log(e)
- setAnswer(e.response?.data?.errorText || e.message)
+ // дописать
+ setText(e.response?.data?.errorText || e.message)
setInfo(e.response?.data?.info || e.name)
- e.response?.status === 400 && setImage(error400)
- e.response?.status === 500 && setImage(error500)
- e.response?.status === 0 && setImage(errorUnknown)
+
+ switch (e.response?.status) {
+ case 400: {
+ setCode('Ошибка 400!')
+ setImage(error400)
+ break
+ }
+ case 500: {
+ setCode('Ошибка 500!')
+ setImage(error500)
+ break
+ }
+ default: {
+ setCode('Error!')
+ setImage(errorUnknown)
+ }
+ }
})
}
return (
Homework #13
+
- {/*для автоматической проверки дз (не менять)*/}
Send true
@@ -65,7 +83,8 @@ const HW13 = () => {
id={'hw13-send-false'}
onClick={send(false)}
xType={'secondary'}
- disabled={answer === '...loading'}
+ // дописать
+ disabled={info === '...loading'}
>
Send false
@@ -73,32 +92,38 @@ const HW13 = () => {
id={'hw13-send-undefined'}
onClick={send(undefined)}
xType={'secondary'}
- disabled={answer === '...loading'}
+ // дописать
+ disabled={info === '...loading'}
>
Send undefined
Send null
+
- {image !== '' &&

}
+ {image &&

}
+
-
- {answer}
+
+ {code}
+
+
+ {text}
{info}
-