import {ComponentProps, Fragment, ReactNode} from 'react'; import styled from '@emotion/styled'; import {Location} from 'history'; import {LinkButton} from 'sentry/components/button'; import {IconCursorArrow, IconShow} from 'sentry/icons'; import {t} from 'sentry/locale'; import {space} from 'sentry/styles/space'; import useDeadRageSelectors from 'sentry/utils/replays/hooks/useDeadRageSelectors'; import {useLocation} from 'sentry/utils/useLocation'; import useOrganization from 'sentry/utils/useOrganization'; import {normalizeUrl} from 'sentry/utils/withDomainRequired'; import SelectorTable from 'sentry/views/replays/deadRageClick/selectorTable'; function DeadRageSelectorCards() { const location = useLocation(); return ( ); } function DeadClickTable({location}: {location: Location}) { const {isLoading, isError, data} = useDeadRageSelectors({ per_page: 4, sort: '-count_dead_clicks', cursor: undefined, prefix: 'selector_', }); return ( {t('Most Dead Clicks')} } headerButtons={ } customHandleResize={() => {}} /> ); } function RageClickTable({location}: {location: Location}) { const {isLoading, isError, data} = useDeadRageSelectors({ per_page: 4, sort: '-count_rage_clicks', cursor: undefined, prefix: 'selector_', }); return ( {t('Most Rage Clicks')} } headerButtons={ } customHandleResize={() => {}} /> ); } function SearchButton({ label, sort, path, ...props }: { label: ReactNode; path: string; sort: string; } & Omit, 'size' | 'to'>) { const location = useLocation(); const organization = useOrganization(); return ( } > {label} ); } const SplitCardContainer = styled('div')` display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: max-content max-content; grid-auto-flow: column; gap: 0 ${space(2)}; align-items: stretch; padding-top: ${space(1)}; `; const IconContainer = styled('span')` margin-right: ${space(1)}; `; export default DeadRageSelectorCards;