mirror of
https://github.com/Growstuff/growstuff.git
synced 2026-09-25 07:24:55 -04:00
Clicking a chip opens the planting's menu under it (view, edit, add photo, record harvest, save seeds, mark as finished), in place of the three dots on annual rows, so perennials get the same menu. A caret shows the chip opens something. Someone who can't change the planting still gets a plain link chip. The menu items are lowercase for every planting menu. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
34 lines
1.2 KiB
React
34 lines
1.2 KiB
React
import React from 'react';
|
|
|
|
import {selectPlantingAction} from '../plantingActions';
|
|
import ActionsMenu from './ActionsMenu';
|
|
import CropChip from './CropChip';
|
|
|
|
// A planting's crop chip, which is also its menu: click it for view, edit,
|
|
// harvest and the rest, the same for annuals and perennials. Someone who can't
|
|
// change the planting has no menu, so for them it stays a plain link to it.
|
|
export default function PlantingChip({planting, defaultIconUrl, highlighted, handlers}) {
|
|
const {id, url, crop, actions} = planting;
|
|
|
|
if (!actions || actions.length === 0) {
|
|
return <CropChip url={url} crop={crop} defaultIconUrl={defaultIconUrl} highlighted={highlighted} />;
|
|
}
|
|
|
|
return (
|
|
<ActionsMenu
|
|
id={`planting-${id}`}
|
|
actions={actions}
|
|
label={(
|
|
<>
|
|
<img className="crop-icon" src={crop.icon_url || defaultIconUrl} alt="" />
|
|
{crop.name}
|
|
</>
|
|
)}
|
|
ariaLabel={`Actions for ${crop.name}`}
|
|
className={`chip crop-chip chip-menu-toggle dropdown-toggle${highlighted ? ' planting-just-added' : ''}`}
|
|
menuClassName="dropdown-menu-start planting-menu"
|
|
onSelect={selectPlantingAction(planting, handlers)}
|
|
/>
|
|
);
|
|
}
|