Create titres

This commit is contained in:
2024-06-22 07:52:32 +04:00
parent 6870f1e459
commit 06879763bc
6 changed files with 152 additions and 39 deletions
-33
View File
@@ -1,33 +0,0 @@
import Box from '@mui/material/Box'
import SpeedDial from '@mui/material/SpeedDial'
import SpeedDialIcon from '@mui/material/SpeedDialIcon'
import SpeedDialAction from '@mui/material/SpeedDialAction'
import ArticleIcon from '@mui/icons-material/Article'
import TitleIcon from '@mui/icons-material/Title'
const actions = [
{icon: <TitleIcon />, name: 'Créer un titre'},
{icon: <ArticleIcon />, name: 'Créer un article'}
]
export default function Create() {
return (
<Box sx={{height: 18, transform: 'translateZ(0px)', flexGrow: 1}}>
<SpeedDial
FabProps={{color: 'success'}}
direction='left'
ariaLabel='Créer un titre ou un article'
sx={{position: 'absolute', bottom: 18, right: 0}}
icon={<SpeedDialIcon />}
>
{actions.map(action => (
<SpeedDialAction
key={action.name}
icon={action.icon}
tooltipTitle={action.name}
/>
))}
</SpeedDial>
</Box>
)
}
@@ -0,0 +1,14 @@
'use client'
import CreateForm from '../forms/create-form.js'
export default function CreateTitre(props) {
return (
<CreateForm
{...props}
collection='titres'
dialogText='Écrivez votre titre'
label='titre'
/>
)
}
@@ -0,0 +1,41 @@
import PropTypes from 'prop-types'
import CreateTitre from './create-titre.js'
export default function HandleCreate({
session,
isOpen,
setIsOpen,
setError,
setSuccess,
setIsErrorAlertOpen,
setIsSuccessAlertOpen,
collection
}) {
if (collection === 'titres') {
return (
<CreateTitre
session={session}
isOpen={isOpen}
setIsOpen={setIsOpen}
setError={setError}
setSuccess={setSuccess}
setIsErrorAlertOpen={setIsErrorAlertOpen}
setIsSuccessAlertOpen={setIsSuccessAlertOpen}
title='Titre'
label='Écrivez votre titre'
hasMultiline={false}
/>
)
}
}
HandleCreate.propTypes = {
session: PropTypes.object,
isOpen: PropTypes.bool.isRequired,
setIsOpen: PropTypes.func.isRequired,
setError: PropTypes.func.isRequired,
setSuccess: PropTypes.func.isRequired,
setIsErrorAlertOpen: PropTypes.func.isRequired,
setIsSuccessAlertOpen: PropTypes.func.isRequired,
collection: PropTypes.oneOf(['titres', 'articles']).isRequired
}
+84
View File
@@ -0,0 +1,84 @@
'use client'
import PropTypes from 'prop-types'
import Box from '@mui/material/Box'
import SpeedDial from '@mui/material/SpeedDial'
import SpeedDialIcon from '@mui/material/SpeedDialIcon'
import SpeedDialAction from '@mui/material/SpeedDialAction'
import ArticleIcon from '@mui/icons-material/Article'
import TitleIcon from '@mui/icons-material/Title'
import {useState} from 'react'
import HandleCreate from './handle-create.js'
import AuthAlert from '@/components/auth-form/auth-alert.js'
const actions = [
{id: 'titres', icon: <TitleIcon />, name: 'Créer un titre'},
{id: 'articles', icon: <ArticleIcon />, name: 'Créer un article'}
]
export default function Create({session}) {
const [collection, setCollection] = useState(null)
const [isDialogOpen, setIsDialogOpen] = useState(false)
const [isErrorAlertOpen, setIsErrorAlertOpen] = useState(false)
const [isSuccessAlertOpen, setIsSuccessAlertOpen] = useState(false)
const [error, setError] = useState('')
const [success, setSuccess] = useState('')
const handleTitresDialog = collection => {
setCollection(collection)
setIsDialogOpen(true)
}
return (
<>
{error && <AuthAlert
isOpen={isErrorAlertOpen}
setIsOpen={setIsErrorAlertOpen}
message={error}
severity='error'
/>}
{success && <AuthAlert
isOpen={isSuccessAlertOpen}
setIsOpen={setIsSuccessAlertOpen}
message={success}
severity='success'
/>}
<Box sx={{height: 18, transform: 'translateZ(0px)', flexGrow: 1}}>
<SpeedDial
FabProps={{color: 'success'}}
direction='left'
ariaLabel='Créer un titre ou un article'
sx={{position: 'absolute', bottom: 18, right: 0}}
icon={<SpeedDialIcon />}
>
{actions.map(({id, icon, name}) => (
<SpeedDialAction
key={name}
icon={icon}
tooltipTitle={name}
onClick={() => handleTitresDialog(id)}
/>
))}
</SpeedDial>
</Box>
{collection && (
<HandleCreate
session={session}
isOpen={isDialogOpen}
setIsOpen={setIsDialogOpen}
setError={setError}
setSuccess={setSuccess}
setIsErrorAlertOpen={setIsErrorAlertOpen}
setIsSuccessAlertOpen={setIsSuccessAlertOpen}
collection={collection}
/>
)}
</>
)
}
Create.propTypes = {
session: PropTypes.object
}
+11 -4
View File
@@ -25,7 +25,8 @@ export default function CreateForm({
dialogText,
collection,
title,
label
label,
hasMultiline = true
}) {
const countdownRef = useRef()
@@ -45,6 +46,11 @@ export default function CreateForm({
titre: selectedTitre,
status: 'draft',
}
} else if (collection === 'titres') {
requestObject = {
contenu: formattedContent,
status: 'draft',
}
}
await handleSubmit({
@@ -80,8 +86,8 @@ export default function CreateForm({
<TextField
autoFocus
required
multiline
fullWidth
multiline={Boolean(hasMultiline)}
mt={2}
rows={4}
id='content'
@@ -101,7 +107,7 @@ export default function CreateForm({
CreateForm.propTypes = {
session: PropTypes.object,
selectedTitre: PropTypes.object.isRequired,
selectedTitre: PropTypes.object,
isOpen: PropTypes.bool.isRequired,
setIsOpen: PropTypes.func.isRequired,
setError: PropTypes.func.isRequired,
@@ -111,5 +117,6 @@ CreateForm.propTypes = {
dialogText: PropTypes.string.isRequired,
collection: PropTypes.string.isRequired,
title: PropTypes.string.isRequired,
label: PropTypes.string.isRequired
label: PropTypes.string.isRequired,
hasMultiline: PropTypes.bool
}