From ae27c6f87eb6d8991783082cfbe26f6c1e05e08a Mon Sep 17 00:00:00 2001
From: sebastjanartic <45803536-sebastjanartic@users.noreply.replit.com>
Date: Tue, 2 Sep 2025 13:58:14 +0000
Subject: [PATCH] Improve content type selection and input field behavior for
 videos

Update admin page dialog to conditionally disable and style input fields (Song Title, Artist/Band, Episode Title) based on the selected content type (e.g., 'oddaja', 'music_video').

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/2cd2c0bc-434c-4bc9-ad3f-b99d3897a0d1/EnQhtBc
---
 client/src/pages/admin.tsx | 27 +++++++++++++++++----------
 1 file changed, 17 insertions(+), 10 deletions(-)

diff --git a/client/src/pages/admin.tsx b/client/src/pages/admin.tsx
index b2ad345..8ffde44 100644
--- a/client/src/pages/admin.tsx
+++ b/client/src/pages/admin.tsx
@@ -363,8 +363,11 @@ function EditVideoDialog({
                   <SelectValue />
                 </SelectTrigger>
                 <SelectContent className="bg-[#2D1B69] border-white/20">
-                  <SelectItem value="video">Music Video</SelectItem>
-                  <SelectItem value="show">Show/Episode</SelectItem>
+                  <SelectItem value="music_video">Music Video</SelectItem>
+                  <SelectItem value="oddaja">Show/Episode</SelectItem>
+                  <SelectItem value="video">Video</SelectItem>
+                  <SelectItem value="documentary">Documentary</SelectItem>
+                  <SelectItem value="live">Live Performance</SelectItem>
                 </SelectContent>
               </Select>
             </div>
@@ -395,26 +398,27 @@ function EditVideoDialog({
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div>
               <Label className="text-white/90">
-                {formData.episodeTitle ? 'Show Name' : 'Song Title'}
+                {formData.contentType === 'oddaja' ? 'Show Name' : 'Song Title'}
               </Label>
               <Input
                 value={formData.title}
                 onChange={(e) => setFormData({ ...formData, title: e.target.value })}
                 className="bg-white/10 border-white/20 text-white"
-                placeholder={formData.episodeTitle ? "Show name (e.g., Die Geschichte des Liedes)..." : "Song title..."}
+                placeholder={formData.contentType === 'oddaja' ? "Show name (e.g., Die Geschichte des Liedes)..." : "Song title..."}
                 required
               />
             </div>
 
             <div>
-              <Label className="text-white/90">
-                {formData.episodeTitle ? 'Main Artist / Band' : 'Artist / Band'}
+              <Label className={`text-white/90 ${formData.contentType === 'oddaja' ? 'text-gray-500' : ''}`}>
+                Artist / Band
               </Label>
               <Input
                 value={formData.artist}
                 onChange={(e) => setFormData({ ...formData, artist: e.target.value })}
-                className="bg-white/10 border-white/20 text-white"
-                placeholder={formData.episodeTitle ? "Main artist or band name..." : "Artist or band name..."}
+                className={`bg-white/10 border-white/20 text-white ${formData.contentType === 'oddaja' ? 'bg-gray-600 text-gray-400 cursor-not-allowed' : ''}`}
+                placeholder="Artist or band name..."
+                disabled={formData.contentType === 'oddaja'}
               />
             </div>
 
@@ -429,12 +433,15 @@ function EditVideoDialog({
             </div>
 
             <div>
-              <Label className="text-white/90">Episode Title / Guest Name</Label>
+              <Label className={`text-white/90 ${formData.contentType === 'music_video' || formData.contentType === 'video' ? 'text-gray-500' : ''}`}>
+                Episode Title / Guest Name
+              </Label>
               <Input
                 value={formData.episodeTitle}
                 onChange={(e) => setFormData({ ...formData, episodeTitle: e.target.value })}
-                className="bg-white/10 border-white/20 text-white"
+                className={`bg-white/10 border-white/20 text-white ${formData.contentType === 'music_video' || formData.contentType === 'video' ? 'bg-gray-600 text-gray-400 cursor-not-allowed' : ''}`}
                 placeholder="e.g., Ansambel Zupan"
+                disabled={formData.contentType === 'music_video' || formData.contentType === 'video'}
               />
             </div>