julienfroidefond/workshop-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: streamline date and title handling in NewWeatherPage and NewWeeklyCheckInPage components for improved user experience
Some checks failed
Deploy with Docker Compose / deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Julien Froidefond
2026-02-04 11:02:52 +01:00
parent ef0772f894
commit e8ffccd286
4 changed files with 68 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
src/components/weather/WeatherCard.tsx
View File

@@ -128,23 +128,23 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit }: Weathe
</td>
{/* Performance */}
<td className="px-4 py-3">
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="relative">
<div className="relative mx-auto w-fit">
<select
value={performanceEmoji || ''}
onChange={(e) => handleEmojiChange('performance', e.target.value || null)}
className="w-full appearance-none rounded-lg border border-border bg-card px-3 py-2.5 pr-10 text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
className="w-16 appearance-none rounded-lg border border-border bg-card px-2 py-2.5 pr-8 text-center text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
>
{WEATHER_EMOJIS.map(({ emoji, label }) => (
{WEATHER_EMOJIS.map(({ emoji }) => (
<option key={emoji || 'none'} value={emoji}>
{emoji} {label}
{emoji}
</option>
))}
</select>
<div className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2">
<div className="pointer-events-none absolute right-2 top-1/2 -translate-y-1/2">
<svg
className="h-4 w-4 text-muted"
className="h-3 w-3 text-muted"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
@@ -159,23 +159,23 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit }: Weathe
</td>
{/* Moral */}
<td className="px-4 py-3">
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="relative">
<div className="relative mx-auto w-fit">
<select
value={moralEmoji || ''}
onChange={(e) => handleEmojiChange('moral', e.target.value || null)}
className="w-full appearance-none rounded-lg border border-border bg-card px-3 py-2.5 pr-10 text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
className="w-16 appearance-none rounded-lg border border-border bg-card px-2 py-2.5 pr-8 text-center text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
>
{WEATHER_EMOJIS.map(({ emoji, label }) => (
{WEATHER_EMOJIS.map(({ emoji }) => (
<option key={emoji || 'none'} value={emoji}>
{emoji} {label}
{emoji}
</option>
))}
</select>
<div className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2">
<div className="pointer-events-none absolute right-2 top-1/2 -translate-y-1/2">
<svg
className="h-4 w-4 text-muted"
className="h-3 w-3 text-muted"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
@@ -190,23 +190,23 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit }: Weathe
</td>
{/* Flux */}
<td className="px-4 py-3">
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="relative">
<div className="relative mx-auto w-fit">
<select
value={fluxEmoji || ''}
onChange={(e) => handleEmojiChange('flux', e.target.value || null)}
className="w-full appearance-none rounded-lg border border-border bg-card px-3 py-2.5 pr-10 text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
className="w-16 appearance-none rounded-lg border border-border bg-card px-2 py-2.5 pr-8 text-center text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
>
{WEATHER_EMOJIS.map(({ emoji, label }) => (
{WEATHER_EMOJIS.map(({ emoji }) => (
<option key={emoji || 'none'} value={emoji}>
{emoji} {label}
{emoji}
</option>
))}
</select>
<div className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2">
<div className="pointer-events-none absolute right-2 top-1/2 -translate-y-1/2">
<svg
className="h-4 w-4 text-muted"
className="h-3 w-3 text-muted"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
@@ -221,23 +221,23 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit }: Weathe
</td>
{/* Création de valeur */}
<td className="px-4 py-3">
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="relative">
<div className="relative mx-auto w-fit">
<select
value={valueCreationEmoji || ''}
onChange={(e) => handleEmojiChange('valueCreation', e.target.value || null)}
className="w-full appearance-none rounded-lg border border-border bg-card px-3 py-2.5 pr-10 text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
className="w-16 appearance-none rounded-lg border border-border bg-card px-2 py-2.5 pr-8 text-center text-lg text-foreground transition-colors hover:bg-card-hover focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20"
>
{WEATHER_EMOJIS.map(({ emoji, label }) => (
{WEATHER_EMOJIS.map(({ emoji }) => (
<option key={emoji || 'none'} value={emoji}>
{emoji} {label}
{emoji}
</option>
))}
</select>
<div className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2">
<div className="pointer-events-none absolute right-2 top-1/2 -translate-y-1/2">
<svg
className="h-4 w-4 text-muted"
className="h-3 w-3 text-muted"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
@@ -252,7 +252,7 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit }: Weathe
</td>
{/* Notes */}
<td className="px-4 py-3 min-w-[300px]">
<td className="px-4 py-3 min-w-[400px]">
{canEditThis ? (
<Textarea
value={notes}