skills.rest
Witroch4
Witroch4COMMUNITY
Explore all skills by this author →
WebsiteGitHub

mobile-mod-agent-chatwit

Develop an isolated mobile UI module for the Chatwit fork using Vuex stores and API clients.

Updated Aug 23, 2026
Search Tags:#frontend#mobile#pwa#vue.js#chatwit#ui isolation
One-click install
npx skills add https://github.com/Witroch4/witdev-skills --skill mobile-mod-agent-chatwit
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mobile-mod-agent-chatwit
Source: https://github.com/Witroch4/witdev-skills/tree/main/mobile-mod-agent-chatwit
Command: npx skills add https://github.com/Witroch4/witdev-skills --skill mobile-mod-agent-chatwit

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enables the development and maintenance of a completely isolated mobile user interface for the Chatwit fork, ensuring that mobile-specific features and fixes do not impact the stable desktop application.

Core Features & Use Cases

  • Mobile UI Development: Build and extend the mobile-first UI components for Chatwit.
  • Desktop Isolation: Guarantee that all mobile changes are confined to the mobile shell and do not affect desktop functionality.
  • Native Parity: Replicate the look and feel of native mobile applications using existing desktop logic and Vue.js.
  • Use Case: Implement a new swipe gesture on the mobile conversation list to reveal conversation actions, ensuring this gesture is only active on screens smaller than 768px and does not interfere with desktop interactions.

Quick Start

Implement the mobile-only conversation actions screen by reusing existing desktop store logic and Vue components.

Frequently Asked Questions about mobile-mod-agent-chatwit

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I isolate mobile UI components in a Vue.js application from desktop logic?▼

Mobile UI isolation in a Vue.js application is achieved by building a separate mobile presentation layer that reuses existing Vuex stores and API clients without porting desktop business logic. This ensures mobile changes remain confined strictly to the mobile shell.

What is the best way to implement PWA push notifications using VAPID in an isolated mobile web app?▼

PWA push notifications using VAPID in an isolated mobile web app are implemented within the mobile presentation layer. This approach leverages existing API clients to manage subscriptions while keeping the notification logic completely separate from desktop functionality.

Can I reuse existing Vuex stores for a mobile-first interface without affecting the desktop version?▼

Yes, you can reuse existing Vuex stores for a mobile-first interface. The mobile UI isolation approach focuses on creating a distinct presentation layer that mirrors native app behavior while sharing the underlying state management, guaranteeing desktop functionality remains unaffected.

Does mobile UI isolation support integrating mobile-specific i18n bundles?▼

Mobile UI isolation fully supports integrating mobile-specific i18n bundles. The isolated mobile presentation layer can load and manage dedicated internationalization resources independently, allowing tailored localization without interfering with the desktop application's language configurations.

When should I not use a shared store approach for mobile and desktop UI separation?▼

You should avoid relying solely on a shared store approach when desktop business logic dictates specific desktop-only mutations. Mobile UI isolation requires confining mobile-specific features to the mobile shell to prevent unintended side effects on the stable desktop application.

How do I restrict mobile-only gestures like swipe actions to small screens under 768px?▼

Restricting mobile-only gestures to small screens under 768px is handled within the isolated mobile UI module. By confining swipe action implementations to the mobile presentation layer, these interactions remain inactive on larger desktop screens.

Related Skills

Explore More Software Engineering Skills→
mgd34msumgd34msu
4

pinia

Manage Vue.js application state with Pinia stores, getters, actions, and plugins.

Community
Intermediate
JocDLCJocDLC
4

add-mobile

Convert a Next.js web app into an installable PWA with push notifications.

Community
Advanced
ai-enhanced-engineerai-enhanced-engineer
3

vite-pwa-patterns

Configure Vite 5 applications as Progressive Web Apps with offline support.

Official
Advanced
phrazzldphrazzld
13

mobile-migrate

Add an Expo React Native app to an existing web monorepo.

Community
Advanced