import { Meta } from '@storybook/addon-docs/blocks'

<Meta title='@dxtmisha/en/functional/Functions/computedByLanguage - Language-aware computed property'/>

# `computedByLanguage`

Creates a reactive computed property that automatically recalculates when the current language or dependencies within the getters change.

### How it works

The function performs checks in the following order:
1. **Language Check**: Verifies that a language is set via `GeoRef.get().value`.
2. **Conditions Check**: If the `conditions` parameter is provided, it is called for an additional check (e.g., checking permissions or data loading state).
3. **Primary Getter Execution**: If both checks above pass, the `getter` is called. If it returns a value (not `undefined`), that value becomes the result.
4. **Fallback Option**: If any of the checks fail or the `getter` returns `undefined`, the `getterNone` is executed/returned.

**Parameters:**
- `getter: ComputedGetter<R>` — The primary logic for obtaining the value. Called only if the language is set and conditions are met.
- `getterNone: R | (() => R)` — A fallback value or a function returning it. Acts as "Plan B". Default: `() => undefined`.
- `conditions?: () => boolean` — A condition function. Acts as a gatekeeper: if it returns `false`, the main `getter` will not even be triggered.
- `debugOptions?: DebuggerOptions` — Options used for debugging reactive computations, supported by Vue.js.

**Returns:**
`ComputedRef<R>` — A reactive computed property.

```typescript
import { computedByLanguage } from '@dxtmisha/functional'
import { ref } from 'vue'

// Basic usage
const label = computedByLanguage(() => translateKey('hello'))

// With a fallback value
const title = computedByLanguage(
  () => translateKey('page.title'),
  () => 'Untitled'
)

// With an additional condition
const isReady = ref(true)
const content = computedByLanguage(
  () => translateKey('content'),
  () => 'Loading...',
  () => isReady.value
)
```
