Хвастаюсь своим последним проектом — менюшкой настроек моего бота @TgTranslatorBot на базе Веб Приложений!

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

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

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

А еще, есть нативные диалоги, которые можно кастомизировать и вставить в них до 4 разных вариантов, либо же использовать дефолтные пресеты с локализацией. И кнопка снизу, которой можно выбрать произвольный текст, переводить в состояние загрузки и временно отключать.
Так же есть возможность использовать вибрацию, при том гранулярно выбирая ее длительность.
Все это делается через специальный объект, который автоматически добавляется в window.


Немного о моей реализации: использовано по минимуму библиотек. Весь стек это Solid.JS + TS + Vite + CSS Modules. Не сказать, что хотелось пилить свои компоненты, но на солид практически нет готовых вариантов.
Зато работать с ним в целом было приятно. DX получше, чем у реакта, да и концептуально солид проще. 
Все приложение занимает 20kb. Страницы даже не разделены на чанки, чтобы все пункты меню открывались моментально.


Потыкать демку прямо сейчас у себя в Телеграме можно жмякнув по ссылке: https://t.me/TgTranslatorBot/settings?startapp=mock

В комментах не совсем поняли, шо тут написано. Этот метод пытается применить разное поведение вибрации в зависимости от конкретной модели девайса.

Прикол в том, что у разных часов физически разные крутилки.
У пиксель вотчей это маленькая фиговинка сбоку, которая плавно прокручивается. Чтобы создать тактильную отдачу, как например у колеса мыши, используется вибромоторчик.
А у самсунговских Watch 4 Classic крутилка сделана вокруг экрана (безель). И она крутится не плавно, а пошагово, потому вибрация ей нафиг не нужна. Она применяется только когда докручиваешь до конца списка

И этот код совершенно не предусматривает, что могут выйти новые модели. А что самое смешное, в процессе выяснилось, что он работает только на одном размере самсунговских часов! В итоге моя 42мм версия классиков не проходит по регексу

Прикольное