Što su state machines i kada pomažu?

Question

Accepted Answer

**State machine** modelira sustav kao konačan skup **stanja** plus dozvoljene **prijelaze** između njih. Umjesto da se nosite s neovisnim boolean zastavicama, točno definirate koja stanja postoje i koji su prijelazi legalni — čineći nemoguća stanja nepredstavljivim.

## The problem: boolean soup

```js
// ❌ multiple booleans → 2^n combinations, many of them invalid
const [isLoading, setLoading] = useState(false);
const [isError, setError] = useState(false);
const [isSuccess, setSuccess] = useState(false);
// { isLoading: true, isError: true, isSuccess: true } — nonsense, but POSSIBLE
```

S neovisnim zastavicama, ništa ne zaustavlja proturječne kombinacije, i trebate ih ručno održavati dosljedno na svakom prijelazu — magnet za greške.

## The state-machine model

```text
States:      idle → loading → success
                       ↓
                     error → (retry) → loading

Only defined transitions are allowed; you can't be in two states at once.
```

```js
const machine = {
  idle:    { FETCH: "loading" },
  loading: { SUCCESS: "success", ERROR: "error" },
  success: { FETCH: "loading" },
  error:   { RETRY: "loading" },
};
function transition(current, event) {
  return machine[current][event] ?? current; // only legal transitions happen
}
```

Jedna varijabla `state` drži trenutno stanje; `event` pokreće *definirani* prijelaz. Nelegalni prijelazi (npr. SUCCESS dok je u mirovanju) jednostavno se ne mogu dogoditi — nemoguća stanja su nestala prema dizajnu.

## Real-world tooling: XState

```js
// libraries like XState formalize this with guards, actions, nested/parallel states
const toggleMachine = createMachine({
  initial: "inactive",
  states: {
    inactive: { on: { TOGGLE: "active" } },
    active:   { on: { TOGGLE: "inactive" } },
  },
});
```

## When state machines help

```text
✓ Complex flows with many states: checkout, multi-step forms/wizards, media players
✓ Authentication flows (logged out → logging in → logged in → refreshing)
✓ Anything where invalid state combinations cause bugs
✗ Overkill for simple toggles or trivial state
```

## Zašto je to važno

State machines donose strogoću kompleksnoj logici s stanjem čineći **nemoguća stanja nemogućim** i prijelaze **eksplicitnim** — zamjenjujući krhke kombinacije boolean vrijednosti jasnim, iscrpnim modelom.

Osobito su vrijedni za komplicirane tokove (čarobnjaci, plaćanja, provjera autentičnosti, mediji) gdje boolean nered vodi do suptilnih, teško reproducibilnih grešaka.

Čak i neformalno (enum `status`) ideја poboljšava async stanje; formalno (XState) pruža logiku koja se može vizualizirati, testirati i biti robusna.

Znati kada ih koristiti je znak zrele konfiguracije stanja.