setupSteps

Des étapes du plugin dans la mise en route de Hodi, l'assistant qui s'ouvre au premier démarrage. Elles servent à ce que le plugin doit savoir dès le départ, comme le nom d'un site public.

Où dans Hodi

La mise en route de Hodi est l'assistant qui s'ouvre au premier démarrage. L'assistant enchaîne des étapes. L'une de ces étapes, Plugins trouvés, liste les plugins présents et propose de les activer. Les étapes des plugins activés viennent juste après, avant Le serveur est prêt.

Exemple

Cette étape demande le nom du site, l'enregistre, puis passe à l'étape suivante avec next() :

import { SetupActions, TextField, definePlugin } from 'hodi:sdk'

const Welcome = ({ next }) => {
  const [name, setName] = useState('')
  const save = async () => {
    await saveName(name)
    next()
  }
  return (
    <>
      <TextField
        aria-label="Nom du site"
        value={name}
        onChange={event => setName(event.target.value)}
      />
      <SetupActions onNext={save} />
    </>
  )
}

definePlugin({
  setupSteps: [
    {
      id: 'welcome',
      title: 'setup.title',
      intro: 'setup.intro',
      page: Welcome
    }
  ]
})

Les champs d'une étape

setupSteps est une liste. Chaque étape de la liste a quatre champs :

Les props

Qui dessine quoi

• Hodi dessine la carte, le titre, la ligne sous le titre, la numérotation et Retour.
• Le plugin dessine le milieu, et termine par SetupActions, qui affiche Continuer.

À savoir

• Qui voit les étapes : l'admin, si le plugin est activé à l'étape Plugins trouvés.
• Une étape de Hodi : { id: 'mail', core: 'mail' } ajoute le formulaire de Serveur › E-mail.