create-feature

CodeHavenX's avatarfrom CodeHavenX

Create a new feature screen in the Edifikana front-end app. Use when asked to create a new screen, feature, or UI component with ViewModel pattern.

⭐0stars🔀0forks📁View on GitHub🕐Updated Jan 8, 2026

When & Why to Use This Skill

This Claude skill automates the creation of front-end feature screens for Kotlin Multiplatform applications. It streamlines the development process by generating standardized boilerplate files—including Screens, ViewModels, UI States, and Tests—following the MVVM (Model-View-ViewModel) architectural pattern. By handling package structure and initial registration, it ensures consistency across the codebase and significantly reduces manual setup time for developers.

Use Cases

  • Rapid Feature Scaffolding: Quickly generate all necessary files for a new UI screen, such as a 'Settings' or 'User Profile' page, with the architectural skeleton pre-configured.
  • Architectural Consistency: Enforce the MVVM pattern across a development team by using standardized templates for state management, event handling, and UI logic.
  • Automated Testing Setup: Automatically create companion unit test files and UI previews alongside new features to encourage immediate verification and high code quality.
  • Boilerplate Reduction: Eliminate repetitive manual tasks involved in creating multiple related files (ViewModel, UIState, Event) for every new application component.
namecreate-feature
description"Create a new feature screen in the Edifikana front-end app. Use when asked to create a new screen, feature, or UI component with ViewModel pattern."
allowed-toolsRead, Write, Edit, Glob, Grep, Bash

Create Feature - Front-End Feature Generator

Purpose

This skill generates the boilerplate files for a new feature screen in our Kotlin Multiplatform front-end application following the established MVVM architecture pattern.

Required Information

Before creating a feature, gather:

  1. Feature name (e.g., "SelectOrg", "AddProperty", "Notifications")
  2. Parent folder. This is the directory where the new package will be created. If the feature is named "AddProperty", the package will be named addproperty. So the parent folder could be edifikana/front-end/shared-app/src/commonMain/kotlin/com/cramsan/edifikana/client/lib/features/ for a path like edifikana/front-end/shared-app/src/commonMain/kotlin/com/cramsan/edifikana/client/lib/features/addproperty/.

Provide the user with some examples of valid feature names and parent folders but DO NOT provide them with options to select from.

Files to Create

For a feature named {FeatureName} in package {packagePath}:

Look at the templates in .idea/fileTemplates/Compose Feature* and create each file by injecting the feature name and package path.

Registration

After creating the files, run through the TODOs in the templates to complete each step. Some files may need to be moved, for example the test files should be moved to the test source set.

Verification

After creating all files, compile and run the tests to ensure everything is set up correctly.

Examples

Example 1: Creating "AddProperty" feature in home

  • Feature name: AddProperty

  • Parent folder: edifikana/front-end/shared-app/src/commonMain/kotlin/com/cramsan/edifikana/client/lib/features/

  • Creating feature AddProperty in package com.cramsan.edifikana.client.lib.features.addproperty

  • Source folder is edifikana/front-end/shared-app/src/commonMain/kotlin/com/cramsan/edifikana/client/lib/features/addproperty/

  • Files created:

    • AddPropertyScreen.kt
    • AddPropertyViewModel.kt
    • AddPropertyUIState.kt
    • AddPropertyEvent.kt
    • AddPropertyViewModelTest.kt
    • AddPropertyScreen.preview.kt
  • Completing tasks in the TODOs in each file.