feat: forum rich-text editor, emoji picker, mentions, discover nav, feed, uploads, profile
Forum: - TipTap WYSIWYG editor with full toolbar - @emoji-mart/react emoji picker (consistent with tweets) - @mention autocomplete with user search API - Fix PHP 8.4 parse errors in Blade templates - Fix thread data display (paginator items) - Align forum page widths to max-w-5xl Discover: - Extract shared _nav.blade.php partial - Add missing nav links to for-you page - Add Following link for authenticated users Feed/Posts: - Post model, controllers, policies, migrations - Feed page components (PostComposer, FeedCard, etc) - Post reactions, comments, saves, reports, sharing - Scheduled publishing support - Link preview controller Profile: - Profile page components (ProfileHero, ProfileTabs) - Profile API controller Uploads: - Upload wizard enhancements - Scheduled publish picker - Studio status bar and readiness checklist
This commit is contained in:
57
resources/js/components/profile/ProfileStatsRow.jsx
Normal file
57
resources/js/components/profile/ProfileStatsRow.jsx
Normal file
@@ -0,0 +1,57 @@
|
||||
import React from 'react'
|
||||
|
||||
const PILLS = [
|
||||
{ key: 'uploads_count', label: 'Artworks', icon: 'fa-images', tab: 'artworks' },
|
||||
{ key: 'downloads_received_count', label: 'Downloads', icon: 'fa-download', tab: null },
|
||||
{ key: 'follower_count', label: 'Followers', icon: 'fa-users', tab: 'about' },
|
||||
{ key: 'following_count', label: 'Following', icon: 'fa-user-check', tab: 'about' },
|
||||
{ key: 'artwork_views_received_count', label: 'Views', icon: 'fa-eye', tab: 'stats' },
|
||||
{ key: 'awards_received_count', label: 'Awards', icon: 'fa-trophy', tab: 'stats' },
|
||||
]
|
||||
|
||||
/**
|
||||
* ProfileStatsRow
|
||||
* Horizontal scrollable pill row of stat counts.
|
||||
* Clicking a pill navigates to the relevant tab.
|
||||
*/
|
||||
export default function ProfileStatsRow({ stats, followerCount, onTabChange }) {
|
||||
const values = {
|
||||
uploads_count: stats?.uploads_count ?? 0,
|
||||
downloads_received_count: stats?.downloads_received_count ?? 0,
|
||||
follower_count: followerCount ?? 0,
|
||||
following_count: stats?.following_count ?? 0,
|
||||
artwork_views_received_count: stats?.artwork_views_received_count ?? 0,
|
||||
awards_received_count: stats?.awards_received_count ?? 0,
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="bg-white/3 border-b border-white/10 overflow-x-auto" style={{ background: 'rgba(255,255,255,0.025)' }}>
|
||||
<div className="max-w-6xl mx-auto px-4">
|
||||
<div className="flex gap-1 py-2 min-w-max sm:min-w-0 sm:flex-wrap">
|
||||
{PILLS.map((pill) => (
|
||||
<button
|
||||
key={pill.key}
|
||||
onClick={() => pill.tab && onTabChange(pill.tab)}
|
||||
title={pill.label}
|
||||
disabled={!pill.tab}
|
||||
className={`
|
||||
flex items-center gap-2 px-4 py-2 rounded-lg text-sm transition-all
|
||||
${pill.tab
|
||||
? 'cursor-pointer hover:bg-white/8 hover:text-white text-slate-300 group'
|
||||
: 'cursor-default text-slate-400'
|
||||
}
|
||||
`}
|
||||
style={{ background: 'transparent' }}
|
||||
>
|
||||
<i className={`fa-solid ${pill.icon} fa-fw text-xs opacity-60 group-hover:opacity-80`} />
|
||||
<span className="font-bold text-white tabular-nums">
|
||||
{Number(values[pill.key]).toLocaleString()}
|
||||
</span>
|
||||
<span className="text-slate-500 text-xs hidden sm:inline">{pill.label}</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user