MrMeison

export const useVideo = (videoRef: RefObject<HTMLVideoElement>, device: MediaDeviceInfo) => {
    const [started, setStarted] = useState(false);
    useEffect(() => {
        if (!videoRef.current || !device) {
            return noop;
        }

        const videoService = new VideoService();

        const start = async () => {

MrMeison

import {useEffect, useState, MutableRefObject} from 'react';
import {Map, TileLayer} from 'leaflet';
import {City} from '../types/city';

function useMap(
  mapRef: MutableRefObject<HTMLElement | null>,
  city: City
): Map | null {
  const [map, setMap] = useState<Map | null>(null);

MrMeison

const Map = (props: PropsMap) => {
    ...
    useEffect(() => {
      if (!map) {
        return;
      }
  
      const layerGroup = new LayerGroup();
  
      points.forEach((point) => {

MrMeison

// Auth провайдер, обертка для прокидывания информации о пользователе
const AuthProvider = ({ children }) => {
  const currentUser = JSON.parse(localStorage.getItem('user'));

  const [user, setUser] = useState(currentUser ? { username: currentUser.username } : null);
  const logIn = (userData) => {
    localStorage.setItem('user', JSON.stringify(userData));
    setUser({ username: userData.username });
  };

MrMeison

const withAcknowledgement = (socketFunc) => (...args) => new Promise((resolve, reject) => {
    let state = 'pending'; // eslint-disable-line
    const timer = setTimeout(() => {
      state = 'rejected';
      reject();
    }, 3000);

    socketFunc(...args, (response) => {
      if (state !== 'pending') return;