Proyectos de Subversion LeadersLinked - SPA

import React from 'react';
import { useParams } from 'react-router-dom';
import { useSelector } from 'react-redux';
import { Box, Grid } from '@mui/material';

import { useFetch } from '@hooks';
import { formatObjectToArray } from '@utils';

import ProfileCard from '@components/profile/ProfileCard';
import LocationCard from '@components/profile/location/LocationCard';
import LanguagesCard from '@components/profile/languages/LanguagesCard';
import SkillsCard from '@components/profile/skills/SkillsCard';
import AptitudesCard from '@components/profile/aptitudes/AptitudesCard';
import HobbiesCard from '@components/profile/hobbies/HobbiesCard';
import SuggestWidget from '@components/widgets/default/SuggestWidget';
import EducationsCard from '@components/profile/educations/educations-card';
import ExperiencesCard from '@components/profile/experiences/experiences-card';

const ProfileViewPage = () => {
  const labels = useSelector(({ intl }) => intl.labels);
  const { uuid } = useParams();

  const { data: profile } = useFetch(`/profile/view/${uuid}`);

  return (
    <Grid container spacing={1}>
      <Grid item xs={12} md={8}>
        <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>
          <ProfileCard
            cover={profile.cover}
            avatar={profile.image}
            name={profile.full_name}
            description={profile.overview}
            address={profile.formatted_address}
            coverUrl={profile.link_cover_upload}
            avatarUrl={profile.link_image_upload}
            coverSize={profile.image_size_cover}
            avatarSize={profile.image_size_profile}
            requestConnection={profile.request_connection}
            linkRequest={profile.link_request}
            linkCancel={profile.link_cancel}
            linkInmail={profile.link_inmail}
            following={profile.following}
            totalConnections={profile.follower}
            facebook={profile.facebook}
            twitter={profile.twitter}
            instagram={profile.instagram}
          />

          <ExperiencesCard experiences={profile?.user_experiences} uuid={uuid} />

          <EducationsCard educations={profile?.user_educations} uuid={uuid} />

          <LocationCard address={profile?.formatted_address} uuid={uuid} />

          <LanguagesCard languages={formatObjectToArray(profile?.user_languages)} uuid={uuid} />

          <SkillsCard skills={formatObjectToArray(profile?.user_skills)} uuid={uuid} />

          <AptitudesCard aptitudes={formatObjectToArray(profile?.user_aptitudes)} uuid={uuid} />

          <HobbiesCard
            hobbies={formatObjectToArray(profile?.user_hobbies_and_interests)}
            uuid={uuid}
          />
        </Box>
      </Grid>

      <Grid item xs={12} md={4}>
        {profile?.user_profile_id && (
          <SuggestWidget
            url={`/helpers/people-viewed-profile/${profile?.user_profile_id}`}
            title={labels.who_has_seen_this_profile}
          />
        )}
      </Grid>
    </Grid>
  );
};

export default ProfileViewPage;