// Global reactive state
const globalState = {
  // Core reactive state
  activeTab: ref('params'),
  httpMethod: ref('GET'),
  requestUrl: ref(''),
  isLoading: ref(false),
  requestName: ref(''),

  // UI State
  showCollectionSidebar: ref(true),
  showSaveRequestModal: ref(false),
  selectedEnvironment: ref(''),

  // Notification system
  notifications: ref([]),

  // Request data
  requestParams: ref([
    { active: true, key: '', value: '', description: '' }
  ]),
  requestHeaders: ref([
    { active: true, key: '', value: '', description: '' }
  ]),
  requestAuth: ref({
    type: 'none',
    bearer: '',
    basic: { username: '', password: '' },
    apiKey: { key: '', value: '', addTo: 'header' },
    oauth2: {
      grantType: 'authorization_code',
      authUrl: '',
      accessTokenUrl: '',
      clientId: '',
      clientSecret: '',
      scope: '',
      redirectUri: '',
      state: '',
      accessToken: '',
      refreshToken: '',
      tokenType: 'Bearer',
      expiresIn: null,
      expiresAt: null
    }
  }),
  requestBody: ref({
    type: 'raw',
    raw: '',
    formData: [{ active: true, key: '', value: '', description: '', type: 'text', file: null }],
    urlEncoded: [{ active: true, key: '', value: '', description: '' }]
  }),

  // Response data
  response: ref({
    status: null,
    statusText: '',
    headers: {},
    data: null,
    time: 0,
    size: 0
  }),
  responseActiveTab: ref('body'),

  // Collections Management (simplified for development)
  collections: ref([]),

  // Environment Management (simplified for development)
  environments: ref([]),

  // History Management (start empty)
  requestHistory: ref([])
}

const httpMethods = ['GET', 'POST', 'PUT', 'PATCH', 'DELETE', 'HEAD', 'OPTIONS']

// Global methods
const showNotification = (message, type = 'info', duration = 3000) => {
  const id = Date.now()
  const notification = { id, message, type }
  globalState.notifications.value.push(notification)
  
  setTimeout(() => {
    const index = globalState.notifications.value.findIndex(n => n.id === id)
    if (index > -1) {
      globalState.notifications.value.splice(index, 1)
    }
  }, duration)
}

const dismissNotification = (id) => {
  const index = globalState.notifications.value.findIndex(n => n.id === id)
  if (index > -1) {
    globalState.notifications.value.splice(index, 1)
  }
}

export const useApiPlatform = () => {
  return {
    // Core state
    activeTab: globalState.activeTab,
    httpMethod: globalState.httpMethod,
    requestUrl: globalState.requestUrl,
    isLoading: globalState.isLoading,
    requestName: globalState.requestName,
    
    // UI State
    showCollectionSidebar: globalState.showCollectionSidebar,
    showSaveRequestModal: globalState.showSaveRequestModal,
    selectedEnvironment: globalState.selectedEnvironment,
    
    // Request data
    requestParams: globalState.requestParams,
    requestHeaders: globalState.requestHeaders,
    requestAuth: globalState.requestAuth,
    requestBody: globalState.requestBody,
    
    // Response data
    response: globalState.response,
    responseActiveTab: globalState.responseActiveTab,
    
    // History and collections
    requestHistory: globalState.requestHistory,
    collections: globalState.collections,
    environments: globalState.environments,
    
    // Notifications
    notifications: globalState.notifications,
    
    // Static data
    httpMethods,
    
    // Methods
    showNotification,
    dismissNotification
  }
}