feat: floating contact bar, remove pricing contact links, fix admin hooks

- Add FloatingContact bar (Записаться + Instagram) visible while scrolling
- Hides on hero and near contact section, centered at bottom
- Move BackToTop button up to avoid overlap
- Remove redundant ContactHint from Pricing section (floating bar covers it)
- Fix React hooks order violation in AdminLayout (early return before useEffect)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-20 13:35:36 +03:00
parent 1bfd502930
commit 96e3333e9f
5 changed files with 79 additions and 49 deletions

View File

@@ -1,10 +1,9 @@
"use client";
import { useState } from "react";
import { CreditCard, Building2, ScrollText, Crown, Sparkles, Instagram, Send, Phone } from "lucide-react";
import { CreditCard, Building2, ScrollText, Crown, Sparkles } from "lucide-react";
import { SectionHeading } from "@/components/ui/SectionHeading";
import { Reveal } from "@/components/ui/Reveal";
import { BRAND } from "@/lib/constants";
import type { SiteContent } from "@/types/content";
type Tab = "prices" | "rental" | "rules";
@@ -13,43 +12,8 @@ interface PricingProps {
data: SiteContent["pricing"];
}
function ContactHint() {
return (
<div className="mt-5 flex flex-wrap items-center justify-center gap-3 text-xs text-neutral-500">
<span>Для записи и бронирования:</span>
<a
href={BRAND.instagram}
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center gap-1 rounded-full border border-white/[0.06] px-3 py-1.5 text-pink-400 hover:text-pink-300 hover:border-pink-400/30 transition-colors"
>
<Instagram size={12} />
Instagram
</a>
<a
href="https://t.me/blackheartdancehouse"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center gap-1 rounded-full border border-white/[0.06] px-3 py-1.5 text-blue-400 hover:text-blue-300 hover:border-blue-400/30 transition-colors"
>
<Send size={12} />
Telegram
</a>
<a
href="tel:+375293897001"
className="inline-flex items-center gap-1 rounded-full border border-white/[0.06] px-3 py-1.5 text-emerald-400 hover:text-emerald-300 hover:border-emerald-400/30 transition-colors"
>
<Phone size={12} />
Позвонить
</a>
</div>
);
}
export function Pricing({ data: pricing }: PricingProps) {
const [activeTab, setActiveTab] = useState<Tab>("prices");
const showHint = pricing.showContactHint !== false; // default true
const tabs: { id: Tab; label: string; icon: React.ReactNode }[] = [
{ id: "prices", label: "Абонементы", icon: <CreditCard size={16} /> },
{ id: "rental", label: "Аренда зала", icon: <Building2 size={16} /> },
@@ -166,8 +130,7 @@ export function Pricing({ data: pricing }: PricingProps) {
</div>
)}
{showHint && <ContactHint />}
</div>
</div>
</Reveal>
)}
@@ -196,8 +159,7 @@ export function Pricing({ data: pricing }: PricingProps) {
</div>
))}
{showHint && <ContactHint />}
</div>
</div>
</Reveal>
)}