added rules on ReFound

2026-06-19 00:26:58 +03:00
parent f0d3a2b85e
commit f309ca8d19
7 changed files with 60 additions and 18 deletions
--- a/src/components/MainFeed.jsx
+++ b/src/components/MainFeed.jsx
@@ -8,6 +8,7 @@ import CreateUpdatePost from "./CreateUpdatePost";
 import MenuIcon from "./icons/MenuIcon";
 import { ProfileModal } from "./profile";
 import AuthModal from "./AuthModal";
+import RulesModal from "./RulesModal";
 import { useAuthContext } from "../context/AuthContext";

 /**
@@ -32,6 +33,8 @@ export default function MainFeed() {
  const [profileModalOpen, setProfileModalOpen] = useState(false);
  // Открыто ли модальное окно аутентификации (login / register)
  const [authModalOpen, setAuthModalOpen] = useState(false);
+  // Открыто ли модальное окно правил площадки
+  const [rulesModalOpen, setRulesModalOpen] = useState(false);
  // Массив объявлений из API (основная лента)
  const [ads, setAds]                 = useState([]);
  // Объявления текущего пользователя (загружаются отдельно по userId)
@@ -45,13 +48,26 @@ export default function MainFeed() {
  // Данные профиля — из контекста авторизации (или пустой объект для гостя)
  const profileData = useMemo(() => {
    if (!user) return {};
+
+    // Если бэк присылает имя одним полем "name" — разбиваем на firstName/lastName
+    // Если бэк присылает отдельные поля firstName/lastName — используем их напрямую
+    const nameParts = (user.name || "").trim().split(/\s+/);
+    const firstName = user.firstName || nameParts[0] || "";
+    const lastName  = user.lastName  || nameParts.slice(1).join(" ") || "";
+
+    // Аватар может быть относительным путём (/uploads/avatars/...) — добавляем API_URL
+    const rawAvatar = user.avatar || null;
+    const avatar = rawAvatar && rawAvatar.startsWith("/")
+      ? `${API_URL}${rawAvatar}`
+      : rawAvatar;
+
    return {
      login:     user.login     || "",
-      firstName: user.name || user.firstName || "",
-      lastName:  user.lastName  || "",
+      firstName,
+      lastName,
      email:     user.email     || "",
      phone:     user.phone     || "",
-      avatar:    user.avatar    || null,
+      avatar,
      id:        user.id,
    };
  }, [user]);
@@ -230,9 +246,8 @@ export default function MainFeed() {
            ad={ad}
            liked={liked.has(ad.id)}
            onLike={toggleLike}
-            onEdit={handleEdit}
-            // На вкладке «Мои объявления» все посты принадлежат пользователю
-            isOwner={activeNav === "Мои объявления" || (isAuthenticated && ad.userId === user?.id)}
+            onEdit={activeNav === "Мои объявления" ? handleEdit : undefined}
+            isOwner={activeNav === "Мои объявления"}
        />
    ));
  };
@@ -253,6 +268,7 @@ export default function MainFeed() {
            isAuthenticated={isAuthenticated}
            onLogout={logout}
            onLoginClick={() => setAuthModalOpen(true)}
+            onRulesClick={() => setRulesModalOpen(true)}
        />

        <div className="f-main">
@@ -334,6 +350,11 @@ export default function MainFeed() {
                onClose={() => setAuthModalOpen(false)}
            />
        )}
+
+        {/* Модальное окно правил площадки */}
+        {rulesModalOpen && (
+            <RulesModal onClose={() => setRulesModalOpen(false)} />
+        )}
      </div>
  );
 }
