TCCPISSUE: Refactor Bootcamp tile and Bootcamp #152 : Refactor Bootca…

…mpCard component: Update imports and use new utility functions

src/section/bootcamp/bootcamp-card.tsx

@@ -1,47 +1,14 @@
 import { FC } from 'react'
 import { Box, CardContent, CardMedia, Chip, Grid, Typography, Rating } from '@mui/material'
-import { SScrollBox, SBadgeHeader } from 'theme/style'
+import { GSContainerGrid, SScrollBox, SBadgeHeader } from 'theme/style'
 import { ServerPath } from 'route/path'
 import { KEY } from 'constant'
 import { ASSET } from 'config'
-
-interface BootcampCardProps {
-  _id?: string
-  name: string
-  badge: string
-  description: string
-  address: string
-  photo: string
-  rating: number
-  careers?: string[] | null
-}
-
-interface UploadLocationProps {
-  bootcamp: BootcampCardProps
-}
-
-function photoLocation({ bootcamp }: UploadLocationProps) {
-  return bootcamp?.photo === KEY.PHOTO_DEFAULT
-    ? ServerPath.ORIGIN + `/upload/` + bootcamp?.photo
-    : ServerPath.ORIGIN + `/upload/${bootcamp._id}/` + bootcamp?.photo
-}
-
-function badgeLocation({ bootcamp }: UploadLocationProps) {
-  return bootcamp?.badge === KEY.BADGE_DEFAULT
-    ? ServerPath.ORIGIN + `/upload/badge/` + bootcamp?.badge
-    : ServerPath.ORIGIN + `/upload/badge/${bootcamp._id}/` + bootcamp?.badge
-}
+import { badgeLocation, photoLocation } from 'util/asset-loc'
 
 const BootcampCard: FC<UploadLocationProps> = ({ bootcamp }) => {
   return (
-    <Grid
-      container
-      sx={{
-        mb: 4,
-        borderRadius: 2,
-        bgcolor: 'grey.300',
-        backgroundImage: `url(${ASSET.DOT_MATRIX_BG})`
-      }}>
+    <GSContainerGrid container>
       <Grid item xs={4}>
         <CardMedia
           component='img'
@@ -65,7 +32,7 @@ const BootcampCard: FC<UploadLocationProps> = ({ bootcamp }) => {
               <Grid item xs={4}>
                 <Grid container spacing={0} justifyContent='flex-end'>
                   <CardMedia
-                    component='img'
+                    component={KEY.IMAGE}
                     src={badgeLocation({ bootcamp })}
                     alt='company badge'
                     height={50}
@@ -86,7 +53,7 @@ const BootcampCard: FC<UploadLocationProps> = ({ bootcamp }) => {
             <Typography variant='body2'>{bootcamp.description}</Typography>
           </Box>
           <Typography variant='h6' py={2}>
-            {bootcamp?.address}
+            {bootcamp?.location?.city}, {bootcamp?.location?.state}
           </Typography>
         </CardContent>
         <SScrollBox my={2} ml={2}>
@@ -95,7 +62,7 @@ const BootcampCard: FC<UploadLocationProps> = ({ bootcamp }) => {
           ))}
         </SScrollBox>
       </Grid>
-    </Grid>
+    </GSContainerGrid>
   )
 }