diff --git a/app/page.tsx b/app/page.tsx index 2941071..5d8faab 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -3,10 +3,10 @@ import { useState, useEffect } from 'react'; import { FilamentTableV2 } from '../src/components/FilamentTableV2'; import { SaleCountdown } from '../src/components/SaleCountdown'; -import ColorRequestModal from '../src/components/ColorRequestModal'; import TabbedNavigation from '../src/components/TabbedNavigation'; import PrintersTable from '../src/components/PrintersTable'; import GearTable from '../src/components/GearTable'; +import ColorRequestSection from '../src/components/ColorRequestSection'; import { Filament } from '../src/types/filament'; import { filamentService } from '../src/services/api'; import { trackEvent } from '../src/components/MatomoAnalytics'; @@ -18,7 +18,6 @@ export default function Home() { const [darkMode, setDarkMode] = useState(false); const [mounted, setMounted] = useState(false); const [resetKey, setResetKey] = useState(0); - const [showColorRequestModal, setShowColorRequestModal] = useState(false); const [activeTab, setActiveTab] = useState('filaments'); // Removed V1/V2 toggle - now only using V2 @@ -179,19 +178,6 @@ export default function Home() { Pozovi +381 67 710 2845 - - {/* Tabs Navigation */} @@ -207,6 +193,15 @@ export default function Home() { ) }, + { + id: 'color-request', + label: 'Zatraži Boju', + icon: ( + + + + ) + }, { id: 'printers', label: 'Štampači', @@ -218,7 +213,7 @@ export default function Home() { }, { id: 'gear', - label: 'Oprema i Delovi', + label: 'Oprema', icon: ( @@ -257,6 +252,8 @@ export default function Home() { )} + {activeTab === 'color-request' && } + {activeTab === 'printers' && } {activeTab === 'gear' && } @@ -281,12 +278,6 @@ export default function Home() { - - {/* Color Request Modal */} - setShowColorRequestModal(false)} - /> ); } \ No newline at end of file diff --git a/src/components/ColorRequestSection.tsx b/src/components/ColorRequestSection.tsx new file mode 100644 index 0000000..bac9653 --- /dev/null +++ b/src/components/ColorRequestSection.tsx @@ -0,0 +1,72 @@ +'use client'; + +import React, { useState } from 'react'; +import ColorRequestModal from './ColorRequestModal'; +import { trackEvent } from './MatomoAnalytics'; + +export default function ColorRequestSection() { + const [showModal, setShowModal] = useState(false); + + return ( +
+
+
+
+
+ + + +
+
+ +

+ Zatražite Novu Boju +

+ +

+ Ne možete pronaći boju koju tražite u našoj ponudi? + Javite nam koju boju želite i mi ćemo je nabaviti za vas! +

+ +
+ +
+ +
+
+
1-3
+
Dana za odgovor
+
+
+
100+
+
Dostupnih boja
+
+
+
7-14
+
Dana za nabavku
+
+
+ +
+

+ Napomena: Minimalna količina za naručivanje novih boja je 2 rolne. +

+
+
+
+ + setShowModal(false)} /> +
+ ); +} \ No newline at end of file diff --git a/src/components/TabbedNavigation.tsx b/src/components/TabbedNavigation.tsx index d499183..e085d81 100644 --- a/src/components/TabbedNavigation.tsx +++ b/src/components/TabbedNavigation.tsx @@ -17,7 +17,7 @@ interface TabbedNavigationProps { export default function TabbedNavigation({ tabs, activeTab, onTabChange }: TabbedNavigationProps) { return (
-