vega-frontend-monorepo/libs/deal-ticket/src/button-radio.tsx
Matthew Russell 313e6e1217
Feat/63 Deal ticket (#82)
* scaffold dealticket package, remove trading views from react-helpers

* add deal ticket component, add intent utils, expand dialog and form group styles

* add splash component, show market not found message if market doesnt exist

* tidy up error handling

* add handleError method for vega tx hook

* add better testname for provider test, flesh out tests a bit more for deal ticket

* Add unit tests for useVegaTransaction and useOrderSubmit hooks

* add wrapper component for order dialog styles

* add vega styled loader to ui toolkit and use in order dialog

* add title prop to order dialog

* split limit and market tickets into own files

* add button radio component

* revert dialog styles

* move splash component to ui-toolkit, add story

* convert intent to enum

* Make button always type=button unless type prop is passed

* inline filter logic for tif selector

* add date-fns, add datetime to helpers

* add order types to wallet package, make price undefined if order type is market

* use enums in deal ticket logic

* tidy up order state by moving submit and transaction hooks out of deal ticket

* add comment for dialog styles

* remove decimal from price input

* add types package, delete old generated types from trading project

* rename types package to graphql

* update generate command to point to correct locations

* fix use order submit test

* use intent shadow helper

* remove date-fns and format manually, update submit button error to use input-error

* remove stray console.log
2022-03-17 12:35:46 -07:00

39 lines
925 B
TypeScript

import { Button } from '@vegaprotocol/ui-toolkit';
interface ButtonRadioProps {
name: string;
options: Array<{ value: string; text: string }>;
currentOption: string | null;
onSelect: (option: string) => void;
}
export const ButtonRadio = ({
name,
options,
currentOption,
onSelect,
}: ButtonRadioProps) => {
return (
<div className="flex gap-8">
{options.map((option) => {
const isSelected = option.value === currentOption;
return (
<Button
onClick={() => onSelect(option.value)}
className="flex-1"
variant={isSelected ? 'accent' : undefined}
data-testid={
isSelected
? `${name}-${option.value}-selected`
: `${name}-${option.value}`
}
key={option.value}
>
{option.text}
</Button>
);
})}
</div>
);
};