Подключить к клиенту graphql

Question

Подключить к клиенту graphql

Closed this issue a year ago · 37 comments

Amiditin commented a year ago

С чем связан запрос на фичу?

Необходимо добавить для всех страниц graphql запросы

Расскажите как вы это себе видите

Добавить query и mutation запросы на страницы:

DoD (критерий готовности)

На всех страницах проходят quiery и mutation запросы

Приложите пример реализаций

No response

Приложите материалы задачи

https://stage.garnet.pet-project.habr.com/api/sandbox/

Answer 1 · 2023-11-01T12:16:53.000Z

@Nelfimov
Что можно с CORS сделать?

Ошибка:

Access to fetch at 'https://stage.garnet.pet-project.habr.com/api/sandbox' from origin 'http://localhost:3020' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Answer 2 · 2023-11-01T12:43:50.000Z

@picolino посмотришь пожалуйста настройки cors?

Answer 3 · 2023-11-01T18:09:37.000Z

@picolino посмотришь пожалуйста настройки cors?

Готово. На stage можно обращаться с localhost

@Amiditin fyi

Answer 4 · 2023-11-01T21:51:36.000Z

@picolino посмотришь пожалуйста настройки cors?

Готово. На stage можно обращаться с localhost

@Amiditin fyi

@picolino теперь такая ошибка падает:

Access to fetch at 'https://stage.garnet.pet-project.habr.com/api/sandbox' from origin 'http://localhost:3020' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

Answer 5 · 2023-11-02T06:08:02.000Z

@Amiditin проверь еще разок

Answer 6 · 2023-11-02T10:00:19.000Z

@picolino собираем бинго из ошибок, на этот раз:

Chrome v119.0.6045.105:

Access to fetch at 'https://stage.garnet.pet-project.habr.com/api/sandbox' from origin 'http://localhost:3020' has been blocked by CORS policy: Cannot parse Access-Control-Allow-Methods response header field in preflight response.

FIrefox v119.0:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://stage.garnet.pet-project.habr.com/api/sandbox. (Reason: invalid token ‘["POST"’ in CORS header ‘Access-Control-Allow-Methods’).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://stage.garnet.pet-project.habr.com/api/sandbox. (Reason: CORS request did not succeed). Status code: (null).

Answer 7 · 2023-11-02T13:58:48.000Z

@picolino @Demorey @gfg7

При загрузке аватарок падает 404, запрос:

mutation UserUploadAvatar($file: Upload!) {
  userUploadAvatar(input: { file: $file }) {
    id
    avatarUrl
  }
}

Вопросы:

Чтобы получить все команды пользователя у нас есть запрос teamsListByUser, но для проектов аналогичного не нашел, т.е. projectsListByUser, как можно их получить? И такой же вопрос по командам projectsListByTeam.
В payload teamsListByUser не хватает информации о количестве участников и проектов команды, которая необходима для этого ховер эффекта.

Answer 8 · 2023-11-02T14:05:44.000Z

Чтобы получить все команды пользователя у нас есть запрос teamsListByUser, но для проектов аналогичного не нашел, т.е. projectsListByUser, как можно их получить? И такой же вопрос по командам projectsListByTeam.

query ProjectTeamParticipantsFilter - в инпуте айди проекта по которому надо отобрать команды-участников, в списке полученных объектов есть список из объектов пользователей-участников команды с их аватарками

Answer 9 · 2023-11-02T14:14:52.000Z

Чтобы получить все команды пользователя у нас есть запрос teamsListByUser, но для проектов аналогичного не нашел, т.е. projectsListByUser, как можно их получить? И такой же вопрос по командам projectsListByTeam.

query ProjectTeamParticipantsFilter - в инпуте айди проекта по которому надо отобрать команды-участников, в списке полученных объектов есть список из объектов пользователей-участников команды с их аватарками

Этот вопрос про кейс, когда мы на странице пользователя/команды и нам нужно получить список проектов figma. А ProjectTeamParticipantsFilter возвращает информацию о командах для конкретного проекта, верно?

Answer 10 · 2023-11-02T14:20:01.000Z

@Amiditin

При загрузке аватарок падает 404, запрос:

Добавь в запрос header:

GraphQL-preflight: 1

Он нужен по соображениям безопасности, поэтому отдает 404.

