refactor: detroit improvements

bloom-housing · Jun 2, 2022 · cc23a34 · cc23a34
1 parent ddb617c
commit cc23a34
Show file tree

Hide file tree

Showing 9 changed files with 136 additions and 95 deletions.
diff --git a/backend/core/src/auth/passport-strategies/jwt.strategy.ts b/backend/core/src/auth/passport-strategies/jwt.strategy.ts
@@ -42,7 +42,7 @@ export class JwtStrategy extends PassportStrategy(Strategy) {
       relations: ["leasingAgentInListings"],
     })
 
-    if (UserService.isPasswordOutdated(user)) {
+    if (user && UserService.isPasswordOutdated(user)) {
       throw new HttpException(
         USER_ERRORS.PASSWORD_OUTDATED.message,
         USER_ERRORS.PASSWORD_OUTDATED.status

diff --git a/backend/core/src/shared/views/change-email.hbs b/backend/core/src/shared/views/change-email.hbs
@@ -1,4 +1,4 @@
-<h1>{{t "t.hello"}} {{> user-name }}</h1>
+<h1>{{t "t.hello"}} {{> user-name }},</h1>
 <p>
     {{t "changeEmail.message" appOptions}}
 </p>

diff --git a/sites/partners/src/listings/Aside.tsx b/sites/partners/src/listings/Aside.tsx
@@ -203,7 +203,7 @@ const Aside = ({
         <GridCell key="btn-preview">
           <a
             target="_blank"
-            href={`${listing.jurisdiction.publicUrl}/preview/listings/${listingId}`}
+            href={`${listing?.jurisdiction.publicUrl}/preview/listings/${listingId}`}
           >
             <Button fullWidth onClick={() => false} type="button">
               {t("listings.actions.preview")}

diff --git a/sites/partners/src/listings/PaperListingForm/formatters/AdditionalMetadataFormatter.ts b/sites/partners/src/listings/PaperListingForm/formatters/AdditionalMetadataFormatter.ts
@@ -42,7 +42,7 @@ export default class AdditionalMetadataFormatter extends Formatter {
 
     this.data.customMapPin = this.metadata.customMapPositionChosen
     this.data.yearBuilt = this.data.yearBuilt ? Number(this.data.yearBuilt) : null
-    if (!this.data.reservedCommunityType.id) this.data.reservedCommunityType = null
+    if (!this.data.reservedCommunityType?.id) this.data.reservedCommunityType = null
     this.data.reviewOrderType =
       this.data.reviewOrderQuestion === "reviewOrderLottery"
         ? ListingReviewOrder.lottery

diff --git a/sites/partners/src/listings/PaperListingForm/sections/SelectAndOrder.tsx b/sites/partners/src/listings/PaperListingForm/sections/SelectAndOrder.tsx
@@ -32,6 +32,7 @@ type SelectAndOrderProps = {
     error: any
   }
   formKey: string
+  subNote?: string
 }
 
 const SelectAndOrder = ({
@@ -45,6 +46,7 @@ const SelectAndOrder = ({
   drawerButtonText,
   dataFetcher,
   formKey,
+  subNote,
 }: SelectAndOrderProps) => {
   const [tableDrawer, setTableDrawer] = useState<boolean | null>(null)
   const [selectDrawer, setSelectDrawer] = useState<boolean | null>(null)
@@ -173,6 +175,7 @@ const SelectAndOrder = ({
             {listingData.length ? editText : addText}
           </Button>
         </div>
+        {subNote && <p className="field-sub-note">{subNote}</p>}
       </GridSection>
 
       <Drawer

diff --git a/sites/partners/src/users/FormUserManage.tsx b/sites/partners/src/users/FormUserManage.tsx
@@ -125,7 +125,7 @@ const FormUserManage = ({ mode, user, listings, onDrawerClose }: FormUserManageP
       }
 
       return []
-    })()
+    })() as string[]
 
     const validation = await trigger()
 

diff --git a/sites/public/pages/create-account.tsx b/sites/public/pages/create-account.tsx
@@ -217,7 +217,9 @@ export default () => {
             />
 
             <div className="text-center mt-10">
-              <Button styleType={AppearanceStyleType.primary}>{t("account.createAccount")}</Button>
+              <Button type="submit" styleType={AppearanceStyleType.primary}>
+                {t("account.createAccount")}
+              </Button>
             </div>
           </div>
         </Form>

diff --git a/sites/public/src/ListingView.tsx b/sites/public/src/ListingView.tsx
@@ -233,6 +233,26 @@ export const ListingView = (props: ListingProps) => {
     })
   }
 
+  const shouldShowFeaturesDetail = () => {
+    return (
+      listing.neighborhood ||
+      listing.yearBuilt ||
+      listing.smokingPolicy ||
+      listing.petPolicy ||
+      listing.amenities ||
+      listing.unitAmenities ||
+      listing.servicesOffered ||
+      listing.accessibility ||
+      // props for UnitTables
+      (listing.units && listing.units.length > 0) ||
+      // props for AdditionalFees
+      listing.depositMin ||
+      listing.depositMax ||
+      listing.applicationFee ||
+      listing.costsNotIncluded
+    )
+  }
+
   let lotterySection
   if (publicLottery && (!lotteryResults || (lotteryResults && !lotteryResults.url))) {
     lotterySection = (
@@ -426,6 +446,17 @@ export const ListingView = (props: ListingProps) => {
     )
   }
 
+  const additionalInformationCard = (cardTitle: string, cardData: string) => {
+    return (
+      <div className="info-card">
+        <h3 className="text-serif-lg">{cardTitle}</h3>
+        <p className="text-sm text-gray-700 break-words">
+          <Markdown children={cardData} options={{ disableParsingRawHTML: true }} />
+        </p>
+      </div>
+    )
+  }
+
   const applicationsClosed = dayjs() > dayjs(listing.applicationDueDate)
 
   const getAccessibilityFeatures = () => {
@@ -717,66 +748,71 @@ export const ListingView = (props: ListingProps) => {
           imageSrc="/images/listing-features.svg"
           title={t("listings.sections.featuresTitle")}
           subtitle={t("listings.sections.featuresSubtitle")}
+          desktopClass="bg-primary-lighter"
         >
-          <div className="listing-detail-panel">
-            <dl className="column-definition-list">
-              {listing.neighborhood && (
-                <Description term={t("t.neighborhood")} description={listing.neighborhood} />
-              )}
-              {listing.yearBuilt && (
-                <Description term={t("t.built")} description={listing.yearBuilt} />
-              )}
-              {listing.smokingPolicy && (
-                <Description term={t("t.smokingPolicy")} description={listing.smokingPolicy} />
-              )}
-              {listing.petPolicy && (
-                <Description term={t("t.petsPolicy")} description={listing.petPolicy} />
-              )}
-              {listing.amenities && (
-                <Description term={t("t.propertyAmenities")} description={listing.amenities} />
-              )}
-              {listing.unitAmenities && (
-                <Description term={t("t.unitAmenities")} description={listing.unitAmenities} />
-              )}
-              {listing.servicesOffered && (
-                <Description term={t("t.servicesOffered")} description={listing.servicesOffered} />
-              )}
-              {accessibilityFeatures && (
-                <Description term={t("t.accessibility")} description={accessibilityFeatures} />
-              )}
-              {listing.accessibility && (
+          {!shouldShowFeaturesDetail() ? (
+            t("errors.noData")
+          ) : (
+            <div className="listing-detail-panel">
+              <dl className="column-definition-list">
+                {listing.neighborhood && (
+                  <Description term={t("t.neighborhood")} description={listing.neighborhood} />
+                )}
+                {listing.yearBuilt && (
+                  <Description term={t("t.built")} description={listing.yearBuilt} />
+                )}
+                {listing.smokingPolicy && (
+                  <Description term={t("t.smokingPolicy")} description={listing.smokingPolicy} />
+                )}
+                {listing.petPolicy && (
+                  <Description term={t("t.petsPolicy")} description={listing.petPolicy} />
+                )}
+                {listing.amenities && (
+                  <Description term={t("t.propertyAmenities")} description={listing.amenities} />
+                )}
+                {listing.unitAmenities && (
+                  <Description term={t("t.unitAmenities")} description={listing.unitAmenities} />
+                )}
+                {listing.servicesOffered && (
+                  <Description
+                    term={t("t.servicesOffered")}
+                    description={listing.servicesOffered}
+                  />
+                )}
+                {listing.accessibility && (
+                  <Description term={t("t.accessibility")} description={listing.accessibility} />
+                )}
                 <Description
-                  term={t("t.additionalAccessibility")}
-                  description={listing.accessibility}
+                  term={t("t.unitFeatures")}
+                  description={
+                    <UnitTables
+                      units={listing.units}
+                      unitSummaries={listing?.unitsSummarized?.byUnitType}
+                      disableAccordion={listing.disableUnitsAccordion}
+                    />
+                  }
                 />
-              )}
-              <Description
-                term={t("t.unitFeatures")}
-                description={
-                  <UnitTables
-                    units={listing.units}
-                    unitSummaries={listing?.unitsSummarized?.byUnitType}
-                    disableAccordion={listing.disableUnitsAccordion}
-                  />
-                }
+              </dl>
+              <AdditionalFees
+                deposit={getCurrencyRange(
+                  parseInt(listing.depositMin),
+                  parseInt(listing.depositMax)
+                )}
+                applicationFee={`$${listing.applicationFee}`}
+                costsNotIncluded={listing.costsNotIncluded}
+                strings={{
+                  sectionHeader: t("listings.sections.additionalFees"),
+                  applicationFee: t("listings.applicationFee"),
+                  deposit: t("t.deposit"),
+                  applicationFeeSubtext: [
+                    t("listings.applicationPerApplicantAgeDescription"),
+                    t("listings.applicationFeeDueAt"),
+                  ],
+                  depositSubtext: [listing.depositHelperText],
+                }}
               />
-            </dl>
-            <AdditionalFees
-              deposit={getCurrencyRange(parseInt(listing.depositMin), parseInt(listing.depositMax))}
-              applicationFee={`$${listing.applicationFee}`}
-              costsNotIncluded={listing.costsNotIncluded}
-              strings={{
-                sectionHeader: t("listings.sections.additionalFees"),
-                applicationFee: t("listings.applicationFee"),
-                deposit: t("t.deposit"),
-                applicationFeeSubtext: [
-                  t("listings.applicationPerApplicantAgeDescription"),
-                  t("listings.applicationFeeDueAt"),
-                ],
-                depositSubtext: [listing.depositHelperText],
-              }}
-            />
-          </div>
+            </div>
+          )}
         </ListingDetailItem>
 
         <ListingDetailItem
@@ -802,39 +838,18 @@ export const ListingView = (props: ListingProps) => {
             subtitle={t("listings.sections.additionalInformationSubtitle")}
           >
             <div className="listing-detail-panel">
-              {listing.requiredDocuments && (
-                <div className="info-card">
-                  <h3 className="text-serif-lg">{t("listings.requiredDocuments")}</h3>
-                  <p className="text-sm text-gray-700">
-                    <Markdown
-                      children={listing.requiredDocuments}
-                      options={{ disableParsingRawHTML: true }}
-                    />
-                  </p>
-                </div>
-              )}
-              {listing.programRules && (
-                <div className="info-card">
-                  <h3 className="text-serif-lg">{t("listings.importantProgramRules")}</h3>
-                  <p className="text-sm text-gray-700">
-                    <Markdown
-                      children={listing.programRules}
-                      options={{ disableParsingRawHTML: true }}
-                    />
-                  </p>
-                </div>
-              )}
-              {listing.specialNotes && (
-                <div className="info-card">
-                  <h3 className="text-serif-lg">{t("listings.specialNotes")}</h3>
-                  <p className="text-sm text-gray-700">
-                    <Markdown
-                      children={listing.specialNotes}
-                      options={{ disableParsingRawHTML: true }}
-                    />
-                  </p>
-                </div>
-              )}
+              {listing.requiredDocuments &&
+                additionalInformationCard(
+                  t("listings.requiredDocuments"),
+                  listing.requiredDocuments
+                )}
+              {listing.programRules &&
+                additionalInformationCard(
+                  t("listings.importantProgramRules"),
+                  listing.programRules
+                )}
+              {listing.specialNotes &&
+                additionalInformationCard(t("listings.specialNotes"), listing.specialNotes)}
             </div>
           </ListingDetailItem>
         )}

diff --git a/ui-components/src/forms/FieldGroup.stories.tsx b/ui-components/src/forms/FieldGroup.stories.tsx
@@ -55,3 +55,24 @@ export const FieldGroupDescriptions = () => {
     />
   )
 }
+
+export const FieldGroupError = () => {
+  const { register } = useForm({ mode: "onChange" })
+  return (
+    <FieldGroup
+      error={true}
+      register={register}
+      name={"testInput"}
+      type={"checkbox"}
+      fields={[
+        { id: "1234", label: "Input 1" },
+        { id: "5678", label: "Input 2" },
+      ]}
+      fieldGroupClassName={"field-group-classname"}
+      fieldClassName={"field-classname"}
+      fieldLabelClassName={"text-primary"}
+      groupNote={"Group Note"}
+      groupLabel={"Group Label"}
+    />
+  )
+}
-Original file line number
+Diff line change
@@ Expand Up @@
           }
           return []
-        })()
+        })() as string[]
         const validation = await trigger()
@@ Expand Down @@