@ibdop/platform-kit 1.0.11 → 1.0.13

package/src/hooks/useApi.ts

@@ -5,8 +5,9 @@
  * обработкой ошибок и уведомлениями.
  */
 
-import { useState, useCallback } from 'react'
+import { useState, useCallback, useRef, useEffect, useMemo } from 'react'
 import type { ApiError, ApiResponse, NotificationPayload } from '../types'
+import { api } from '../services/api'
 
 // Development mode flag
 const isDev = import.meta.env?.DEV === true || import.meta.env?.MODE === 'development'
@@ -104,6 +105,8 @@ export interface UseApiConfig<T = never> {
   errorContext?: string
   onSuccess?: (data: T) => void
   onError?: (error: ApiError) => void
+  /** Auto-execute on mount (default: false) */
+  immediate?: boolean
 }
 
 /**
@@ -117,6 +120,14 @@ export interface UseApiResult<T> {
   isSuccess: boolean
   execute: () => Promise<T | null>
   reset: () => void
+  abort: () => void
+}
+
+/**
+ * Check if error is an abort error
+ */
+function isAbortError(error: unknown): boolean {
+  return error instanceof Error && error.name === 'AbortError'
 }
 
 /**
@@ -128,14 +139,14 @@ export interface UseApiResult<T> {
  * 
  * @example
  * ```tsx
- * const { data, isLoading, isError, execute } = useApi<User[]>(
- *   () => fetch('/api/users').then(r => r.json()),
+ * const { data, isLoading, isError, execute, abort } = useApi<User[]>(
+ *   (signal) => fetch('/api/users', { signal }).then(r => r.json()),
  *   { notifyOnError: true, errorContext: 'загрузка пользователей' }
  * )
  * ```
  */
 export function useApi<T>(
-  request: () => Promise<ApiResponse<T>>,
+  request: (signal?: AbortSignal) => Promise<ApiResponse<T>>,
   config: UseApiConfig<T> = {}
 ): UseApiResult<T> {
   const {
@@ -151,15 +162,50 @@ export function useApi<T>(
   const [error, setError] = useState<ApiError | null>(null)
   const [isLoading, setIsLoading] = useState(false)
 
+  // AbortController ref for request cancellation
+  const abortControllerRef = useRef<AbortController | null>(null)
+
   const isError = error !== null
   const isSuccess = data !== null && !isLoading && !isError
 
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (abortControllerRef.current) {
+        abortControllerRef.current.abort()
+      }
+    }
+  }, [])
+
+  const abort = useCallback(() => {
+    if (abortControllerRef.current) {
+      abortControllerRef.current.abort()
+      abortControllerRef.current = null
+      setIsLoading(false)
+      logger.log('Request aborted')
+    }
+  }, [])
+
   const execute = useCallback(async () => {
+    // Abort any pending request
+    if (abortControllerRef.current) {
+      abortControllerRef.current.abort()
+    }
+
+    // Create new AbortController
+    abortControllerRef.current = new AbortController()
+    const signal = abortControllerRef.current.signal
+
     setIsLoading(true)
     setError(null)
 
     try {
-      const response = await request()
+      const response = await request(signal)
+      
+      // Check if aborted during request
+      if (signal.aborted) {
+        return null
+      }
       
       if (response.ok) {
         setData(response.data)
@@ -193,6 +239,12 @@ export function useApi<T>(
         return null
       }
     } catch (err) {
+      // Ignore abort errors
+      if (isAbortError(err)) {
+        logger.log('Request was aborted')
+        return null
+      }
+      
       // Handle network/server errors
       const apiError = err as ApiError
       setError(apiError)
@@ -204,7 +256,10 @@ export function useApi<T>(
       onError?.(apiError)
       return null
     } finally {
-      setIsLoading(false)
+      if (!signal.aborted) {
+        setIsLoading(false)
+      }
+      abortControllerRef.current = null
     }
   }, [request, notifyOnError, notifyOnSuccess, successMessage, errorContext, onSuccess, onError])
 
@@ -222,91 +277,103 @@ export function useApi<T>(
     isSuccess,
     execute,
     reset,
+    abort,
   }
 }
 
 // Convenience hooks for common HTTP methods
 
 /**
- * GET запрос
+ * GET request config with auto-execute support
+ */
+export interface UseGetConfig<T> extends UseApiConfig<T> {
+  /** Skip request (don't execute) */
+  skip?: boolean
+  /** Dynamic headers function */
+  headers?: () => Record<string, string>
+  /** Auto-execute on mount (default: true for useGet) */
+  immediate?: boolean
+}
+
+/**
+ * GET request with AbortController and auto-execute
  */
 export function useGet<T>(
   url: string,
-  params?: Record<string, unknown>,
-  config: UseApiConfig<T> = {}
+  config: UseGetConfig<T> = {}
 ): UseApiResult<T> {
-  const request = () => 
-    fetch(url, params ? { 
-      method: 'GET',
-      headers: { 'Content-Type': 'application/json' }
-    } : {})
-      .then(async (response) => {
-        const data = await response.json()
-        return { data, status: response.status, ok: response.ok } as ApiResponse<T>
+  const { skip = false, headers, immediate = true, ...apiConfig } = config
+
+  const request = useMemo(() => {
+    return (signal?: AbortSignal) => {
+      const headersObj = headers ? headers() : {}
+      return api.get(url, { 
+        headers: { 'Content-Type': 'application/json', ...headersObj },
+        signal,
       })
+        .then((response) => {
+          return { data: response.data, status: response.status, ok: response.status >= 200 && response.status < 300 } as ApiResponse<T>
+        })
+    }
+  }, [url, headers])
 
-  return useApi(request, config)
+  const result = useApi(request, { ...apiConfig, immediate: false })
+
+  // Auto-execute on mount if not skipped
+  useEffect(() => {
+    if (immediate && !skip) {
+      result.execute()
+    }
+  }, [immediate, skip, url])
+
+  return result
 }
 
 /**
- * POST запрос
+ * POST запрос с AbortController
  */
 export function usePost<T>(
   url: string,
   data?: unknown,
   config: UseApiConfig<T> = {}
 ): UseApiResult<T> {
-  const request = () =>
-    fetch(url, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: data ? JSON.stringify(data) : undefined,
-    })
-      .then(async (response) => {
-        const responseData = await response.json()
-        return { data: responseData, status: response.status, ok: response.ok } as ApiResponse<T>
+  const request = (signal?: AbortSignal) =>
+    api.post(url, data, { signal })
+      .then((response) => {
+        return { data: response.data, status: response.status, ok: response.status >= 200 && response.status < 300 } as ApiResponse<T>
       })
 
   return useApi(request, config)
 }
 
 /**
- * PUT запрос
+ * PUT запрос с AbortController
  */
 export function usePut<T>(
   url: string,
   data?: unknown,
   config: UseApiConfig<T> = {}
 ): UseApiResult<T> {
-  const request = () =>
-    fetch(url, {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: data ? JSON.stringify(data) : undefined,
-    })
-      .then(async (response) => {
-        const responseData = await response.json()
-        return { data: responseData, status: response.status, ok: response.ok } as ApiResponse<T>
+  const request = (signal?: AbortSignal) =>
+    api.put(url, data, { signal })
+      .then((response) => {
+        return { data: response.data, status: response.status, ok: response.status >= 200 && response.status < 300 } as ApiResponse<T>
       })
 
   return useApi(request, config)
 }
 
 /**
- * DELETE запрос
+ * DELETE запрос с AbortController
  */
 export function useDel<T>(
   url: string,
   config: UseApiConfig<T> = {}
 ): UseApiResult<T> {
-  const request = () =>
-    fetch(url, {
-      method: 'DELETE',
-      headers: { 'Content-Type': 'application/json' },
-    })
-      .then(async (response) => {
-        const responseData = await response.json()
-        return { data: responseData, status: response.status, ok: response.ok } as ApiResponse<T>
+  const request = (signal?: AbortSignal) =>
+    api.delete(url, { signal })
+      .then((response) => {
+        return { data: response.data, status: response.status, ok: response.status >= 200 && response.status < 300 } as ApiResponse<T>
       })
 
   return useApi(request, config)

package/src/hooks/useShellAuth.ts

@@ -7,6 +7,7 @@
 
 import { useEffect, useState, useCallback, useRef } from 'react'
 import type { ShellAuth } from '../types'
+import { getShellAuth } from '../utils/shellAuth'
 
 // Development mode flag
 const isDev = import.meta.env?.DEV === true || import.meta.env?.MODE === 'development'
@@ -23,27 +24,6 @@ const logger = {
   },
 }
 
-/**
- * Получить auth из window globals
- */
-function getAuth(): ShellAuth | null {
-  if (typeof window === 'undefined') return null
-
-  // Try __SHELL_AUTH_INSTANCE__ first
-  const win = window as unknown as { __SHELL_AUTH_INSTANCE__?: ShellAuth }
-  if (win.__SHELL_AUTH_INSTANCE__) {
-    return win.__SHELL_AUTH_INSTANCE__
-  }
-
-  // Try __SHELL_AUTH__ format
-  const win2 = window as unknown as { __SHELL_AUTH__?: { authInstance?: ShellAuth } }
-  if (win2.__SHELL_AUTH__?.authInstance) {
-    return win2.__SHELL_AUTH__.authInstance
-  }
-
-  return null
-}
-
 /**
  * Централизованный хук для получения состояния авторизации из shell
  * 
@@ -66,7 +46,7 @@ export function useShellAuth(): ShellAuth {
   const maxAttempts = 20 // 10 seconds max wait (20 * 500ms)
 
   const getAuthState = useCallback((): ShellAuth | null => {
-    return getAuth()
+    return getShellAuth()
   }, [])
 
   useEffect(() => {
@@ -118,7 +98,7 @@ export function useShellAuth(): ShellAuth {
     isLoading: isLoading,
     signinRedirect: async () => {
       logger.log('Redirecting to login')
-      const shellAuth = getAuth()
+      const shellAuth = getShellAuth()
       if (shellAuth?.signinRedirect) {
         await shellAuth.signinRedirect()
       } else {
@@ -128,7 +108,7 @@ export function useShellAuth(): ShellAuth {
       }
     },
     removeUser: async () => {
-      const shellAuth = getAuth()
+      const shellAuth = getShellAuth()
       if (shellAuth?.removeUser) {
         await shellAuth.removeUser()
       }
@@ -141,5 +121,5 @@ export function useShellAuth(): ShellAuth {
   return result
 }
 
-// Named exports for specific helpers
-export { getAuth }
+// Re-export shell auth utilities for convenience
+export { getShellAuth }

package/src/services/api.ts

@@ -6,6 +6,7 @@
 
 import axios, { AxiosInstance, AxiosError, InternalAxiosRequestConfig } from 'axios'
 import type { ApiError, ApiResponse } from '../types'
+import { getAuthState, redirectToLogin } from '../utils/shellAuth'
 
 // MF Name for logging
 const MF_NAME = 'platform-kit'
@@ -38,6 +39,8 @@ export interface ApiConfig {
   timeout?: number
   baseURL?: string
   name?: string
+  retries?: number
+  retryDelay?: number
 }
 
 /**
@@ -49,29 +52,6 @@ export interface ApiErrorResponse {
   status?: number
 }
 
-/**
- * Получить состояние авторизации из shell
- */
-function getAuthState(): { isAuthenticated: boolean; user?: { profile?: { access_token?: string } } } | null {
-  if (typeof window === 'undefined') {
-    return { isAuthenticated: false }
-  }
-
-  // Try __SHELL_AUTH_INSTANCE__
-  const shellAuth = (window as unknown as { __SHELL_AUTH_INSTANCE__?: { isAuthenticated: boolean; user?: { profile?: { access_token?: string } } } }).__SHELL_AUTH_INSTANCE__
-  if (shellAuth) {
-    return shellAuth
-  }
-
-  // Try __SHELL_AUTH__ format
-  const shellAuth2 = (window as unknown as { __SHELL_AUTH__?: { authInstance?: { isAuthenticated: boolean; user?: { profile?: { access_token?: string } } } } }).__SHELL_AUTH__
-  if (shellAuth2?.authInstance) {
-    return shellAuth2.authInstance
-  }
-
-  return { isAuthenticated: false }
-}
-
 /**
  * Получить mfeName из window
  */
@@ -83,23 +63,6 @@ function getMfeName(): string {
   return MF_NAME
 }
 
-/**
- * Обработка ошибок авторизации - редирект на логин
- */
-function handleAuthError(): void {
-  if (typeof window === 'undefined') return
-
-  const shellAuth = (window as unknown as { __SHELL_AUTH_INSTANCE__?: { signinRedirect?: () => Promise<void> } }).__SHELL_AUTH_INSTANCE__
-
-  if (shellAuth?.signinRedirect) {
-    shellAuth.signinRedirect().catch((err) => {
-      logger.error('Failed to redirect to login:', err)
-    })
-  } else {
-    window.location.href = '/'
-  }
-}
-
 /**
  * Форматирование API ошибки в консистентную структуру
  */
@@ -130,6 +93,27 @@ function formatApiError(error: AxiosError<ApiErrorResponse>): ApiError {
   }
 }
 
+/**
+ * Default retry configuration
+ */
+const DEFAULT_RETRIES = 3
+const DEFAULT_RETRY_DELAY = 1000
+
+/**
+ * Check if error is retryable
+ */
+function isRetryableError(status?: number): boolean {
+  // Retry on network errors, 5xx, and 429 (rate limit)
+  return !status || status >= 500 || status === 429
+}
+
+/**
+ * Sleep utility for retry delay
+ */
+function sleep(ms: number): Promise<void> {
+  return new Promise(resolve => setTimeout(resolve, ms))
+}
+
 /**
  * Создание API клиента с interceptors
  * 
@@ -144,6 +128,8 @@ function formatApiError(error: AxiosError<ApiErrorResponse>): ApiError {
  */
 export function createApiClient(config: ApiConfig = {}): AxiosInstance {
   const clientName = config.name || MF_NAME
+  const retries = config.retries ?? DEFAULT_RETRIES
+  const retryDelay = config.retryDelay ?? DEFAULT_RETRY_DELAY
 
   const clientLogger = {
     log: (...args: unknown[]) => logger.log(`[API:${clientName}]`, ...args),
@@ -167,10 +153,13 @@ export function createApiClient(config: ApiConfig = {}): AxiosInstance {
 
       // Attach token ONLY if user is authenticated
       if (authState?.isAuthenticated) {
-        const token = authState.user?.profile?.access_token
+        // Try user.access_token first (from react-oidc-context), then user.profile.access_token
+        const token = authState.user?.access_token || authState.user?.profile?.access_token
         if (token && config.headers) {
           config.headers.Authorization = `Bearer ${token}`
           clientLogger.info('Auth token attached')
+        } else {
+          clientLogger.warn('User is authenticated but no token found')
         }
       } else {
         clientLogger.info('User not authenticated - request without token')
@@ -185,20 +174,34 @@ export function createApiClient(config: ApiConfig = {}): AxiosInstance {
     }
   )
 
-  // Response interceptor - обработка ошибок
+  // Response interceptor - обработка ошибок с retry
   client.interceptors.response.use(
     (response) => {
       clientLogger.log(`Response ${response.status}:`, response.config.url)
       return response
     },
-    (error: AxiosError<ApiErrorResponse>) => {
+    async (error: AxiosError<ApiErrorResponse>) => {
       const status = error.response?.status
       const url = error.config?.url
+      const retryCount = (error.config as InternalAxiosRequestConfig & { _retryCount?: number })?._retryCount ?? 0
+
+      // Retry logic for retryable errors
+      if (isRetryableError(status) && retryCount < retries) {
+        const configWithRetry = error.config as InternalAxiosRequestConfig & { _retryCount?: number }
+        configWithRetry._retryCount = retryCount + 1
+        
+        // Exponential backoff: delay * 2^retryCount
+        const backoffDelay = retryDelay * Math.pow(2, retryCount)
+        clientLogger.warn(`Retrying (${configWithRetry._retryCount}/${retries}) after ${backoffDelay}ms:`, url)
+        
+        await sleep(backoffDelay)
+        return client.request(configWithRetry)
+      }
 
       // Categorize errors
       if (status === 401) {
         clientLogger.warn('401 Unauthorized - triggering re-auth')
-        handleAuthError()
+        redirectToLogin()
       } else if (status === 403) {
         clientLogger.warn('403 Forbidden - insufficient permissions')
       } else if (status === 404) {

package/src/types/index.ts

@@ -75,30 +75,7 @@ export interface ApiResponse<T> {
   ok: boolean
 }
 
-/**
- * Interface для конфигурации useApi
- */
-export interface UseApiConfig<T = never> {
-  notifyOnError?: boolean
-  notifyOnSuccess?: boolean
-  successMessage?: string
-  errorContext?: string
-  onSuccess?: (data: T) => void
-  onError?: (error: ApiError) => void
-}
-
-/**
- * Interface для результата useApi
- */
-export interface UseApiResult<T> {
-  data: T | null
-  error: ApiError | null
-  isLoading: boolean
-  isError: boolean
-  isSuccess: boolean
-  execute: () => Promise<T | null>
-  reset: () => void
-}
+// Note: UseApiConfig and UseApiResult are exported from hooks/useApi.ts
 
 // ==================== Info Types ====================
 

package/src/utils/index.ts

@@ -15,5 +15,15 @@ export {
   type MfeNameProps,
 } from './mfeName'
 
+// Shell Auth utilities
+export {
+  getShellAuth,
+  getAuthState,
+  getAccessToken,
+  isAuthenticated,
+  redirectToLogin,
+  logout,
+} from './shellAuth'
+
 // Re-export types
 export type { MfeNameSource } from '../types'

package/src/utils/shellAuth.ts

@@ -0,0 +1,107 @@
+/**
+ * Shell Auth Utilities - Централизованные утилиты для работы с Shell Auth
+ * 
+ * Используются в hooks/useShellAuth.ts и services/api.ts
+ */
+
+import type { ShellAuth } from '../types'
+
+/**
+ * Получить auth instance из window globals
+ * 
+ * Поддерживает два формата:
+ * - window.__SHELL_AUTH_INSTANCE__ (прямой доступ)
+ * - window.__SHELL_AUTH__.authInstance (вложенный формат)
+ * 
+ * @returns ShellAuth instance или null
+ */
+export function getShellAuth(): ShellAuth | null {
+  if (typeof window === 'undefined') return null
+
+  // Try __SHELL_AUTH_INSTANCE__ first (direct format)
+  const win = window as unknown as { __SHELL_AUTH_INSTANCE__?: ShellAuth }
+  if (win.__SHELL_AUTH_INSTANCE__) {
+    return win.__SHELL_AUTH_INSTANCE__
+  }
+
+  // Try __SHELL_AUTH__ format (nested format)
+  const win2 = window as unknown as { __SHELL_AUTH__?: { authInstance?: ShellAuth } }
+  if (win2.__SHELL_AUTH__?.authInstance) {
+    return win2.__SHELL_AUTH__.authInstance
+  }
+
+  return null
+}
+
+/**
+ * Получить auth state (упрощённый формат для API interceptors)
+ * 
+ * @returns Auth state с isAuthenticated и user
+ */
+export function getAuthState(): { 
+  isAuthenticated: boolean
+  user?: { 
+    access_token?: string
+    profile?: { 
+      access_token?: string 
+    } 
+  } 
+} | null {
+  const auth = getShellAuth()
+  
+  if (!auth) {
+    return { isAuthenticated: false }
+  }
+  
+  return {
+    isAuthenticated: auth.isAuthenticated,
+    user: auth.user ?? undefined,
+  }
+}
+
+/**
+ * Получить access token из shell auth
+ * 
+ * @returns Access token или null
+ */
+export function getAccessToken(): string | null {
+  const auth = getShellAuth()
+  
+  if (!auth?.isAuthenticated) {
+    return null
+  }
+  
+  return auth.user?.profile?.access_token ?? null
+}
+
+/**
+ * Проверить авторизован ли пользователь
+ */
+export function isAuthenticated(): boolean {
+  const auth = getShellAuth()
+  return auth?.isAuthenticated ?? false
+}
+
+/**
+ * Инициировать редирект на страницу логина
+ */
+export async function redirectToLogin(): Promise<void> {
+  const auth = getShellAuth()
+  
+  if (auth?.signinRedirect) {
+    await auth.signinRedirect()
+  } else if (typeof window !== 'undefined') {
+    window.location.href = '/'
+  }
+}
+
+/**
+ * Выход из системы
+ */
+export async function logout(): Promise<void> {
+  const auth = getShellAuth()
+  
+  if (auth?.removeUser) {
+    await auth.removeUser()
+  }
+}