Estoy escribiendo una aplicación en React + Material UI. Hay acciones en diferentes páginas de mi aplicación que usan modales y, en lugar de usar el cuadro de diálogo de Material UI en cada una de estas páginas, he definido un contexto modal global que cambia de estado para mostrar y llena el modal con otros accesorios. Ahora mi pregunta es: ¿cuál es la práctica estándar para renderizar esos accesorios? Como en, ¿en qué punto debo decidir crear un modal/diálogo separado para, digamos, formularios en comparación con acciones simples? ¿O es correcto si uso condiciones para representar cualquier cosa desde dentro de ese Modal? Como ejemplo considere la siguiente muestra:

 <DialogContent> <DialogContentText> {modalTypeDefaults.text} </DialogContentText> <DialogContentText sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginTop: '5px' }}> { (modalTypeDefaults.type === 'user') ? <UserInfoCellComponent displayName={modalProps.displayName} imageURL={modalProps.fkImageIdAvatar} username={modalProps.username.toLowerCase()} /> : (modalTypeDefaults.type === 'post') ? <Box> <Typography>Title: {modalProps.title.toUpperCase()}</Typography> <Typography>Id: {modalProps.id}</Typography> </Box> : (modalTypeDefaults.type === 'event') ? <Box sx={{ alignItems: 'center', display: 'flex' }} > <Avatar src={modalProps.fkImageId} sx={{ mr: 2 }} /> <Typography color="textPrimary" variant="body1" > <a href={modalProps.urlWebsite}>{modalProps.name}</a> </Typography> </Box> : '' } </DialogContentText> </DialogContent>

¿Existen prácticas estándar? Miré a mi alrededor y encontré respuestas extremadamente variables. ¿Qué es mejor para el rendimiento?