Proyectos de Subversion LeadersLinked - SPA

import React from 'react'
import { useParams } from 'react-router-dom'
import { Container, Grid } from '@mui/material'

import { formatObjectToArray } from '@app/utils'
import useFetch from '@app/hooks/useFetch'

import ProfileCard from '@app/components/profile/ProfileCard'
import AptitudesCard from '@app/components/profile/aptitudes/AptitudesCard'
import EducationsCard from '@app/components/profile/educations/EducationsCard'
import ExperiencesCard from '@app/components/profile/experiences/ExperiencesCard'
import LanguagesCard from '@app/components/profile/languages/LanguagesCard'
import LocationCard from '@app/components/profile/location/LocationCard'
import SkillsCard from '@app/components/profile/skills/SkillsCard'
import HobbiesCard from '@app/components/profile/hobbies/HobbiesCard'

import '../../styles/profile/profile.scss'

const ProfileEditLayout = () => {
  const { uuid } = useParams()
  const { data: profile } = useFetch(`/profile/my-profiles/edit/${uuid}`)

  const {
    user_experiences = [],
    user_educations = [],
    formatted_address = '',
    user_languages = {},
    user_skills = {},
    user_aptitudes = {},
    user_hobbies_and_interests = {}
  } = profile

  return (
    <Container as='main' sx={{ p: 0 }}>
      <Grid container spacing={2}>
        <Grid
          item
          xs={12}
          sx={{
            display: 'flex',
            flexDirection: 'column',
            gap: 1
          }}
        >
          <ProfileCard
            {...profile}
            sizes={{
              image: profile.image_size_profile,
              cover: profile.image_size_cover
            }}
            uuid={profile.user_uuid}
            image={profile.image}
            cover={profile.cover}
          />

          <ExperiencesCard experiences={user_experiences} uuid={uuid} edit />

          <EducationsCard educations={user_educations} uuid={uuid} edit />

          <LocationCard address={formatted_address} uuid={uuid} edit />

          <LanguagesCard
            languages={formatObjectToArray(user_languages)}
            uuid={uuid}
            edit
          />

          <SkillsCard
            skills={formatObjectToArray(user_skills)}
            uuid={uuid}
            edit
          />

          <AptitudesCard
            aptitudes={formatObjectToArray(user_aptitudes)}
            uuid={uuid}
            edit
          />

          <HobbiesCard
            hobbies={formatObjectToArray(user_hobbies_and_interests)}
            uuid={uuid}
            edit
          />
        </Grid>
      </Grid>
    </Container>
  )
}

export default ProfileEditLayout