Dosya

Делаю запрос на сервер и он падает в ошибку и я хочу понять ,что там произошло, как получить статус кода?

const response = await fetch(`${this.webUrl}/checkConnection/`);
console.log(response.status, 'status') //Вот так получают статус

const getPosts = async () => {
    try {
        const res = await fetch('http://jsonplaceholder.typicode.com/posts')
        const data = await res.json()
        console.log(data, 'array')
    } catch (error) {
        console.log(error)
    }
}

getPosts ()

Важно понимать если данные с API приходят в формате JSON. Чтобы JS дальше смог работать с данными нужно парсить в обычный JS массив или объект с помощью метода await res.json()

Если у тебя сервер стоит node js, то используй эту библиотеку ссылка

но она не смотря на то что вызвана или нет отправляет запросы

Функция просто так не может сработать, чтобы функция сработала нужно вызвать, значит ты где-то вызываешь функцию

Разбираюсь в теме работы с токенами, не могуть понять, как должна работать авторизация по токенам. Если сервер нам присылает токены через Set-Cookie, мы не можем получить к ним доступ с помощью java script, но для дальнейших запросов нам нужно установить заголовок Authorization: `Bearer ${access_token}`

Можно сделать так хранить токен в куки файлах и особенности куки заключается в том чтобы сервер получил куки файлы не нужно писать заголовки. Не знаю какой у тебя сервер стоит, вот в Node js Express куки файлы можно легко получить через req.cookies и при каждом запросе на сервер ты можешь сделать middleware проверка токена

Попробуй метод input.addEventListener('change', () =>{})

Нативный js код лучше добавить в хук useEffect

useEffect(() => {
document.body.onload = function () {
        setTimeout(function () {
            let preloader = document.getElementById('page-preloader');
            if ( preloader.classList.contains('none') ) {
                preloader.classList.add('none')
            }
        }, 1000)
    }
}, [])

const input = document.querySelector('input')

let value = ''

input.addEventListener('change',  () => {
    value = input.value
})

getUsers()
            .then((users) => (this.users = users))
            .then(() => getOrganizations())
            .then((organizations) => (this.organizations = organizations))
            .then(() => this.setState({ loading: false }));

Вот здесь место then лучше использовать await и try catch.

if (this.state.loading) {
      return "Loading...";
    }

    let users = [];

    for (let i = 0; i < this.users.length; i++) {
      const name = this.users[i].name;
      let org;

      for (let j = 0; j < this.organizations.length; j++) {
        if (this.organizations[j].id === this.users[i].organization) {
          org = this.organizations[j].name;
        }
      }

      users.push(
        <div className="user-list-item">
          <div>name: {name}</div>
          <div onClick={() => this.selectOrg(org)}>org: {org}</div>
        </div>
      );
    }

Вот здесь переменные всегда должны быть сверху выше всех

{this.state.selectedOrg && <button onClick={() => this.resetSelectedOrg()}>reset selected org</button>}

Не стоит создавать анонимные функции это плохо влияет на React

for (let j = 0; j < this.organizations.length; j++) {
        if (this.organizations[j].id === this.users[i].organization) {
          org = this.organizations[j].name;
        }
      }

Я одно понять не могу зачем делать такие циклы и использовать как перебор массива, когда есть
for (let i of arr)
Работает как у тебя, но кода будет чище

В целом компомнент не плохой, но написан на классовом компоненте, лучше писать на функиональном компоненте кода будет намного чище

Я так понял это Mongodb, а там нельзя удалять то что тебе не разрешают. Да, эти данные тебе не нужны, но нужны для Mongodb, благодаря этим данным Mongodb понимает логику базы данных

Чтобы поставить дефолтный класс ты можешь место Classlist использовать метод ClassName = "". Так же с помощью этого метода можешь дать класс, просто внутри написав название класса

в JavaScript есть глобальный метод window.scrollTo(). В этот метод принимает опции, один из них это top, это координаты к примеру вы хотите чтобы по нажатие на кнопку экран перемещался вверх.

window.scrollTo({
            top: 0,  // это координат где должен быть экран
            behavior: 'smooth'  //Это анимация
        })