Function handleColorChange

components/groups-form.tsx:123–130

(id: string, color: HslColor)

  }

  const handleColorChange = (id: string, color: HslColor) => {
    const hslString = `hsl(${color.h}, ${color.s}%, ${color.l}%)`
    const newGroups = groups.map(group =>
      group.id === id ? { ...group, color: hslString } : group
    )
    setGroups(newGroups)
    debouncedSave(newGroups)
  }

  const handleClose = () => {
    debouncedSave.flush()