Stabilisér tømrer og materiale tabs med proper state management

- Tilføj explicit data loading når tabs aktiveres
- Implementer loading og error states for bedre UX
- Clear state ved view skift for at undgå stale data
- Disable form inputs under loading
- Tilføj fallback beskeder for tomme kategorier
- Ensartet struktur med andre stabile tabs som OpenAI budget

frontend/src/App.js

@@ -546,10 +546,16 @@ function App() {
   React.useEffect(() => {
     if (selectedCategory) {
       if (currentView === 'labor-prices') {
+        setLaborPrices([]); // Clear existing data
         loadLaborPrices(selectedCategory);
       } else if (currentView === 'material-prices') {
+        setMaterialPrices([]); // Clear existing data
         loadMaterialPrices(selectedCategory);
       }
+    } else {
+      // Clear data when no category selected
+      setLaborPrices([]);
+      setMaterialPrices([]);
     }
   }, [selectedCategory, currentView]);
 
@@ -698,13 +704,25 @@ function App() {
             </button>
             <button 
               className={`nav-btn ${currentView === 'labor-prices' ? 'active' : ''}`}
-              onClick={() => setCurrentView('labor-prices')}
+              onClick={() => {
+                setCurrentView('labor-prices');
+                setError('');
+                loadCategories();
+                setSelectedCategory('');
+                setLaborPrices([]);
+              }}
             >
               👷 Tømrer Priser
             </button>
             <button 
               className={`nav-btn ${currentView === 'material-prices' ? 'active' : ''}`}
-              onClick={() => setCurrentView('material-prices')}
+              onClick={() => {
+                setCurrentView('material-prices');
+                setError('');
+                loadCategories();
+                setSelectedCategory('');
+                setMaterialPrices([]);
+              }}
             >
               🧱 Materiale Priser
             </button>
@@ -965,12 +983,25 @@ function App() {
               <h2>👷 Tømrer Priser</h2>
               <p>Se tidligere arbejdspriser og tilføj nye timelønssatser for forskellige projekttyper.</p>
               
+              {error && (
+                <div className="error">
+                  {error}
+                </div>
+              )}
+              
+              {loading && (
+                <div className="loading">
+                  Indlæser data...
+                </div>
+              )}
+              
               <div className="category-selector">
                 <label htmlFor="category-select">Vælg projekttype:</label>
                 <select
                   id="category-select"
                   value={selectedCategory}
                   onChange={(e) => setSelectedCategory(e.target.value)}
+                  disabled={loading}
                 >
                   <option value="">Vælg kategori...</option>
                   {categories.projectTypes && categories.projectTypes.map(type => (
@@ -1249,12 +1280,25 @@ function App() {
               <h2>🧱 Materiale Priser</h2>
               <p>Se tidligere materialepriser og tilføj nye priser fra leverandører.</p>
               
+              {error && (
+                <div className="error">
+                  {error}
+                </div>
+              )}
+              
+              {loading && (
+                <div className="loading">
+                  Indlæser data...
+                </div>
+              )}
+              
               <div className="category-selector">
                 <label htmlFor="material-category-select">Vælg materialekategori:</label>
                 <select
                   id="material-category-select"
                   value={selectedCategory}
                   onChange={(e) => setSelectedCategory(e.target.value)}
+                  disabled={loading}
                 >
                   <option value="">Vælg kategori...</option>
                   {categories.materialCategories && categories.materialCategories.map(cat => (