saveeeeeeeeeee
This commit is contained in:
50
src/App.jsx
50
src/App.jsx
@@ -589,6 +589,14 @@ export default function App() {
|
||||
}
|
||||
}, [user, userProfile?.username, userProfile?.fullName, userProfile?.avatar, userProfile?.settings?.isPrivate, userProfile?.location]);
|
||||
|
||||
// Sync do status público (em tempo real) para a Comunidade
|
||||
useEffect(() => {
|
||||
if (user && userStatus) {
|
||||
const publicProfileDoc = doc(db, 'artifacts', appId, 'publicProfiles', user.uid);
|
||||
setDoc(publicProfileDoc, { status: userStatus }, { merge: true }).catch(() => {});
|
||||
}
|
||||
}, [user, userStatus]);
|
||||
|
||||
// Fetch utilizadores da comunidade
|
||||
useEffect(() => {
|
||||
if (view !== 'community') return;
|
||||
@@ -2569,12 +2577,26 @@ export default function App() {
|
||||
communityUsers.map(u => (
|
||||
<Card key={u.uid} className="p-6 cursor-pointer hover:scale-105 transition-transform" darkMode={darkMode} onClick={() => viewCommunityUser(u)}>
|
||||
<div className="flex items-center gap-4 text-inherit">
|
||||
<div className="w-16 h-16 rounded-2xl bg-primary-600 text-white flex items-center justify-center font-black text-2xl overflow-hidden">
|
||||
{u.avatar ? <img src={u.avatar} className="w-full h-full object-cover" alt="Avatar"/> : <span>{(u.fullName?.[0] || u.username?.[0] || 'U').toUpperCase()}</span>}
|
||||
<div className="relative w-16 h-16 shrink-0">
|
||||
<div className="w-16 h-16 rounded-2xl bg-primary-600 text-white flex items-center justify-center font-black text-2xl overflow-hidden">
|
||||
{u.avatar ? <img src={u.avatar} className="w-full h-full object-cover" alt="Avatar"/> : <span>{(u.fullName?.[0] || u.username?.[0] || 'U').toUpperCase()}</span>}
|
||||
</div>
|
||||
<span className={`absolute -bottom-1 -right-1 w-4 h-4 rounded-full border-2 ${darkMode ? 'border-gray-800' : 'border-white'} ${
|
||||
u.status === 'online' ? 'bg-emerald-500' :
|
||||
u.status === 'away' ? 'bg-amber-400' :
|
||||
'bg-gray-400'
|
||||
}`} title={t(u.status || 'offline')} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-black text-lg">{u.fullName || t('userTitle')}</h3>
|
||||
<p className="text-sm opacity-60 font-bold">@{u.username || 'user'}</p>
|
||||
<span className={`inline-flex items-center gap-1 text-[10px] font-black uppercase tracking-widest mt-1 px-2 py-0.5 rounded-full ${
|
||||
u.status === 'online' ? 'bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-400' :
|
||||
u.status === 'away' ? 'bg-amber-100 text-amber-700 dark:bg-amber-900/40 dark:text-amber-400' :
|
||||
'bg-gray-100 text-gray-500 dark:bg-gray-700 dark:text-gray-400'
|
||||
}`}>
|
||||
{t(u.status || 'offline')}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
@@ -2610,6 +2632,18 @@ export default function App() {
|
||||
>
|
||||
<Copy size={14} />
|
||||
</button>
|
||||
<span className={`inline-flex items-center gap-1.5 text-[10px] font-black uppercase tracking-widest px-2.5 py-1 rounded-full ${
|
||||
selectedCommunityUser.status === 'online' ? 'bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-400' :
|
||||
selectedCommunityUser.status === 'away' ? 'bg-amber-100 text-amber-700 dark:bg-amber-900/40 dark:text-amber-400' :
|
||||
'bg-gray-100 text-gray-500 dark:bg-gray-700 dark:text-gray-400'
|
||||
}`}>
|
||||
<span className={`w-2 h-2 rounded-full ${
|
||||
selectedCommunityUser.status === 'online' ? 'bg-emerald-500' :
|
||||
selectedCommunityUser.status === 'away' ? 'bg-amber-400' :
|
||||
'bg-gray-400'
|
||||
}`} />
|
||||
{t(selectedCommunityUser.status || 'offline')}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<button onClick={() => setShowInspectModal(true)} className="px-5 py-3 bg-primary-100 text-primary-700 dark:bg-primary-900/50 dark:text-primary-300 rounded-2xl font-black text-sm transition-all hover:scale-105 flex items-center gap-2">
|
||||
@@ -2632,6 +2666,18 @@ export default function App() {
|
||||
<div>
|
||||
<h3 className="text-2xl font-black">{selectedCommunityUser.fullName || t('userTitle')}</h3>
|
||||
<p className="opacity-60 font-bold">@{selectedCommunityUser.username || 'user'}</p>
|
||||
<span className={`inline-flex items-center gap-1.5 text-[10px] font-black uppercase tracking-widest mt-1.5 px-2.5 py-1 rounded-full ${
|
||||
selectedCommunityUser.status === 'online' ? 'bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-400' :
|
||||
selectedCommunityUser.status === 'away' ? 'bg-amber-100 text-amber-700 dark:bg-amber-900/40 dark:text-amber-400' :
|
||||
'bg-gray-100 text-gray-500 dark:bg-gray-700 dark:text-gray-400'
|
||||
}`}>
|
||||
<span className={`w-2 h-2 rounded-full ${
|
||||
selectedCommunityUser.status === 'online' ? 'bg-emerald-500' :
|
||||
selectedCommunityUser.status === 'away' ? 'bg-amber-400' :
|
||||
'bg-gray-400'
|
||||
}`} />
|
||||
{t(selectedCommunityUser.status || 'offline')}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user