За оффтоп

гайс, как в реселекте замеморайзить только 1 аргумент ?

reselect(s => s, identity => identity) =\

но остальные аргумент ж пропадут

mstp = state => ({ arg: state.arg, memArg: selector(state), })

че ?

и что оно даст ?

Как ты думаешь?

А что надо?

fn(a,b,c){}

надо меморйзить если поменялась а

и что оно даст ?

shallow campare у connect или PureComponent не будет трегерится

в остальных кейсах

не надо ниче делать

mstp = state => ({ arg: state.arg, memArg: selector(state), })

че не так-то?

selector(state)

вынеси эту логику (если она вообще нужна) в ту же сагу

Ну значить 2й вариант. Сохранять в очердь экшены что-бы потом по открытии сокета их выполнить?

при чем мап стейт ту пропс

вообще

и просто делать function componentDidMount() { this.props.dispatch(getMessages()); }

Ну значить 2й вариант. Сохранять в очердь экшены что-бы потом по открытии сокета их выполнить?

в смысле зачем тебе что то сохранять в очередеи?

сделай некий кастомный handshake протокол общения с бакендом

Потому что на этапе маунта сокет еще не открыт и данные не получить

открыл веб сокет, и пусть тебе бакенд шлет некий инициализирующий пакет пока ты его не получишь и не дашь отмашку что все гуд

открыл веб сокет, и пусть тебе бакенд шлет некий инициализирующий пакет пока ты его не получишь и не дашь отмашку что все гуд

Ключевое - "Открыл сокет"

в разных браузерах есть проблема с подпиской на логические каналы

А

в сокетах и в EventSource

часто бывает так, что ты в вебе думаешь что уже открыл вебсокет, а бакенд так не думает еще

и наоборот

я ловил и одну и другую ситуацию

событие типа onopen не канает

при чем мап стейт ту пропс

Расскажи потом, как решил. Может пойму что ты хотел

событие типа onopen не канает

А что тогда?

Именно ответ от сервера?

тип такого, но там надо меморайзер переписывать для реселекта

Типа прислать на клиент ready?

А что тогда?

ну я в итоге свой handshake реализовал бакенд открывает вебсокет и начинает слать в него пакеты каждые 500мс как только фронт подписался на все логические каналы, принимает такой пакетик, так сразу дает бакенду отмашку типа все ок и я готов к приему данных

по крайней мере такая схема во всех браузерах у меня норм работает

а то в сафари свои особенности, в фф и хроме свои

про IE ваще молчу

ну я в итоге свой handshake реализовал бакенд открывает вебсокет и начинает слать в него пакеты каждые 500мс как только фронт подписался на все логические каналы, принимает такой пакетик, так сразу дает бакенду отмашку типа все ок и я готов к приему данных

Окей, в будущем такое сделаю. Спасибо! Но тут немного в другом вопрос

и весь этот зоопарк надо поддерживать

Допустим сервер скажет все ок

данные можно гнать

но

все ок должен сказать не сервер, а браузер

mount component -> dispatch(getMessages()) -> openConnection

да не тащи ты это все в компоненты

делай это в сагах

В сагах инициировать получение сообщений?

ты в компоненте запаришься такие процессы обрабатывать

да все делать надо через саги

компоненты только за отображение информации должны отвечать и интерактив с юзером

Хм, ну тогда сага будет знать что нужно получить сообщения, а если чата на страничке потом не будет?

Окей

Хм, ну тогда сага будет знать что нужно получить сообщения, а если чата на страничке потом не будет?

в каком смысле?

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

а приложение рулит компонентами

логика у тебя должна крутиться параллельно вся

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

Да, я согласен

ERROR: S client not available

в итоге может получиться что то типа такого

Просто с http инициация именно через componentDidMount идет?

т.е. из сокета пришло сообщение в STREAM_INITIALIZE ты отреагировал разок и далее если разрывы соединения будут, то takeEvery это поймает

если будет релогин юзера, то весь процесс будет cancel и потом снова fork

Сейчас как-то так export default function* wsHandling() { while (true) { yield takeLeading('START_WS'); try { const socket = yield call(createWebSocketConnection); const socketChannel = yield call(watchMessages, socket); yield fork(function* saga() { const { cancel } = yield race({ task: [ call(externalListener, socketChannel), call(internalListener, socket), ], cancel: take('STOP_WS'), }); if (cancel) { yield put(connectionClosed()); socketChannel.close(); } }); yield put(connectionOpened()); } catch (e) { console.error(e); yield put(connectionError()); return; } } }

Просто с http инициация именно через componentDidMount идет?

надо четче разделять компоненты от логики

ну у тебя я тут не вижу yield cancel(...)

любой повторный круг событий у тебя форкнет задачи

задублирует их

ну я имею ввиду smart компонент

takeLeading же отработает один раз?

takeLeading же отработает один раз?

оно запустится и будет висеть пока не завершится

потом будет ожидать очередного события

я честно говоря такого паттерна использования не видел

т.е. вот такая запись мне кажется не правильной yield takeLeading('START_WS');

Да я может что-то конечно напутал

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

Тобишь для форка нужен кенсл?

Идеи брал тут https://medium.com/@ebakhtarov/bidirectional-websockets-with-redux-saga-bfd5b677c7e7

Кто работал с react-apollo ?

Тобишь для форка нужен кенсл?

ну если ты форкнул задачу и потом надо ее остановить корректно, то нужно сделать cancel для нее

если у тебя в конструкции try/catch посыпалось там че то, то cancel по моему автоматически будет сделан

ну если ты форкнул задачу и потом надо ее остановить корректно, то нужно сделать cancel для нее

Спасибо) Этот момент упустил)

Пагни и девушки лень самому верстать, подскажите бесплатные ui

Если это вас не сильно затруднит:)

Пагни и девушки лень самому верстать, подскажите бесплатные ui

Adobe Dreamweaver ))))

Adobe Dreamweaver ))))

Спасибочки огромное) сейчас как замучу дизайн

Пагни и девушки лень самому верстать, подскажите бесплатные ui

https://github.com/artalar/blog/blob/master/src/pages/currently-best-ui-kits.md

Ребята. В состоянии хранится массив объектов this.state = {fields: [{id: 'name', name: 'field name', required: true}, ...]} необходимо изменить параметр 'name' через <input name="name" value={this.state.fields[index].name} onChange={ ... } />

Adobe Dreamweaver ))))

он же там выдаст наверное такое