import LocationMapTopbar from "./LocationMapTopbar";

export function LocationMapMessageState({ message }) {
  return (
    <div className="location-map-page">
      <p className="location-map-loading">{message}</p>
    </div>
  );
}

export function LocationMapLoadErrorState({ location, loadError, onBack, onRetry }) {
  return (
    <div className="location-map-page">
      <LocationMapTopbar location={location} status="Load Error" onBack={onBack} />
      <main className="location-map-workspace">
        <section className="location-map-setup location-map-load-error" role="alert" aria-live="polite">
          <h2>Map Unavailable</h2>
          <p>{loadError}</p>
          <div className="location-map-setup-actions">
            <button type="button" className="btn-primary" onClick={onRetry}>
              Retry
            </button>
          </div>
        </section>
      </main>
    </div>
  );
}