Merge pull request #15 from SlimusMinus/edit-profile
moved edit profile in center window
This commit is contained in:
@@ -6,6 +6,7 @@ import RightSidebar from "./RightSidebar";
|
|||||||
import PostOnFeed from "./PostOnFeed";
|
import PostOnFeed from "./PostOnFeed";
|
||||||
import CreateUpdatePost from "./CreateUpdatePost";
|
import CreateUpdatePost from "./CreateUpdatePost";
|
||||||
import MenuIcon from "./icons/MenuIcon";
|
import MenuIcon from "./icons/MenuIcon";
|
||||||
|
import { ProfileModal } from "./profile";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* MainFeed — корневой компонент приложения.
|
* MainFeed — корневой компонент приложения.
|
||||||
@@ -23,6 +24,15 @@ export default function MainFeed() {
|
|||||||
const [modalOpen, setModalOpen] = useState(false);
|
const [modalOpen, setModalOpen] = useState(false);
|
||||||
// Объявление, которое сейчас редактируется (null — модалка закрыта)
|
// Объявление, которое сейчас редактируется (null — модалка закрыта)
|
||||||
const [editAd, setEditAd] = useState(null);
|
const [editAd, setEditAd] = useState(null);
|
||||||
|
// Открыто ли модальное окно редактирования профиля
|
||||||
|
const [profileModalOpen, setProfileModalOpen] = useState(false);
|
||||||
|
// Данные профиля пользователя
|
||||||
|
const [profileData, setProfileData] = useState({
|
||||||
|
firstName: "Иван",
|
||||||
|
lastName: "Иванов",
|
||||||
|
email: "ivan@example.com",
|
||||||
|
phone: "+7 (999) 123-45-67",
|
||||||
|
});
|
||||||
// Массив объявлений из API
|
// Массив объявлений из API
|
||||||
const [ads, setAds] = useState([]);
|
const [ads, setAds] = useState([]);
|
||||||
// Set id объявлений, которые пользователь лайкнул (только локально)
|
// Set id объявлений, которые пользователь лайкнул (только локально)
|
||||||
@@ -149,6 +159,7 @@ export default function MainFeed() {
|
|||||||
activeNav={activeNav}
|
activeNav={activeNav}
|
||||||
onClose={() => setSidebarOpen(false)}
|
onClose={() => setSidebarOpen(false)}
|
||||||
onNavClick={setActiveNav}
|
onNavClick={setActiveNav}
|
||||||
|
onEditProfile={() => setProfileModalOpen(true)}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="f-main">
|
<div className="f-main">
|
||||||
@@ -215,6 +226,14 @@ export default function MainFeed() {
|
|||||||
onSuccess={handleEditSave}
|
onSuccess={handleEditSave}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{/* Модальное окно редактирования профиля */}
|
||||||
|
{profileModalOpen && (
|
||||||
|
<ProfileModal
|
||||||
|
onClose={() => setProfileModalOpen(false)}
|
||||||
|
initialData={profileData}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -4,8 +4,8 @@ import {NAV_BOTTOM, NAV_ITEMS} from "../config/feedConstants";
|
|||||||
import {NavIcons} from "./icons/NavIcons";
|
import {NavIcons} from "./icons/NavIcons";
|
||||||
import Profile from "./profile/Profile";
|
import Profile from "./profile/Profile";
|
||||||
|
|
||||||
export default function Sidebar({ open, activeNav, onClose, onNavClick }) {
|
export default function Sidebar({ open, activeNav, onClose, onNavClick, onEditProfile }) {
|
||||||
const [profileData, setProfileData] = useState({
|
const [profileData] = useState({
|
||||||
firstName: "Иван",
|
firstName: "Иван",
|
||||||
lastName: "Иванов",
|
lastName: "Иванов",
|
||||||
email: "ivan@example.com",
|
email: "ivan@example.com",
|
||||||
@@ -48,7 +48,7 @@ export default function Sidebar({ open, activeNav, onClose, onNavClick }) {
|
|||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
<div className="f-sb-divider" />
|
<div className="f-sb-divider" />
|
||||||
<Profile data={profileData} />
|
<Profile data={profileData} onEdit={onEditProfile} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -1,19 +1,11 @@
|
|||||||
import React, { useState } from "react";
|
|
||||||
import ProfileModal from "./ProfileModal";
|
|
||||||
import ProfileAvatar from "./ProfileAvatar";
|
import ProfileAvatar from "./ProfileAvatar";
|
||||||
import ProfileInfo from "./ProfileInfo";
|
import ProfileInfo from "./ProfileInfo";
|
||||||
|
|
||||||
export default function Profile({ data = {} }) {
|
export default function Profile({ data = {}, onEdit }) {
|
||||||
const [showModal, setShowModal] = useState(false);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<div className="f-profile" onClick={onEdit}>
|
||||||
<div className="f-profile" onClick={() => setShowModal(true)}>
|
<ProfileAvatar avatar={data.avatar} name={`${data.firstName || ""} ${data.lastName || ""}`} />
|
||||||
<ProfileAvatar avatar={data.avatar} name={`${data.firstName || ""} ${data.lastName || ""}`} />
|
<ProfileInfo firstName={data.firstName} email={data.email} />
|
||||||
<ProfileInfo firstName={data.firstName} email={data.email} />
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
{showModal && <ProfileModal onClose={() => setShowModal(false)} initialData={data} />}
|
|
||||||
</>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user