Resource Configuration
Resource Configuration
Configure how each resource appears and behaves in the admin panel.
Basic Configuration
Resources are configured in the autoAdmin.resources object:
export default defineNuxtConfig({
autoAdmin: {
resources: {
users: {
displayName: 'Users',
icon: 'i-heroicons-user-group',
group: 'User Management',
order: 1,
},
posts: {
displayName: 'Blog Posts',
icon: 'i-heroicons-document-text',
group: 'Content',
order: 2,
},
},
},
})
Resource Options
displayName
The human-readable name shown in the UI:
resources: {
users: {
displayName: 'Users', // Shown in sidebar, headers, breadcrumbs
},
}
If not specified, the resource name is automatically formatted (users → Users).
icon
Heroicon name for the resource:
resources: {
users: {
icon: 'i-heroicons-user-group',
},
posts: {
icon: 'i-heroicons-document-text',
},
settings: {
icon: 'i-heroicons-cog-6-tooth',
},
}
Browse available icons at: https://heroicons.com/
If not specified, a default icon is used.
group
Organize resources into collapsible groups in the sidebar:
resources: {
users: {
group: 'User Management',
},
roles: {
group: 'User Management',
},
posts: {
group: 'Content',
},
pages: {
group: 'Content',
},
}
Resources without a group appear at the top of the sidebar.
order
Control the display order within groups (or ungrouped):
resources: {
users: {
group: 'User Management',
order: 1, // Shown first
},
roles: {
group: 'User Management',
order: 2, // Shown second
},
}
Lower numbers appear first. If not specified, defaults to 0.
type
Specify the resource type:
resources: {
users: {
type: 'resource', // Default - shows in sidebar with full CRUD
},
articleCategories: {
type: 'junction', // Hidden from sidebar, managed through M2M relations
},
}
Types:
'resource'(default) - Regular resource with full admin UI'junction'- M2M junction table, hidden from sidebar
disabled
Temporarily disable a resource without removing its configuration:
resources: {
legacyData: {
disabled: true, // Resource exists but is hidden from admin
},
}
List View Configuration
listFields
Specify which fields to show in the list table:
resources: {
users: {
listFields: ['id', 'name', 'email', 'role', 'createdAt'],
},
}
If not specified, all non-hidden fields are shown.
hiddenFields
Hide fields from all views (list, detail, forms):
resources: {
users: {
hiddenFields: ['password', 'passwordHash', 'resetToken'],
},
}
Common hidden fields:
- Passwords and sensitive data
- Internal IDs and foreign keys
- System fields like
deletedAt
readonlyFields
Make fields visible but non-editable in forms:
resources: {
users: {
readonlyFields: ['id', 'createdAt', 'updatedAt'],
},
}
These fields appear in detail view and edit forms but cannot be modified.
Form Configuration
Configure forms for create and edit operations:
resources: {
articles: {
formFields: {
create: [
{ name: 'title', widget: 'TextInput', required: true },
{ name: 'slug', widget: 'SlugInput', required: true },
{ name: 'content', widget: 'TextareaInput' },
{ name: 'published', widget: 'CheckboxInput' },
],
edit: [
// Same as create, but you can customize differently
{ name: 'title', widget: 'TextInput', required: true },
{ name: 'slug', widget: 'SlugInput', readonly: true },
{ name: 'content', widget: 'TextareaInput' },
{ name: 'published', widget: 'CheckboxInput' },
],
},
},
}
If formFields is not specified, the admin panel auto-generates forms from the schema.
See Form Fields & Widgets for detailed form configuration.
Complete Example
export default defineNuxtConfig({
autoAdmin: {
resources: {
users: {
displayName: 'Users',
icon: 'i-heroicons-user-group',
group: 'User Management',
order: 1,
listFields: ['id', 'name', 'email', 'role', 'createdAt'],
hiddenFields: ['password', 'passwordHash'],
readonlyFields: ['id', 'createdAt', 'updatedAt'],
},
posts: {
displayName: 'Blog Posts',
icon: 'i-heroicons-document-text',
group: 'Content',
order: 1,
listFields: ['id', 'title', 'author', 'status', 'publishedAt'],
formFields: {
create: [
{ name: 'title', widget: 'TextInput', required: true },
{ name: 'slug', widget: 'SlugInput', required: true },
{ name: 'excerpt', widget: 'TextareaInput', rows: 3 },
{ name: 'content', widget: 'RichTextEditor' },
{ name: 'authorId', widget: 'RelationSelect', label: 'Author',
options: { resource: 'users', displayField: 'name' } },
{ name: 'status', widget: 'SelectInput',
options: { enumValues: ['draft', 'published', 'archived'] } },
{ name: 'publishedAt', widget: 'DateTimePicker', showTime: true },
],
edit: [
{ name: 'title', widget: 'TextInput', required: true },
{ name: 'slug', widget: 'SlugInput', readonly: true },
{ name: 'excerpt', widget: 'TextareaInput', rows: 3 },
{ name: 'content', widget: 'RichTextEditor' },
{ name: 'authorId', widget: 'RelationSelect', label: 'Author',
options: { resource: 'users', displayField: 'name' } },
{ name: 'status', widget: 'SelectInput',
options: { enumValues: ['draft', 'published', 'archived'] } },
{ name: 'publishedAt', widget: 'DateTimePicker', showTime: true },
// M2M Relations
{
name: 'tags',
label: 'Tags',
widget: 'MultiRelationSelect',
options: {
resource: 'tags',
displayField: 'name',
junctionTable: 'postTags',
junctionLeftKey: 'postId',
junctionRightKey: 'tagId',
},
},
],
},
},
comments: {
displayName: 'Comments',
icon: 'i-heroicons-chat-bubble-left',
group: 'Content',
order: 2,
},
// Hide junction tables
postTags: {
type: 'junction',
},
},
},
})
Auto-Generation
If you don't configure a resource, the admin panel auto-generates everything:
- displayName - Formatted from resource name
- icon - Default icon
- listFields - All non-hidden columns
- formFields - All editable columns with appropriate widgets
This works great for prototyping, but custom configuration gives you more control.
Best Practices
- Always hide sensitive fields (passwords, tokens, etc.)
- Use meaningful display names for better UX
- Group related resources for easier navigation
- Set appropriate field orders to match user workflow
- Mark system fields as readonly (id, createdAt, etc.)
- Configure M2M relations in edit forms only
Next Steps
- Form Fields & Widgets - Detailed form customization
- M2M Relationships - Many-to-many configuration
- Permissions - Resource-level access control
Configuration & Theming
Customize the appearance and behavior of your admin panel.
Form Fields & Widgets
Customize create and edit forms with various widget types.
