fix: Synchronize profile modal state reactively via useEffect and add scroll container
This commit is contained in:
Vendored
+2
-2
@@ -11,8 +11,8 @@
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
<title>Schichtplaner — Veranstaltungsschichtpläne</title>
|
||||
<script type="module" crossorigin src="/assets/index-BZVfc_jb.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-DQgIbK11.css">
|
||||
<script type="module" crossorigin src="/assets/index-xAdtp-F5.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-DVt5wlUY.css">
|
||||
</head>
|
||||
<body class="bg-paper text-main font-sans antialiased min-h-screen">
|
||||
<div id="root"></div>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState } from 'react';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { X, User, Award, Check, AlertCircle, CheckCircle2 } from 'lucide-react';
|
||||
import { apiFetch } from '../api/client';
|
||||
import { getRandomSkillColor } from '../utils/colors';
|
||||
@@ -14,6 +14,17 @@ export default function ProfileModal({ user, skills = [], onClose, onUserUpdated
|
||||
safeUserSkills.map(s => (typeof s === 'object' ? s.id : s))
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (user) {
|
||||
setDisplayName(user.display_name || user.username || '');
|
||||
const uSkills = user.skills ? (Array.isArray(user.skills) ? user.skills : []) : [];
|
||||
setSelectedSkillIds(uSkills.map(s => (typeof s === 'object' ? s.id : s)));
|
||||
} else {
|
||||
setDisplayName(localStorage.getItem('guest_display_name') || '');
|
||||
setSelectedSkillIds([]);
|
||||
}
|
||||
}, [user]);
|
||||
|
||||
// New skill fields
|
||||
const [newSkillName, setNewSkillName] = useState('');
|
||||
const [newSkillDesc, setNewSkillDesc] = useState('');
|
||||
@@ -93,7 +104,7 @@ export default function ProfileModal({ user, skills = [], onClose, onUserUpdated
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/70 backdrop-blur-sm overflow-y-auto animate-in fade-in duration-200">
|
||||
<div className="bg-surface w-full max-w-lg rounded-sm border border-grid p-6 shadow-2xl relative my-8 text-main font-sans">
|
||||
<div className="bg-surface w-full max-w-lg rounded-sm border border-grid p-6 shadow-2xl relative my-8 text-main font-sans max-h-[90vh] overflow-y-auto">
|
||||
{/* Close Button */}
|
||||
<button
|
||||
onClick={onClose}
|
||||
|
||||
Reference in New Issue
Block a user