@graphql_ru
GraphQL — русскоговорящее сообщество

Общаемся на темы, посвященные GraphQL и опыту его использования. Проблемы. Новости. Решения. Вам могут быть полезны: @apollo_ru, @react_js, @vuejs_ru Рекомендуем сразу отключить уведомления, чтобы пребывание в чате было полезным и комфортным.

352 members

Архив канала @graphql_ru 11 марта 2018 г.

12:13:32 ПП
User 446660471
Joao Pedro:
“O GraphQL resolve!! (Parte I)” @zerocowl https://medium.com/@zerocowl/graphql-resolve-pt1-72697a655917
medium.com/@zerocowl/graphql-resolve-pt1-72697a655917
Não podemos falar de uma solução sem antes conhecer um problema, que neste caso vai ser listar todos os alunos de uma escola e criar um…
12:25:40 ПП
User 128597654
Я пробую Relay после Apollo на клиенте и не совсем понятно как обновить список после мутации

const tagMutation = {
  createTag: (environment, input) => {
    return new Promise((resolve, reject) => {
      commitMutation(environment, {
        mutation: createTagMutation,
        variables: { input },
        onCompleted(response, errors) {
          console.log('onCompleted', response);
          if (errors) {
            reject(errors[0]);
          } else {
            resolve(response.createTag.tag);
          }
        },
        onError: reject,
        updater: store => {
          // ??
        },
      });
    });
  },
};


Сам список
export default createFragmentContainer(
  withStyles(styles)(CreateTag),
  graphql`
    fragment CreateTagAdmin on Query {
      tags {
        id
        slug
        title
      }
      me {
        id
        firstName
        lastName
        avatarPreview
      }
    }
  `,
);


В аполло для этого есть typeName:id и стор сам знает что обновить, а как в релей этого достичь?
12:27:16 ПП
User 178361440
http://facebook.github.io/relay/docs/en/mutations.html#range-add
facebook.github.io/relay/docs/en/mutations.html
Table of Contents:
12:27:19 ПП
User 224769697
А чем аполло не подошел, если не секрет?)
12:28:16 ПП
User 128597654
User 178361440
http://facebook.github.io/relay/docs/en/mutations.html#range-add
facebook.github.io/relay/docs/en/mutations.html
Table of Contents:
Спасибо. Так и думал. Но не был уверен что именно такой путь. Буду разбираться
12:30:48 ПП
User 128597654
User 224769697
А чем аполло не подошел, если не секрет?)
Аполло нравится, уже сделал два проекта с ним. Только для того чтобы делать проект с стартером от Константина нужен релей. Он конечно сложнее...
12:31:35 ПП
User 91770096
как вы вообще дебажите эти апдейтер конфиги?
12:31:57 ПП
User 91770096
пишешь конфиг — ничего не работает — никаких варнингов, ничего
12:32:39 ПП
User 224769697
А чем хорош стартер от Константина?)
12:33:10 ПП
User 128597654
User 224769697
А чем хорош стартер от Константина?)
https://github.com/kriasoft/react-firebase-starter
github.com/kriasoft/react-firebase-starter
Boilerplate (seed) project for creating web apps with React.js, GraphQL.js and Relay - kriasoft/react-firebase-starter
12:40:34 ПП
User 128597654
User 91770096
пишешь конфиг — ничего не работает — никаких варнингов, ничего
сейчас буду тестировать 🙂
01:24:06 ПП
User 128597654
А в Relay для мутации типа RANGE_ADD, что является parentID? Если у меня это не connection, а просто список

graphql`
    fragment CreateTagAdmin on Query {
      tags {
        id
        slug
        title
      }
    }
  `,
01:29:24 ПП
User 91770096
зависит от того что ты хочешь
скажем у тебя есть на странице

item {
  tags { }
}

и ты хочешь добавить новый тег в список 
то парент айди будет item.id
01:29:41 ПП
User 91770096
тот что глобал айди
01:30:14 ПП
User 91770096
или рут
01:30:25 ПП
User 128597654
User 91770096
тот что глобал айди
аа, а если tags глобальные?
01:30:38 ПП
User 91770096
client:root
01:31:05 ПП
User 128597654
тогда получается так? 

