Jackie/rentall-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

streamlined address and availability

Browse Source
This commit is contained in:
jackiettran
2025-08-20 14:56:16 -04:00
parent 66dc187295
commit ddd27a59f9
10 changed files with 1173 additions and 314 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/components/AvailabilitySettings.tsx
View File

@@ -1,4 +1,4 @@
import React from 'react';
import React from "react";
interface AvailabilityData {
generalAvailableAfter: string;
@@ -18,31 +18,35 @@ interface AvailabilityData {
interface AvailabilitySettingsProps {
data: AvailabilityData;
onChange: (field: string, value: string | boolean) => void;
onWeeklyTimeChange: (day: string, field: 'availableAfter' | 'availableBefore', value: string) => void;
showTitle?: boolean;
onWeeklyTimeChange: (
day: string,
field: "availableAfter" | "availableBefore",
value: string
) => void;
}
const AvailabilitySettings: React.FC<AvailabilitySettingsProps> = ({
data,
onChange,
onWeeklyTimeChange,
showTitle = true
}) => {
const generateTimeOptions = () => {
const options = [];
for (let hour = 0; hour < 24; hour++) {
const time24 = `${hour.toString().padStart(2, '0')}:00`;
const time24 = `${hour.toString().padStart(2, "0")}:00`;
const hour12 = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;
const period = hour < 12 ? 'AM' : 'PM';
const period = hour < 12 ? "AM" : "PM";
const time12 = `${hour12}:00 ${period}`;
options.push({ value: time24, label: time12 });
}
return options;
};
const handleGeneralChange = (e: React.ChangeEvent<HTMLSelectElement | HTMLInputElement>) => {
const handleGeneralChange = (
e: React.ChangeEvent<HTMLSelectElement | HTMLInputElement>
) => {
const { name, value, type } = e.target;
if (type === 'checkbox') {
if (type === "checkbox") {
const checked = (e.target as HTMLInputElement).checked;
onChange(name, checked);
} else {
@@ -52,8 +56,6 @@ const AvailabilitySettings: React.FC<AvailabilitySettingsProps> = ({
return (
<div>
{showTitle && <h5 className="card-title">Availability</h5>}
{/* General Times */}
<div className="row mb-3">
<div className="col-md-6">
@@ -129,7 +131,7 @@ const AvailabilitySettings: React.FC<AvailabilitySettingsProps> = ({
className="form-select form-select-sm"
value={times.availableAfter}
onChange={(e) =>
onWeeklyTimeChange(day, 'availableAfter', e.target.value)
onWeeklyTimeChange(day, "availableAfter", e.target.value)
}
>
{generateTimeOptions().map((option) => (
@@ -144,7 +146,7 @@ const AvailabilitySettings: React.FC<AvailabilitySettingsProps> = ({
className="form-select form-select-sm"
value={times.availableBefore}
onChange={(e) =>
onWeeklyTimeChange(day, 'availableBefore', e.target.value)
onWeeklyTimeChange(day, "availableBefore", e.target.value)
}
>
{generateTimeOptions().map((option) => (
@@ -162,4 +164,4 @@ const AvailabilitySettings: React.FC<AvailabilitySettingsProps> = ({
);
};
export default AvailabilitySettings;
export default AvailabilitySettings;