* ui: fix performance bottlenecks, split data sources in devtools panes * ui: move xray warn * Player ux improvements (#2834) * Player UX improvements. DevTools (Including multi-tab) Actions panel (User events, Click maps, Tag Elements) * ui: remove unused imports, remove str templ classnames --------- Co-authored-by: Sudheer Salavadi <connect.uxmaster@gmail.com> --------- Co-authored-by: Sudheer Salavadi <connect.uxmaster@gmail.com>
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import { Tooltip } from 'UI';
|
|
import { CaretRightOutlined } from '@ant-design/icons';
|
|
import { Button } from 'antd';
|
|
import { shortDurationFromMs } from 'App/date';
|
|
|
|
interface Props {
|
|
onClick: any;
|
|
time?: number;
|
|
tooltip?: string;
|
|
}
|
|
function JumpButton(props: Props) {
|
|
const { tooltip } = props;
|
|
return (
|
|
<div className="absolute right-2 top-0 bottom-0 my-auto flex items-center">
|
|
<Tooltip title={tooltip} disabled={!tooltip}>
|
|
<Button
|
|
type="default"
|
|
size="small"
|
|
className="hidden group-hover:flex rounded-lg text-xs p-1 py-0 gap-0 h-6"
|
|
iconPosition="end"
|
|
onClick={(e: any) => {
|
|
e.stopPropagation();
|
|
props.onClick();
|
|
}}
|
|
icon={<CaretRightOutlined />}
|
|
>
|
|
JUMP
|
|
</Button>
|
|
{props.time ? (
|
|
<div className={'block group-hover:hidden mr-2 text-sm'}>
|
|
{shortDurationFromMs(props.time)}
|
|
</div>
|
|
) : null}
|
|
</Tooltip>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default JumpButton;
|