Rocky_Mountain_Vending/components/forms/sms-consent-fields.tsx

99 lines
3.2 KiB
TypeScript

import Link from "next/link"
import { Checkbox } from "@/components/ui/checkbox"
import { Label } from "@/components/ui/label"
import { businessConfig } from "@/lib/seo-config"
function PolicyLinks() {
return (
<>
{" "}
Review our{" "}
<Link
href="/privacy-policy"
target="_blank"
rel="noopener noreferrer"
className="font-medium text-foreground underline underline-offset-4 hover:text-primary"
>
Privacy Policy
</Link>
{" "}and{" "}
<Link
href="/terms-and-conditions"
target="_blank"
rel="noopener noreferrer"
className="font-medium text-foreground underline underline-offset-4 hover:text-primary"
>
Terms
</Link>
.
</>
)
}
type SmsConsentFieldsProps = {
idPrefix: string
marketingChecked: boolean
marketingError?: string
mode?: "chat" | "forms"
onMarketingChange: (checked: boolean) => void
onServiceChange: (checked: boolean) => void
serviceChecked: boolean
serviceError?: string
}
export function SmsConsentFields({
idPrefix,
marketingChecked,
marketingError,
mode = "forms",
onMarketingChange,
onServiceChange,
serviceChecked,
serviceError,
}: SmsConsentFieldsProps) {
return (
<div className="space-y-3">
<div className="flex items-start gap-3 rounded-2xl border border-border/60 bg-background/90 px-4 py-3">
<Checkbox
id={`${idPrefix}-service-consent`}
checked={serviceChecked}
onCheckedChange={(checked) => onServiceChange(Boolean(checked))}
className="mt-0.5"
/>
<Label
htmlFor={`${idPrefix}-service-consent`}
className="text-xs leading-relaxed text-muted-foreground"
>
I agree to receive conversational SMS from {businessConfig.legalName} about my inquiry, scheduling,
support, repairs, moving, and follow-up. Message frequency varies. Message and data rates may apply.
Reply STOP to opt out and HELP for help. Consent is not a condition of purchase.
<PolicyLinks />
</Label>
</div>
{serviceError ? <p className="text-xs text-destructive">{serviceError}</p> : null}
{mode === "forms" ? (
<>
<div className="flex items-start gap-3 rounded-2xl border border-border/60 bg-background/90 px-4 py-3">
<Checkbox
id={`${idPrefix}-marketing-consent`}
checked={marketingChecked}
onCheckedChange={(checked) => onMarketingChange(Boolean(checked))}
className="mt-0.5"
/>
<Label
htmlFor={`${idPrefix}-marketing-consent`}
className="text-xs leading-relaxed text-muted-foreground"
>
I agree to receive promotional and marketing SMS from {businessConfig.legalName}. Message frequency
varies. Message and data rates may apply. Reply STOP to opt out and HELP for help. Consent is not a
condition of purchase.
<PolicyLinks />
</Label>
</div>
{marketingError ? <p className="text-xs text-destructive">{marketingError}</p> : null}
</>
) : null}
</div>
)
}