types: use types exposed by components

getsentry · Mar 5, 2025 · 3e39baf · 3e39baf
1 parent deb9144
commit 3e39baf
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 13 deletions.
diff --git a/static/app/components/core/badge/featureBadge.stories.tsx b/static/app/components/core/badge/featureBadge.stories.tsx
@@ -1,7 +1,9 @@
-import type {ComponentProps} from 'react';
 import {Fragment} from 'react';
 
-import {FeatureBadge} from 'sentry/components/core/badge/featureBadge';
+import {
+  FeatureBadge,
+  type FeatureBadgeProps,
+} from 'sentry/components/core/badge/featureBadge';
 import Matrix from 'sentry/components/stories/matrix';
 import SideBySide from 'sentry/components/stories/sideBySide';
 import storyBook from 'sentry/stories/storyBook';
@@ -18,7 +20,7 @@ export default storyBook('FeatureBadge', story => {
 
   story('Variants', () => (
     <Fragment>
-      <Matrix<ComponentProps<typeof FeatureBadge>>
+      <Matrix<FeatureBadgeProps>
         render={props => (
           <span>
             Feature X

diff --git a/static/app/components/organizations/hybridFilter.tsx b/static/app/components/organizations/hybridFilter.tsx
@@ -12,7 +12,7 @@ import type {
   SelectSection,
 } from 'sentry/components/compactSelect';
 import {CompactSelect} from 'sentry/components/compactSelect';
-import {Checkbox} from 'sentry/components/core/checkbox';
+import {Checkbox, type CheckboxProps} from 'sentry/components/core/checkbox';
 import {IconInfo} from 'sentry/icons/iconInfo';
 import {t} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
@@ -42,7 +42,7 @@ export interface HybridFilterProps<Value extends SelectKey>
   onChange: (selected: Value[]) => void;
   value: Value[];
   checkboxWrapper?: (
-    renderCheckbox: (props: React.ComponentProps<typeof Checkbox>) => React.ReactNode
+    renderCheckbox: (props: CheckboxProps) => React.ReactNode
   ) => React.ReactNode;
   /**
    * Whether to disable the commit action in multiple selection mode. When true, the
@@ -174,7 +174,7 @@ export function HybridFilter<Value extends SelectKey>({
       ...option,
       hideCheck: true,
       trailingItems: ({isFocused, isSelected, disabled}) => {
-        function TrailingCheckbox(props: React.ComponentProps<typeof Checkbox>) {
+        function TrailingCheckbox(props: CheckboxProps) {
           return (
             <CheckWrap
               visible={isFocused || isSelected || (!!multiple && modifierKeyPressed)}

diff --git a/static/app/views/settings/dynamicSampling/percentInput.tsx b/static/app/views/settings/dynamicSampling/percentInput.tsx
@@ -1,14 +1,11 @@
-import type React from 'react';
 import {forwardRef} from 'react';
 import {css} from '@emotion/react';
 import styled from '@emotion/styled';
 
-import {InputGroup} from 'sentry/components/core/input/inputGroup';
+import {InputGroup, type InputProps} from 'sentry/components/core/input/inputGroup';
 import {space} from 'sentry/styles/space';
 
-interface Props extends React.ComponentProps<typeof InputGroup.Input> {}
-
-export const PercentInput = forwardRef<HTMLInputElement, Props>(
+export const PercentInput = forwardRef<HTMLInputElement, InputProps>(
   function PercentInput(props, ref) {
     return (
       <InputGroup

diff --git a/...pp/views/settings/organizationDeveloperSettings/sentryApplicationDashboard/requestLog.tsx b/...pp/views/settings/organizationDeveloperSettings/sentryApplicationDashboard/requestLog.tsx
@@ -5,7 +5,7 @@ import type moment from 'moment-timezone';
 
 import {Button, StyledButton} from 'sentry/components/button';
 import {CompactSelect} from 'sentry/components/compactSelect';
-import {Tag} from 'sentry/components/core/badge/tag';
+import {Tag, type TagProps} from 'sentry/components/core/badge/tag';
 import {Checkbox} from 'sentry/components/core/checkbox';
 import {DateTime} from 'sentry/components/dateTime';
 import EmptyMessage from 'sentry/components/emptyMessage';
@@ -85,7 +85,7 @@ const getEventTypes = memoize((app: SentryApp) => {
 });
 
 function ResponseCode({code}: {code: number}) {
-  let type: React.ComponentProps<typeof Tag>['type'] = 'error';
+  let type: TagProps['type'] = 'error';
   if (code <= 399 && code >= 300) {
     type = 'warning';
   } else if (code <= 299 && code >= 100) {