DaX/Filamenteka
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Confluence integration and add sortable columns

Browse Source 
- Fixed Confluence API authentication using Basic auth with email
- Added /wiki path to API URL for proper endpoint
- Improved HTML parsing with cheerio for better table extraction
- Made all table columns sortable (previously only 4 were clickable)
- Removed fallback to mock data - now always uses real Confluence data
- Only color Boja column instead of entire rows for cleaner look
- Added proper error handling and logging
This commit is contained in:
DaX
2025-06-18 23:11:43 +02:00
parent 0860686019
commit 7f20d342fc
9 changed files with 711 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
src/components/FilamentTable.tsx
View File

@@ -100,17 +100,42 @@ export const FilamentTable: React.FC<FilamentTableProps> = ({ filaments, loading
>
Boja {sortField === 'boja' && (sortOrder === 'asc' ? '↑' : '↓')}
</th>
<th className="px-4 py-2 border-b border-r dark:border-gray-600 text-gray-900 dark:text-gray-100">Refill</th>
<th className="px-4 py-2 border-b border-r dark:border-gray-600 text-gray-900 dark:text-gray-100">Vakum</th>
<th className="px-4 py-2 border-b border-r dark:border-gray-600 text-gray-900 dark:text-gray-100">Otvoreno</th>
<th className="px-4 py-2 border-b border-r dark:border-gray-600 text-gray-900 dark:text-gray-100">Količina</th>
<th className="px-4 py-2 border-b dark:border-gray-600 text-gray-900 dark:text-gray-100">Cena</th>
<th
className="px-4 py-2 border-b border-r dark:border-gray-600 cursor-pointer hover:bg-gray-200 dark:hover:bg-gray-600 text-gray-900 dark:text-gray-100"
onClick={() => handleSort('refill')}
>
Refill {sortField === 'refill' && (sortOrder === 'asc' ? '↑' : '↓')}
</th>
<th
className="px-4 py-2 border-b border-r dark:border-gray-600 cursor-pointer hover:bg-gray-200 dark:hover:bg-gray-600 text-gray-900 dark:text-gray-100"
onClick={() => handleSort('vakum')}
>
Vakum {sortField === 'vakum' && (sortOrder === 'asc' ? '↑' : '↓')}
</th>
<th
className="px-4 py-2 border-b border-r dark:border-gray-600 cursor-pointer hover:bg-gray-200 dark:hover:bg-gray-600 text-gray-900 dark:text-gray-100"
onClick={() => handleSort('otvoreno')}
>
Otvoreno {sortField === 'otvoreno' && (sortOrder === 'asc' ? '↑' : '↓')}
</th>
<th
className="px-4 py-2 border-b border-r dark:border-gray-600 cursor-pointer hover:bg-gray-200 dark:hover:bg-gray-600 text-gray-900 dark:text-gray-100"
onClick={() => handleSort('kolicina')}
>
Količina {sortField === 'kolicina' && (sortOrder === 'asc' ? '↑' : '↓')}
</th>
<th
className="px-4 py-2 border-b dark:border-gray-600 cursor-pointer hover:bg-gray-200 dark:hover:bg-gray-600 text-gray-900 dark:text-gray-100"
onClick={() => handleSort('cena')}
>
Cena {sortField === 'cena' && (sortOrder === 'asc' ? '↑' : '↓')}
</th>
</tr>
</thead>
<tbody>
{filteredAndSortedFilaments.map((filament, index) => {
const colorMapping = getFilamentColor(filament.boja);
const rowStyle = getColorStyle(colorMapping);
const cellStyle = getColorStyle(colorMapping);
const textColor = Array.isArray(colorMapping.hex)
? '#000000'
: getContrastColor(colorMapping.hex);
@@ -118,24 +143,25 @@ export const FilamentTable: React.FC<FilamentTableProps> = ({ filaments, loading
return (
<tr
key={index}
className="hover:opacity-90 transition-opacity"
style={{
...rowStyle,
opacity: 0.8,
color: textColor
}}
className="hover:bg-gray-50 dark:hover:bg-gray-750 transition-colors bg-white dark:bg-gray-800"
>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">{filament.brand}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">{filament.tip}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">{filament.finish}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">
<td className="px-4 py-2 border-b border-r dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.brand}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.tip}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.finish}</td>
<td
className="px-4 py-2 border-b border-r dark:border-gray-700"
style={{
...cellStyle,
color: textColor
}}
>
<ColorCell colorName={filament.boja} />
</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">{filament.refill}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">{filament.vakum}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">{filament.otvoreno}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700">{filament.kolicina}</td>
<td className="px-4 py-2 border-b dark:border-gray-700">{filament.cena}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.refill}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.vakum}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.otvoreno}</td>
<td className="px-4 py-2 border-b border-r dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.kolicina}</td>
<td className="px-4 py-2 border-b dark:border-gray-700 text-gray-900 dark:text-gray-100">{filament.cena}</td>
</tr>
);
})}