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.
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Basé sur la classification professionnelle 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' |