Address Lookup

Main address lookup feature components combining input, processing, and results display.

Address Lookup Components (components/address-lookup/)

Main address lookup feature components combining input, processing, and results display.

Purpose

Orchestrates the single-address geocoding workflow:

1. User enters address
2. Address is validated and geocoded
3. Results displayed with municipality info
4. Handle errors and edge cases

Components

Main feature components:

• Lookup Form: Address input with submit
• Results Display: Municipality and location info
• Error States: Not found, timeout, validation errors
• Loading States: Geocoding in progress indicators

Features

• Client-side Validation: Immediate feedback on invalid input
• Server Actions: Form submission via Next.js server actions
• Optimistic UI: Show loading state during geocoding
• Error Recovery: Clear error messages with retry options
• Cache Integration: Display cache hit/miss status

Usage

import { AddressLookupForm } from "@/components/address-lookup/lookup-form";
import { GeocodingResults } from "@/components/address-lookup/results";

export default function LookupPage() {
  const [result, setResult] = useState<GeocodingResult | null>(null);
  const [error, setError] = useState<string | null>(null);

  const handleSubmit = async (formData: FormData) => {
    try {
      const geocoded = await lookupAddressAction(formData);
      setResult(geocoded);
      setError(null);
    } catch (err) {
      setError(err.message);
      setResult(null);
    }
  };

  return (
    <>
      <AddressLookupForm onSubmit={handleSubmit} />
      {result && <GeocodingResults result={result} />}
      {error && <ErrorMessage message={error} />}
    </>
  );
}

State Management

Lookup flow manages:

• Address input value
• Validation errors
• Loading/submitting state
• Geocoding result or error
• Cache status

Error Handling

Specific error types displayed differently:

• Validation Error: Inline field error
• Address Not Found: "No results" message with suggestions
• API Timeout: "Service unavailable" with retry button
• Network Error: "Connection failed" with offline indicator