зря я не отправил сообщение, моя либа разрабатывалась с расчётом, что любые мутации стора будут инкапсулированы в логику (функции) и стоять за каким-то EE связывающим логику и вью

т.е. нет, не разрешаю

а такое store.set(todos([1, 2, 3]).completed, true) эта строчка установит значение completed у элементов массива(или Map) todos с айди 1, 2 и 3

Магия(

)))

только ошибся store.set(todos([1, 2, 3], e => e.completed), true)

Ну, уже понятнее, но всё равно жесть.

ОК, не жесть. Непривычно.

только ошибся store.set(todos([1, 2, 3], e => e.completed), true)

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

да, скорее не привычно, теперь представь, что есть какая-то эвент шина, в ней событие markCompleted в пейлоаде number или number[], на событие подписана функция: function markCompleted(payload) { store.set(todos(payload, e => e.completed), true); } теперь можно выделить несколько элементов и нажать кнопку completed

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

не понял, а массив может быть только из number, string, и что там ещё?

структура стора следующая: { todos: [ { completed } ] }

не понял, а массив может быть только из number, string, и что там ещё?

Нет, просто твой синтакси спросто провоцирует делать структуры с огромной вложенностью. Работать то удобно.

если удобно, почему нет?

если удобно, почему нет?

полностью оправдан

да, скорее не привычно, теперь представь, что есть какая-то эвент шина, в ней событие markCompleted в пейлоаде number или number[], на событие подписана функция: function markCompleted(payload) { store.set(todos(payload, e => e.completed), true); } теперь можно выделить несколько элементов и нажать кнопку completed

Ну, хз. Я бы предпочёл явно записать что-то типа todos.filter().map()

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

Cbynfrcbc dpzn bp ujkjds/

если удобно, почему нет?

Мне кажется, что в итоге люди всё же вернутся к куче маленьких сторов, где синтаксис oldStore => newStore предпочтительнее, имхо.

Ну, хз. Я бы предпочёл явно записать что-то типа todos.filter().map()

можно и так, почему нет: store.set(todos, todos => todos.filter().map())

ну суть в том, что можно изолированно работать с частями состояния не зная о внешнем мире, т.е. создавать фичи

Ну, ок. Моя позиция заключается в том, что сторы должны быть маленькими и нельзя пользователю позволять больше, поэтому oldStore => newStore не то что оправдано - оно необходимо.

Ну, ок. Моя позиция заключается в том, что сторы должны быть маленькими и нельзя пользователю позволять больше, поэтому oldStore => newStore не то что оправдано - оно необходимо.

Согласен полностью

А во вложенности собирать computed сторами

эффекторнулись

эффекторнулись

Ну, я нокаутнулся)

сопротивляться бесполезно, победитель очевиден

я сдаюсь

А во вложенности собирать computed сторами

А что такое вложенность в твоём понимании?

А что такое вложенность в твоём понимании?

зря ты..

сопротивляться бесполезно, победитель очевиден

Нет. У твоего решения есть огромное преимущество перед эффектором -это локальность.

А в остальном да, всё печально)

Ну собрать todos из соответствующих text, complete итд

локальность, это типа, что оно подходит только мне?

Ну собрать todos из соответствующих text, complete итд

О, ты тоже наркоман)

локальность, это типа, что оно подходит только мне?

Нет. Не только тебе. Я сравнил с эффетором.

Ну собрать todos из соответствующих text, complete итд

ты не понял, берёшь строку const store0 = createStore() копируешь ровно столько раз, сколько у тебя глобальных переменных(в том числе в виде объектов) в приложении, потом, переименовываешь store0 в соотвествии с назначением и распихиваешь эти сторы там, где они нужны

ну ещё можно как акторы их представлять со своим набором событий и редьюсерами

ты не понял, берёшь строку const store0 = createStore() копируешь ровно столько раз, сколько у тебя глобальных переменных(в том числе в виде объектов) в приложении, потом, переименовываешь store0 в соотвествии с назначением и распихиваешь эти сторы там, где они нужны

эм

вообще я имел в виду делать так const ids = createStore(new Set) const text = createStore(new Map) const complete = createStore(new Map) const todos = combineByIds(ids, { text, complete })

да мы поняли

Не будет.

ну вот я покинул компонент и он размонтировался, а к тому времени then отработал и this.setState срабатывает. реакт же кидает ошибку в таком случае

ну вот я покинул компонент и он размонтировался, а к тому времени then отработал и this.setState срабатывает. реакт же кидает ошибку в таком случае

Предупреждение.

и его можно не парясь игнорить?

Лучше не игнорить, а прерывать запросы.

Кто-нибудь использовал Redux-ORM?

Сильно тормозит?

@MyNameIsLiberty вроде эксперт в ней

Подытожу косяки драфта Если делать кастомные атомарные блоки - Результат тяжело превратить в строку по той причине, что “текст” блока должен состоять из одного символа, иначе придется X раз жать delete, чтобы его удалить. Пропсы блока получаются через костыли - Если нажать delete перед атомарным блоком, он почему-то становится обычной строкой. (Ишью об этом висит 2 года) - Невозможно получить selectionState внутри компонента блока. Это означает, что невозможно нормальным образом определить, выделен ли он вообще или нет Если делать декораторы - Нет возможности сделать декорированный блок “immutable” (типа удалять блок целиком при нажатии delete). Это, в общем-то, логично, но в виду такой захардкоженности блоков и тяжести работы с ними, было бы клево добавить такую возможность Фразой “Low-level API” разработчики пытаются оправдать архитектурные костыли, которые нагородили и не могут теперь исправить В либе куча всяких Modifier, AtomicBlocksUtils, RichUtils, KeyBingingUtils, но когда начинаешь что-то делать, понимаешь, что даже этого недостаточно

А, еще забыл Отсутствует API для плагинов. Есть draft-js-plugins, кастомный компонент редактора, который принимает проп plugins. Но это, сами понимаете, жопа. При этом сорсы плагинов километровые, абсолютно нечитаемые, абсолютно непонятные

ну да, там пиздец, это ещё на разных браузерах по разному всё работает

Из косяков slate - не дописана (или не раскрыта) дока по сущностям, коих в библиотеки почти 20. НО это на все 100% компенсируется тем, что главная страница состоит из аж 23 примеров использования. Из этого следует, что практически любую фичу можно просто скопировать из сорсов примеров и воткнуть (что я, собственно, и сделал). Сорсы при этом понятные и читаемые, очень понравилась фишка с изменением стейта через чейнинг change Плагины из коробки, onChange, renderNode и остальные хуки работают как мидлвари - передается next Любое действие можно сделать встроенными методами - перенос курсора, замена текста на определенном куске, вставка блока, удаление, разбиение - вообще все. При этом можно создать command - шорткат, в который прокидывается change, там можно описать цепочку действий и так же юзать в цепочках

Очень понравилось наличие всевозможных moveAnchorToEndOfBlock, moveOffsetTo, moveToStartOfText итд

Из косяков slate - не дописана (или не раскрыта) дока по сущностям, коих в библиотеки почти 20. НО это на все 100% компенсируется тем, что главная страница состоит из аж 23 примеров использования. Из этого следует, что практически любую фичу можно просто скопировать из сорсов примеров и воткнуть (что я, собственно, и сделал). Сорсы при этом понятные и читаемые, очень понравилась фишка с изменением стейта через чейнинг change Плагины из коробки, onChange, renderNode и остальные хуки работают как мидлвари - передается next Любое действие можно сделать встроенными методами - перенос курсора, замена текста на определенном куске, вставка блока, удаление, разбиение - вообще все. При этом можно создать command - шорткат, в который прокидывается change, там можно описать цепочку действий и так же юзать в цепочках

Блин. Мне нужен редактор с плагинами

Ищу не могу найти (

Это для чего

Slate?

Это для чего

Я делаю редактор команд У команд есть переменные - { codename, name } - Их нужно визуально выделять. Конвертить строку Hello, %foo% в Hello, Foo (где foo - codename, Foo - name) - Если нет переменных - отображать как строку - Удалять только целиком - Менять фон при выделении - Автоматически заменять на переменную, если написать Hello, %foo - Возможность втыкать переменные нажатием на кнопки на место курсора

Slate?

Да, это slate

Я делаю редактор команд У команд есть переменные - { codename, name } - Их нужно визуально выделять. Конвертить строку Hello, %foo% в Hello, Foo (где foo - codename, Foo - name) - Если нет переменных - отображать как строку - Удалять только целиком - Менять фон при выделении - Автоматически заменять на переменную, если написать Hello, %foo - Возможность втыкать переменные нажатием на кнопки на место курсора

По итогу, единственное, что я написал “руками” - конвертацию стейта обратно строку + определение позиции открывающего % (для предпоследнего пункта)

ERROR: S client not available

Хипер даже

ага

https://t.me/this_week_in_react/20

Я делаю редактор команд У команд есть переменные - { codename, name } - Их нужно визуально выделять. Конвертить строку Hello, %foo% в Hello, Foo (где foo - codename, Foo - name) - Если нет переменных - отображать как строку - Удалять только целиком - Менять фон при выделении - Автоматически заменять на переменную, если написать Hello, %foo - Возможность втыкать переменные нажатием на кнопки на место курсора

Подскажешь по слейту если что?

Сильно тормозит?

У меня без тормозов все летает.

Подскажешь по слейту если что?

Только учти, что я сам только сегодня начал))

Только учти, что я сам только сегодня начал))

кек

а что там с визуальной кастомизацией?

Ну, блоки = компоненты. Кастомизируй, как хочешь)

https://www.slatejs.org Тут тонна примеров, в общем-то

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

styled components позволяет сделать что-то вроде: props => props.header ? `@media (min-width: 600px) { display: none; }` ?

styled components позволяет сделать что-то вроде: props => props.header ? `@media (min-width: 600px) { display: none; }` ?

да.

но этот вариант говно

Что-то не работает, только если display: ${props => props.header ? 'none': 'block'};

Что-то не работает, только если display: ${props => props.header ? 'none': 'block'};

пришли код

export const Logo = styled(Typography)` max-width: 120px; padding-right: ${theme.spacing.unit * 2}px; ${(props: any) => props.header ? ` ${theme.breakpoints.down('xs')} { display: none !important; }` : '' } `;

если убрать функцию, то все ок

export const Logo = styled(Typography)` max-width: 120px; padding-right: ${theme.spacing.unit * 2}px; ${(props: any) => props.header ? ` ${theme.breakpoints.down('xs')} { display: none !important; }` : '' } `;

должно работать по идее

попробуй тогда функцию внутрь media засунуть

странно

export const Logo = styled(Typography)` max-width: 120px; padding-right: ${theme.spacing.unit * 2}px; ${(props: any) => props.header ? ` ${theme.breakpoints.down('xs')} { display: none !important; }` : '' } `;

export const Logo = styled(Typography)` max-width: 120px; padding-right: ${theme.spacing.unit * 2}px; ${(props: any) => props.header ? css` ${theme.breakpoints.down('xs')} { display: none !important; }` : '' } `;

попробуй так

(добавил css)

Кстати, еще вопрос, по поводу nextjs. при запуске next и рекомпиле при каких-то изменениях + обновление страницы (с хот релоад все ок) Warning: Prop d did not match. Server: "M 0 0 h 24 v 24 H 0 V 0 Z" Client: "M0 0h24v24H0V0z" И такие же ошибки с классами MUI Как с этим бороться?

а css откуда берется?

импортируешь из стайледов

ок, спс

Есть какие примеры по структуре приложения react+mobx? Как это правильно делать

Что лучше всего испльзовать чтобы изменять состояние хранилища?

экшены