@mediacubeco/expo-template-fsd 2.3.0 → 2.4.0

package/src/shared/lib/api/api.client.ts

@@ -0,0 +1,157 @@
+import { listenAppState } from '@mediacubeco/base-react-native/utils'
+import { ErrorHandler } from '@mediacubeco/base/helpers'
+import { addNetworkStateListener, getNetworkStateAsync } from 'expo-network'
+import { createAsyncStoragePersister } from '@tanstack/query-async-storage-persister'
+import {
+  focusManager,
+  MutationCache,
+  onlineManager,
+  QueryCache,
+  QueryClient,
+} from '@tanstack/react-query'
+import { type PersistQueryClientProviderProps } from '@tanstack/react-query-persist-client'
+import { storageAsync } from '../storage'
+import { apiInstanceErrorHandlerCase } from './models'
+
+const MAX_RETRY_COUNT = 2
+const GC_TIME = 1000 * 60 * 60 * 24
+const PERSIST_MAX_AGE = 1000 * 60 * 60 * 24
+const PERSIST_THROTTLE_TIME = 1000
+const PERSIST_KEY = 'reactQuery'
+
+/**
+ * Отправляет ошибку TanStack Query в `ErrorHandler.capture`: разобранное сообщение,
+ * HTTP-статус, ошибки валидации, состояние сети и переданные детали запроса/мутации.
+ */
+const queryCache = new QueryCache({
+  onError: (error, query) => {
+    if (query.meta?.silent) {
+      return
+    }
+
+    const { isStale, getObserversCount, ...rest } = query
+
+    ErrorHandler.capture(error, {
+      signal: 'query',
+      payload: {
+        ...rest,
+        isStale: isStale(),
+        observerCount: getObserversCount(),
+      },
+    })
+  },
+})
+
+const mutationCache = new MutationCache({
+  onError: (error, variables, context, mutation) => {
+    if (mutation.meta?.silent) {
+      return
+    }
+
+    const { ...rest } = mutation
+
+    ErrorHandler.capture(error, {
+      signal: 'query',
+      payload: {
+        variables,
+        context,
+        ...rest,
+      },
+    })
+  },
+})
+
+const queryClient = new QueryClient({
+  queryCache,
+  mutationCache,
+  defaultOptions: {
+    queries: {
+      gcTime: GC_TIME,
+      retry: (failureCount, error) => {
+        const { status } = ErrorHandler.parse(error)
+
+        if (status >= 400 && status < 500) {
+          return false
+        }
+
+        return failureCount < MAX_RETRY_COUNT
+      },
+    },
+  },
+})
+
+const prefetchApiReferenceData = () => {
+  return Promise.all([])
+}
+
+const persister = createAsyncStoragePersister({
+  key: PERSIST_KEY,
+  storage: storageAsync,
+  throttleTime: PERSIST_THROTTLE_TIME,
+})
+
+const persistOptions = {
+  maxAge: PERSIST_MAX_AGE,
+  dehydrateOptions: {
+    shouldDehydrateQuery: (query) => {
+      return query.state.status === 'success' && query.meta?.persist === true
+    },
+  },
+  persister,
+} satisfies PersistQueryClientProviderProps['persistOptions']
+
+/**
+ * Приблизительный вес персистентного дампа TanStack Query в байтах: длина
+ * сериализованной строки под ключом `PERSIST_KEY` (0, если дампа ещё нет).
+ */
+const getQueryPersistSize = async () => {
+  const value = await storageAsync.getItem(PERSIST_KEY)
+
+  return value ? value.length : 0
+}
+
+/**
+ * Полная очистка кэша TanStack Query: сбрасывает in-memory кэш и удаляет
+ * персистентный дамп из хранилища. Настройки темы, языка и сессии не затрагивает.
+ */
+const clearQueryPersist = async () => {
+  queryClient.clear()
+
+  await persister.removeClient()
+}
+
+onlineManager.setEventListener((setOnline) => {
+  const syncOnline = async () => {
+    try {
+      const state = await getNetworkStateAsync()
+
+      setOnline(Boolean(state.isConnected))
+    } catch {
+      setOnline(true)
+    }
+  }
+
+  syncOnline()
+
+  const subscription = addNetworkStateListener((state) => {
+    setOnline(Boolean(state.isConnected))
+  })
+
+  return () => subscription.remove()
+})
+
+listenAppState({
+  onChange: (status) => {
+    focusManager.setFocused(status === 'active')
+  },
+})
+
+ErrorHandler.case(apiInstanceErrorHandlerCase)
+
+export {
+  queryClient,
+  persistOptions,
+  prefetchApiReferenceData,
+  getQueryPersistSize,
+  clearQueryPersist,
+}

