fix(dashboard): reservation creation form (#7489)

**What**
- refresh reservation creation flow, show available items without required search input
- fix location details divider

---

CLOSES CORE-2053
This commit is contained in:
Frane Polić
2024-05-28 13:37:14 +00:00
committed by GitHub
parent e020b49493
commit 32576a1512
2 changed files with 11 additions and 13 deletions
@@ -161,7 +161,7 @@ function Location(props: LocationProps) {
</div> </div>
{/* ACTION*/} {/* ACTION*/}
<div className="flex h-[12px] grow-0 items-center gap-4 divide-x overflow-hidden"> <div className="flex grow-0 items-center gap-4 overflow-hidden">
<ActionMenu <ActionMenu
groups={[ groups={[
{ {
@@ -180,8 +180,9 @@ function Location(props: LocationProps) {
}, },
]} ]}
/> />
<div className="bg-ui-border-strong h-[12px] w-[1px]" />
<Button <Button
className="text-ui-fg-interactive rounded-none pl-5 hover:bg-transparent active:bg-transparent" className="text-ui-fg-interactive -ml-1 rounded-none"
onClick={() => navigate(`/settings/locations/${location.id}`)} onClick={() => navigate(`/settings/locations/${location.id}`)}
variant="transparent" variant="transparent"
> >
@@ -61,14 +61,9 @@ export const CreateReservationForm = () => {
resolver: zodResolver(CreateReservationSchema), resolver: zodResolver(CreateReservationSchema),
}) })
const { inventory_items } = useInventoryItems( const { inventory_items } = useInventoryItems({
{
q: inventorySearch, q: inventorySearch,
}, })
{
enabled: !!inventorySearch,
}
)
const inventoryItemId = form.watch("inventory_item_id") const inventoryItemId = form.watch("inventory_item_id")
const selectedInventoryItem = inventory_items?.find( const selectedInventoryItem = inventory_items?.find(
@@ -174,12 +169,12 @@ export const CreateReservationForm = () => {
<Form.Label>{t("fields.location")}</Form.Label> <Form.Label>{t("fields.location")}</Form.Label>
<Form.Control> <Form.Control>
<Combobox <Combobox
disabled={!!selectedInventoryItem}
value={value} value={value}
onChange={(v) => { onChange={(v) => {
onChange(v) onChange(v)
}} }}
{...field} {...field}
disabled={!inventoryItemId}
options={(stock_locations ?? []).map( options={(stock_locations ?? []).map(
(stockLocation) => ({ (stockLocation) => ({
label: stockLocation.name, label: stockLocation.name,
@@ -214,7 +209,7 @@ export const CreateReservationForm = () => {
title={t("inventory.available")} title={t("inventory.available")}
value={ value={
selectedLocationLevel selectedLocationLevel
? selectedLocationLevel.available_quantity - quantity ? selectedLocationLevel.available_quantity - (quantity || 0)
: "-" : "-"
} }
/> />
@@ -233,7 +228,7 @@ export const CreateReservationForm = () => {
placeholder={t( placeholder={t(
"inventory.reservation.quantityPlaceholder" "inventory.reservation.quantityPlaceholder"
)} )}
min={0} min={1}
max={ max={
selectedLocationLevel selectedLocationLevel
? selectedLocationLevel.available_quantity ? selectedLocationLevel.available_quantity
@@ -250,6 +245,7 @@ export const CreateReservationForm = () => {
} }
}} }}
{...field} {...field}
disabled={!inventoryItemId || !locationId}
/> />
</Form.Control> </Form.Control>
<Form.ErrorMessage /> <Form.ErrorMessage />
@@ -268,6 +264,7 @@ export const CreateReservationForm = () => {
<Form.Control> <Form.Control>
<Textarea <Textarea
{...field} {...field}
disabled={!inventoryItemId || !locationId}
placeholder={t( placeholder={t(
"inventory.reservation.descriptionPlaceholder" "inventory.reservation.descriptionPlaceholder"
)} )}