ref(userfeedback): convert test to tsx (#52038)

getsentry · Jul 4, 2023 · 856c373 · 856c373
1 parent ba7b2e2
commit 856c373
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 14 deletions.
diff --git a/static/app/views/asyncView.tsx b/static/app/views/asyncView.tsx
@@ -1,8 +1,8 @@
 import AsyncComponent from 'sentry/components/asyncComponent';
 import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
 
-type AsyncViewState = AsyncComponent['state'];
-type AsyncViewProps = AsyncComponent['props'];
+export type AsyncViewState = AsyncComponent['state'];
+export type AsyncViewProps = AsyncComponent['props'];
 
 export default class AsyncView<
   P extends AsyncViewProps = AsyncViewProps,

diff --git a/static/app/views/userFeedback/index.spec.jsx → static/app/views/userFeedback/index.spec.tsx b/static/app/views/userFeedback/index.spec.jsx → static/app/views/userFeedback/index.spec.tsx
@@ -12,6 +12,14 @@ describe('UserFeedback', function () {
 
   const project = TestStubs.Project({isMember: true});
 
+  const routeProps = {
+    routes: router.routes,
+    route: {},
+    router,
+    location: router.location,
+    routeParams: router.params,
+  };
+
   beforeEach(function () {
     ProjectsStore.loadInitialData([project]);
 
@@ -34,10 +42,10 @@ describe('UserFeedback', function () {
   it('renders', function () {
     const params = {
       organization: TestStubs.Organization(),
-      location: {query: {}, search: ''},
       params: {
         orgId: organization.slug,
       },
+      ...routeProps,
     };
 
     MockApiClient.addMockResponse({
@@ -56,10 +64,10 @@ describe('UserFeedback', function () {
 
     const params = {
       organization: TestStubs.Organization(),
-      location: {query: {}, search: ''},
       params: {
         orgId: organization.slug,
       },
+      ...routeProps,
     };
     render(<UserFeedback {...params} />, {context: routerContext});
 
@@ -78,10 +86,10 @@ describe('UserFeedback', function () {
       organization: TestStubs.Organization({
         projects: [TestStubs.Project({isMember: true})],
       }),
-      location: {query: {}, search: ''},
       params: {
         orgId: organization.slug,
       },
+      ...routeProps,
     };
     render(<UserFeedback {...params} />, {context: routerContext});
 
@@ -95,10 +103,16 @@ describe('UserFeedback', function () {
     });
 
     const params = {
+      ...routeProps,
       organization: TestStubs.Organization({
         projects: [TestStubs.Project({isMember: true})],
       }),
-      location: {pathname: 'sentry', query: {project: '112'}, search: ''},
+      location: {
+        ...routeProps.location,
+        pathname: 'sentry',
+        query: {project: '112'},
+        search: '',
+      },
       params: {
         orgId: organization.slug,
       },
@@ -113,11 +127,10 @@ describe('UserFeedback', function () {
       organization: TestStubs.Organization({
         projects: [TestStubs.Project({isMember: true})],
       }),
-      location: router.location,
       params: {
         orgId: organization.slug,
       },
-      router,
+      ...routeProps,
     };
     render(<UserFeedback {...params} />, {context: routerContext});
 
@@ -144,10 +157,16 @@ describe('UserFeedback', function () {
     });
 
     const params = {
+      ...routeProps,
       organization: TestStubs.Organization({
         projects: [TestStubs.Project({isMember: true})],
       }),
-      location: {pathname: 'sentry', query: {project: ['112', '113']}, search: ''},
+      location: {
+        ...routeProps.location,
+        pathname: 'sentry',
+        query: {project: ['112', '113']},
+        search: '',
+      },
       params: {
         orgId: organization.slug,
       },

diff --git a/static/app/views/userFeedback/index.tsx b/static/app/views/userFeedback/index.tsx
@@ -21,18 +21,18 @@ import {t} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
 import {Organization, UserReport} from 'sentry/types';
 import withOrganization from 'sentry/utils/withOrganization';
-import AsyncView from 'sentry/views/asyncView';
+import AsyncView, {AsyncViewState} from 'sentry/views/asyncView';
 
 import {UserFeedbackEmpty} from './userFeedbackEmpty';
 import {getQuery} from './utils';
 
-type State = AsyncView['state'] & {
+interface State extends AsyncViewState {
   reportList: UserReport[];
-};
+}
 
-type Props = RouteComponentProps<{}, {}> & {
+interface Props extends RouteComponentProps<{}, {}> {
   organization: Organization;
-};
+}
 
 class OrganizationUserFeedback extends AsyncView<Props, State> {
   getEndpoints(): ReturnType<AsyncView['getEndpoints']> {