Skip to content

Conversation

@Giovaaanniii
Copy link

  1. Добавить кнопки "лайк" и "дизлайк" со счетчиками (дизайн) в карточку отзыва (TheReviewCard.vue)
  2. Забираем значения лайков и дизлайков из пропа comment.
  3. На каждую из кнопок на событие клик навесить хендлер.
  4. Для ручки требуется два параметра (params: { path: { uuid, reaction } }). uuid берется из свойства пропа: comment.raw.uuid. reaction: "like" | "dislike" нужно вписать в зависимости от хендлера.
  5. Отправить запрос с методом PUT (apiClient.PUT). Пока что библиотека это распознает как ошибку, и тесты проходиться не будут, но функционал будет работать -- ждем выкатки бэка на прод, чтобы это все пофиксилось.
  6. Если вернулось все успешно: меняем стиль кнопки на заполненный, обновляем счетчик. Если случилась ошибка: пока что вывести в консоль.

@BatuevIO BatuevIO force-pushed the review_card__reaction_buttons branch from d085591 to 4d6e7a4 Compare November 3, 2025 17:09
like_count.value = response.data?.like_count;
dislike_count.value = response.data?.dislike_count;
if (action === 'like') {
like_count.value = response.data?.like_count;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Если пользователь неавторизован и тут есть ошибка, то значение становится undefined, что не очень хорошо. Лучше при отсутствии ответа откатываться на значения до запроса -- либо проверять на то, что data вообще существует до обновления UI, либо через ?? писать.

У меня try-catch не работает -- в консоль 403 выводится как непойманная. Поэтому может быть лучше переписать через

const { data, error } = await apiClient ... 
if (error) {
  something;
  return;
}
что-то с датой, тут она точно есть.
image

<v-btn
class="px-0 pl-4"
style="max-width: 51px; min-width: 51px;"
style="max-width: 51px; min-width: 51px"
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

prettier убрал

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

А чего не просто width?

uuid: propsLocal.comment.raw.uuid,
reaction: action,
},
const response = await apiClient.PUT('/rating/comment/{uuid}/{reaction}', {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ну, в целом ок. Но вообще я вроде говорил, что можно писать

const {response, data, error} = await apiClient...

Можешь в любом другом запросе глянуть. Будет более читаемо.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Да и response можно не забирать, если он тебе не нужен. А обычно у нас он нужен только если код ответа нужен зачем-то.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants