Если вы ведёте в Notez что-то, у чего есть жизненный цикл, — список чтения, бэклог, заметки по клиентам, — у вас наверняка есть свойство Статус. Может быть, ещё Исполнитель. Или связь Проект, которая указывает на заметку самого проекта.
И каждый раз, когда нужно было увидеть только заблокированные задачи или только свои, вы открывали окно Фильтр, находили свойство, открывали его список, отмечали значение и закрывали два слоя интерфейса. Три-четыре клика ради вопроса, который вы задаёте двадцать раз в день.
У тегов такой проблемы не было никогда. У них всегда был раздел в боковой панели: по строке на тег, счётчик, клик — и список отфильтрован. Это самый используемый элемент управления в приложении. Напрашивался вопрос, почему он единственный.
Что вышло
Начиная с v0.8.0 любое свойство типа Выбрать, Мультивыбор, Участник или Связь можно показать в боковой панели отдельным разделом. Встроенную Доску тоже. Каждый раздел показывает свои значения строками — цветная плашка для варианта, аватар для человека, значок заметки для связанной заметки, название колонки для доски — и рядом счётчик заметок с этим значением, не считая тех, что в корзине. Клик по строке фильтрует список по ней. Вторая строка в том же разделе добавляет её значение: подойдёт заметка с любым из двух. Строка в другом разделе сужает выборку дальше.
Раздел включается через Ещё → Пользовательские свойства: откройте свойство, включите Показывать в боковой панели, сохраните. Чтобы выключить, наведите курсор на заголовок раздела в боковой панели, нажмите появившуюся маленькую кнопку настроек и выберите Убрать из боковой панели. Само свойство остаётся как было, оно просто исчезает из боковой панели.
Теги включены по умолчанию, потому что так было всегда. Доска по умолчанию выключена: представление доски и так показывает колонки, и вторая копия большинству людей только мешала бы. И то и другое переключается в том же окне.
Боковая панель получила и изменение поменьше, которое оказалось важнее, чем я ожидал: Новая заметка и Главная теперь закреплены сверху, а «Файлы», «Корзина», «Настройки» и «Ещё» — снизу, и прокручиваются только разделы между ними. Если вывести четыре свойства на экране ноутбука, основные действия больше не уезжают за верхний край.
Почему только эти типы
В первом черновике этой функции было «любое свойство». Во втором, через час, — «любое свойство, у которого значения — фиксированный набор», и вышла именно эта версия.
Строка в боковой панели должна быть отдельным значением, по которому можно кликнуть. Вариант списка подходит. Человек подходит. Связанная заметка подходит. Число, дата или строка текста — нет: для фильтра по ним нужен диапазон или запрос, а для этого есть поля в окне «Фильтр». Вынести текстовое свойство в боковую панель значило бы поставить туда поле поиска. Тогда это уже не раздел боковой панели, а второе окно фильтра с вёрсткой похуже.
Для связей понадобилось ещё одно решение. У свойства «Выбрать» фиксированный список вариантов, а «варианты» связи — это любые заметки, на которые кто-то сослался. Их могут быть сотни, и список меняется каждый раз, когда кто-то добавляет ссылку. Если показать их все, раздел станет огромным. Поэтому раздел связи показывает десять заметок, на которые ссылаются чаще всего (без заметок в корзине), по убыванию числа ссылок, а до остальных можно добраться поиском в окне фильтра. Если у вас есть связь Проект, боковая панель покажет проекты, к которым относится больше всего заметок, — почти всегда это те, по которым вы и хотите кликнуть.
С участниками было проще: раздел показывает весь состав рабочего пространства, как и выбор людей в окне фильтра, потому что состав небольшой и ограниченный.
Один фильтр, а не два
Больше всего я следил за тем, чего не видно, когда всё работает: боковая панель и окно «Фильтр» — один и тот же фильтр.
Notez хранит фильтры списка в URL. Так было и раньше — поэтому можно сохранить в закладки «всё с тегом client-x и статусом Заблокировано», — и разделы боковой панели просто пишут туда же, откуда читает окно фильтра. Нажмите Заблокировано в боковой панели, и в окне фильтра Заблокировано окажется отмеченным. Снимите отметку в окне, и строка в боковой панели погаснет. Очистить сбрасывает и то и другое. Нет второго состояния, которое может разойтись с первым, нет «фильтра боковой панели» как понятия, отдельного от «фильтра».
Это решение заодно исправило скрытый баг. В отредактированном вручную или устаревшем URL могло оказаться два токена фильтра для одного свойства, и сервер объединял их через И. Заметка должна была подходить под оба списка, а для свойства типа «Выбрать», где у заметки одно значение, это значило, что не подходит ничего, хотя боковая панель спокойно показывала строку активной. Теперь обработчик клика в боковой панели удаляет все токены своего свойства и записывает ровно один. Окно фильтра и так делало то же самое, им просто нужно было договориться.
Ещё два граничных случая, раз сервер ограничивает список десятью фильтрами по свойствам. Одиннадцатый боковая панель не принимает и показывает то же уведомление, что и окно фильтра. А клик вычисляет следующий URL из текущих параметров роутера, а не из тех, с которыми компонент отрисовался, так что два быстрых клика или клик в боковой панели одновременно с изменением в окне фильтра не могут молча отменить друг друга.
Что вырезало ревью плана
Эту функцию я сначала расписал в документе, ещё до кода, и план прошёл четыре ревью с разными заданиями: корректность, внутренние правила проекта, полнота и «что здесь переусложнено». Последнее оказалось самым полезным, и стоит рассказать, что оно убрало.
Сворачиваемые разделы. В первом плане у каждого раздела была стрелка, а свёрнутое состояние сохранялось для каждого рабочего пространства: мол, несколько разделов вытолкнут низ боковой панели за экран. Ревьюер заметил, что тело боковой панели и так прокручивается независимо от нижнего блока, так что обоснование было просто неверным. Вырезано. (Закреплённый верхний блок, который всё-таки вышел, появился позже, из-за другой, настоящей жалобы.)
Отдельный эндпоинт на сервере. План предлагал новый запрос, который возвращал бы готовые разделы боковой панели: названия, варианты, порядок, счётчики. Ревьюер заметил, что всё, кроме счётчиков, уже есть в списке свойств, который приложение загружает для окна фильтра и окна свойств, а вторая копия названий и вариантов означала бы второй кеш, который может устареть. В итоге вышел один небольшой запрос только за счётчиками, с ключами по id варианта, человека или заметки, а остальное боковая панель берёт из данных, которые у неё уже были.
Ссылка «Настроить боковую панель». Я сделал под разделами ссылку, которая появлялась при наведении и открывала окно свойств. Она попала в сборку для разработки, я посмотрел на неё один раз и убрал в тот же день. Окно и так открывается в один клик из меню Ещё, а элемент, который появляется только при наведении, да ещё внизу прокручиваемой области, никто не находит. Оставшееся меню у каждого раздела решает задачу, которая у людей есть, — убрать вот это отсюда — там, куда они и так смотрят.
Метаданные или колонка. Флаг «показывать в боковой панели» хранится в существующих JSON-метаданных свойства, а не в новой колонке базы данных. Об этом стоит сказать, потому что о таких решениях обычно спорят. По этому флагу никогда не фильтруют в SQL — клиент сам решает, что отрисовать, по списку свойств, который у него уже есть, — так что типизированная колонка не дала бы ничего, кроме миграции. Если это когда-нибудь изменится, переедет флаг, и больше ничего.
Что ещё вошло в релиз
Вместе с работой над боковой панелью вышло ещё несколько вещей.
Избранное. Закреплённые заметки теперь везде называются «Избранное»: в заголовке заметки есть звёздочка, а избранное отмечено залитой янтарной звёздочкой. Раздел в боковой панели скрыт, пока пуст, а отметка звёздочкой больше не вызывает уведомление: звёздочка и раздел и так показывают результат. Горячие клавиши
PиDдля карточек убраны, оба действия теперь в меню карточки.Главная. Верхняя ссылка в боковой панели теперь «Главная», а не «Все заметки». Заголовок страницы по-прежнему «Все заметки».
Назад и вперёд на доске. Когда карточка открыта в панели справа,
JиKтеперь переходят по её колонке. Раньше на доске этих кнопок не было вовсе.Нижний блок аккуратнее. «Импорт», «Пользовательские свойства», «Интеграции» и «Горячие клавиши» спрятаны под переключатель Ещё, который раскрывается вверх, так что сама кнопка остаётся на месте. «Настройки» открываются сразу на вкладке «Рабочее пространство», а отдельного пункта «Рабочее пространство» больше нет.
Синий. Основной цвет сменился с фиолетового на синий во всём приложении, на лендинге и в иконках.
И два исправления. Заголовок панели справа показывал название самой заметки под видом «хлебной крошки», а теперь показывает только путь к родителю. А край свёрнутой боковой панели, за который её вытягивают обратно, перестал реагировать на клики; это тоже исправлено.
Зачем это всё
Смысл свойств никогда не был в самих свойствах. Он в том, чтобы спросить «что заблокировано?» или «что моё?» и получить ответ, не думая об инструменте. Для тегов это всегда был один клик. Теперь один клик и для остального, а поскольку боковая панель и окно фильтра внутри — одно и то же, решать остаётся только одно: где кликнуть.
Включите свойство через Ещё → Пользовательские свойства и посмотрите, перестанете ли вы открывать окно фильтра. Я перестал.
Справка: Пользовательские свойства · Организация заметок · Работа с досками · Список изменений v0.8.0
Читайте также
Ссылка, которую я убрал, и почему она вернулась — v0.8.1 возвращает «Настроить боковую панель» для пустой боковой панели и добавляет «Редактировать свойство» в меню каждого раздела.
Без папок: как Notez организует заметки — теги, вложенные заметки, доски и одиннадцать типов пользовательских свойств, и почему в Notez нет папок.
Список, который вы теряете каждый раз, когда открываете заметку — заметка открывается в панели поверх списка, так что прокрутка и фильтры остаются на месте.