Macbook
63 lines
1.8 KiB
TypeScript
63 lines
1.8 KiB
TypeScript
import React from 'react';
|
|
|
|
interface Props {
|
|
market: string;
|
|
inTargets: boolean;
|
|
targetPinned?: boolean;
|
|
busy?: boolean;
|
|
onAdd: () => void;
|
|
onRemove: () => void;
|
|
}
|
|
|
|
const TrendSearchTargetActions: React.FC<Props> = ({
|
|
market,
|
|
inTargets,
|
|
targetPinned = false,
|
|
busy = false,
|
|
onAdd,
|
|
onRemove,
|
|
}) => (
|
|
<div
|
|
className="tsd-card-target-actions"
|
|
role="group"
|
|
aria-label={`${market} 투자대상`}
|
|
onClick={e => e.stopPropagation()}
|
|
onKeyDown={e => e.stopPropagation()}
|
|
>
|
|
<button
|
|
type="button"
|
|
className="tsd-card-target-btn tsd-card-target-btn--add"
|
|
title={inTargets ? '이미 투자대상에 등록됨' : '가상매매 투자대상에 추가'}
|
|
aria-label="투자대상 추가"
|
|
disabled={inTargets || busy}
|
|
onClick={onAdd}
|
|
>
|
|
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" aria-hidden>
|
|
<line x1="7" y1="2" x2="7" y2="12" />
|
|
<line x1="2" y1="7" x2="12" y2="7" />
|
|
</svg>
|
|
</button>
|
|
<button
|
|
type="button"
|
|
className="tsd-card-target-btn tsd-card-target-btn--remove"
|
|
title={
|
|
!inTargets
|
|
? '투자대상에 없음'
|
|
: targetPinned
|
|
? '고정된 종목은 삭제할 수 없습니다'
|
|
: '투자대상에서 제거'
|
|
}
|
|
aria-label="투자대상 제거"
|
|
disabled={!inTargets || targetPinned || busy}
|
|
onClick={onRemove}
|
|
>
|
|
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" aria-hidden>
|
|
<line x1="3" y1="3" x2="11" y2="11" />
|
|
<line x1="11" y1="3" x2="3" y2="11" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
);
|
|
|
|
export default TrendSearchTargetActions;
|