/**
 * useChallongeApiKey Composable
 * Manages Challonge API key storage in browser localStorage
 * Works on mobile, desktop, and tablets
 */

import { ref, computed } from 'vue';

const STORAGE_KEY = 'challonge_api_key';
const storedKey = ref(getStoredKey());

/**
 * Get API key from localStorage
 * @returns {string|null} Stored API key or null
 */
function getStoredKey() {
  try {
    return localStorage.getItem(STORAGE_KEY) || null;
  } catch (error) {
    console.warn('localStorage not available:', error);
    return null;
  }
}

/**
 * Save API key to localStorage
 * @param {string} apiKey - The API key to store
 * @returns {boolean} Success status
 */
function saveApiKey(apiKey) {
  try {
    if (!apiKey || typeof apiKey !== 'string') {
      throw new Error('Invalid API key format');
    }
    localStorage.setItem(STORAGE_KEY, apiKey);
    storedKey.value = apiKey;
    return true;
  } catch (error) {
    console.error('Failed to save API key:', error);
    return false;
  }
}

/**
 * Clear API key from localStorage
 * @returns {boolean} Success status
 */
function clearApiKey() {
  try {
    localStorage.removeItem(STORAGE_KEY);
    storedKey.value = null;
    return true;
  } catch (error) {
    console.error('Failed to clear API key:', error);
    return false;
  }
}

/**
 * Get masked version of API key for display
 * Shows first 4 and last 4 characters
 * @returns {string|null} Masked key or null
 */
const maskedKey = computed(() => {
  if (!storedKey.value) return null;
  const key = storedKey.value;
  if (key.length < 8) return '••••••••';
  return `${key.slice(0, 4)}•••••••${key.slice(-4)}`;
});

/**
 * Check if API key is stored
 * @returns {boolean} True if key exists
 */
const isKeyStored = computed(() => !!storedKey.value);

/**
 * Get the full API key (use with caution)
 * @returns {string|null} Full API key or null
 */
function getApiKey() {
  return storedKey.value;
}

export function useChallongeApiKey() {
  return {
    saveApiKey,
    clearApiKey,
    getApiKey,
    getStoredKey,
    storedKey: computed(() => storedKey.value),
    maskedKey,
    isKeyStored
  };
}