本文へ移動
cccskills
無料GitHub で公開

define-feature-flag

Define a frontend feature flag with `defineFlag` and wire its readers. Use when adding, suggesting, or changing a feature flag, PostHog flag, `ENABLE_*` env flag, `useFeatureFlag`, `isFeatureEnabled`, or `ShowFeatureFlag`.

インストール方法を見る

含まれるファイル(1)

  • SKILL.md3.0 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Define a frontend feature flag

Frontend only. Registry: apps/web/src/lib/core/constant/featureFlags.ts. There is no shared backend flag system.

1. Remote or env-only?

RemoteEnv-only
Source of truthPostHog in deployed envsdefault, optionally overridden by env
Discriminatorkey presentno key
envoptional local overrideoptional override of default
defaultomit / undefined to fall through to PostHogrequired
ReadersuseFeatureFlag, ShowFeatureFlag, isFeatureEnabledisFeatureEnabled only

Most product rollouts are remote. Use env-only when there is no PostHog flag and never will be (compile-time / local kill switch).

Ask before assuming. If the user said "flag it" and did not mention PostHog, prefer remote and confirm.

2. Define it

Add one defineFlag next to its neighbors. Do not add ENABLE_*_FLAG / _OVERRIDE / ENABLE_*() triples or a raw PostHog string at the call site.

  • key (remote): kebab-case, named after the question (enable-foo, disable-browser-turso-cache). Export the object in matching camelCase (enableFoo).
  • env: the name after VITE_, e.g. 'ENABLE_FOO' → VITE_ENABLE_FOO.
  • default: used when env is unset. On a remote flag, false is a real override and skips PostHog. On-in-dev / on-in-local is DEV_MODE_ENV || undefined or LOCAL_ONLY || undefined, not the boolean itself.
  • Never invert on the flag object. If the product question is "disable X", invert at the call site (!isFeatureEnabled(disableX)).
  • Env-only exports that are used as if (ENABLE_FOO) must be the boolean: defineFlag({ env, default }).enabled. The object is always truthy.
export const enableFoo = defineFlag({
  key: 'enable-foo',
  env: 'ENABLE_FOO',
  default: DEV_MODE_ENV || undefined,
});

export const ENABLE_BAR = defineFlag({
  env: 'ENABLE_BAR',
  default: false,
}).enabled;

Do not create the PostHog flag. Ask which project / environment it should live in and wait.

3. Read it

const foo = useFeatureFlag(enableFoo); // component: foo().enabled
<ShowFeatureFlag flag={enableFoo}>{...}</ShowFeatureFlag>
isFeatureEnabled(enableFoo)            // queries, helpers, env-only

A thin useXFlag wrapper around useFeatureFlag(flag) is fine when several call sites share the same read. Compose flags in the wrapper (calendar search requires calendar UI), not on the flag object.

useFeatureFlag / ShowFeatureFlag take a RemoteFlag. Passing an env-only flag is a type error.

Don't

  • Migrate existing FLAG / OVERRIDE / string useFeatureFlag call sites unless you are already changing that flag or were asked to.
  • Invent a second helper (resolveFeatureFlag for new flags, a global flags.foo map, .use() / .Show() on the object).

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Wrap a new backend endpoint in the TypeScript SDK (packages/sdk), or record it as skipped. Use when `just coverage` fails, or after adding an endpoint to a Rust service.

日本語の概要は準備中です。原文の説明を表示しています。

macro-inc/macro4,6382026年10月12日 更新

add-tour

無料

Add or change an in-app feature tour (a view's guided flyover) in the web app. Use when adding a tour to a view, adding or editing tour steps, pointing a step at a new control, or when a step's target needs something opened first.

日本語の概要は準備中です。原文の説明を表示しています。

macro-inc/macro4,6382026年10月12日 更新

Enforce hexagonal architecture in the Rust backend. Use before modifying crates or Rust services, especially inbound axum/tool/listener adapters, domain services/ports, outbound adapters, authorization, permissions, database access, or external clients.

日本語の概要は準備中です。原文の説明を表示しています。

macro-inc/macro4,6382026年10月12日 更新

Enforce hexagonal architecture in the Rust backend. Use before modifying crates/ or Rust services, especially inbound axum/tool/listener adapters, domain services/ports, outbound adapters, authorization, permissions, database access, or external clients.

日本語の概要は準備中です。原文の説明を表示しています。

macro-inc/macro4,6382026年10月12日 更新

Use when adding collaborative markdown, notes, or descriptions to a feature with collab surfaces. Covers parent entities, service entry points, authorization, content storage, and lifecycle.

日本語の概要は準備中です。原文の説明を表示しています。

macro-inc/macro4,6382026年10月12日 更新

Build a new AI tool end-to-end — Rust implementation, toolset wiring, infra, schema generation, and frontend UI.

日本語の概要は準備中です。原文の説明を表示しています。

macro-inc/macro4,6382026年10月12日 更新

macro-inc のスキルをすべて見る

このスキルの問題を報告する