harb/web-app/src/composables/useVersionCheck.ts

import { ref, onMounted } from 'vue';
import { KRAIKEN_LIB_VERSION } from 'kraiken-lib/version';

export interface VersionStatus {
  isValid: boolean;
  error?: string;
  contractVersion?: number;
  indexerVersion?: number;
  libVersion: number;
}

const versionStatus = ref<VersionStatus>({
  isValid: true,
  libVersion: KRAIKEN_LIB_VERSION,
});

const isChecking = ref(false);
const hasChecked = ref(false);

/**
 * Validates version compatibility between contract, indexer (Ponder), and frontend (kraiken-lib).
 * 
 * Queries Ponder GraphQL for the contract version it indexed, then compares:
 * 1. Frontend lib version vs Ponder's lib version (should match exactly)
 * 2. Contract version vs compatible versions list (should be in COMPATIBLE_CONTRACT_VERSIONS)
 */
export function useVersionCheck() {
  async function checkVersions(_graphqlUrl: string) {
    if (isChecking.value || hasChecked.value) return versionStatus.value;

    isChecking.value = true;

    try {
      // For now, we don't have contract version in Ponder stats yet
      // This is a placeholder for when we add it to the schema
      // Just validate that kraiken-lib is loaded correctly

      versionStatus.value = {
        isValid: true,
        libVersion: KRAIKEN_LIB_VERSION,
      };

      // TODO: Implement actual version check against Ponder GraphQL
      // console.log(`✓ Frontend version check passed: v${KRAIKEN_LIB_VERSION}`);
      hasChecked.value = true;
    } catch (error) {
      // TODO: Add proper error logging
      // console.error('Version check failed:', error);
      versionStatus.value = {
        isValid: false,
        error: error instanceof Error ? error.message : 'Failed to check version compatibility',
        libVersion: KRAIKEN_LIB_VERSION,
      };
    } finally {
      isChecking.value = false;
    }

    return versionStatus.value;
  }

  return {
    versionStatus,
    checkVersions,
    isChecking,
    hasChecked,
  };
}

/**
 * Vue composable that automatically checks versions on mount.
 * Shows a warning banner if versions are incompatible.
 */
export function useVersionCheckOnMount(graphqlUrl: string) {
  const { versionStatus, checkVersions, isChecking } = useVersionCheck();

  onMounted(async () => {
    await checkVersions(graphqlUrl);
  });

  return {
    versionStatus,
    isChecking,
  };
}