Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-03-11 02:12:21 -05:00
Code Issues Activity

Added click to menu items in AdminX

Browse source 
rers. https://github.com/TryGhost/Team/issues/3318
This commit is contained in:
Peter Zimon 2023-06-02 12:21:30 +02:00
parent 6e7f974e7e
commit 7535fc73fc
2 changed files with 5 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ghost/admin-x-settings/src/admin-x-ds/global/Menu.stories.tsx
View file

@ -16,7 +16,9 @@ type Story = StoryObj<typeof Menu>;
const items = [ const items = [
{id: 'item-1', label: 'Item 1'}, {id: 'item-1', label: 'Item 1'},
{id: 'item-2', label: 'Item 2'}, {id: 'item-2', label: 'Item 2'},
{id: 'item-3', label: 'Item 3'} {id: 'item-3', label: 'Click me', onClick: () => {
alert('Clicked!');
}}
]; ];
const longItems = [ const longItems = [

3
ghost/admin-x-settings/src/admin-x-ds/global/Menu.tsx
View file

@ -3,6 +3,7 @@ import React, {useState} from 'react';
export type MenuItem = { export type MenuItem = {
id: string, id: string,
label: string; label: string;
onClick?: () => void
} }
type MenuPosition = 'left' | 'right'; type MenuPosition = 'left' | 'right';
@ -55,7 +56,7 @@ const Menu: React.FC<MenuProps> = ({trigger, items, position, className}) => {
<div aria-labelledby="menu-button" aria-orientation="vertical" className={menuListStyles} role="menu"> <div aria-labelledby="menu-button" aria-orientation="vertical" className={menuListStyles} role="menu">
<div className="py-1" role="none"> <div className="py-1" role="none">
{items.map(item => ( {items.map(item => (
<button key={item.id} className="block w-full cursor-pointer px-4 py-2 text-left text-sm text-grey-900 hover:bg-grey-100" type="button">{item.label}</button> <button key={item.id} className="block w-full cursor-pointer px-4 py-2 text-left text-sm text-grey-900 hover:bg-grey-100" type="button" onClick={item.onClick}>{item.label}</button>
))} ))}
</div> </div>
</div> </div>