Но имей в виду, эндпоинты для взаимодействия с пользователем на редактирование должны выполняться под текущим пользователем. Сейчас у нас кратос не развернут на стейдже, нет нормальной регистрации и авторизации, к бекенду функционал "текущего пользователя" не подключен. Все запросы исполняются от системы. До момента развернутого и работоспособного кратоса с полным функционалом по регистрации и авторизации мы не сможем зафести фукнционал редактирования текущего пользователя.

Answer 11 · 2023-11-02T14:23:09.000Z

Этот вопрос про кейс, когда мы на странице пользователя/команды и нам нужно получить список проектов figma.

Понял о чем ты, этих запросов действительно нет, добавлю

А ProjectTeamParticipantsFilter возвращает информацию о командах для конкретного проекта, верно?

Верно

Answer 12 · 2023-11-02T16:23:27.000Z

@picolino

Добавь в запрос header:

GraphQL-preflight: 1
Он нужен по соображениям безопасности, поэтому отдает 404.

В первый раз запрос прошел успешно, а при следующих выкидывает такую ошибку:

{
  "errors": [
    {
      "message": "Unexpected Execution Error",
      "locations": [
        {
          "line": 2,
          "column": 3
        }
      ],
      "path": [
        "userUploadAvatar"
      ]
    }
  ]
}

Кейс редактирования аватара.

Answer 13 · 2023-11-02T17:42:43.000Z

Кейс редактирования аватара.

@Amiditin фикс на stage

Answer 14 · 2023-11-02T20:45:40.000Z

Чтобы получить все команды пользователя у нас есть запрос teamsListByUser, но для проектов аналогичного не нашел, т.е. projectsListByUser, как можно их получить? И такой же вопрос по командам projectsListByTeam.

@Amiditin добавил запросы ProjectFilterByTeamParticipantId и ProjectFilterByUserParticipantId

Answer 15 · 2023-11-02T22:07:25.000Z

@Demorey запрос teamsListByUser на получение команд пользователя начал выдавать ошибку 500:

Запрос:

query UserGet($id: String!, $skip: Int!, $take: Int!) {
  teamsListByUser(input: { userId: $id, skip: $skip, take: $take }) {
    teams {
      id
      name
      avatarUrl
    }
  }
}

Ошибка:

{
  "errors": [
    {
      "message": "Unexpected Execution Error",
      "locations": [
        {
          "line": 2,
          "column": 3
        }
      ],
      "path": [
        "teamsListByUser"
      ]
    }
  ]
}

Answer 16 · 2023-11-02T22:27:49.000Z

@Demorey запрос teamsListByUser на получение команд пользователя начал выдавать ошибку 500:

если тестили в стейдж, какой userId был

Answer 17 · 2023-11-02T22:31:08.000Z

@Demorey запрос teamsListByUser на получение команд пользователя начал выдавать ошибку 500:

если тестили в стейдж, какой userId был

system

Answer 18 · 2023-11-02T22:34:22.000Z

@Demorey запрос teamsListByUser на получение команд пользователя начал выдавать ошибку 500:

если тестили в стейдж, какой userId был

system

почистила бд, теперь проходит

Answer 19 · 2023-11-02T22:39:27.000Z

2. В payload teamsListByUser не хватает информации о количестве участников и проектов команды, которая необходима для этого ховер эффекта.

судя по дизайну, нужны еще сразу аватарки участников?

Answer 20 · 2023-11-02T23:01:15.000Z

В payload teamsListByUser не хватает информации о количестве участников и проектов команды, которая необходима для этого ховер эффекта.

судя по дизайну, нужны еще сразу аватарки участников?

Да, нужны, хотя бы первые 3

Answer 21 · 2023-11-02T23:46:50.000Z

@Demorey запрос teamsListByUser на получение команд пользователя начал выдавать ошибку 500:

Аналогичная ситуация с projectsFilter

Запрос:

query ProjectFilters($search: String, $skip: Int!, $tags: [String!], $take: Int!) {
  projectsFilter(input: {search: $search, skip: $skip, tags: $tags, take: $take}) {
    projects {
      id
      projectName
      avatarUrl
    }
  }
}

Variables:

{
  "search": "",
  "skip": 0,
  "tags": [],
  "take": 0
}

Answer 22 · 2023-11-03T08:53:17.000Z

@Demorey запрос teamsListByUser на получение команд пользователя начал выдавать ошибку 500:

Аналогичная ситуация с projectsFilter

Тоже подчистил бд, сейчас вроде проходит запрос

Answer 23 · 2023-11-03T10:07:10.000Z

