@beletsky/react-native-yandex-remote-config NPM

Yandex Remote Config for React Native

Библиотека, предназначенная для использования Feature Toggles (переключателей функций) в приложениях React Native. Библиотека предоставляет простой интерфейс для управления удалёнными конфигурациями и переключателями функций, позволяя динамически контролировать функции в вашем приложении.

Установка

npm install @beletsky/react-native-yandex-remote-config

или

yarn add @beletsky/react-native-yandex-remote-config

Для IOS

Перед использованием библиотеки на IOS устройствах, необходимо выполнить установку pod

pod install

API

`withRemoteConfig({ flag, flagType, condition, defaultValue, defaultCondition }, WrappedComponent)`

Компонент высшего порядка (HOC), который оборачивает переданный компонент и отображает его только в том случае, если условие, основанное на значении удалённого флага, выполняется. Этот HOC полезен, когда нужно контролировать видимость компонента на основе удалённых флагов конфигурации.

Параметры:

flag: Имя флага, который будет проверяться в удалённой конфигурации.
flagType: Тип флага, который ожидается (например, FlagType.bool).
condition: Условие, по которому определяется, будет ли компонент отображён. По умолчанию, проверяет значение на true.
defaultValue: Значение по умолчанию для флага, если его нет в конфигурации.
defaultCondition: Условие по умолчанию для отображения компонента до загрузки значения флага (по умолчанию false).
WrappedComponent: Компонент, который будет обёрнут и отображён в случае выполнения условия.

Возвращает:

Компонент, который будет отображаться только при выполнении условия.

Пример:

import React from 'react';
import { Text } from 'react-native';
import { withRemoteConfig, FlagType } from '@beletsky/react-native-yandex-remote-config';

const MyComponent = ({ updateFlag }) => {
  return <Text>Функция активирована!</Text>;
};

const MyComponentWithToggle = withRemoteConfig(
  {
    flag: 'feature_enabled',
    flagType: FlagType.bool,
    condition: (value) => value === true,
    defaultCondition: false,
  },
  MyComponent
);

export default MyComponentWithToggle;

В этом примере MyComponentWithToggle будет отображаться только в том случае, если флаг feature_enabled возвращает значение true из удалённой конфигурации. Функция updateFlag() будет передана в обёрнутый компонент, что позволяет принудительно обновить значение флага при необходимости.

`wrapRemoteConfig({ flag, flagType, condition, callback, defaultValue })`

Функция-обёртка, которая позволяет обернуть любую функцию в логику Feature Toggle. Эта функция вызовет переданный колбэк только в том случае, если заданное условие (condition) выполнено. Это полезно для выполнения определённых действий, если определённая функция включена в конфигурации.

Параметры:

flag: Имя флага, который будет проверяться в удалённой конфигурации.
flagType: Тип флага, который ожидается (например, FlagType.bool).
condition: Условие, по которому будет определяться, нужно ли выполнять функцию. По умолчанию, проверяет значение на true.
callback: Функция, которая будет вызвана, если условие выполнено. Функция должна принимать значение флага и возвращать другую функцию, которая будет вызвана с переданными аргументами.
defaultValue: Значение по умолчанию для флага, если его нет в конфигурации.

Возвращает:

Функция, которая возвращает промис, выполняющий переданный callback, если условие выполнено, или ничего не делает, если не выполнено.

Пример:

const execAlert = (flagValue: boolean) => (text: string) => {
    Alert.alert('Feature Toggle alert', `${text}: ${flagValue}`);
    return '';
};

const scheduledAlert = wrapRemoteConfig({
    flag: 'test-bool',
    flagType: FlagType.bool,
    callback: execAlert,
    condition: (value) => {
        return !!value;
    },
});

// Использование:
scheduledAlert('Some text');

Эта функция полезна, когда вы хотите контролировать выполнение кода в зависимости от значений, загруженных из удалённой конфигурации.

`useRemoteConfig(flag, flagType, defaultValue)`

Пользовательский хук, который используется для получения значения флага из удалённой конфигурации. Он позволяет вам загружать и отслеживать значения флагов в вашем приложении и предоставляет возможность принудительно обновить значение флага.

