import { useState, useEffect, useCallback } from 'react';
import api from '../utils/api';

/**
 * Default directory configuration - used as fallback if API fails
 */
const DEFAULT_DIRECTORY_CONFIG = {
  fields: {
    show_in_directory: { enabled: true, label: 'Show in Directory', required: false },
    directory_email: { enabled: true, label: 'Directory Email', required: false },
    directory_bio: { enabled: true, label: 'Bio', required: false },
    directory_address: { enabled: true, label: 'Address', required: false },
    directory_phone: { enabled: true, label: 'Phone', required: false },
    directory_dob: { enabled: true, label: 'Birthday', required: false },
    directory_partner_name: { enabled: true, label: 'Partner Name', required: false },
    volunteer_interests: { enabled: true, label: 'Volunteer Interests', required: false },
    social_media: { enabled: true, label: 'Social Media Links', required: false },
  }
};

/**
 * Hook to fetch and manage directory field configuration
 * @returns {Object} - { config, loading, error, isFieldEnabled, getFieldLabel, refetch }
 */
const useDirectoryConfig = () => {
  const [config, setConfig] = useState(DEFAULT_DIRECTORY_CONFIG);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);

  const fetchConfig = useCallback(async () => {
    try {
      setLoading(true);
      setError(null);
      const response = await api.get('/directory/config');
      setConfig(response.data || DEFAULT_DIRECTORY_CONFIG);
    } catch (err) {
      console.error('Failed to fetch directory config:', err);
      setError(err);
      // Use default config on error
      setConfig(DEFAULT_DIRECTORY_CONFIG);
    } finally {
      setLoading(false);
    }
  }, []);

  useEffect(() => {
    fetchConfig();
  }, [fetchConfig]);

  /**
   * Check if a field is enabled in the config
   * @param {string} fieldId - The field ID to check (e.g., 'directory_email')
   * @returns {boolean} - Whether the field is enabled
   */
  const isFieldEnabled = useCallback((fieldId) => {
    const field = config?.fields?.[fieldId];
    return field?.enabled !== false; // Default to true if not specified
  }, [config]);

  /**
   * Get the label for a field
   * @param {string} fieldId - The field ID
   * @param {string} defaultLabel - Default label if not in config
   * @returns {string} - The field label
   */
  const getFieldLabel = useCallback((fieldId, defaultLabel = '') => {
    const field = config?.fields?.[fieldId];
    return field?.label || defaultLabel;
  }, [config]);

  /**
   * Check if a field is required
   * @param {string} fieldId - The field ID
   * @returns {boolean} - Whether the field is required
   */
  const isFieldRequired = useCallback((fieldId) => {
    const field = config?.fields?.[fieldId];
    return field?.required === true;
  }, [config]);

  return {
    config,
    loading,
    error,
    isFieldEnabled,
    getFieldLabel,
    isFieldRequired,
    refetch: fetchConfig
  };
};

export default useDirectoryConfig;
