Skip to content

Commit

Permalink
1317/listings management, building details & intro (#1420)
Browse files Browse the repository at this point in the history
  • Loading branch information
emilyjablonski committed Jun 28, 2021
1 parent 377a2e4 commit 4f926eb
Show file tree
Hide file tree
Showing 16 changed files with 253 additions and 55 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,7 @@ All notable changes to this project will be documented in this file. The format
- Add Additional Eligibility section to listing management ([#1374](https://github.com/bloom-housing/bloom/pull/1374)) (Emily Jablonski)
- Add Leasing Agent section to listing management ([#1349](https://github.com/bloom-housing/bloom/pull/1349)) (Emily Jablonski)
- Add Additional Fees section to listing management ([#1377](https://github.com/bloom-housing/bloom/pull/1377)) (Emily Jablonski)
- Add Building Details and Intro section to listing management ([#1420](https://github.com/bloom-housing/bloom/pull/1420)) (Emily Jablonski)

- Fixed:

Expand Down
6 changes: 4 additions & 2 deletions sites/partners/pages/listings/[id]/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,8 @@ import Layout from "../../../layouts"
import Aside from "../../../src/listings/Aside"
import { ListingContext } from "../../../src/listings/ListingContext"
import DetailListingData from "../../../src/listings/PaperListingDetails/sections/DetailListingData"
import DetailProperty from "../../../src/listings/PaperListingDetails/sections/DetailProperty"
import DetailListingIntro from "../../../src/listings/PaperListingDetails/sections/DetailListingIntro"
import DetailBuildingDetails from "../../../src/listings/PaperListingDetails/sections/DetailBuildingDetails"
import DetailApplication from "../../../src/listings/PaperListingDetails/sections/DetailApplication"
import DetailAdditionalDetails from "../../../src/listings/PaperListingDetails/sections/DetailAdditionalDetails"
import DetailAdditionalEligibility from "../../../src/listings/PaperListingDetails/sections/DetailAdditionalEligibility"
Expand Down Expand Up @@ -102,7 +103,8 @@ export default function ApplicationsList() {
<div className="flex flex-row flex-wrap ">
<div className="info-card md:w-9/12">
<DetailListingData />
<DetailProperty />
<DetailListingIntro />
<DetailBuildingDetails />
<DetailApplication />
<DetailAdditionalFees />
<DetailAdditionalEligibility />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const DetailAdditionalDetails = () => {

return (
<GridSection
className="bg-primary-ligher"
className="bg-primary-lighter"
title={t("listings.sections.additionalDetails")}
grid={false}
inset
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const DetailAdditionalEligibility = () => {

return (
<GridSection
className="bg-primary-ligher"
className="bg-primary-lighter"
title={t("listings.sections.additionalEligibilityTitle")}
grid={false}
inset
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@ import React, { useContext } from "react"
import { t, GridSection, ViewItem, GridCell } from "@bloom-housing/ui-components"
import { ListingContext } from "../../ListingContext"

const DetailAdditionalDetails = () => {
const DetailAdditionalFees = () => {
const listing = useContext(ListingContext)

return (
<GridSection
className="bg-primary-ligher"
className="bg-primary-lighter"
title={t("listings.sections.additionalFees")}
grid={false}
inset
Expand All @@ -34,4 +34,4 @@ const DetailAdditionalDetails = () => {
)
}

export default DetailAdditionalDetails
export default DetailAdditionalFees
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const DetailApplication = () => {

return (
<GridSection
className="bg-primary-ligher"
className="bg-primary-lighter"
title={t("listings.applicationTitle")}
grid={false}
inset
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
import React, { useContext } from "react"
import { t, GridSection, ViewItem, GridCell } from "@bloom-housing/ui-components"
import { ListingContext } from "../../ListingContext"

const DetailBuildingDetails = () => {
const listing = useContext(ListingContext)

return (
<GridSection
className="bg-primary-lighter"
title={t("listings.sections.buildingDetailsTitle")}
grid={false}
inset
>
<GridSection columns={3}>
<GridCell span={2}>
<ViewItem label={t("application.contact.streetAddress")}>
{listing.buildingAddress.street}
</ViewItem>
</GridCell>
<ViewItem label={t("t.neighborhood")}>{listing.neighborhood}</ViewItem>
</GridSection>
<GridSection columns={6}>
<GridCell span={2}>
<ViewItem label={t("application.contact.city")}>{listing.buildingAddress.city}</ViewItem>
</GridCell>
<ViewItem label={t("application.contact.state")}>{listing.buildingAddress.state}</ViewItem>
<ViewItem label={t("application.contact.zip")}>{listing.buildingAddress.zipCode}</ViewItem>

<GridCell span={2}>
<ViewItem label={t("listings.yearBuilt")}>{listing.yearBuilt}</ViewItem>
</GridCell>
</GridSection>
<GridSection columns={3}>
<ViewItem label={t("listings.longitude")}>{listing.buildingAddress.longitude}</ViewItem>
<ViewItem label={t("listings.latitude")}>{listing.buildingAddress.latitude}</ViewItem>
</GridSection>
</GridSection>
)
}

export default DetailBuildingDetails
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const DetailLeasingAgent = () => {

return (
<GridSection
className="bg-primary-ligher"
className="bg-primary-lighter"
title={t("listings.sections.leasingAgentTitle")}
grid={false}
inset
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import React, { useContext } from "react"
import { t, GridSection, ViewItem, GridCell } from "@bloom-housing/ui-components"
import { ListingContext } from "../../ListingContext"

const DetailListingIntro = () => {
const listing = useContext(ListingContext)

return (
<GridSection
className="bg-primary-lighter"
title={t("listings.sections.introTitle")}
grid={false}
inset
>
<GridSection columns={3}>
<GridCell span={2}>
<ViewItem label={t("listings.listingName")}>{listing.name}</ViewItem>
</GridCell>
<ViewItem label={t("listings.developer")}>{listing.developer}</ViewItem>
</GridSection>
</GridSection>
)
}

export default DetailListingIntro
14 changes: 11 additions & 3 deletions sites/partners/src/listings/PaperListingForm/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@ import AdditionalDetails from "./sections/AdditionalDetails"
import AdditionalEligibility from "./sections/AdditionalEligibility"
import LeasingAgent from "./sections/LeasingAgent"
import AdditionalFees from "./sections/AdditionalFees"
import BuildingDetails from "./sections/BuildingDetails"
import ListingIntro from "./sections/ListingIntro"

type FormListing = ListingCreate & ListingUpdate

Expand Down Expand Up @@ -95,7 +97,7 @@ const defaults: FormListing = {
unitsAvailable: 0,
unitAmenities: "",
servicesOffered: "",
yearBuilt: 0,
yearBuilt: 2021,
}

// eslint-disable-next-line @typescript-eslint/no-unused-vars
Expand Down Expand Up @@ -142,12 +144,16 @@ const ListingForm = ({ listing, editMode }: ListingFormProps) => {
setAlert(null)
setLoading(true)
try {
const typedData: FormListing = {
...data,
yearBuilt: data.yearBuilt ? Number(data.yearBuilt) : null,
}
const result = editMode
? await listingsService.update({
listingId: listing.id,
body: { id: listing.id, ...data },
body: { id: listing.id, ...typedData },
})
: await listingsService.create({ body: data })
: await listingsService.create({ body: typedData })
setLoading(false)

if (result) {
Expand Down Expand Up @@ -214,7 +220,9 @@ const ListingForm = ({ listing, editMode }: ListingFormProps) => {
<Form id="listing-form" onSubmit={handleSubmit(triggerSubmit, onError)}>
<div className="flex flex-row flex-wrap">
<div className="info-card md:w-9/12">
<ListingIntro />
<FormListingData />
<BuildingDetails />
<AdditionalFees />
<AdditionalEligibility />
<AdditionalDetails />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ const AdditionalDetails = () => {
<GridSection grid={false} separator>
<span className="form-section__title">{t("listings.sections.additionalDetails")}</span>
<span className="form-section__description">
{t("listings.sections.additionalDetailsSubtext")}
{t("listings.sections.additionalDetailsSubtitle")}
</span>
<GridSection columns={2}>
<Textarea
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
import React from "react"
import { useFormContext } from "react-hook-form"
import {
t,
GridSection,
GridCell,
Field,
ViewItem,
Select,
stateKeys,
} from "@bloom-housing/ui-components"

const BuildingDetails = () => {
const formMethods = useFormContext()

// eslint-disable-next-line @typescript-eslint/unbound-method
const { register } = formMethods

return (
<GridSection grid={false} columns={3} separator>
<span className="form-section__title">{t("listings.sections.buildingDetailsTitle")}</span>
<span className="form-section__description">
{t("listings.sections.buildingDetailsSubtitle")}
</span>

<GridSection columns={3}>
<GridCell span={2}>
<Field
label={t("application.contact.streetAddress")}
name={"buildingAddress.street"}
id={"buildingAddress.street"}
placeholder={t("application.contact.streetAddress")}
register={register}
/>
</GridCell>
<Field
label={t("t.neighborhood")}
name={"neighborhood"}
id={"neighborhood"}
placeholder={t("t.neighborhood")}
register={register}
/>
</GridSection>
<GridSection columns={6}>
<GridCell span={2}>
<Field
label={t("application.contact.city")}
name={"buildingAddress.city"}
id={"buildingAddress.city"}
placeholder={t("application.contact.city")}
register={register}
/>
</GridCell>
<ViewItem label={t("application.contact.state")} className="mb-0">
<Select
id={`buildingAddress.state`}
name={`buildingAddress.state`}
label={t("application.contact.state")}
labelClassName="sr-only"
register={register}
controlClassName="control"
options={stateKeys}
keyPrefix="states"
errorMessage={t("errors.stateError")}
/>
</ViewItem>
<Field
label={t("application.contact.zip")}
name={"buildingAddress.zipCode"}
id={"buildingAddress.zipCode"}
placeholder={t("application.contact.zip")}
errorMessage={t("errors.zipCodeError")}
register={register}
/>
<GridCell span={2}>
<Field
label={t("listings.yearBuilt")}
name={"yearBuilt"}
id={"yearBuilt"}
placeholder={t("listings.yearBuilt")}
type={"number"}
register={register}
/>
</GridCell>
</GridSection>
<GridSection columns={3}>
<Field
label={t("listings.longitude")}
name={"buildingAddress.longitude"}
id={"buildingAddress.longitude"}
placeholder={t("listings.longitude")}
register={register}
/>
<Field
label={t("listings.latitude")}
name={"buildingAddress.latitude"}
id={"buildingAddress.latitude"}
placeholder={t("listings.latitude")}
register={register}
/>
</GridSection>
</GridSection>
)
}

export default BuildingDetails
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React from "react"
import { useFormContext } from "react-hook-form"
import { t, GridSection, Field, FormAddress } from "@bloom-housing/ui-components"
import { t, GridSection, Field } from "@bloom-housing/ui-components"

const FormListingData = () => {
const formMethods = useFormContext()
Expand All @@ -9,45 +9,15 @@ const FormListingData = () => {
const { register } = formMethods

return (
<div>
<GridSection grid={false} separator>
<GridSection columns={3}>
<Field
id="name"
name="name"
label={t("listings.listingName")}
placeholder={t("listings.listingName")}
register={register}
/>
</GridSection>
<GridSection grid={false} separator>
<FormAddress
subtitle={t("listings.buildingAddress")}
dataKey="buildingAddress"
type="mailing"
register={register}
/>
</GridSection>
</GridSection>
<GridSection grid={false} separator>
<GridSection columns={3}>
<Field
id="developer"
name="developer"
label={t("listings.developer")}
placeholder={t("listings.developer")}
register={register}
/>
<Field
id="applicationDueDate"
name="applicationDueDate"
label={t("listings.applicationDeadline")}
placeholder="MM-DD-YYYY"
register={register}
/>
</GridSection>
</GridSection>
</div>
<GridSection columns={3} separator>
<Field
id="applicationDueDate"
name="applicationDueDate"
label={t("listings.applicationDeadline")}
placeholder="MM-DD-YYYY"
register={register}
/>
</GridSection>
)
}

Expand Down
Loading

0 comments on commit 4f926eb

Please sign in to comment.