Update material finish options and spool-only configurations

- Add Metal and Silk+ finishes as spool-only for PLA
- Add PPA material with CF finish (spool-only, black color only)
- Add PA6 material with CF and GF finishes (spool-only)
- Add FR finish option for PC material (spool-only)
- Disable refill price field when refill option is disabled
- Add color filtering for PPA CF to show only black colors

app/upadaj/dashboard/page.tsx

@@ -40,8 +40,17 @@ const isRefillOnly = (color: string, finish?: string): boolean => {
 };
 
 // Helper function to check if a filament is spool-only
-const isSpoolOnly = (finish?: string): boolean => {
+const isSpoolOnly = (finish?: string, type?: string): boolean => {
-  return finish === 'Translucent';
+  return finish === 'Translucent' || finish === 'Metal' || finish === 'Silk+' || (type === 'PPA' && finish === 'CF') || type === 'PA6' || type === 'PC';
+};
+
+// Helper function to filter colors based on material and finish
+const getFilteredColors = (colors: Array<{id: string, name: string, hex: string, cena_refill?: number, cena_spulna?: number}>, type?: string, finish?: string) => {
+  // PPA CF only has black color
+  if (type === 'PPA' && finish === 'CF') {
+    return colors.filter(color => color.name.toLowerCase() === 'black');
+  }
+  return colors;
 };
 
 interface FilamentWithId extends Filament {
@@ -57,9 +66,11 @@ const FINISH_OPTIONS_BY_TYPE: Record<string, string[]> = {
   'PLA': ['85A', '90A', '95A HF', 'Aero', 'Basic', 'Basic Gradient', 'CF', 'FR', 'Galaxy', 'GF', 'Glow', 'HF', 'Marble', 'Matte', 'Metal', 'Silk Multi-Color', 'Silk+', 'Sparkle', 'Translucent', 'Wood'],
   'TPU': ['85A', '90A', '95A HF'],
   'PETG': ['Basic', 'CF', 'FR', 'HF', 'Translucent'],
-  'PC': ['CF', 'Bez Finisha'],
+  'PC': ['CF', 'FR', 'Bez Finisha'],
   'ASA': ['Bez Finisha'],
   'PA': ['CF', 'GF', 'Bez Finisha'],
+  'PA6': ['CF', 'GF'],
+  'PPA': ['CF'],
   'PVA': ['Bez Finisha'],
   'HIPS': ['Bez Finisha']
 };
@@ -669,7 +680,7 @@ function FilamentForm({
     finish: filament.finish || (filament.id ? '' : 'Basic'), // Default to Basic for new filaments
     boja: filament.boja || '',
     boja_hex: filament.boja_hex || '',
-    refill: isSpoolOnly(filament.finish) ? 0 : (filament.refill || 0),  // Store as number
+    refill: isSpoolOnly(filament.finish, filament.tip) ? 0 : (filament.refill || 0),  // Store as number
     spulna: isRefillOnly(filament.boja || '', filament.finish) ? 0 : (filament.spulna || 0), // Store as number
     kolicina: filament.kolicina || 0,  // Default to 0, stored as number
     cena: '', // Price is now determined by color selection
@@ -722,10 +733,15 @@ function FilamentForm({
       // If changing filament type, reset finish if it's not compatible
       const newTypeFinishes = FINISH_OPTIONS_BY_TYPE[value] || [];
       const resetFinish = !newTypeFinishes.includes(formData.finish);
+      const spoolOnly = isSpoolOnly(formData.finish, value);
+      // If changing to PPA with CF finish and current color is not black, reset color
+      const needsColorReset = value === 'PPA' && formData.finish === 'CF' && formData.boja.toLowerCase() !== 'black';
       setFormData({
         ...formData,
         [name]: value,
-        ...(resetFinish ? { finish: '' } : {})
+        ...(resetFinish ? { finish: '' } : {}),
+        ...(spoolOnly ? { refill: 0 } : {}),
+        ...(needsColorReset ? { boja: '' } : {})
       });
     } else if (name === 'boja') {
       // If changing to a refill-only color, reset spulna to 0
@@ -738,12 +754,15 @@ function FilamentForm({
     } else if (name === 'finish') {
       // If changing to Translucent finish, enable spool option and disable refill
       const refillOnly = isRefillOnly(formData.boja, value);
-      const spoolOnly = isSpoolOnly(value);
+      const spoolOnly = isSpoolOnly(value, formData.tip);
+      // If changing to PPA CF and current color is not black, reset color
+      const needsColorReset = formData.tip === 'PPA' && value === 'CF' && formData.boja.toLowerCase() !== 'black';
       setFormData({
         ...formData,
         [name]: value,
         ...(refillOnly ? { spulna: 0 } : {}),
-        ...(spoolOnly ? { refill: 0 } : {})
+        ...(spoolOnly ? { refill: 0 } : {}),
+        ...(needsColorReset ? { boja: '' } : {})
       });
     } else {
       setFormData({
@@ -876,7 +895,7 @@ function FilamentForm({
             className="custom-select w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500"
           >
             <option value="">Izaberite boju</option>
-            {availableColors.map(color => (
+            {getFilteredColors(availableColors, formData.tip, formData.finish).map(color => (
               <option key={color.id} value={color.name}>
                 {color.name}
               </option>
@@ -916,7 +935,12 @@ function FilamentForm({
             min="0"
             step="1"
             placeholder="3499"
-            className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-green-600 dark:text-green-400 font-bold focus:outline-none focus:ring-2 focus:ring-green-500"
+            disabled={isSpoolOnly(formData.finish, formData.tip)}
+            className={`w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md ${
+              isSpoolOnly(formData.finish, formData.tip) 
+                ? 'bg-gray-100 dark:bg-gray-600 cursor-not-allowed' 
+                : 'bg-white dark:bg-gray-700'
+            } text-green-600 dark:text-green-400 font-bold focus:outline-none focus:ring-2 focus:ring-green-500`}
           />
         </div>
 
@@ -945,7 +969,7 @@ function FilamentForm({
         <div>
           <label className="block text-sm font-medium mb-1 text-gray-700 dark:text-gray-300">
             Refill
-            {isSpoolOnly(formData.finish) && (
+            {isSpoolOnly(formData.finish, formData.tip) && (
               <span className="text-xs text-gray-500 dark:text-gray-400 ml-2">(samo spulna postoji)</span>
             )}
           </label>
@@ -957,9 +981,9 @@ function FilamentForm({
             min="0"
             step="1"
             placeholder="0"
-            disabled={isSpoolOnly(formData.finish)}
+            disabled={isSpoolOnly(formData.finish, formData.tip)}
             className={`w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md ${
-              isSpoolOnly(formData.finish) 
+              isSpoolOnly(formData.finish, formData.tip) 
                 ? 'bg-gray-100 dark:bg-gray-600 cursor-not-allowed' 
                 : 'bg-white dark:bg-gray-700'
             } text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500`}