Menu
Rules for importing MUI (Material-UI) components and icons. Use when adding or editing imports from @mui/material or @mui/icons-material, or when MUI commit hooks fail.
Instalar com Codex ou Claude Copie este prompt, cole no Codex, Claude ou outro assistente e deixe que ele revise a página da skill e instale para você.
Baseado na classificação ocupacional SOC
Points to OpenCloningDB API endpoint documentation. Use when working with opencloningdb as the database backend, looking up database API routes, or integrating sequence/primer submission to OpenCloningDB.
Points to where backend API endpoints are documented. Use when looking up backend API routes, endpoints, or when integrating with the primary OpenCloning backend (localhost:8000).
Points to eLabFTW API endpoint documentation. Use when working with eLabFTW as the database backend, looking up eLabFTW API routes, or integrating sequence/primer submission to eLabFTW.
Patterns for data fetching in this codebase. Use when making HTTP requests in React components — prefer useMutation or useQuery over manual useState/useEffect loading/error state.
| name | mui-imports |
| description | Rules for importing MUI (Material-UI) components and icons. Use when adding or editing imports from @mui/material or @mui/icons-material, or when MUI commit hooks fail. |
Imports must use the main package entry point, not subpaths. This ensures proper module resolution when the package is installed from npm. Enforced by .husky/no_mui_subpath_imports.sh on commit.
❌ Wrong (subpath):
import Button from '@mui/material/Button'
import TextField from '@mui/material/TextField'
✅ Correct (named imports from main package):
import { Button, TextField } from '@mui/material'
❌ Wrong (subpath):
import DeleteIcon from '@mui/icons-material/Delete'
import AddIcon from '@mui/icons-material/Add'
✅ Correct (named imports from main package):
import { Delete as DeleteIcon, Add as AddIcon } from '@mui/icons-material'
| Package | Use | Avoid |
|---|---|---|
@mui/material | import { Component } from '@mui/material' | import Component from '@mui/material/Component' |
@mui/icons-material | import { Icon } from '@mui/icons-material' | import Icon from '@mui/icons-material/Icon' |