diff --git a/src/components/landlord/AddViewingWindowForm.tsx b/src/components/landlord/AddViewingWindowForm.tsx index f0991352..9923b27a 100644 --- a/src/components/landlord/AddViewingWindowForm.tsx +++ b/src/components/landlord/AddViewingWindowForm.tsx @@ -24,6 +24,12 @@ const DAYS = [ 'SUNDAY', ] as const; +const DAY_OPTIONS = [ + ...DAYS, + 'EVERYDAY', + 'WEEKDAYS', +] as const; + export const AddViewingWindowForm: React.FC = ({ propertyId, onSuccess, @@ -43,16 +49,34 @@ export const AddViewingWindowForm: React.FC = ({ return; } - // Wrap in array as server expects a list of windows for the property - const payload = { - propertyId, - viewingWindows: [ + // Expand shortcut options into individual days for the backend + const getSelectedWindows = () => { + if (dayOfWeek === 'EVERYDAY') { + return DAYS.map((day) => ({ + dayOfWeek: day, + startTime, + endTime, + })); + } + if (dayOfWeek === 'WEEKDAYS') { + return ['MONDAY', 'TUESDAY', 'WEDNESDAY', 'THURSDAY', 'FRIDAY'].map((day) => ({ + dayOfWeek: day, + startTime, + endTime, + })); + } + return [ { dayOfWeek, startTime, endTime, }, - ], + ]; + }; + + const payload = { + propertyId, + viewingWindows: getSelectedWindows(), }; updateWindows(payload, { @@ -76,9 +100,13 @@ export const AddViewingWindowForm: React.FC = ({ - {DAYS.map((day) => ( + {DAY_OPTIONS.map((day) => ( - {day.charAt(0) + day.slice(1).toLowerCase()} + {day === 'EVERYDAY' + ? 'Everyday' + : day === 'WEEKDAYS' + ? 'Weekdays' + : day.charAt(0) + day.slice(1).toLowerCase()} ))} diff --git a/src/components/landlord/create-property/ViewingWindowsForm.tsx b/src/components/landlord/create-property/ViewingWindowsForm.tsx index 272b3940..6939d8d2 100644 --- a/src/components/landlord/create-property/ViewingWindowsForm.tsx +++ b/src/components/landlord/create-property/ViewingWindowsForm.tsx @@ -29,12 +29,15 @@ export const ViewingWindowsForm: React.FC = ({ disabled const [editingWindowIndex, setEditingWindowIndex] = useState(null); const [isAddingWindow, setIsAddingWindow] = useState(false); - const [tempWindow, setTempWindow] = useState<{ dayOfWeek: 'MONDAY' | 'TUESDAY' | 'WEDNESDAY' | 'THURSDAY' | 'FRIDAY' | 'SATURDAY' | 'SUNDAY'; startTime: string; endTime: string }>({ + const [tempWindow, setTempWindow] = useState<{ dayOfWeek: string; startTime: string; endTime: string }>({ dayOfWeek: 'MONDAY', startTime: '09:00', endTime: '12:00', }); + const DAYS = ['MONDAY', 'TUESDAY', 'WEDNESDAY', 'THURSDAY', 'FRIDAY', 'SATURDAY', 'SUNDAY']; + const DAY_OPTIONS = [...DAYS, 'EVERYDAY', 'WEEKDAYS']; + const handleStartAddWindow = () => { if (disabled) return; setTempWindow({ dayOfWeek: 'MONDAY', startTime: '09:00', endTime: '12:00' }); @@ -62,14 +65,26 @@ export const ViewingWindowsForm: React.FC = ({ disabled }; const handleSaveWindow = () => { + const expandWindows = (base: { dayOfWeek: string; startTime: string; endTime: string }) => { + if (base.dayOfWeek === 'EVERYDAY') { + return DAYS.map(day => ({ ...base, dayOfWeek: day })); + } + if (base.dayOfWeek === 'WEEKDAYS') { + return ['MONDAY', 'TUESDAY', 'WEDNESDAY', 'THURSDAY', 'FRIDAY'].map(day => ({ ...base, dayOfWeek: day })); + } + return [base]; + }; + + const newWindows = expandWindows(tempWindow) as any[]; + if (editingWindowIndex !== null) { const next = [...viewingWindows]; - next[editingWindowIndex] = { ...tempWindow }; + next.splice(editingWindowIndex, 1, ...newWindows); setValue('viewingWindows', next); } else { setValue('viewingWindows', [ ...viewingWindows, - { ...tempWindow }, + ...newWindows, ]); } setEditingWindowIndex(null); @@ -133,9 +148,13 @@ export const ViewingWindowsForm: React.FC = ({ disabled - {['MONDAY', 'TUESDAY', 'WEDNESDAY', 'THURSDAY', 'FRIDAY', 'SATURDAY', 'SUNDAY'].map((day) => ( + {DAY_OPTIONS.map((day) => ( - {day.charAt(0) + day.slice(1).toLowerCase()} + {day === 'EVERYDAY' + ? 'Everyday' + : day === 'WEEKDAYS' + ? 'Weekdays' + : day.charAt(0) + day.slice(1).toLowerCase()} ))} diff --git a/src/components/public/footer/FooterCompany.tsx b/src/components/public/footer/FooterCompany.tsx index 75ae9c6a..a974f6fa 100644 --- a/src/components/public/footer/FooterCompany.tsx +++ b/src/components/public/footer/FooterCompany.tsx @@ -1,5 +1,5 @@ import { NavLink } from 'react-router-dom'; -import { navLinks } from '../nav/Navbar'; +import { navLinks } from '../nav/nav-links'; export const FooterFeatures = () => { return ( diff --git a/src/components/public/hero/Hero.tsx b/src/components/public/hero/Hero.tsx index bdeb2abc..74975339 100644 --- a/src/components/public/hero/Hero.tsx +++ b/src/components/public/hero/Hero.tsx @@ -3,7 +3,7 @@ import { Navbar } from '../nav/Navbar'; import { Logo } from '@/components/shared/Logo'; // NOTE: useNavigate commented out - not needed while original CTA buttons are replaced // with "Join the Waitlist" for early stage rollout. Uncomment when restoring. -// import { useNavigate } from 'react-router-dom'; +import { useNavigate } from 'react-router-dom'; import { HeroCarousel } from './HeroCarousel'; import { HeroConfig } from './types'; import { highlightHeroHeadline } from '@/utils/highlightHeroHeadline'; @@ -16,7 +16,7 @@ interface HeroProps { export const Hero = ({ config }: HeroProps) => { // NOTE: navigate and ctas commented out - not needed while CTA buttons are replaced // with "Join the Waitlist" button for early stage rollout. Uncomment when restoring original CTAs. - // const navigate = useNavigate(); + const navigate = useNavigate(); const { size, media, content } = config; // const { size, media, content, ctas } = config; @@ -33,7 +33,16 @@ export const Hero = ({ config }: HeroProps) => {
- +
+ + +
diff --git a/src/components/public/nav/Navbar.tsx b/src/components/public/nav/Navbar.tsx index 2c716d8b..9c39fdaf 100644 --- a/src/components/public/nav/Navbar.tsx +++ b/src/components/public/nav/Navbar.tsx @@ -6,34 +6,7 @@ import { LandingCTA } from '../hero/LandingCTA'; import { useMediaQuery } from '@/hooks/useMediaQuery'; import { Button } from '../../ui/button'; -type NavLinksType = { - id: string; - label: string; - slug: string; -}; -export const navLinks: NavLinksType[] = [ - { - id: '1', - label: 'Home', - slug: '/', - }, - { - id: '2', - label: `Listings`, - slug: '/listings', - }, - { - id: '3', - label: 'About Us', - slug: '/about', - }, - - { - id: '4', - label: 'Contact Us', - slug: '/contact', - }, -]; +import { navLinks } from './nav-links'; export const Navbar = () => { const [isNavOpen, setIsNavOpen] = useState(false); diff --git a/src/components/public/nav/nav-links.ts b/src/components/public/nav/nav-links.ts new file mode 100644 index 00000000..88851ed6 --- /dev/null +++ b/src/components/public/nav/nav-links.ts @@ -0,0 +1,28 @@ +export type NavLinksType = { + id: string; + label: string; + slug: string; +}; + +export const navLinks: NavLinksType[] = [ + { + id: '1', + label: 'Home', + slug: '/', + }, + { + id: '2', + label: `Listings`, + slug: '/listings', + }, + { + id: '3', + label: 'About Us', + slug: '/about', + }, + { + id: '4', + label: 'Contact Us', + slug: '/contact', + }, +]; diff --git a/src/components/ui/alert-dialog.tsx b/src/components/ui/alert-dialog.tsx index fa2b4429..d7c16988 100644 --- a/src/components/ui/alert-dialog.tsx +++ b/src/components/ui/alert-dialog.tsx @@ -2,7 +2,7 @@ import * as React from "react" import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog" import { cn } from "@/lib/utils" -import { buttonVariants } from "@/components/ui/button" +import { buttonVariants } from "@/components/ui/button-variants" const AlertDialog = AlertDialogPrimitive.Root diff --git a/src/components/ui/button-variants.ts b/src/components/ui/button-variants.ts new file mode 100644 index 00000000..2464ddb7 --- /dev/null +++ b/src/components/ui/button-variants.ts @@ -0,0 +1,33 @@ +import { cva, type VariantProps } from "class-variance-authority" + +export const buttonVariants = cva( + "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-xl text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:size-4 [&_svg]:shrink-0", + { + variants: { + variant: { + default: + "bg-primary text-primary-foreground", + destructive: + "bg-destructive text-destructive-foreground", + outline: + "border border-primary text-primary bg-background hover:!bg-[#00E4B2] hover:!text-white hover:!border-[#00E4B2]", + secondary: + "bg-secondary text-secondary-foreground", + ghost: "text-primary-foreground bg-white/20", + link: "text-primary underline-offset-4", + }, + size: { + default: "h-9 px-4 py-2", + sm: "h-8 rounded-md px-3 text-xs", + lg: "h-10 rounded-md px-8", + icon: "h-9 w-9", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + } +) + +export type ButtonVariantProps = VariantProps diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx index d95b0f1f..2a7d1151 100644 --- a/src/components/ui/button.tsx +++ b/src/components/ui/button.tsx @@ -1,38 +1,9 @@ import * as React from "react" import { Slot } from "@radix-ui/react-slot" -import { cva, type VariantProps } from "class-variance-authority" +import { type VariantProps } from "class-variance-authority" import { cn } from "@/lib/utils" - -const buttonVariants = cva( - "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-xl text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", - { - variants: { - variant: { - default: - "bg-primary text-primary-foreground", - destructive: - "bg-destructive text-destructive-foreground", - outline: - "border border-primary text-primary bg-background hover:!bg-[#00E4B2] hover:!text-white hover:!border-[#00E4B2]", - secondary: - "bg-secondary text-secondary-foreground", - ghost: "", - link: "text-primary underline-offset-4", - }, - size: { - default: "h-9 px-4 py-2", - sm: "h-8 rounded-md px-3 text-xs", - lg: "h-10 rounded-md px-8", - icon: "h-9 w-9", - }, - }, - defaultVariants: { - variant: "default", - size: "default", - }, - } -) +import { buttonVariants } from "./button-variants" export interface ButtonProps extends React.ButtonHTMLAttributes, @@ -54,4 +25,4 @@ const Button = React.forwardRef( ) Button.displayName = "Button" -export { Button, buttonVariants } +export { Button } diff --git a/src/components/ui/calendar.tsx b/src/components/ui/calendar.tsx index cfed8e8b..5b9a83e1 100644 --- a/src/components/ui/calendar.tsx +++ b/src/components/ui/calendar.tsx @@ -7,7 +7,8 @@ import { import { DayButton, DayPicker, getDefaultClassNames } from "react-day-picker" import { cn } from "@/lib/utils" -import { Button, buttonVariants } from "@/components/ui/button" +import { Button } from "@/components/ui/button" +import { buttonVariants } from "@/components/ui/button-variants" function Calendar({ className, diff --git a/src/components/ui/pagination.tsx b/src/components/ui/pagination.tsx index d3311054..379ad911 100644 --- a/src/components/ui/pagination.tsx +++ b/src/components/ui/pagination.tsx @@ -2,7 +2,8 @@ import * as React from "react" import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react" import { cn } from "@/lib/utils" -import { ButtonProps, buttonVariants } from "@/components/ui/button" +import { ButtonProps } from "@/components/ui/button" +import { buttonVariants } from "@/components/ui/button-variants" const Pagination = ({ className, ...props }: React.ComponentProps<"nav">) => (