better types

Front/src/coinDetails/coinChart.tsx

@@ -85,8 +85,8 @@ const CoinChart = (props: ICoinChartProps): JSX.Element => {
     });
   }
 
-  function formatChartLabels(data: any): any {
+  function formatChartLabels(data: IChartData): string[] {
-    return data['prices'].map((value: (string | number | Date)[]) =>
+    return data['prices'].map((value: IChartDataItem) =>
       format(new Date(value[0]), 'MM/dd/yyyy')
     );
   }

Front/src/coinDetails/coinDetails.tsx

@@ -19,10 +19,6 @@ const CoinDetails = (): JSX.Element => {
     isSuccess,
   } = useGetCoinInfoQuery(id ? id : '');
 
-  React.useEffect(() => {
-    console.log(data)
-  }, [])
-
   return (
     <div className="details">
       {isLoading && <div>Loading...</div>}

Front/src/coinDetails/coinInfo.tsx

@@ -9,12 +9,24 @@ import Button from '@mui/material/Button';
 
 import Grid from '@mui/material/Grid';
 
+import { IGetCoinInfoResponse } from '../coinApi-types'
+
+// export interface ICoinInfoProps {
+//   [key: string]: any;
+// }
+
+// interface ICoinInfoProps {
+//   data: IGetCoinInfoResponse;
+// }
+
+
 export interface ICoinInfoProps {
   [key: string]: any;
 }
 
 const CoinInfo = (props: ICoinInfoProps): JSX.Element => {
   const { data } = props;
+  console.log("CoinInfo props.data: ", data)
 
   return (
     <div>
@@ -51,7 +63,6 @@ const CoinInfo = (props: ICoinInfoProps): JSX.Element => {
           Object.entries(data.links.chat_url).map(
             ([key, value]) => {
               if (Boolean(value)) {
-                console.log(value);
                 const domain = new URL(String(value));
                 const label = domain.hostname.split(".")[0]
                 return (

Front/src/coinDetails/coinStats.tsx

@@ -5,14 +5,19 @@ import TableContainer from '@mui/material/TableContainer';
 import TableHead from '@mui/material/TableHead';
 import TableRow from '@mui/material/TableRow';
 
-import { IGetCoinInfoResponse, IGetCoinInfoData } from '../coinApi-types'
+import { IGetCoinInfoResponse } from '../coinApi-types'
 
 interface ICoinStatsProps {
   data: IGetCoinInfoResponse;
 }
 
+interface IRow {
+  title: string;
+  value: string;
+}
+
 const CoinStats = (props: ICoinStatsProps): JSX.Element => {
-  console.log("CoinStats props", props)
+  // console.log("CoinStats props", props)
 
   const { data } = props;
 
@@ -37,7 +42,7 @@ const CoinStats = (props: ICoinStatsProps): JSX.Element => {
         <Table size="small" >
           <TableBody>
             {
-              tableData.map((row: any, index: any) => (
+              tableData.map((row: IRow, index: number) => (
                 <TableRow key={row.title}>
                   <TableCell align="left">{row.title}</TableCell>
                   <TableCell align="right">{row.value}</TableCell>

Front/src/index.css

@@ -32,12 +32,6 @@ header a {
   color: #e15241
 }
 
-
-/* #chart {
-  position: absolute;
-  height: 400px;
-} */
-
 .coinName {
   font-weight: bold;
   margin-left: 10px;