Skip to content

Правила и переопределения

Контекстные правила

Правила — это функции, вычисляемые реактивно. Приоритет: ниже URL-переопределений и setFlag, выше loader/статики.

ts
app.use(FeatureToggles, {
  rules: {
    darkMode: () => window.matchMedia('(prefers-color-scheme: dark)').matches,
    liveChatWidget: () => {
      const h = new Date().getHours()
      return h >= 9 && h < 18
    },
    devFeatures: () => document.cookie.includes('internal=1'),
  },
})

Правила можно переопределить через setFlag() или URL-параметр.

URL-переопределения

Когда urlOverrides: true, query-параметры переопределяют значения флагов без перезагрузки страницы.

https://app.example.com/?feature:newDashboard=true&feature:checkoutFlow=v2

Переопределение переменных:

?feature-var:newCheckout:maxItems=10

Пользовательский префикс (urlPrefix: 'ft'):

?ft:newDashboard=true

Порядок приоритета (от высшего к низшему)

URL-переопределение → runtime setFlag() → правила → loader → статические флаги → defaultValue

Персистентные переопределения

По умолчанию setFlag живёт только в памяти. Передайте { persist: true }, чтобы сохранить в localStorage:

ts
const { setFlag, clearPersistedFlags, isPersisted } = useFeatureProvider()

setFlag('darkMode', true, { persist: true })
// Значение переживает перезагрузки страницы

isPersisted('darkMode') // → true

clearPersistedFlags() // удалить все персистентные переопределения

Профили переопределений

Именованные наборы переопределений, хранимые в localStorage — полезны для QA, демонстраций и дизайн-ревью.

ts
const { saveProfile, loadProfile, listProfiles } = useFeatureProvider()

saveProfile('demo-mode', {
  newDashboard: true,
  betaSearch: true,
  maintenanceMode: false,
})

loadProfile('demo-mode') // применяет все флаги профиля как runtime-переопределения
loadProfile('default') // сброс к исходным значениям (вызывает resetAll)

listProfiles() // → ['demo-mode']

Панель <FeatureDevTools> показывает выпадающий список профилей, когда они существуют.