di-example.tsx

di-example.tsx

// общий интерфейс
interface CookieService {
  get(key) {}
  set(key, value) {}
}

// типизированный токен - ключ для реализации интерфейса в DI
const COOKIE_SERVICE = createToken<CookieService>('cookie service');

// серверная реализация
class ServerCookieService implements CookieService {
  get(key) { /** работает с req.cookies */}
  set(key, value) { /** работает с req.cookies */}
}

// клиентская реализация
class BrowserCookieService implements CookieService {
  get(key) { /** работает с document.cookie */}
  set(key, value) { /** работает с document.cookie */}
}

// где-то происходит регистрация подходящей реализации в DI

// используем в любом компоненте
const Component = () => {
  // одинаково работает и на сервере и на клиенте
  const cookieService = useDi(COOKIE_SERVICE);

  return <>foo cookie valu: {cookieService.get('foo')}</>;
}