skills.rest
liwoo
liwooCOMMUNITY
Explore all skills by this author →
Website𝕏@liwucodesGitHub

inertia-detail

Generate a read-only Inertia.js detail view for Goravel entities with i18n labels.

16|11|Updated Jun 12, 2025
Search Tags:#typescript#react#i18n#inertia#admin-ui#goravel#detail-view
One-click install
npx skills add https://github.com/liwoo/goravel-inertia-tw-starter --skill inertia-detail
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: inertia-detail
Source: https://github.com/liwoo/goravel-inertia-tw-starter/tree/main/.claude/skills/inertia-detail
Command: npx skills add https://github.com/liwoo/goravel-inertia-tw-starter --skill inertia-detail

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Detail views are needed to present entity data in a consistent, readable format across admin interfaces, but building them repeatedly leads to drift. This skill provides a ready-made read-only detail component that leverages i18n labels, formatted dates, and status badges to deliver a uniform UX.

Core Features & Use Cases

  • Reusable read-only detail React component for Goravel entities.
  • i18n-aware labels using useTranslation('entities').
  • Metadata section with created/updated timestamps and ID.
  • Quick adaptation to any EntityName by following the file location template.

Quick Start

Create the detail view for an entity named <EntityName> by placing the file under resources/js/pages/<EntityName>/sections/<EntityName>DetailView.tsx and wiring it into your admin routes.

Frequently Asked Questions about inertia-detail

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

FAQPage Schema
How do I build a read-only detail view for a Goravel entity in Inertia.js?▼

Build a read-only detail view by generating a React component under resources/js/pages/<EntityName>/sections/ that accepts an Entity type, item, onEdit, onClose, and canEdit props to display entity data consistently.

How does i18n work in Inertia.js detail views for admin dashboards?▼

i18n in Inertia.js detail views works by calling useTranslation('entities') inside the React component to provide localized labels for fields like name, description, status badges, and timestamps across the admin interface.

Can I use this detail view component for any Goravel entity?▼

Yes, you can use this detail view component for any Goravel entity by renaming the file path template to match your EntityName and passing the corresponding entity data to the item prop.

What's the best way to prevent UI drift when creating multiple admin detail pages?▼

Prevent UI drift by using a reusable read-only detail component that standardizes the presentation of metadata, formatted dates, status badges, and i18n labels across all admin dashboard entities.

What props does the Inertia.js detail view component expect?▼

The Inertia.js detail view component expects props including the item data, onEdit callback, onClose callback, and a canEdit boolean, conforming to standard Entity type conventions for admin interfaces.

Does this read-only detail view support timestamps and metadata display?▼

Yes, the read-only detail view supports timestamps and metadata display by including a dedicated section that renders created and updated dates alongside the entity ID.

Related Skills

Explore More Software Engineering Skills→
liwooliwoo
16

inertia-page

Generate an Inertia index page component for a Goravel entity.

Community
Intermediate
georgebjorkgeorgebjork

detail-page

Generate a Blazor/Razor detail page with view, edit, and delete actions.

Community
Advanced
btabaskabtabaska
1

rule-frontend-i18n

Enforce frontend i18n standards for naming conventions and translation usage across codebase.

Community
Intermediate
alguaritoalguarito

frontend-design

Design and build custom frontend interfaces using HTML/CSS/JS or React/Vue.

Community
Advanced