This commit is contained in:
DirkSchlossmacher 2023-11-14 09:42:26 +01:00
parent 45ec58b8ea
commit 68706346b3

View File

@ -36,46 +36,44 @@ const UsageStats: React.FC<{ onClose: () => void }> = ({ onClose }) => {
return ( return (
<div className={styles.usageStatsContainer}> <div className={styles.usageStatsContainer}>
<div className={styles.usageStatsModal}> <div className={styles.usageStatsModal}>
<h1>Usage Stats</h1> <h1>Usage Stats</h1>
<select value={selectedDateKey} onChange={handleDateChange}> <select value={selectedDateKey} onChange={handleDateChange}>
{dateKeys.map(dateKey => ( {dateKeys.map(dateKey => (
<option key={dateKey} value={dateKey}> <option key={dateKey} value={dateKey}>
{dateKey} {dateKey}
</option> </option>
))} ))}
</select> </select>
<p>Number of events: {signInCount}</p> <p>Number of events: {signInCount}</p>
<button onClick={handleDrillDown}>Drill-down</button> <button onClick={handleDrillDown}>Drill-down</button>
<div> {/* Wrap the conditional block and the button with a div or fragment */}
{showDrillDown && ( <div>
{showDrillDown && (
<table>
{/* ... other UI elements ... */} <thead>
<tr>
<table> <th>Email</th>
<thead> <th>Count</th>
<tr> </tr>
<th>Email</th> </thead>
<th>Count</th> <tbody>
{Object.entries(userDetails).map(([email, count]) => (
<tr key={email}>
<td>{email}</td>
<td>{count}</td>
</tr> </tr>
</thead> ))}
<tbody> </tbody>
{Object.entries(userDetails).map(([email, count]) => ( </table>
<tr key={email}> )}
<td>{email}</td>
<td>{count}</td>
</tr>
))}
</tbody>
</table>
)}
<button className={styles.closeButton} onClick={onClose}> <button className={styles.closeButton} onClick={onClose}>
Close Close
</button> </button>
</div> </div>
</div> </div>
</div> </div>
); );
}; };
export default UsageStats; export default UsageStats;