feat: add frontend Rich Presence — activityStore, ActivityCard, sidebar upgrades, settings toggle
- Task 7: Create activityStore (Zustand) with Map<userId, Activity[]>, showActivity toggle, debounced pushActivities, and reset on logout - Task 8: Wire WS integration — presence_update propagates activities to store, ready payload initializes userActivities and showActivity (via setState to avoid side effects) - Task 9: Create ActivityCard component with compact/full modes, type-colored labels, elapsed time display, asset images, and fallback to customStatus - Task 10: Upgrade ActivityPanel to three groups — active friends (full cards, no header), online friends (compact), offline friends — using getPrimaryActivity for grouping - Task 11: Upgrade MemberSidebar to show compact ActivityCards instead of raw customStatus - Task 12: Add showActivity toggle in AccountPanel settings (Activity Status section) with API persistence and store sync
This commit is contained in:
@@ -11,6 +11,7 @@ import type { User, UserStatus, AvatarColor } from '@backspace/shared';
|
||||
import type { FederationOpResult } from '../../../utils/federationOps';
|
||||
import { isElectron } from '../../../platform/platform';
|
||||
import { Toggle } from '../../ui/Toggle';
|
||||
import { useActivityStore } from '../../../stores/activityStore';
|
||||
|
||||
|
||||
function AutoLaunchSettings() {
|
||||
@@ -139,6 +140,7 @@ export function AccountPanel() {
|
||||
|
||||
const instances = useInstanceStore((s) => s.instances);
|
||||
const changePassword = useAuthStore((s) => s.changePassword);
|
||||
const showActivity = useActivityStore((s) => s.showActivity);
|
||||
|
||||
if (!user) return null;
|
||||
|
||||
@@ -775,6 +777,30 @@ export function AccountPanel() {
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ── Activity Status ── */}
|
||||
<div>
|
||||
<div className="text-[11px] font-semibold text-txt-tertiary uppercase tracking-wider mb-1.5">Activity Status</div>
|
||||
<div className="rounded-lg bg-white/[0.03] border border-white/[0.04] p-3.5">
|
||||
<div className="flex items-center justify-between py-1">
|
||||
<div>
|
||||
<div className="text-[14px] text-txt-primary">Share Activity Status</div>
|
||||
<div className="text-[12px] text-txt-tertiary mt-0.5">Allow others to see what you're up to</div>
|
||||
</div>
|
||||
<Toggle
|
||||
enabled={showActivity}
|
||||
onChange={async (enabled) => {
|
||||
try {
|
||||
await api.users.update({ showActivity: enabled });
|
||||
useActivityStore.getState().setShowActivity(enabled);
|
||||
} catch (err) {
|
||||
console.error('Failed to update activity visibility:', err);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ── Danger Zone ── */}
|
||||
<div>
|
||||
<div className="text-[11px] font-semibold text-txt-tertiary uppercase tracking-wider mb-1.5">Danger Zone</div>
|
||||
|
||||
Reference in New Issue
Block a user