Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Michal Čížek
flea-market-manager
Commits
722a7c2b
Commit
722a7c2b
authored
May 18, 2022
by
cizek
Browse files
added validation for stand reservation
parent
0a18b56e
Changes
3
Hide whitespace changes
Inline
Side-by-side
frontend/src/modules/stand-reservation/stand-reservation.tsx
View file @
722a7c2b
import
{
useEffect
,
useState
,
useCallback
}
from
"
react
"
;
import
{
getItemCategories
,
getStandTypes
,
putReservation
,
}
from
"
./stand-reservation-api
"
;
import
{
ItemCategory
}
from
"
../../models/item-category
"
;
import
{
useNavigate
,
useParams
}
from
"
react-router-dom
"
;
import
{
Form
,
Formik
}
from
"
formik
"
;
import
{
useMutation
}
from
"
react-query
"
;
import
{
...
...
@@ -17,11 +12,19 @@ import {
Title
,
Group
,
}
from
"
@mantine/core
"
;
import
{
StandType
}
from
"
models/stand-type
"
;
import
{
useAuth
}
from
"
context/auth/auth-context
"
;
import
{
useNotification
}
from
"
context/notification/notification-context
"
;
import
{
getItemCategories
,
getStandTypes
,
putReservation
,
}
from
"
./stand-reservation-api
"
;
import
{
ItemCategory
}
from
"
../../models/item-category
"
;
import
{
Reservation
}
from
"
./stand-resevation-type
"
;
import
{
useNavigate
,
useParams
}
from
"
react-router-dom
"
;
import
{
standSchema
}
from
"
./stand-validation
"
;
export
const
StandReservation
=
()
=>
{
const
[
itemCategories
,
setItemCategories
]
=
useState
<
ItemCategory
[]
>
([]);
...
...
@@ -88,7 +91,7 @@ export const StandReservation = () => {
<
Container
sx
=
{
{
height
:
"
100%
"
}
}
>
<
Center
sx
=
{
{
height
:
"
100%
"
}
}
>
<
Paper
shadow
=
"md"
sx
=
{
{
padding
:
25
,
width
:
"
100%
"
}
}
>
<
Formik
<
Formik
<
Reservation
>
initialValues=
{
{
standTypeId
:
""
,
// user has to be logged in at this point
...
...
@@ -97,8 +100,9 @@ export const StandReservation = () => {
itemCategories
:
[],
}
}
onSubmit=
{
handleSubmit
}
validationSchema=
{
standSchema
}
>
{
({
setFieldValue
,
errors
})
=>
(
{
({
setFieldValue
,
errors
,
touched
})
=>
(
<
Form
>
<
Title
order
=
{
1
}
sx
=
{
{
marginBottom
:
"
1rem
"
}
}
>
Stand Reservation
...
...
@@ -114,19 +118,25 @@ export const StandReservation = () => {
value
:
standType
.
id
,
label
:
standType
.
name
,
}))
}
error
=
{
errors
.
standTypeId
}
error
=
{
touched
.
standTypeId
&&
errors
.
standTypeId
}
required
/>
<
MultiSelect
name
=
"itemCategories"
onChange
=
{
(
value
)
=>
setFieldValue
(
"
itemCategories
"
,
value
)
}
onChange
=
{
(
value
)
=>
{
setFieldValue
(
"
itemCategories
"
,
value
);
}
}
data
=
{
itemCategories
.
map
((
itemCategory
)
=>
({
value
:
itemCategory
.
id
,
label
:
itemCategory
.
label
,
}))
}
label
=
"Select sold item categories"
placeholder
=
"Pick all that you like"
error
=
{
errors
.
itemCategories
}
error
=
{
touched
.
itemCategories
&&
typeof
errors
.
itemCategories
===
"
string
"
&&
errors
.
itemCategories
}
required
/>
<
Group
position
=
"right"
sx
=
{
{
marginTop
:
"
1rem
"
}
}
>
...
...
frontend/src/modules/stand-reservation/stand-resevation-type.ts
View file @
722a7c2b
import
{
ItemCategory
}
from
"
models/item-category
"
;
export
type
Reservation
=
{
standTypeId
:
string
;
userId
:
string
;
itemCategories
:
ItemCategory
[];
itemCategories
:
string
[];
};
frontend/src/modules/stand-reservation/stand-validation.ts
0 → 100644
View file @
722a7c2b
import
*
as
yup
from
"
yup
"
;
import
{
Reservation
}
from
"
./stand-resevation-type
"
;
export
const
standSchema
:
yup
.
SchemaOf
<
Reservation
>
=
yup
.
object
().
shape
({
userId
:
yup
.
string
().
required
(
""
),
standTypeId
:
yup
.
string
().
required
(
"
stand type is required
"
),
itemCategories
:
yup
.
array
()
.
of
(
yup
.
string
().
required
())
.
min
(
1
,
"
at least one item category is required
"
)
.
required
(
"
item category is required
"
),
});
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment