Spaces:
Sleeping
Sleeping
File size: 2,529 Bytes
d8808e7 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 | import { ChevronDown } from 'lucide-react'
import {
addWorkshopSampleAdvisorPanel,
addWorkshopSamplePersonas,
deleteWorkshopSampleAdvisorPanel,
deleteWorkshopSamplePersonas,
} from '../lib/creations'
type Props = {
open: boolean
onToggle: () => void
/** Called after a sample-data action so the parent can close the menu. */
onActionComplete?: () => void
}
export function SampleDataMenuItem({ open, onToggle, onActionComplete }: Props) {
const run = (fn: () => void) => {
fn()
onActionComplete?.()
}
return (
<div className="user-dropdown-speech">
<button
type="button"
role="menuitem"
className="user-dropdown-speech-trigger"
onClick={(e) => {
e.stopPropagation()
onToggle()
}}
aria-expanded={open}
aria-controls="sample-data-submenu"
id="sample-data-trigger"
>
<span>Sample Data</span>
<ChevronDown size={16} className={open ? 'user-dropdown-speech-chevron--open' : ''} aria-hidden />
</button>
{open && (
<div
id="sample-data-submenu"
role="region"
aria-labelledby="sample-data-trigger"
className="user-dropdown-speech-body"
onMouseDown={(e) => e.stopPropagation()}
>
<div className="user-dropdown-sample-actions">
<button
type="button"
className="user-dropdown-sample-action"
onClick={() => run(addWorkshopSamplePersonas)}
>
Add Sample Personas
</button>
<button
type="button"
className="user-dropdown-sample-action"
onClick={() => run(addWorkshopSampleAdvisorPanel)}
>
Add Sample Advisor Panel
</button>
<button
type="button"
className="user-dropdown-sample-action user-dropdown-sample-action--danger"
onClick={() => run(deleteWorkshopSamplePersonas)}
>
Delete Sample Personas
</button>
<button
type="button"
className="user-dropdown-sample-action user-dropdown-sample-action--danger"
onClick={() => run(deleteWorkshopSampleAdvisorPanel)}
>
Delete Sample Advisor Panel
</button>
</div>
</div>
)}
</div>
)
}
|