package/src/shared/lib/api/api.provider.tsx

@@ -1,44 +1,22 @@
-import { listenAppState } from '@mediacubeco/base-react-native/utils'
-import { createAsyncStoragePersister } from '@tanstack/query-async-storage-persister'
-import { focusManager, QueryClient } from '@tanstack/react-query'
-import {
-  PersistQueryClientProvider,
-  type PersistQueryClientProviderProps,
-} from '@tanstack/react-query-persist-client'
-import { storageAsync } from '../storage'
+import { useCallback } from 'react'
+import { useReactQueryDevTools } from '@dev-plugins/react-query'
+import { PersistQueryClientProvider } from '@tanstack/react-query-persist-client'
 import { type ApiProviderProps } from './api.types'
+import { persistOptions, prefetchApiReferenceData, queryClient } from './api.client'
 
-const client = new QueryClient({
-  defaultOptions: {
-    queries: {
-      retry: 2,
-      gcTime: 1000 * 60 * 60 * 24,
-    },
-  },
-})
-
-const persistOptions = {
-  maxAge: 1000 * 60 * 60 * 24,
-  dehydrateOptions: {
-    shouldDehydrateQuery: (query) => {
-      return query.state.status === 'success' && query.meta?.persist === true
-    },
-  },
-  persister: createAsyncStoragePersister({
-    storage: storageAsync,
-    throttleTime: 1000,
-  }),
-} satisfies PersistQueryClientProviderProps['persistOptions']
+const ApiProvider = ({ children }: ApiProviderProps) => {
+  useReactQueryDevTools(queryClient)
 
-listenAppState({
-  onChange: (status) => {
-    focusManager.setFocused(status === 'active')
-  },
-})
+  const handleSuccess = useCallback(() => {
+    prefetchApiReferenceData()
+  }, [])
 
-const ApiProvider = ({ children }: ApiProviderProps) => {
   return (
-    <PersistQueryClientProvider client={client} persistOptions={persistOptions}>
+    <PersistQueryClientProvider
+      client={queryClient}
+      persistOptions={persistOptions}
+      onSuccess={handleSuccess}
+    >
       {children}
     </PersistQueryClientProvider>
   )

package/src/shared/lib/api/api.ts

@@ -1,7 +1,3 @@
-import { AuthRepository } from './repositories'
-
-class Api {
-  static authRepository = new AuthRepository('/auth')
-}
+class Api {}
 
 export { Api }

package/src/shared/lib/api/api.types.ts

@@ -1,9 +1,12 @@
 import { type PropsWithChildren } from 'react'
+import { type ApiInstanceOptions } from './models'
 
-type ApiResponse<Response = {}> = {
-  data: Partial<Response>
+type ApiResponse<Response = {}> = Response & {}
+
+type ApiConfig<Config = {}> = Config & {
+  options?: ApiInstanceOptions
 }
 
 type ApiProviderProps = PropsWithChildren
 
-export type { ApiResponse, ApiProviderProps }
+export type { ApiResponse, ApiConfig, ApiProviderProps }

package/src/shared/lib/api/hooks/index.ts

@@ -0,0 +1 @@
+export {}

package/src/shared/lib/api/index.ts

@@ -1,4 +1,3 @@
-export {} from './entities'
-export {} from './resources'
-export {} from './hooks'
+export * from './entities'
+export * from './hooks'
 export { default as ApiProvider } from './api.provider'

package/src/shared/lib/api/models/api-instance/api-instance.client.ts

@@ -0,0 +1,50 @@
+import { Log } from '@mediacubeco/base/helpers'
+import axios, { AxiosError, isAxiosError } from 'axios'
+import { APP_URL_API } from '../../../../constants'
+
+/**
+ * Общий axios-инстанс приложения: база из `APP_URL_API`, таймаут и JSON-заголовки.
+ * Интерсепторы навешиваются здесь один раз: Bearer из сессии (с учётом `skipAuth`),
+ * single-flight 401-refresh с одним повтором, логирование успехов и ошибок.
+ */
+const apiInstanceClient = axios.create({
+  baseURL: APP_URL_API,
+  withCredentials: true,
+  headers: {
+    'Accept': 'application/json',
+    'Content-Type': 'application/json',
+  },
+})
+
+apiInstanceClient.interceptors.request.use((config) => {
+  return config
+})
+
+apiInstanceClient.interceptors.response.use(
+  (response) => {
+    const { config } = response
+
+    Log.formatted.success(config.method ?? 'request', apiInstanceClient.getUri(config), response)
+
+    return response
+  },
+  async (error) => {
+    if (!isAxiosError(error) || !error.config) {
+      throw error
+    }
+
+    const { config } = error
+
+    if (error.code !== AxiosError.ERR_CANCELED) {
+      Log.formatted.danger(
+        config.method ?? 'request',
+        apiInstanceClient.getUri(config),
+        error.response
+      )
+    }
+
+    throw error
+  }
+)
+
+export { apiInstanceClient }

package/src/shared/lib/api/models/api-instance/api-instance.ts

@@ -1,116 +1,64 @@
-import { ErrorHandler, Log } from '@mediacubeco/base/helpers'
-import { API_URL } from '../../../../constants'
-import { formatRoute, formatURI } from './api-instance.utils'
 import { ApiInstanceMethod } from './api-instance.constants'
 import {
   type ApiInstanceConfig,
-  type ApiInstanceDefaultBody,
-  type ApiInstanceDefaultHeaders,
-  type ApiInstanceDefaultParams,
   type ApiInstanceRoute,
-  type ApiInstanceURL,
   type ApiInstanceURN,
 } from './api-instance.types'
+import { apiInstanceClient } from './api-instance.client'
 
+/**
+ * Базовый класс репозиториев: типизированные HTTP-методы поверх общего axios-инстанса.
+ * Держит URN домена и приклеивает его к каждому route.
+ */
 abstract class ApiInstance {
-  private url: ApiInstanceURL
+  /** URN домена репозитория, добавляется перед каждым route. */
   private urn: ApiInstanceURN
 
-  private headers: ApiInstanceDefaultHeaders
-
   constructor(urn: ApiInstanceURN) {
-    this.url = API_URL
     this.urn = urn
-
-    this.headers = {
-      'Accept': 'application/json',
-      'Content-Type': 'application/json',
-      // 'Authorization': `Bearer ${API_TOKEN}`,
-    }
-  }
-
-  private formatHeaders(headers?: ApiInstanceDefaultHeaders) {
-    return { ...this.headers, ...headers }
   }
 
+  /** Выполняет запрос через общий axios-инстанс и возвращает тело ответа (undefined при пустом теле). */
   private async request<Result>(
     method: ApiInstanceMethod,
     route: ApiInstanceRoute,
-    { params, body, headers }: ApiInstanceConfig = {}
-  ): Promise<Result> {
-    const uri = formatURI(this.url, this.urn, formatRoute(route, params))
-
-    try {
-      const response = await fetch(uri, {
-        method,
-        body: JSON.stringify(body),
-        headers: this.formatHeaders(headers),
-      })
-
-      if (!response.ok) {
-        ErrorHandler.throw('API Error', response)
-      }
-
-      const data = await response.json()
-
-      Log.formatted.success(method, uri, { data, params, body, headers })
-
-      return data as Result
-    } catch (error) {
-      ErrorHandler.forward(error, {
-        signal: method,
-        message: uri,
-        payload: { params, body, headers },
-      })
-    }
-  }
-
-  protected updateHeaders(headers: ApiInstanceDefaultHeaders) {
-    this.headers = { ...this.headers, ...headers }
+    { params, body, headers, options, ...config }: ApiInstanceConfig = {}
+  ) {
+    const response = await apiInstanceClient.request<Result>({
+      url: [this.urn, route].join(''),
+      method,
+      params,
+      data: body,
+      headers,
+      ...options,
+      ...config,
+    })
+
+    return response.data
   }
 
-  protected async get<
-    Result,
-    Params extends ApiInstanceDefaultParams = ApiInstanceDefaultParams,
-    Body extends ApiInstanceDefaultBody = ApiInstanceDefaultBody,
-    Headers extends ApiInstanceDefaultHeaders = ApiInstanceDefaultHeaders,
-  >(route: ApiInstanceRoute, config?: ApiInstanceConfig<Body, Params, Headers>) {
+  /** GET-запрос домена. */
+  protected async get<Result>(route: ApiInstanceRoute, config?: ApiInstanceConfig) {
     return await this.request<Result>(ApiInstanceMethod.Get, route, config)
   }
 
-  protected async post<
-    Result,
-    Params extends ApiInstanceDefaultParams = ApiInstanceDefaultParams,
-    Body extends ApiInstanceDefaultBody = ApiInstanceDefaultBody,
-    Headers extends ApiInstanceDefaultHeaders = ApiInstanceDefaultHeaders,
-  >(route: ApiInstanceRoute, config?: ApiInstanceConfig<Body, Params, Headers>) {
+  /** POST-запрос домена. */
+  protected async post<Result>(route: ApiInstanceRoute, config?: ApiInstanceConfig) {
     return await this.request<Result>(ApiInstanceMethod.Post, route, config)
   }
 
-  protected async put<
-    Result,
-    Params extends ApiInstanceDefaultParams = ApiInstanceDefaultParams,
-    Body extends ApiInstanceDefaultBody = ApiInstanceDefaultBody,
-    Headers extends ApiInstanceDefaultHeaders = ApiInstanceDefaultHeaders,
-  >(route: ApiInstanceRoute, config?: ApiInstanceConfig<Body, Params, Headers>) {
+  /** PUT-запрос домена. */
+  protected async put<Result>(route: ApiInstanceRoute, config?: ApiInstanceConfig) {
     return await this.request<Result>(ApiInstanceMethod.Put, route, config)
   }
 
-  protected async patch<
-    Result,
-    Params extends ApiInstanceDefaultParams = ApiInstanceDefaultParams,
-    Body extends ApiInstanceDefaultBody = ApiInstanceDefaultBody,
-    Headers extends ApiInstanceDefaultHeaders = ApiInstanceDefaultHeaders,
-  >(route: ApiInstanceRoute, config?: ApiInstanceConfig<Body, Params, Headers>) {
+  /** PATCH-запрос домена. */
+  protected async patch<Result>(route: ApiInstanceRoute, config?: ApiInstanceConfig) {
     return await this.request<Result>(ApiInstanceMethod.Patch, route, config)
   }
 
-  protected async delete<
-    Result,
-    Params extends ApiInstanceDefaultParams = ApiInstanceDefaultParams,
-    Body extends ApiInstanceDefaultBody = ApiInstanceDefaultBody,
-    Headers extends ApiInstanceDefaultHeaders = ApiInstanceDefaultHeaders,
-  >(route: ApiInstanceRoute, config?: ApiInstanceConfig<Body, Params, Headers>) {
+  /** DELETE-запрос домена. */
+  protected async delete<Result>(route: ApiInstanceRoute, config?: ApiInstanceConfig) {
     return await this.request<Result>(ApiInstanceMethod.Delete, route, config)
   }
 }

package/src/shared/lib/api/models/api-instance/api-instance.types.ts

@@ -1,31 +1,29 @@
-type ApiInstanceURL = `https://${string}`
+import { type AxiosRequestConfig } from 'axios'
 
 type ApiInstanceURN = `/${string}`
 
 type ApiInstanceRoute = `/${string}`
 
-type ApiInstanceDefaultParams = Record<string, string>
-
-type ApiInstanceDefaultBody = Record<string, any>
-
-type ApiInstanceDefaultHeaders = Record<string, string>
+type ApiInstanceOptions = {
+  signal?: AbortSignal
+  timeout?: number
+}
 
-type ApiInstanceConfig<
-  Params extends ApiInstanceDefaultParams = ApiInstanceDefaultParams,
-  Body extends ApiInstanceDefaultBody = ApiInstanceDefaultBody,
-  Headers extends ApiInstanceDefaultHeaders = ApiInstanceDefaultHeaders,
-> = {
-  params?: Params
-  body?: Body
-  headers?: Headers
+type ApiInstanceConfig = Omit<AxiosRequestConfig, 'data'> & {
+  body?: AxiosRequestConfig['data']
+  options?: ApiInstanceOptions
 }
 
+/** Тело ошибки бэкенда (Laravel): сообщение и ошибки валидации по полям. */
+type ApiInstanceErrorData = {
+  message?: string
+  errors?: Record<string, string | string[]>
+} & Record<string, unknown>
+
 export type {
-  ApiInstanceURL,
   ApiInstanceURN,
   ApiInstanceRoute,
-  ApiInstanceDefaultBody,
-  ApiInstanceDefaultParams,
-  ApiInstanceDefaultHeaders,
+  ApiInstanceErrorData,
+  ApiInstanceOptions,
   ApiInstanceConfig,
 }

package/src/shared/lib/api/models/api-instance/api-instance.utils.ts

@@ -1,22 +1,15 @@
-import {
-  type ApiInstanceDefaultParams,
-  type ApiInstanceRoute,
-  type ApiInstanceURL,
-  type ApiInstanceURN,
-} from './api-instance.types'
-
-const formatURI = (url: ApiInstanceURL, urn: ApiInstanceURN, route: ApiInstanceRoute) => {
-  return [url, urn, route].join('')
-}
-
-const formatRoute = <Params extends ApiInstanceDefaultParams>(
-  route: ApiInstanceRoute,
-  params?: Params
-) => {
-  const query = new URLSearchParams(params).toString()
-  const validRoute = route.endsWith('/') ? route.slice(0, -1) : route
-
-  return [validRoute, query].filter(Boolean).join('?') as ApiInstanceRoute
+import { type ErrorHandlerCaseConfig } from '@mediacubeco/base/helpers'
+import { type AxiosError, isAxiosError } from 'axios'
+import { type ApiInstanceErrorData } from './api-instance.types'
+
+const apiInstanceErrorHandlerCase: ErrorHandlerCaseConfig<AxiosError<ApiInstanceErrorData>> = {
+  check: (error): error is AxiosError<ApiInstanceErrorData> => isAxiosError(error),
+  parse: (error, defaultResult) => ({
+    ...defaultResult,
+    message: error.response?.data?.message ?? error.message,
+    status: error.response?.status ?? defaultResult.status,
+    errors: (error.response?.data?.errors ?? defaultResult.errors) as typeof defaultResult.errors,
+  }),
 }
 
-export { formatURI, formatRoute }
+export { apiInstanceErrorHandlerCase }

package/src/shared/lib/api/models/api-instance/index.ts

@@ -1 +1,4 @@
 export { default as ApiInstance } from './api-instance'
+export { apiInstanceClient } from './api-instance.client'
+export type { ApiInstanceErrorData, ApiInstanceOptions } from './api-instance.types'
+export { apiInstanceErrorHandlerCase } from './api-instance.utils'

package/src/shared/lib/api/queries/index.ts

@@ -0,0 +1 @@
+export {}

package/src/shared/lib/api/repositories/index.ts

@@ -1 +1 @@
-export * from './auth'
+export {}

package/src/shared/lib/localization/constants/index.ts

@@ -10,23 +10,32 @@ enum LocalizationCode {
   English = 'en',
 }
 
-const LOCALIZATION_RESOURCES = {
-  en: { translation: TRANSLATIONS.EN },
-  ru: { translation: TRANSLATIONS.RU },
+const LOCALIZATION_NATIVE_TITLES: Record<LocalizationCode, string> = {
+  [LocalizationCode.Russian]: 'Русский',
+  [LocalizationCode.English]: 'English',
 }
 
+const LOCALIZATION_NATIVE_GREETINGS: Record<LocalizationCode, string> = {
+  [LocalizationCode.Russian]: 'Привет!',
+  [LocalizationCode.English]: 'Hello!',
+}
+
+const LOCALIZATION_RESOURCES = Object.fromEntries(
+  Object.entries(TRANSLATIONS).map(([code, translation]) => [code, { translation }])
+)
+
 const LOCALIZATION_SUPPORTED_LOCALE_LIST = Object.keys(LOCALIZATION_RESOURCES) as LocalizationCode[]
 
 const LOCALIZATION_CODE = (locales.find(
   (locale) => locale && LOCALIZATION_SUPPORTED_LOCALE_LIST.includes(locale as LocalizationCode)
-) ?? LOCALIZATION_SUPPORTED_LOCALE_LIST[0]) as LocalizationCode
+) ?? LocalizationCode.English) as LocalizationCode
 
 const LOCALIZATION_CODE_FALLBACK = (locales.find(
   (locale) =>
     locale &&
     locale !== LOCALIZATION_CODE &&
     LOCALIZATION_SUPPORTED_LOCALE_LIST.includes(locale as LocalizationCode)
-) ?? LOCALIZATION_SUPPORTED_LOCALE_LIST[1]) as LocalizationCode
+) ?? LocalizationCode.Russian) as LocalizationCode
 
 const languageDetector: LanguageDetectorAsyncModule = {
   type: 'languageDetector' as const,
@@ -46,6 +55,8 @@ const languageDetector: LanguageDetectorAsyncModule = {
 
 export {
   LocalizationCode,
+  LOCALIZATION_NATIVE_GREETINGS,
+  LOCALIZATION_NATIVE_TITLES,
   LOCALIZATION_RESOURCES,
   LOCALIZATION_SUPPORTED_LOCALE_LIST,
   LOCALIZATION_CODE,

package/src/shared/lib/localization/index.ts

@@ -1,4 +1,8 @@
 export { LocalizationTranslate } from './components'
+export {
+  LocalizationCode,
+  LOCALIZATION_NATIVE_GREETINGS,
+  LOCALIZATION_NATIVE_TITLES,
+} from './constants'
 export { useLocalizationSetup, useLocalizationText } from './hooks'
-export { LocalizationCode } from './constants'
 export { default as LocalizationProvider } from './localization.provider'

package/src/shared/lib/navigation/hooks/index.ts

@@ -1,4 +1,9 @@
-export * from './use-navigation'
-export * from './use-navigation-params'
+export * from './use-navigation-breakpoints'
+export * from './use-navigation-dimensions'
 export * from './use-navigation-options'
-export * from './use-navigation-native-tabs'
+export * from './use-navigation-params'
+export * from './use-navigation-route'
+export * from './use-navigation-safe-area'
+export * from './use-navigation-tabs'
+export * from './use-navigation-tabs-native'
+export * from './use-navigation-transition'

package/src/shared/{hooks/use-breakpoints.ts → lib/navigation/hooks/use-navigation-breakpoints.ts}

@@ -1,6 +1,6 @@
 import { useWindowDimensions } from 'react-native'
 
-const useBreakpoints = () => {
+const useNavigationBreakpoints = () => {
   const { width } = useWindowDimensions()
 
   return {
@@ -19,7 +19,4 @@ const useBreakpoints = () => {
   }
 }
 
-type Breakpoints = ReturnType<typeof useBreakpoints>
-
-export { useBreakpoints }
-export type { Breakpoints }
+export { useNavigationBreakpoints }

package/src/shared/lib/navigation/hooks/use-navigation-dimensions.ts

@@ -0,0 +1,12 @@
+import { useWindowDimensions } from 'react-native'
+
+const useNavigationDimensions = () => {
+  const { width, height } = useWindowDimensions()
+
+  return {
+    WIDTH: width,
+    HEIGHT: height,
+  }
+}
+
+export { useNavigationDimensions }