address-02-block

1"use client";
2 
3import React, { useState, useEffect } from "react";
4import { z } from "zod";
5import { useForm } from "react-hook-form";
6import { zodResolver } from "@hookform/resolvers/zod";
7import {
8  Form,
9  FormField,
10  FormItem,
11  FormLabel,
12  FormControl,
13  FormMessage,
14} from "@/components/ui/form";
15import { Input } from "@/components/ui/input";
16import { Button } from "@/components/ui/button";
17import { Checkbox } from "@/components/ui/checkbox";
18import {
19  Dialog,
20  DialogContent,
21  DialogDescription,
22  DialogFooter,
23  DialogHeader,
24  DialogTitle,
25  DialogTrigger,
26} from "@/components/ui/dialog";
27import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
28import { Badge } from "@/components/ui/badge";
29import { Edit, MapPin, Phone, Mail, User } from "lucide-react";
30import PhoneInput from "@/components/commerce-ui/phone-number-input-basic";
31import { cn } from "@/lib/utils";
32 
33export const addressFormSchema = z.object({
34  address1: z.string().min(1, "Address is required"),
35  address2: z.string().optional(),
36  city: z.string().min(1, "City is required"),
37  country: z.string().min(1, "Country is required"),
38  email: z.string().email("Invalid email").optional(),
39  firstName: z.string().min(1, "First name is required"),
40  isBillingAddress: z.boolean(),
41  lastName: z.string().min(1, "Last name is required"),
42  phone: z.string().optional(),
43  postalCode: z.string().min(1, "Postal code is required"),
44  state: z.string().min(1, "State is required"),
45});
46 
47export type AddressFormValues = z.infer<typeof addressFormSchema>;
48 
49export type AddressCardProps = {
50  value?: AddressFormValues;
51  onChange?: (value: AddressFormValues) => void;
52  onSubmit?: (value: AddressFormValues) => void;
53  title?: string;
54  editButtonLabel?: string;
55  saveButtonLabel?: string;
56  cancelButtonLabel?: string;
57  disabled?: boolean;
58  className?: string;
59  showBillingBadge?: boolean;
60};
61 
62function Address_02({
63  className = "",
64  disabled = false,
65  onChange,
66  onSubmit,
67  title = "Address",
68  editButtonLabel = "Edit",
69  saveButtonLabel = "Save Changes",
70  cancelButtonLabel = "Cancel",
71  value,
72  showBillingBadge = true,
73}: AddressCardProps) {
74  const [isModalOpen, setIsModalOpen] = useState(false);
75  const [isLoading, setIsLoading] = useState(false);
76 
77  const form = useForm<AddressFormValues>({
78    defaultValues: value || {
79      address1: "",
80      address2: "",
81      city: "",
82      country: "",
83      email: "",
84      firstName: "",
85      isBillingAddress: false,
86// … truncated