Параметры:

flag: Имя флага, который нужно загрузить.
flagType: Тип флага, который ожидается (например, FlagType.bool).
defaultValue: Значение по умолчанию, если флаг не найден или его значение не задано.

Возвращает:

[state, fetchFlag, isLoading]: Массив, содержащий три элемента:
- state: Текущее значение флага или значение по умолчанию, если флаг не найден.
- fetchFlag: Функция, которая позволяет вручную перезагрузить значение флага из удалённой конфигурации.
- isLoading: Булевое значение, указывающее, загружается ли в данный момент значение флага.

Пример:

const [featureEnabled, reloadFeature, isLoading] = useRemoteConfig('new_feature', FlagType.bool, false);

if (isLoading) {
  // Отображаем индикатор загрузки
}

if (featureEnabled) {
  // Выполняем действие, если функция включена
}

// Для принудительного обновления значения флага:
reloadFeature();

Этот хук полезен для динамической загрузки и использования значений флагов конфигурации в компонентах вашего приложения, а также для отслеживания состояния загрузки этих значений.

Типы

`Settings`

Тип Settings представляет настройки для конфигурации удалённого клиента. Он включает в себя различные параметры, такие как базовый URL, сетевые настройки и очереди.

Структура:

type Settings = {
  baseURL?: string;
  settings?: any;
  network?: any;
  fetchThrottle?: number;
  clientFeatures?: Record<string, string>;
  varioqubQueue?: any;
  outputQueue?: any;
};

Параметры:

baseURL: Базовый URL для запросов.
settings: Дополнительные настройки клиента.
network: Настройки сети.
fetchThrottle: Интервал времени (в миллисекундах) между запросами к удалённой конфигурации.
clientFeatures: Объект, представляющий функции клиента в формате ключ-значение.
varioqubQueue: Очередь для обработки задач.
outputQueue: Очередь для вывода данных.

`FlagType`

Enum FlagType представляет возможные типы флагов, которые могут быть использованы в удалённой конфигурации.

Структура:

enum FlagType {
  string = 'string',
  int = 'int',
  double = 'double',
  bool = 'bool',
}

Значения:

baseURL: Базовый URL для запросов.
string: Строковый тип флага.
int: Целочисленный тип флага.
double: Числовой тип флага с плавающей точкой.
bool: Логический тип флага.

`ValueType<T extends FlagType>`

Тип ValueType используется для определения возможного значения флага в зависимости от его типа. Это условный тип, который определяет, какое значение может принимать флаг в зависимости от его типа FlagType.

Структура:

type ValueType<T extends FlagType> = T extends FlagType.string
  ? string
  : T extends FlagType.bool
    ? boolean
    : number;

Описание:

Если тип флага string, то значение будет строкой.
Если тип флага bool, то значение будет логическим (boolean).
В остальных случаях значение будет числовым (number).

`FCFT<P>`

Интерфейс FCFT описывает функциональный компонент с дополнительным свойством updateFlag(), который передаётся обёрнутому компоненту с использованием withRemoteConfig().

Структура:

interface FCFT<P> {
  (
    props: PropsWithChildren<
      P & {
      updateFlag: () => void;
    }
    >,
    context?: any
  ): ReactElement<any, any> | null;

  propTypes?: WeakValidationMap<P> | undefined;
  contextTypes?: ValidationMap<any> | undefined;
  defaultProps?: Partial<P> | undefined;
  displayName?: string | undefined;
}

Описание:

props: Свойства компонента, которые включают в себя все свойства, передаваемые в компонент, а также функцию updateFlag.
context: Опциональный контекст для компонента.
propTypes: Опциональные типы проверок свойств компонента.
contextTypes: Опциональные типы проверок контекста.
defaultProps: Опциональные свойства по умолчанию для компонента.
displayName: Опциональное отображаемое имя компонента.

Этот интерфейс полезен для определения компонентов, которые будут использоваться с HOC withRemoteConfig() и которым потребуется функция обновления значения флага.

react-native ios android remote yandex appmetrica remote-config yandex-remote-config react-native-remote-config appmetrica-remote-config

11 months ago

11 months ago

11 months ago

11 months ago