generic-provider

Scaffolds React context providers with useReducer and redux-actions from ABP backend DTOs.

Updated Mar 26, 2026
One-click install
npx skills add https://github.com/AryanMohanlall/SafeGuard --skill generic-provider-aryanmohanlall
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: generic-provider
Source: https://github.com/AryanMohanlall/SafeGuard/tree/main/.agents/skills/generic-provider
Command: npx skills add https://github.com/AryanMohanlall/SafeGuard --skill generic-provider-aryanmohanlall

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires redux-actions, axios, react, and includes references (resource) components.

What problem does it solve? Manually wiring React context providers for every backend entity is repetitive and error-prone, especially when TypeScript interfaces must exactly mirror C# DTOs from an ABP backend. This Skill generates the full provider stack — context, actions, reducer, and provider component — with types derived directly from the backend DTOs so nothing is invented or mismatched. ## Core Features & Use Cases - DTO-Driven Type Generation: Maps C# types (Guid, DateTime, long, nullable fields) to correct TypeScript equivalents by reading the actual backend DTO files. - Complete Provider Scaffold: Generates context.tsx, actions.tsx, reducer.tsx, and index.tsx using useReducer + redux-actions with pending/success/error action triads for each CRUD operation. - ABP API Conventions: Uses the standard /api/services/app/{EntityName}/{Method} URL pattern and correctly unwraps res.data.result envelopes including paginated items/totalCount. - Provider Composition: Registers the new provider in the shared composition file with correct nesting order and verifies the root layout. - Use Case: Ask to create a provider for a LeaveRequest entity, and the Skill reads LeaveRequestDto.cs, derives the interfaces, scaffolds all four files, and registers the provider in AppProviders. ## Quick Start Create a React context provider for the Incident entity using the backend DTO, with fetch, create, and update actions, and register it in the provider composition.

Frequently Asked Questions about generic-provider

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

FAQPage Schema
How do I create a React context provider for an ABP backend entity?▼

Locate the entity's DTO in the backend Application/Services folder, derive TypeScript interfaces from its C# properties, then scaffold context, actions, reducer, and index files using useReducer with redux-actions. Register the provider in the shared composition file.

How do I map C# DTO types to TypeScript interfaces?▼

Map Guid to string, DateTime to string (ISO 8601), long and int to number, bool to boolean, and nullable fields to optional properties. List<T> becomes T[] and nested DTOs become nested interfaces.

What is the ABP API URL pattern for CRUD operations?▼

ABP exposes application services at /api/services/app/{EntityName}/{Method}, with GetAll, Get, Create, Update, and Delete endpoints. Responses are wrapped in a result envelope, so paginated data lives at res.data.result.items and res.data.result.totalCount.

Does this work with authentication providers in ABP?▼

Yes, but auth providers use a different endpoint shape and response structure than standard CRUD services. The Skill references a dedicated auth-provider guide for login, register, logout, and token storage flows.

When should I skip CRUD actions in a context provider?▼

Only include the action groups the feature actually needs. A read-only list view needs just fetchAll with items and totalCount, while detail views add fetchById and a selected field. Unused actions add dead code.