Centralize interface definitions in types.tsx

- Move component prop interfaces from individual files to types.tsx - Add new interfaces: RequestInputProps, ResponseDisplayProps, ProfileEventsTableProps, MetadataTableProps, and EndpointSelectorProps
getsentry · Nov 4, 2024 · a86a3e4 · a86a3e4
1 parent 6c8b59f
commit a86a3e4
Show file tree

Hide file tree

Showing 6 changed files with 73 additions and 71 deletions.
diff --git a/snuba/admin/static/rpc_endpoints/endpoint_selector.tsx b/snuba/admin/static/rpc_endpoints/endpoint_selector.tsx
@@ -1,11 +1,6 @@
 import React from 'react';
 import { Select } from '@mantine/core';
-
-interface EndpointSelectorProps {
-  endpoints: Array<{ name: string; version: string }>;
-  selectedEndpoint: string | null;
-  handleEndpointSelect: (value: string | null) => void;
-}
+import { EndpointSelectorProps } from 'SnubaAdmin/rpc_endpoints/types';
 
 export const EndpointSelector = ({
   endpoints,

diff --git a/snuba/admin/static/rpc_endpoints/metadata_table.tsx b/snuba/admin/static/rpc_endpoints/metadata_table.tsx
@@ -1,11 +1,6 @@
 import React from 'react';
 import { Table, Code } from '@mantine/core';
-import { QueryInfo } from './types';
-
-interface MetadataTableProps {
-  queryInfo: QueryInfo;
-  classes: any;
-}
+import { MetadataTableProps } from 'SnubaAdmin/rpc_endpoints/types';
 
 export const MetadataTable = ({ queryInfo, classes }: MetadataTableProps) => (
   <Table className={classes.table}>

diff --git a/snuba/admin/static/rpc_endpoints/profile_events_table.tsx b/snuba/admin/static/rpc_endpoints/profile_events_table.tsx
@@ -1,11 +1,6 @@
 import React from 'react';
 import { Stack, Title, Table } from '@mantine/core';
-import { HostProfileEvents } from './types';
-
-interface ProfileEventsTableProps {
-  profileEvents: HostProfileEvents[];
-  classes: any;
-}
+import { ProfileEventsTableProps } from 'SnubaAdmin/rpc_endpoints/types';
 
 export const ProfileEventsTable = ({ profileEvents, classes }: ProfileEventsTableProps) => (
   <div className={classes.scrollableDataContainer}>

diff --git a/snuba/admin/static/rpc_endpoints/request_input.tsx b/snuba/admin/static/rpc_endpoints/request_input.tsx
@@ -1,20 +1,7 @@
 import React from 'react';
 import { Space, Textarea, Checkbox, Button, Loader } from '@mantine/core';
 import { ExampleRequestAccordion } from 'SnubaAdmin/rpc_endpoints/example_request_accordion';
-
-interface RequestInputProps {
-  selectedEndpoint: string | null;
-  selectedVersion: string | null;
-  exampleRequestTemplates: Record<string, Record<string, any>>;
-  requestBody: string;
-  setRequestBody: (value: string) => void;
-  debugMode: boolean;
-  setDebugMode: (value: boolean) => void;
-  isLoading: boolean;
-  handleExecute: () => void;
-  classes: any;
-}
-
+import { RequestInputProps } from 'SnubaAdmin/rpc_endpoints/types';
 const DEBUG_SUPPORTED_VERSIONS = ['v1'];
 
 export const RequestInput = ({

diff --git a/snuba/admin/static/rpc_endpoints/response_display.tsx b/snuba/admin/static/rpc_endpoints/response_display.tsx
@@ -6,19 +6,7 @@ import { ProfileEventsTable } from 'SnubaAdmin/rpc_endpoints/profile_events_tabl
 import { MetadataTable } from 'SnubaAdmin/rpc_endpoints/metadata_table';
 import { QueryInfo, TracingSummary, HostProfileEvents } from 'SnubaAdmin/rpc_endpoints/types';
 import { useStyles } from 'SnubaAdmin/rpc_endpoints/styles';
-
-interface ResponseDisplayProps {
-  response: any;
-  showTraceLogs: boolean;
-  setShowTraceLogs: (value: boolean) => void;
-  showSummarizedView: boolean;
-  setShowSummarizedView: (value: boolean) => void;
-  summarizedTraceOutput: TracingSummary | null;
-  showProfileEvents: boolean;
-  setShowProfileEvents: (value: boolean) => void;
-  profileEvents: HostProfileEvents[] | null;
-  classes: any;
-}
+import { ResponseDisplayProps } from 'SnubaAdmin/rpc_endpoints/types';
 
 const ToggleOption = ({ active, children }: { active: boolean; children: React.ReactNode }) => {
   const { classes } = useStyles();

diff --git a/snuba/admin/static/rpc_endpoints/types.tsx b/snuba/admin/static/rpc_endpoints/types.tsx
@@ -1,3 +1,70 @@
+interface EndpointData {
+    name: string;
+    version: string;
+}
+
+interface ExampleRequestAccordionProps {
+    selectedEndpoint: string | null;
+    selectedVersion: string | null;
+    exampleRequestTemplates: Record<string, Record<string, any>>;
+    setRequestBody: (value: string) => void;
+    classes: Record<string, string>;
+}
+
+interface TraceLogProps {
+    log: string;
+    width?: number;
+}
+
+interface RequestInputProps {
+    selectedEndpoint: string | null;
+    selectedVersion: string | null;
+    exampleRequestTemplates: Record<string, Record<string, any>>;
+    requestBody: string;
+    setRequestBody: (value: string) => void;
+    debugMode: boolean;
+    setDebugMode: (value: boolean) => void;
+    isLoading: boolean;
+    handleExecute: () => void;
+    classes: any;
+}
+
+interface ResponseDisplayProps {
+    response: any;
+    showTraceLogs: boolean;
+    setShowTraceLogs: (value: boolean) => void;
+    showSummarizedView: boolean;
+    setShowSummarizedView: (value: boolean) => void;
+    summarizedTraceOutput: TracingSummary | null;
+    showProfileEvents: boolean;
+    setShowProfileEvents: (value: boolean) => void;
+    profileEvents: HostProfileEvents[] | null;
+    classes: any;
+}
+
+interface ProfileEventsTableProps {
+    profileEvents: HostProfileEvents[];
+    classes: any;
+}
+
+interface MetadataTableProps {
+    queryInfo: QueryInfo;
+    classes: any;
+}
+
+interface StyledSpanProps {
+    color: string;
+    children: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+
+interface EndpointSelectorProps {
+    endpoints: Array<{ name: string; version: string }>;
+    selectedEndpoint: string | null;
+    handleEndpointSelect: (value: string | null) => void;
+}
+
 type TimingMarks = {
     durationMs?: number;
     marksMs?: Record<string, number>;
@@ -31,31 +98,6 @@ type QueryInfo = {
     traceLogs: string;
 };
 
-interface EndpointData {
-    name: string;
-    version: string;
-}
-
-interface ExampleRequestAccordionProps {
-    selectedEndpoint: string | null;
-    selectedVersion: string | null;
-    exampleRequestTemplates: Record<string, Record<string, any>>;
-    setRequestBody: (value: string) => void;
-    classes: Record<string, string>;
-}
-
-interface TraceLogProps {
-    log: string;
-    width?: number;
-}
-
-interface StyledSpanProps {
-    color: string;
-    children: React.ReactNode;
-    className?: string;
-    style?: React.CSSProperties;
-}
-
 type ExecuteSummary = {
     rows_read: number;
     memory_size: string;
@@ -101,4 +143,4 @@ type ProfileEventsResults = {
     [hostName: string]: ProfileData;
 };
 
-export type { QueryInfo, QueryStats, QueryMetadata, TimingMarks, EndpointData, ExampleRequestAccordionProps, TraceLogProps, StyledSpanProps, ExecuteSummary, IndexSummary, QuerySummary, TracingSummary, ProfileEvent, HostProfileEvents, ProfileData, ProfileEventsResults };
+export type { QueryInfo, QueryStats, QueryMetadata, TimingMarks, EndpointData, ExampleRequestAccordionProps, TraceLogProps, StyledSpanProps, ExecuteSummary, IndexSummary, QuerySummary, TracingSummary, ProfileEvent, HostProfileEvents, ProfileData, ProfileEventsResults, RequestInputProps, ResponseDisplayProps, ProfileEventsTableProps, MetadataTableProps, EndpointSelectorProps };