@Amiditin добавил запросы ProjectFilterByTeamParticipantId и ProjectFilterByUserParticipantId

При запросе ProjectFilters возвращается один проект с "ownerUserId": "system":

query ProjectFilters($search: String, $skip: Int!, $tags: [String!], $take: Int!) {
  projectsFilter(input: {search: $search, skip: $skip, tags: $tags, take: $take}) {
    projects {
      id
      projectName
      avatarUrl
      ownerUserId
    }
  }
}
variables
{
  "search": "",
  "skip": 0,
  "tags": [],
  "take": 0
}

При этом запрос projectFilterByUserParticipantId с "id": "system" возвращает пустой массив:

query UserGetProjects($id: String!) {
  projectFilterByUserParticipantId(userId: $id) {
    projects {
      id
      projectName
      avatarUrl
    }
  }
}
variables
{
  "id": "system"
}

Answer 24 · 2023-11-03T10:13:35.000Z

Как я и говорил, у нас не будет адекватно работать функционал, связанный с пользователями, пока мы не настроим корректную регистрацию и авторизацию через kratos.

Предлагаю пока что жить на моках. В процессе сейчас добавление регистрации пользователей на бекенде, как закончим - полностью почистим базу (чтобы все было консистентным) и можно будет норм пользоваться и тестить.

Answer 25 · 2023-11-03T12:38:02.000Z

@Demorey @gfg7
Для запросов teamParticipantFilter, teamUserJoinRequestsShow, teamJoinInvitationsShow можно в респонс добавить полностью информацию о пользователе? (имя, аватар, теги)

Answer 26 · 2023-11-03T20:01:54.000Z

@Amiditin

Для запросов teamParticipantFilter можно в респонс добавить полностью информацию о пользователе? (имя, аватар, теги)

не вижу в дизайне показа тегов для списка участников, будут правки?

имя, аватар

добавлено в рамках #223

teamUserJoinRequestsShow, teamJoinInvitationsShow

добавлю

Answer 27 · 2023-11-03T20:08:22.000Z

не вижу в дизайне показа тегов для списка участников, будут правки?

Да, для списка участников теги не нужны.

Answer 28 · 2023-11-06T13:57:28.000Z

@Nelfimov
Зарегался на stage, запросы c /api/sandbox проходят, но с локалхоста нет 401, куки добавлены и идентичны stage. Что-то ещё нужно сделать?

Answer 29 · 2023-11-06T16:06:14.000Z

@Nelfimov
Зарегался на stage, запросы c /api/sandbox проходят, но с локалхоста нет 401, куки добавлены и идентичны stage. Что-то ещё нужно сделать?

Попробуй порт поменять на 3000 у приложения для локальной разработки. Иначе призываем бэк.

Answer 30 · 2023-11-06T16:23:59.000Z

Проблема в том, что куки в браузере указываются для текущей страницы (localhost).
И при запросах на стейдж автоматически не передаются, так как другой домен. Секьюрити.

Если выполнять запросы напрямую с куками из curl или postman - все будет ок. Нужно курить доку\конфиги чтобы все заработало. Если вообще так можно

Answer 31 · 2023-11-07T10:18:02.000Z

@picolino @Nelfimov Как можно получить id авторизованного пользователя?

Answer 32 · 2023-11-07T10:20:40.000Z

@Amiditin id можешь получить из kratos: https://www.ory.sh/docs/kratos/reference/api#tag/frontend/operation/toSession

Answer 33 · 2023-11-07T10:34:27.000Z

@Amiditin возможно с нашего бэка можно вытащить - они же делают у себя дубликат id пользователя.

Answer 34 · 2023-11-07T10:35:41.000Z

Эндпоинта на получение текущего юзера мы не делали, вся нужная инфа по текущему пользаку есть в кратосе, эндпоинт указали выше

Answer 35 · 2023-11-07T10:59:07.000Z

@Amiditin id можешь получить из kratos: https://www.ory.sh/docs/kratos/reference/api#tag/frontend/operation/toSession

@Nelfimov Откуда мне взять flow.id? в useFlow ничего не лежит

Answer 36 · 2023-11-07T11:05:41.000Z

@Amiditin А зачем тебе flow.id? Там обычный запрос на эндпоинт с текущими куками кратоса

Answer 37 · 2023-11-07T21:46:15.000Z

teamUserJoinRequestsShow, teamJoinInvitationsShow можно в респонс добавить полностью информацию о пользователе? (имя, аватар, теги)

#225