const configs = [
  {
    type: 'RANGE_ADD',
    parentID: 'root',
    connectionInfo: [
      {
        key: 'CreateTagAdmin',
        rangeBehavior: 'append',
      },
    ],
    edgeName: 'tag',
  },
];
01:32:06 ПП
User 128597654
а что тогда edgeName должно быть?
01:34:59 ПП
User 213453025
конфиги для коннекшинов
01:35:33 ПП
User 128597654
User 213453025
конфиги для коннекшинов
а как тогда быть, если это не коннекшн?
01:35:51 ПП
User 213453025
там можно вручную стор обновлять
01:36:01 ПП
User 213453025
конфиги упрощение для коггекшинов
01:36:08 ПП
User 128597654
User 213453025
там можно вручную стор обновлять
через updater?
01:36:08 ПП
User 213453025
чтобы самому не писать
01:36:28 ПП
User 213453025
ну там что-то есть
01:36:58 ПП
User 213453025
у меня конфиги не работали я вручную делал
01:37:19 ПП
User 213453025
потом разрулил конфиги, они конечно да стремные что ничего не выдают
01:37:26 ПП
User 213453025
или работают или нет
01:37:54 ПП
User 128597654
да уж. Вот тут коллега 11 дней разбирался с этим https://github.com/facebook/relay/issues/2157
github.com/facebook/relay/issues/2157
Hi, The docu here: https://facebook.github.io/relay/docs/mutations.html#range-add suggests to use configs to configure the store updating mechanism. Unfortunately it is unclear to me what the paren...
01:39:07 ПП
User 128597654
правда там для коннекшна
01:39:11 ПП
User 91770096
User 128597654
тогда получается так? 

const configs = [
  {
    type: 'RANGE_ADD',
    parentID: 'root',
    connectionInfo: [
      {
        key: 'CreateTagAdmin',
        rangeBehavior: 'append',
      },
    ],
    edgeName: 'tag',
  },
];
client:root
01:39:33 ПП
User 213453025
у меня проблема была что в коннекшн директиву аргумент фильтров не передал
01:39:42 ПП
User 213453025
нужно хотя бы filters: []
01:39:56 ПП
User 213453025
без это не будет работать, что конечно очень глупо
01:40:18 ПП
User 91770096
интересно, лучше ли дела в аполо сейчас обстоят?
01:40:38 ПП
User 128597654
User 91770096
интересно, лучше ли дела в аполо сейчас обстоят?
да, там на много проще все это делается
01:40:39 ПП
User 91770096
рилей очень плохо документирован
01:40:48 ПП
User 213453025
у каждого решения свои +/-
01:40:57 ПП
User 91770096
половина всего исправляется методом тыка
01:40:59 ПП
User 213453025
нет такого что аполло во всем лучше
01:41:19 ПП
User 213453025
User 91770096
рилей очень плохо документирован
ну как и новая версия аполло
01:41:53 ПП
User 128597654
const configs = [
  {
    type: 'RANGE_ADD',
    parentID: 'client:root',
    connectionInfo: [
      {
        key: 'tags',
        rangeBehavior: 'append',
      },
    ],
    edgeName: 'tag',
  },
];

const tagMutation = {
  createTag: (environment, input) => {
    return new Promise((resolve, reject) => {
      commitMutation(environment, {
        mutation: createTagMutation,
        variables: { input },
        onCompleted(response, errors) {
          console.log('onCompleted', response);
          if (errors) {
            reject(errors[0]);
          } else {
            resolve(response.createTag.tag);
          }
        },
        onError: reject,
        updater: store => {
          console.log('store', store);
        },
        configs,
      });
    });
  },
};

export default createFragmentContainer(
  withStyles(styles)(CreateTag),
  graphql`
    fragment CreateTagAdmin on Query {
      tags {
        id
        slug
        title
      }
      me {
        id
        firstName
        lastName
        avatarPreview
      }
    }
  `,
);

Вот что получилось, но ничего не обновляется
01:42:39 ПП
User 213453025
чувак, я же написал
01:42:46 ПП
User 213453025
конфиги для коннекшинов
01:42:52 ПП
User 213453025
у тебя просто список
01:43:03 ПП
User 128597654
User 213453025
чувак, я же написал
пойду пробовать через updater
01:43:20 ПП
User 213453025
в конфиге даже указано >connectionInfo
01:46:11 ПП
User 128597654
самое забавное, что в документации написано что должно само происходить обновление 

updater: Function used to update the local in-memory store based on the real server response from the mutation. If updater is not provided, by default, Relay will know to automatically update the fields on the records referenced in the mutation response; however, you should pass an updater if you need to make more complicated updates than just updating fields (e.g. deleting records or adding items to collections).
01:47:00 ПП
User 213453025
это только для редактирования
01:47:06 ПП
User 213453025
как и аполло в принципе
01:47:17 ПП
01:47:19 ПП
User 213453025
добавление/удаление самому
01:47:42 ПП
User 128597654
спасибо!
01:48:47 ПП
User 128597654
ребят, если бы не вы, я бы по 10 дней тратил как тот коллега на поиски решений.
02:31:10 ПП
User 128597654
сделал. Вот что получилось.

updater: (store: RecordSourceSelectorProxy) => {
          const payload = store.getRootField('createTag');
          const tag = payload.getLinkedRecord('tag');
          const root = store.getRoot();
          const rootTags = root.getLinkedRecords('tags') || [];
          const newRootTags = [tag, ...rootTags];
          root.setLinkedRecords(newRootTags, 'tags');
        },