refactor(web): remove typescript

packages/web/src/components/FlowRow/index.jsx

@@ -6,71 +6,46 @@ import CardActionArea from '@mui/material/CardActionArea';
 import Chip from '@mui/material/Chip';
 import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
 import { DateTime } from 'luxon';
-
-import type { IFlow } from 'types';
 import FlowAppIcons from 'components/FlowAppIcons';
 import FlowContextMenu from 'components/FlowContextMenu';
 import useFormatMessage from 'hooks/useFormatMessage';
 import * as URLS from 'config/urls';
 import { Apps, CardContent, ContextMenu, Title, Typography } from './style';
-
-type FlowRowProps = {
-  flow: IFlow;
-};
-
-function getFlowStatusTranslationKey(status: IFlow['status']): string {
+function getFlowStatusTranslationKey(status) {
   if (status === 'published') {
     return 'flow.published';
   } else if (status === 'paused') {
     return 'flow.paused';
   }
-
   return 'flow.draft';
 }
-
-function getFlowStatusColor(
-  status: IFlow['status']
-):
-  | 'default'
-  | 'primary'
-  | 'secondary'
-  | 'error'
-  | 'info'
-  | 'success'
-  | 'warning' {
+function getFlowStatusColor(status) {
   if (status === 'published') {
     return 'success';
   } else if (status === 'paused') {
     return 'error';
   }
-
   return 'info';
 }
-
-export default function FlowRow(props: FlowRowProps): React.ReactElement {
+export default function FlowRow(props) {
   const formatMessage = useFormatMessage();
-  const contextButtonRef = React.useRef<HTMLButtonElement | null>(null);
-  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(
-    null
-  );
+  const contextButtonRef = React.useRef(null);
+  const [anchorEl, setAnchorEl] = React.useState(null);
   const { flow } = props;
-
   const handleClose = () => {
     setAnchorEl(null);
   };
-  const onContextMenuClick = (event: React.MouseEvent) => {
+  const onContextMenuClick = (event) => {
     event.preventDefault();
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
     setAnchorEl(contextButtonRef.current);
   };
-
-  const createdAt = DateTime.fromMillis(parseInt(flow.createdAt as string, 10));
-  const updatedAt = DateTime.fromMillis(parseInt(flow.updatedAt as string, 10));
+  const createdAt = DateTime.fromMillis(parseInt(flow.createdAt, 10));
+  const updatedAt = DateTime.fromMillis(parseInt(flow.updatedAt, 10));
   const isUpdated = updatedAt > createdAt;
   const relativeCreatedAt = createdAt.toRelative();
   const relativeUpdatedAt = updatedAt.toRelative();
-
   return (
     <>
       <Card sx={{ mb: 1 }} data-test="flow-row">

packages/web/src/components/FlowRow/style.js

@@ -3,7 +3,6 @@ import MuiStack from '@mui/material/Stack';
 import MuiBox from '@mui/material/Box';
 import MuiCardContent from '@mui/material/CardContent';
 import MuiTypography from '@mui/material/Typography';
-
 export const CardContent = styled(MuiCardContent)(({ theme }) => ({
   display: 'grid',
   gridTemplateRows: 'auto',
@@ -22,14 +21,12 @@ export const CardContent = styled(MuiCardContent)(({ theme }) => ({
     gridTemplateRows: 'auto auto',
   },
 }));
-
 export const Apps = styled(MuiStack)(() => ({
   gridArea: 'apps',
 }));
 export const Title = styled(MuiStack)(() => ({
   gridArea: 'title',
 }));
-
 export const ContextMenu = styled(MuiBox)(({ theme }) => ({
   flexDirection: 'row',
   display: 'flex',
@@ -42,7 +39,6 @@ export const Typography = styled(MuiTypography)(() => ({
   width: '100%',
   maxWidth: '85%',
 }));
-
 export const DesktopOnlyBreakline = styled('br')(({ theme }) => ({
   [theme.breakpoints.down('sm')]: {
     display: 'none',