--- a/src/components/Sidebar.jsx
+++ b/src/components/Sidebar.jsx
@@ -13,6 +13,7 @@ export default function Sidebar({
  isAuthenticated,
  onLogout,
  onLoginClick,
+  onRulesClick,
 }) {
  return (
      <>
@@ -48,11 +49,20 @@ export default function Sidebar({
          <div className="f-sb-bottom">
            {NAV_BOTTOM.map(({ icon, label }) => {
              const Ic = NavIcons[icon];
+              const handleBottomClick = () => {
+                if (label === "Правила площадки") {
+                  onRulesClick?.();
+                  onClose();
+                  return;
+                }
+                onNavClick(label);
+                onClose();
+              };
              return (
                  <div
                      key={label}
                      className={`f-sb-item${activeNav === label ? " active" : ""}`}
-                      onClick={() => { onNavClick(label); onClose(); }}
+                      onClick={handleBottomClick}
                  >
                    <Ic /> {label}
                  </div>
--- a/src/components/icons/NavIcons.jsx
+++ b/src/components/icons/NavIcons.jsx
@@ -36,4 +36,13 @@ export const NavIcons = {
        <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z" />
      </svg>
  ),
+  rules: () => (
+      <svg width={20} height={20} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round">
+        <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
+        <polyline points="14 2 14 8 20 8" />
+        <line x1="8" y1="13" x2="16" y2="13" />
+        <line x1="8" y1="17" x2="13" y2="17" />
+        <line x1="8" y1="9" x2="10" y2="9" />
+      </svg>
+  ),
 };
--- a/src/components/profile/ProfileModal.jsx
+++ b/src/components/profile/ProfileModal.jsx
@@ -52,7 +52,8 @@ export default function ProfileModal({ onClose, initialData = {} }) {
    }

    const profileData = {
-      name:     form.firstName.trim(),
+      firstName: form.firstName.trim(),
+      lastName:  form.lastName.trim(),
      login:     form.login.trim(),
      phone:     form.phone.trim(),
      email:     form.email.trim(),
--- a/src/config/feedConstants.js
+++ b/src/config/feedConstants.js
@@ -9,7 +9,7 @@ export const NAV_ITEMS = [

 export const NAV_BOTTOM = [
  { icon: "user",     label: "Профиль" },
-  { icon: "settings", label: "Настройки" },
+  { icon: "rules", label: "Правила площадки" },
 ];

 export const CATEGORIES = [
--- a/src/styles/card.css
+++ b/src/styles/card.css
@@ -8,17 +8,18 @@
 .f-card:hover { border-color: rgba(45,224,200,.3); transform: translateY(-2px); }

 .f-card-inner {
-  display: flex; flex-direction: row; min-height: 160px;
+  display: flex; flex-direction: row; min-height: 180px;
 }

 /* Image Panel */
 .f-card-img {
  width: 180px; min-width: 180px;
+  align-self: stretch;       /* растягивается на всю высоту карточки */
  background: linear-gradient(135deg, #1a3a4a 0%, #0f2235 100%);
  display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden; flex-shrink: 0;
 }
-.f-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
+.f-card-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; position: absolute; inset: 0; }
 .f-card-emoji { font-size: 3rem; opacity: .22; }

 /* Badges */
@@ -103,7 +104,7 @@
  .f-card-img {
    width: 100%;
    min-width: unset;
-    height: 160px;
+    height: 180px;
  }

  /* Убираем кнопку карты на мобилке — занимает много места */
--- a/src/styles/modal.css
+++ b/src/styles/modal.css
@@ -77,8 +77,8 @@
 .f-img-input { display: none; }

 /* Image Preview */
-.f-img-preview-wrap { position: relative; display: inline-block; width: 100%; }
-.f-img-preview { width: 100%; max-height: 220px; object-fit: cover; border-radius: 12px; display: block; }
+.f-img-preview-wrap { position: relative; display: block; width: 100%; }
+.f-img-preview { width: 100%; height: 200px; object-fit: cover; object-position: center; border-radius: 12px; display: block; }
 .f-img-remove {
  position: absolute; top: 8px; right: 8px;
  background: rgba(0,0,0,0.55); border: none; border-radius: 50%;