refactor(web): remove typescript

packages/web/src/pages/Application/index.jsx

@@ -17,12 +17,10 @@ import Grid from '@mui/material/Grid';
 import Tabs from '@mui/material/Tabs';
 import Tab from '@mui/material/Tab';
 import AddIcon from '@mui/icons-material/Add';
-
 import useFormatMessage from 'hooks/useFormatMessage';
 import useAppConfig from 'hooks/useAppConfig.ee';
 import { GET_APP } from 'graphql/queries/get-app';
 import * as URLS from 'config/urls';
-
 import SplitButton from 'components/SplitButton';
 import ConditionalIconButton from 'components/ConditionalIconButton';
 import AppConnections from 'components/AppConnections';
@@ -31,23 +29,9 @@ import AddAppConnection from 'components/AddAppConnection';
 import AppIcon from 'components/AppIcon';
 import Container from 'components/Container';
 import PageTitle from 'components/PageTitle';
-
-type ApplicationParams = {
-  appKey: string;
-  connectionId?: string;
-};
-
-type ConnectionOption = {
-  key: string;
-  label: string;
-  'data-test': string;
-  to: string;
-};
-
-const ReconnectConnection = (props: any): React.ReactElement => {
+const ReconnectConnection = (props) => {
   const { application, onClose } = props;
-  const { connectionId } = useParams() as ApplicationParams;
-
+  const { connectionId } = useParams();
   return (
     <AddAppConnection
       onClose={onClose}
@@ -56,8 +40,7 @@ const ReconnectConnection = (props: any): React.ReactElement => {
     />
   );
 };
-
-export default function Application(): React.ReactElement | null {
+export default function Application() {
   const theme = useTheme();
   const matchSmallScreens = useMediaQuery(theme.breakpoints.down('md'));
   const formatMessage = useFormatMessage();
@@ -67,19 +50,17 @@ export default function Application(): React.ReactElement | null {
   });
   const flowsPathMatch = useMatch({ path: URLS.APP_FLOWS_PATTERN, end: false });
   const [searchParams] = useSearchParams();
-  const { appKey } = useParams() as ApplicationParams;
+  const { appKey } = useParams();
   const navigate = useNavigate();
   const { data, loading } = useQuery(GET_APP, { variables: { key: appKey } });
   const { appConfig } = useAppConfig(appKey);
-
   const connectionId = searchParams.get('connectionId') || undefined;
   const goToApplicationPage = () => navigate('connections');
   const app = data?.getApp || {};
-
   const connectionOptions = React.useMemo(() => {
     const shouldHaveCustomConnection =
       appConfig?.canConnect && appConfig?.canCustomConnect;
-    const options: ConnectionOption[] = [
+    const options = [
       {
         label: formatMessage('app.addConnection'),
         key: 'addConnection',
@@ -87,7 +68,6 @@ export default function Application(): React.ReactElement | null {
         to: URLS.APP_ADD_CONNECTION(appKey, appConfig?.canConnect),
       },
     ];
-
     if (shouldHaveCustomConnection) {
       options.push({
         label: formatMessage('app.addCustomConnection'),
@@ -96,12 +76,9 @@ export default function Application(): React.ReactElement | null {
         to: URLS.APP_ADD_CONNECTION(appKey),
       });
     }
-
     return options;
   }, [appKey, appConfig]);
-
   if (loading) return null;
-
   return (
     <>
       <Box sx={{ py: 3 }}>
@@ -132,7 +109,7 @@ export default function Application(): React.ReactElement | null {
                       component={Link}
                       to={URLS.CREATE_FLOW_WITH_APP_AND_CONNECTION(
                         appKey,
-                        connectionId
+                        connectionId,
                       )}
                       fullWidth
                       icon={<AddIcon />}