1 | import React, { useEffect, useState } from "react";
|
---|
2 | import logo from "../Images/logo.png";
|
---|
3 | import "../styles/Header.css";
|
---|
4 | import SearchIcon from "@mui/icons-material/Search";
|
---|
5 | import AccountCircleIcon from "@mui/icons-material/AccountCircle";
|
---|
6 | //import ShoppingBasketIcon from '@mui/icons-material/ShoppingBasket';
|
---|
7 | import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
|
---|
8 | import WeekendIcon from "@mui/icons-material/Weekend";
|
---|
9 | import MeetingRoomIcon from "@mui/icons-material/MeetingRoom";
|
---|
10 | import TableRestaurantIcon from "@mui/icons-material/TableRestaurant";
|
---|
11 | import BedIcon from "@mui/icons-material/Bed";
|
---|
12 | import KitchenIcon from "@mui/icons-material/Kitchen";
|
---|
13 | import ChairAltIcon from "@mui/icons-material/ChairAlt";
|
---|
14 | import BedroomChildIcon from "@mui/icons-material/BedroomChild";
|
---|
15 | import DeckIcon from "@mui/icons-material/Deck";
|
---|
16 | import ShoppingBasketIcon from "@mui/icons-material/ShoppingCart";
|
---|
17 | import MenuIcon from "@mui/icons-material/Menu";
|
---|
18 | import { Link, NavLink, useNavigate } from "react-router-dom";
|
---|
19 | import logo2 from "../Images/logo2.png";
|
---|
20 | import Badge from "react-bootstrap/Badge";
|
---|
21 | import ArrowBackIcon from "@mui/icons-material/ArrowBack";
|
---|
22 | import { Store } from "../Store";
|
---|
23 | import { useContext } from "react";
|
---|
24 | import NavDropdown from "react-bootstrap/NavDropdown";
|
---|
25 | import { height } from "@mui/system";
|
---|
26 | import Axios from "axios";
|
---|
27 | import CategoryMenu from "./CategoryMenu";
|
---|
28 |
|
---|
29 | const toggleMenu = (event) => {
|
---|
30 | event.stopPropagation();
|
---|
31 | let menu = document.querySelector(".mobile-menu-container");
|
---|
32 | menu.classList.remove("hidden");
|
---|
33 | menu.classList.add("visible");
|
---|
34 | };
|
---|
35 |
|
---|
36 | const toggleSubMenu = (event) => {
|
---|
37 | event.stopPropagation();
|
---|
38 | let menu = document.querySelector(".subDropdown");
|
---|
39 | menu.classList.remove("hidden");
|
---|
40 | menu.classList.add("visible");
|
---|
41 | let tog = document.querySelector(".subMenu");
|
---|
42 | tog.removeAttribute("onClick");
|
---|
43 | console.log("SubMenu Visible");
|
---|
44 | };
|
---|
45 |
|
---|
46 | const categoryMenuTrigger = (event) => {
|
---|
47 | event.stopPropagation();
|
---|
48 | let span = event.target;
|
---|
49 | let menu = document.querySelector(`.${span.classList[0]}-menu`);
|
---|
50 | menu.classList.remove("hidden");
|
---|
51 | menu.classList.add("visible");
|
---|
52 | };
|
---|
53 |
|
---|
54 | const closeMenu = (event) => {
|
---|
55 | let menu = document.querySelector(".mobile-menu-container");
|
---|
56 | menu.classList.remove("visible");
|
---|
57 | menu.classList.add("hidden");
|
---|
58 | };
|
---|
59 |
|
---|
60 | const backToMenu = (event) => {
|
---|
61 | event.stopPropagation();
|
---|
62 | let menu1 = document.querySelector(".subDropdown");
|
---|
63 | menu1.classList.remove("visible");
|
---|
64 | menu1.classList.add("hidden");
|
---|
65 | console.log("SubMenu Invisible");
|
---|
66 | };
|
---|
67 |
|
---|
68 | const backToSubMenu = (event) => {
|
---|
69 | event.stopPropagation();
|
---|
70 | let menu = document.querySelector(`.${event.target.classList[0]}-menu`);
|
---|
71 | menu.classList.remove("visible");
|
---|
72 | menu.classList.add("hidden");
|
---|
73 | };
|
---|
74 |
|
---|
75 | function Header() {
|
---|
76 | const { state, dispatch: ctxDispatch } = useContext(Store);
|
---|
77 | const { cart, userInfo } = state;
|
---|
78 | const navigate = useNavigate();
|
---|
79 |
|
---|
80 | const [categories, setCategories] = useState([]);
|
---|
81 | //const []
|
---|
82 |
|
---|
83 | const signoutHandler = () => {
|
---|
84 | ctxDispatch({ type: "USER_SIGNOUT" });
|
---|
85 | localStorage.removeItem("userInfo");
|
---|
86 | localStorage.removeItem("shippingAddress");
|
---|
87 | localStorage.removeItem("paymentMethod");
|
---|
88 | window.location.href = "/signin";
|
---|
89 | };
|
---|
90 |
|
---|
91 | const searchHandler = () => {
|
---|
92 | let text = document.querySelector(".header__searchInput").value;
|
---|
93 | console.log(text);
|
---|
94 | navigate(`/products/search?text=${text}`);
|
---|
95 | };
|
---|
96 |
|
---|
97 | useEffect(() => {
|
---|
98 | const fetchData = async () => {
|
---|
99 | const cat = await Axios.get(`/api/category/getCategories`);
|
---|
100 | categories.splice(0, categories.length);
|
---|
101 | for (let i = 0; i < cat.data.length; i++) {
|
---|
102 | categories.push(cat.data[i]);
|
---|
103 | }
|
---|
104 | console.log(categories[0]);
|
---|
105 | };
|
---|
106 | fetchData();
|
---|
107 | }, [categories]);
|
---|
108 | const results = [];
|
---|
109 | const results1 = [];
|
---|
110 | const results2 = [];
|
---|
111 | const results3 = [];
|
---|
112 | if (categories) createMenu(categories);
|
---|
113 | function createMenu(categories) {
|
---|
114 | /*
|
---|
115 | let ul = document.getElementById("category-ul-1");
|
---|
116 | for(let i=0;i<categories.length;i++){
|
---|
117 | ul.appendChild()
|
---|
118 | }*/
|
---|
119 | results.splice(0, results.length);
|
---|
120 | categories.forEach((category) => {
|
---|
121 | results.push(<CategoryMenu category={category} />);
|
---|
122 | });
|
---|
123 | for (let i = 0; i < categories.length; i++) {
|
---|
124 | if (i < 3) {
|
---|
125 | results1.push(<CategoryMenu category={categories[i]} />);
|
---|
126 | } else if (i < 5) {
|
---|
127 | results2.push(<CategoryMenu category={categories[i]} />);
|
---|
128 | } else {
|
---|
129 | results3.push(<CategoryMenu category={categories[i]} />);
|
---|
130 | }
|
---|
131 | }
|
---|
132 | console.log("Results:");
|
---|
133 | console.log(categories);
|
---|
134 | }
|
---|
135 |
|
---|
136 | return (
|
---|
137 | <div className="header">
|
---|
138 | <div className="header__iconContainer">
|
---|
139 | <MenuIcon
|
---|
140 | className="header__icon"
|
---|
141 | fontSize="large"
|
---|
142 | onClick={toggleMenu}
|
---|
143 | />
|
---|
144 | <img
|
---|
145 | className="header__icon"
|
---|
146 | src={logo2}
|
---|
147 | alt="logo"
|
---|
148 | onClick={() => {
|
---|
149 | navigate("/");
|
---|
150 | }}
|
---|
151 | ></img>
|
---|
152 | </div>
|
---|
153 | <div className="mobile-menu-container hidden">
|
---|
154 | <div className="closeBtn" onClick={closeMenu}>
|
---|
155 | x
|
---|
156 | </div>
|
---|
157 | <ul className="mobile-menu">
|
---|
158 | <Link
|
---|
159 | to="/"
|
---|
160 | style={{ textDecoration: "none", color: "black" }}
|
---|
161 | onClick={closeMenu}
|
---|
162 | >
|
---|
163 | <li>Почетна</li>
|
---|
164 | </Link>
|
---|
165 | <li onClick={toggleSubMenu} className="subMenu">
|
---|
166 | Производи <ArrowDropDownIcon />
|
---|
167 | <div className="subDropdown hidden">
|
---|
168 | <div className="backBtn" onClick={backToMenu}>
|
---|
169 | <ArrowBackIcon />
|
---|
170 | Назад
|
---|
171 | </div>
|
---|
172 | <ul className="mobile-submenu">
|
---|
173 | <li
|
---|
174 | className="category-menu-trigger"
|
---|
175 | onClick={categoryMenuTrigger}
|
---|
176 | >
|
---|
177 | <span className="dnevna">
|
---|
178 | <WeekendIcon /> Дневна
|
---|
179 | </span>
|
---|
180 | <div className="category-menu dnevna-menu hidden">
|
---|
181 | <div onClick={backToSubMenu} className="dnevna">
|
---|
182 | <ArrowBackIcon />
|
---|
183 | Назад
|
---|
184 | </div>
|
---|
185 | <ul>
|
---|
186 | <li>
|
---|
187 | <Link
|
---|
188 | to="/products/dnevna/agolni-garnituri"
|
---|
189 | style={{
|
---|
190 | textDecoration: "none",
|
---|
191 | color: "black",
|
---|
192 | width: "100%",
|
---|
193 | height: "100%",
|
---|
194 | display: "flex",
|
---|
195 | justifyContent: "center",
|
---|
196 | alignItems: "center",
|
---|
197 | }}
|
---|
198 | >
|
---|
199 | Аголни гарнитури
|
---|
200 | </Link>
|
---|
201 | </li>
|
---|
202 | <li>
|
---|
203 | <Link
|
---|
204 | to="/products/dnevna/sofi"
|
---|
205 | style={{
|
---|
206 | textDecoration: "none",
|
---|
207 | color: "black",
|
---|
208 | width: "100%",
|
---|
209 | height: "100%",
|
---|
210 | display: "flex",
|
---|
211 | justifyContent: "center",
|
---|
212 | alignItems: "center",
|
---|
213 | }}
|
---|
214 | >
|
---|
215 | Софи
|
---|
216 | </Link>
|
---|
217 | </li>
|
---|
218 | <li>
|
---|
219 | <Link
|
---|
220 | to="/products/dnevna/fotelji"
|
---|
221 | style={{
|
---|
222 | textDecoration: "none",
|
---|
223 | color: "black",
|
---|
224 | width: "100%",
|
---|
225 | height: "100%",
|
---|
226 | display: "flex",
|
---|
227 | justifyContent: "center",
|
---|
228 | alignItems: "center",
|
---|
229 | }}
|
---|
230 | >
|
---|
231 | Фотелји
|
---|
232 | </Link>
|
---|
233 | </li>
|
---|
234 | <li>
|
---|
235 | <Link
|
---|
236 | to="/products/dnevna/taburetki"
|
---|
237 | style={{
|
---|
238 | textDecoration: "none",
|
---|
239 | color: "black",
|
---|
240 | width: "100%",
|
---|
241 | height: "100%",
|
---|
242 | display: "flex",
|
---|
243 | justifyContent: "center",
|
---|
244 | alignItems: "center",
|
---|
245 | }}
|
---|
246 | >
|
---|
247 | Табуретки
|
---|
248 | </Link>
|
---|
249 | </li>
|
---|
250 | <li>
|
---|
251 | <Link
|
---|
252 | to="/products/dnevna/klub-masi"
|
---|
253 | style={{
|
---|
254 | textDecoration: "none",
|
---|
255 | color: "black",
|
---|
256 | width: "100%",
|
---|
257 | height: "100%",
|
---|
258 | display: "flex",
|
---|
259 | justifyContent: "center",
|
---|
260 | alignItems: "center",
|
---|
261 | }}
|
---|
262 | >
|
---|
263 | Клуб Маси
|
---|
264 | </Link>
|
---|
265 | </li>
|
---|
266 | <li>
|
---|
267 | <Link
|
---|
268 | to="/products/dnevna/tv-komodi"
|
---|
269 | style={{
|
---|
270 | textDecoration: "none",
|
---|
271 | color: "black",
|
---|
272 | width: "100%",
|
---|
273 | height: "100%",
|
---|
274 | display: "flex",
|
---|
275 | justifyContent: "center",
|
---|
276 | alignItems: "center",
|
---|
277 | }}
|
---|
278 | >
|
---|
279 | ТВ Комоди
|
---|
280 | </Link>
|
---|
281 | </li>
|
---|
282 | <li>
|
---|
283 | <Link
|
---|
284 | to="/products/dnevna/komodi"
|
---|
285 | style={{
|
---|
286 | textDecoration: "none",
|
---|
287 | color: "black",
|
---|
288 | width: "100%",
|
---|
289 | height: "100%",
|
---|
290 | display: "flex",
|
---|
291 | justifyContent: "center",
|
---|
292 | alignItems: "center",
|
---|
293 | }}
|
---|
294 | >
|
---|
295 | Комоди
|
---|
296 | </Link>
|
---|
297 | </li>
|
---|
298 | </ul>
|
---|
299 | </div>
|
---|
300 | </li>
|
---|
301 | <li
|
---|
302 | className="category-menu-trigger"
|
---|
303 | onClick={categoryMenuTrigger}
|
---|
304 | >
|
---|
305 | <span className="hodnik">
|
---|
306 | <MeetingRoomIcon />
|
---|
307 | Ходник
|
---|
308 | </span>
|
---|
309 | <div className="category-menu hodnik-menu hidden">
|
---|
310 | <div onClick={backToSubMenu} className="hodnik">
|
---|
311 | <ArrowBackIcon />
|
---|
312 | Назад
|
---|
313 | </div>
|
---|
314 | <ul>
|
---|
315 | <li>
|
---|
316 | <Link
|
---|
317 | to="/products/hodnik/skafovi-za-cevli"
|
---|
318 | style={{
|
---|
319 | textDecoration: "none",
|
---|
320 | color: "black",
|
---|
321 | width: "100%",
|
---|
322 | height: "100%",
|
---|
323 | display: "flex",
|
---|
324 | justifyContent: "center",
|
---|
325 | alignItems: "center",
|
---|
326 | }}
|
---|
327 | >
|
---|
328 | Шкафови за чевли
|
---|
329 | </Link>
|
---|
330 | </li>
|
---|
331 | <li>
|
---|
332 | <Link
|
---|
333 | to="/products/hodnik/zakacalki-i-ogledala"
|
---|
334 | style={{
|
---|
335 | textDecoration: "none",
|
---|
336 | color: "black",
|
---|
337 | width: "100%",
|
---|
338 | height: "100%",
|
---|
339 | display: "flex",
|
---|
340 | justifyContent: "center",
|
---|
341 | alignItems: "center",
|
---|
342 | }}
|
---|
343 | >
|
---|
344 | Закачалки и огледала
|
---|
345 | </Link>
|
---|
346 | </li>
|
---|
347 | <li>
|
---|
348 | <Link
|
---|
349 | to="/products/hodnik/kolekcii-za-hodnik"
|
---|
350 | style={{
|
---|
351 | textDecoration: "none",
|
---|
352 | color: "black",
|
---|
353 | width: "100%",
|
---|
354 | height: "100%",
|
---|
355 | display: "flex",
|
---|
356 | justifyContent: "center",
|
---|
357 | alignItems: "center",
|
---|
358 | }}
|
---|
359 | >
|
---|
360 | Колекции за ходник
|
---|
361 | </Link>
|
---|
362 | </li>
|
---|
363 | </ul>
|
---|
364 | </div>
|
---|
365 | </li>
|
---|
366 | <li
|
---|
367 | className="category-menu-trigger"
|
---|
368 | onClick={categoryMenuTrigger}
|
---|
369 | >
|
---|
370 | <span className="kujna">
|
---|
371 | <KitchenIcon />
|
---|
372 | Кујна
|
---|
373 | </span>
|
---|
374 | <div className="category-menu kujna-menu hidden">
|
---|
375 | <div onClick={backToSubMenu} className="kujna">
|
---|
376 | <ArrowBackIcon />
|
---|
377 | Назад
|
---|
378 | </div>
|
---|
379 | <ul>
|
---|
380 | <li>
|
---|
381 | <Link
|
---|
382 | to="/products/kujna/kujnski-agolni-garnituri"
|
---|
383 | style={{
|
---|
384 | textDecoration: "none",
|
---|
385 | color: "black",
|
---|
386 | width: "100%",
|
---|
387 | height: "100%",
|
---|
388 | display: "flex",
|
---|
389 | justifyContent: "center",
|
---|
390 | alignItems: "center",
|
---|
391 | }}
|
---|
392 | >
|
---|
393 | Кујнски аголни гарнитури
|
---|
394 | </Link>
|
---|
395 | </li>
|
---|
396 | <li>
|
---|
397 | <Link
|
---|
398 | to="/products/kujna/standarni-kujni"
|
---|
399 | style={{
|
---|
400 | textDecoration: "none",
|
---|
401 | color: "black",
|
---|
402 | width: "100%",
|
---|
403 | height: "100%",
|
---|
404 | display: "flex",
|
---|
405 | justifyContent: "center",
|
---|
406 | alignItems: "center",
|
---|
407 | }}
|
---|
408 | >
|
---|
409 | Стандардни кујни
|
---|
410 | </Link>
|
---|
411 | </li>
|
---|
412 | </ul>
|
---|
413 | </div>
|
---|
414 | </li>
|
---|
415 | <li
|
---|
416 | className="category-menu-trigger"
|
---|
417 | onClick={categoryMenuTrigger}
|
---|
418 | >
|
---|
419 | <span className="spalna">
|
---|
420 | <BedIcon />
|
---|
421 | Спална
|
---|
422 | </span>
|
---|
423 | <div className="category-menu spalna-menu hidden">
|
---|
424 | <div onClick={backToSubMenu} className="spalna">
|
---|
425 | <ArrowBackIcon />
|
---|
426 | Назад
|
---|
427 | </div>
|
---|
428 | <ul>
|
---|
429 | <li>
|
---|
430 | <Link
|
---|
431 | to="/products/spalna/spalni-kompleti"
|
---|
432 | style={{
|
---|
433 | textDecoration: "none",
|
---|
434 | color: "black",
|
---|
435 | width: "100%",
|
---|
436 | height: "100%",
|
---|
437 | display: "flex",
|
---|
438 | justifyContent: "center",
|
---|
439 | alignItems: "center",
|
---|
440 | }}
|
---|
441 | >
|
---|
442 | Спални комплети
|
---|
443 | </Link>
|
---|
444 | </li>
|
---|
445 |
|
---|
446 | <li>
|
---|
447 | <Link
|
---|
448 | to="/products/spalna/lezai"
|
---|
449 | style={{
|
---|
450 | textDecoration: "none",
|
---|
451 | color: "black",
|
---|
452 | width: "100%",
|
---|
453 | height: "100%",
|
---|
454 | display: "flex",
|
---|
455 | justifyContent: "center",
|
---|
456 | alignItems: "center",
|
---|
457 | }}
|
---|
458 | >
|
---|
459 | Лежаи
|
---|
460 | </Link>
|
---|
461 | </li>
|
---|
462 |
|
---|
463 | <li>
|
---|
464 | <Link
|
---|
465 | to="/products/spalna/kreveti"
|
---|
466 | style={{
|
---|
467 | textDecoration: "none",
|
---|
468 | color: "black",
|
---|
469 | width: "100%",
|
---|
470 | height: "100%",
|
---|
471 | display: "flex",
|
---|
472 | justifyContent: "center",
|
---|
473 | alignItems: "center",
|
---|
474 | }}
|
---|
475 | >
|
---|
476 | Кревети
|
---|
477 | </Link>
|
---|
478 | </li>
|
---|
479 |
|
---|
480 | <li>
|
---|
481 | <Link
|
---|
482 | to="/products/spalna/plakari"
|
---|
483 | style={{
|
---|
484 | textDecoration: "none",
|
---|
485 | color: "black",
|
---|
486 | width: "100%",
|
---|
487 | height: "100%",
|
---|
488 | display: "flex",
|
---|
489 | justifyContent: "center",
|
---|
490 | alignItems: "center",
|
---|
491 | }}
|
---|
492 | >
|
---|
493 | Плакари
|
---|
494 | </Link>
|
---|
495 | </li>
|
---|
496 | <li>
|
---|
497 | <Link
|
---|
498 | to="/products/spalna/nokni-skafcinja"
|
---|
499 | style={{
|
---|
500 | textDecoration: "none",
|
---|
501 | color: "black",
|
---|
502 | width: "100%",
|
---|
503 | height: "100%",
|
---|
504 | display: "flex",
|
---|
505 | justifyContent: "center",
|
---|
506 | alignItems: "center",
|
---|
507 | }}
|
---|
508 | >
|
---|
509 | Ноќни шкафчиња
|
---|
510 | </Link>
|
---|
511 | </li>
|
---|
512 | <li>
|
---|
513 | <Link
|
---|
514 | to="/products/spalna/toaletni-masi"
|
---|
515 | style={{
|
---|
516 | textDecoration: "none",
|
---|
517 | color: "black",
|
---|
518 | width: "100%",
|
---|
519 | height: "100%",
|
---|
520 | display: "flex",
|
---|
521 | justifyContent: "center",
|
---|
522 | alignItems: "center",
|
---|
523 | }}
|
---|
524 | >
|
---|
525 | Тоалетни маси
|
---|
526 | </Link>
|
---|
527 | </li>
|
---|
528 | </ul>
|
---|
529 | </div>
|
---|
530 | </li>
|
---|
531 | <li
|
---|
532 | className="category-menu-trigger"
|
---|
533 | onClick={categoryMenuTrigger}
|
---|
534 | >
|
---|
535 | <span className="gradina">
|
---|
536 | <DeckIcon />
|
---|
537 | Градина
|
---|
538 | </span>
|
---|
539 | <div className="category-menu gradina-menu hidden">
|
---|
540 | <div onClick={backToSubMenu} className="gradina">
|
---|
541 | <ArrowBackIcon />
|
---|
542 | Назад
|
---|
543 | </div>
|
---|
544 | <ul>
|
---|
545 | <li>
|
---|
546 | <Link
|
---|
547 | to="/products/gradina/gradinarski-kompleti"
|
---|
548 | style={{
|
---|
549 | textDecoration: "none",
|
---|
550 | color: "black",
|
---|
551 | width: "100%",
|
---|
552 | height: "100%",
|
---|
553 | display: "flex",
|
---|
554 | justifyContent: "center",
|
---|
555 | alignItems: "center",
|
---|
556 | }}
|
---|
557 | >
|
---|
558 | Градинарски комплети
|
---|
559 | </Link>
|
---|
560 | </li>
|
---|
561 | <li>
|
---|
562 | <Link
|
---|
563 | to="/products/gradina/gradinarski-lulki"
|
---|
564 | style={{
|
---|
565 | textDecoration: "none",
|
---|
566 | color: "black",
|
---|
567 | width: "100%",
|
---|
568 | height: "100%",
|
---|
569 | display: "flex",
|
---|
570 | justifyContent: "center",
|
---|
571 | alignItems: "center",
|
---|
572 | }}
|
---|
573 | >
|
---|
574 | Градинарски лулки
|
---|
575 | </Link>
|
---|
576 | </li>
|
---|
577 | <li>
|
---|
578 | <Link
|
---|
579 | to="/products/gradina/gradinarski-cadori"
|
---|
580 | style={{
|
---|
581 | textDecoration: "none",
|
---|
582 | color: "black",
|
---|
583 | width: "100%",
|
---|
584 | height: "100%",
|
---|
585 | display: "flex",
|
---|
586 | justifyContent: "center",
|
---|
587 | alignItems: "center",
|
---|
588 | }}
|
---|
589 | >
|
---|
590 | Градинарски чадори
|
---|
591 | </Link>
|
---|
592 | </li>
|
---|
593 | <li>
|
---|
594 | <Link
|
---|
595 | to="/products/gradina/gradinarski-masi"
|
---|
596 | style={{
|
---|
597 | textDecoration: "none",
|
---|
598 | color: "black",
|
---|
599 | width: "100%",
|
---|
600 | height: "100%",
|
---|
601 | display: "flex",
|
---|
602 | justifyContent: "center",
|
---|
603 | alignItems: "center",
|
---|
604 | }}
|
---|
605 | >
|
---|
606 | Градинарски маси
|
---|
607 | </Link>
|
---|
608 | </li>
|
---|
609 | <li>
|
---|
610 | <Link
|
---|
611 | to="/products/gradina/gradinarski-stolovi"
|
---|
612 | style={{
|
---|
613 | textDecoration: "none",
|
---|
614 | color: "black",
|
---|
615 | width: "100%",
|
---|
616 | height: "100%",
|
---|
617 | display: "flex",
|
---|
618 | justifyContent: "center",
|
---|
619 | alignItems: "center",
|
---|
620 | }}
|
---|
621 | >
|
---|
622 | Градинарски столови
|
---|
623 | </Link>
|
---|
624 | </li>
|
---|
625 | <li>
|
---|
626 | <Link
|
---|
627 | to="/products/gradina/gradinarsko-osvetluvanje"
|
---|
628 | style={{
|
---|
629 | textDecoration: "none",
|
---|
630 | color: "black",
|
---|
631 | width: "100%",
|
---|
632 | height: "100%",
|
---|
633 | display: "flex",
|
---|
634 | justifyContent: "center",
|
---|
635 | alignItems: "center",
|
---|
636 | }}
|
---|
637 | >
|
---|
638 | Градинарско осветлување
|
---|
639 | </Link>
|
---|
640 | </li>
|
---|
641 | </ul>
|
---|
642 | </div>
|
---|
643 | </li>
|
---|
644 | <li
|
---|
645 | className="category-menu-trigger"
|
---|
646 | onClick={categoryMenuTrigger}
|
---|
647 | >
|
---|
648 | <span className="kancelarija">
|
---|
649 | <ChairAltIcon />
|
---|
650 | Канцеларија
|
---|
651 | </span>
|
---|
652 | <div className="category-menu kancelarija-menu hidden">
|
---|
653 | <div onClick={backToSubMenu} className="kancelarija">
|
---|
654 | <ArrowBackIcon />
|
---|
655 | Назад
|
---|
656 | </div>
|
---|
657 | <ul>
|
---|
658 | <li>
|
---|
659 | <Link
|
---|
660 | to="/products/kancelarija/biroa"
|
---|
661 | style={{
|
---|
662 | textDecoration: "none",
|
---|
663 | color: "black",
|
---|
664 | width: "100%",
|
---|
665 | height: "100%",
|
---|
666 | display: "flex",
|
---|
667 | justifyContent: "center",
|
---|
668 | alignItems: "center",
|
---|
669 | }}
|
---|
670 | >
|
---|
671 | Бироа
|
---|
672 | </Link>
|
---|
673 | </li>
|
---|
674 | <li>
|
---|
675 | <Link
|
---|
676 | to="/products/kancelarija/kancelariski-stolovi"
|
---|
677 | style={{
|
---|
678 | textDecoration: "none",
|
---|
679 | color: "black",
|
---|
680 | width: "100%",
|
---|
681 | height: "100%",
|
---|
682 | display: "flex",
|
---|
683 | justifyContent: "center",
|
---|
684 | alignItems: "center",
|
---|
685 | }}
|
---|
686 | >
|
---|
687 | Канцелариски столови
|
---|
688 | </Link>
|
---|
689 | </li>
|
---|
690 | <li>
|
---|
691 | <Link
|
---|
692 | to="/products/kancelarija/gejmerski-stolovi"
|
---|
693 | style={{
|
---|
694 | textDecoration: "none",
|
---|
695 | color: "black",
|
---|
696 | width: "100%",
|
---|
697 | height: "100%",
|
---|
698 | display: "flex",
|
---|
699 | justifyContent: "center",
|
---|
700 | alignItems: "center",
|
---|
701 | }}
|
---|
702 | >
|
---|
703 | Гејмерски столови
|
---|
704 | </Link>
|
---|
705 | </li>
|
---|
706 | <li>
|
---|
707 | <Link
|
---|
708 | to="/products/kancelarija/kancelariski-skafovi"
|
---|
709 | style={{
|
---|
710 | textDecoration: "none",
|
---|
711 | color: "black",
|
---|
712 | width: "100%",
|
---|
713 | height: "100%",
|
---|
714 | display: "flex",
|
---|
715 | justifyContent: "center",
|
---|
716 | alignItems: "center",
|
---|
717 | }}
|
---|
718 | >
|
---|
719 | Канцелариски шкафови
|
---|
720 | </Link>
|
---|
721 | </li>
|
---|
722 | </ul>
|
---|
723 | </div>
|
---|
724 | </li>
|
---|
725 | <li
|
---|
726 | className="category-menu-trigger"
|
---|
727 | onClick={categoryMenuTrigger}
|
---|
728 | >
|
---|
729 | <span className="trpezarija">
|
---|
730 | <TableRestaurantIcon />
|
---|
731 | Трпезарија
|
---|
732 | </span>
|
---|
733 | <div className="category-menu trpezarija-menu hidden">
|
---|
734 | <div onClick={backToSubMenu} className="trpezarija">
|
---|
735 | <ArrowBackIcon />
|
---|
736 | Назад
|
---|
737 | </div>
|
---|
738 | <ul>
|
---|
739 | <li>
|
---|
740 | <Link
|
---|
741 | to="/products/trpezarija/trpezariski-masi"
|
---|
742 | style={{
|
---|
743 | textDecoration: "none",
|
---|
744 | color: "black",
|
---|
745 | width: "100%",
|
---|
746 | height: "100%",
|
---|
747 | display: "flex",
|
---|
748 | justifyContent: "center",
|
---|
749 | alignItems: "center",
|
---|
750 | }}
|
---|
751 | >
|
---|
752 | Трпезариски маси
|
---|
753 | </Link>
|
---|
754 | </li>
|
---|
755 | <li>
|
---|
756 | <Link
|
---|
757 | to="/products/trpezarija/trpezariski-stolovi"
|
---|
758 | style={{
|
---|
759 | textDecoration: "none",
|
---|
760 | color: "black",
|
---|
761 | width: "100%",
|
---|
762 | height: "100%",
|
---|
763 | display: "flex",
|
---|
764 | justifyContent: "center",
|
---|
765 | alignItems: "center",
|
---|
766 | }}
|
---|
767 | >
|
---|
768 | Трпезариски столови
|
---|
769 | </Link>
|
---|
770 | </li>
|
---|
771 | <li>
|
---|
772 | <Link
|
---|
773 | to="/products/trpezarija/kujnski-garnituri"
|
---|
774 | style={{
|
---|
775 | textDecoration: "none",
|
---|
776 | color: "black",
|
---|
777 | width: "100%",
|
---|
778 | height: "100%",
|
---|
779 | display: "flex",
|
---|
780 | justifyContent: "center",
|
---|
781 | alignItems: "center",
|
---|
782 | }}
|
---|
783 | >
|
---|
784 | Кујнски гарнитури
|
---|
785 | </Link>
|
---|
786 | </li>
|
---|
787 | <li>
|
---|
788 | <Link
|
---|
789 | to="/products/trpezarija/bar-stolovi-i-masi"
|
---|
790 | style={{
|
---|
791 | textDecoration: "none",
|
---|
792 | color: "black",
|
---|
793 | width: "100%",
|
---|
794 | height: "100%",
|
---|
795 | display: "flex",
|
---|
796 | justifyContent: "center",
|
---|
797 | alignItems: "center",
|
---|
798 | }}
|
---|
799 | >
|
---|
800 | Бар столови и маси
|
---|
801 | </Link>
|
---|
802 | </li>
|
---|
803 | </ul>
|
---|
804 | </div>
|
---|
805 | </li>
|
---|
806 | <li
|
---|
807 | className="category-menu-trigger"
|
---|
808 | onClick={categoryMenuTrigger}
|
---|
809 | >
|
---|
810 | <span className="detska">
|
---|
811 | <BedroomChildIcon />
|
---|
812 | Детска соба
|
---|
813 | </span>
|
---|
814 | <div className="category-menu detska-menu hidden">
|
---|
815 | <div onClick={backToSubMenu} className="detska">
|
---|
816 | <ArrowBackIcon />
|
---|
817 | Назад
|
---|
818 | </div>
|
---|
819 | <ul>
|
---|
820 | <li>
|
---|
821 | <Link
|
---|
822 | to="/products/detska/kolekcii-za-detska-soba"
|
---|
823 | style={{
|
---|
824 | textDecoration: "none",
|
---|
825 | color: "black",
|
---|
826 | width: "100%",
|
---|
827 | height: "100%",
|
---|
828 | display: "flex",
|
---|
829 | justifyContent: "center",
|
---|
830 | alignItems: "center",
|
---|
831 | }}
|
---|
832 | >
|
---|
833 | Колекции за детска соба
|
---|
834 | </Link>
|
---|
835 | </li>
|
---|
836 | <li>
|
---|
837 | <Link
|
---|
838 | to="/products/detska/detski-biroa"
|
---|
839 | style={{
|
---|
840 | textDecoration: "none",
|
---|
841 | color: "black",
|
---|
842 | width: "100%",
|
---|
843 | height: "100%",
|
---|
844 | display: "flex",
|
---|
845 | justifyContent: "center",
|
---|
846 | alignItems: "center",
|
---|
847 | }}
|
---|
848 | >
|
---|
849 | Детски бироа
|
---|
850 | </Link>
|
---|
851 | </li>
|
---|
852 | <li>
|
---|
853 | <Link
|
---|
854 | to="/products/detska/detski-lezai"
|
---|
855 | style={{
|
---|
856 | textDecoration: "none",
|
---|
857 | color: "black",
|
---|
858 | width: "100%",
|
---|
859 | height: "100%",
|
---|
860 | display: "flex",
|
---|
861 | justifyContent: "center",
|
---|
862 | alignItems: "center",
|
---|
863 | }}
|
---|
864 | >
|
---|
865 | Лежаи
|
---|
866 | </Link>
|
---|
867 | </li>
|
---|
868 | </ul>
|
---|
869 | </div>
|
---|
870 | </li>
|
---|
871 | </ul>
|
---|
872 | </div>
|
---|
873 | </li>
|
---|
874 | <li>За Нас</li>
|
---|
875 | <li>Контакти</li>
|
---|
876 | </ul>
|
---|
877 | </div>
|
---|
878 | <nav className="header__menu">
|
---|
879 | <img src={logo} alt="logo"></img>
|
---|
880 | <li>
|
---|
881 | <Link to={"/"} className="link">
|
---|
882 | Почетна
|
---|
883 | </Link>
|
---|
884 | </li>
|
---|
885 | <li className="header__products">
|
---|
886 | <span className="header__productsSpan">
|
---|
887 | Производи <ArrowDropDownIcon />
|
---|
888 | </span>
|
---|
889 | <div className="header__dropdown">
|
---|
890 | <div className="header__dropdownColumn">
|
---|
891 | <ul id="category-ul-1">
|
---|
892 | <li>{categories[0] && results1}</li>
|
---|
893 | {/*
|
---|
894 | <li>
|
---|
895 | <Link to="/products/dnevna/all">
|
---|
896 | <span>
|
---|
897 | <WeekendIcon /> Дневна
|
---|
898 | </span>
|
---|
899 | </Link>
|
---|
900 | <ul>
|
---|
901 | <li>
|
---|
902 | <Link to="/products/dnevna/agolni-garnituri">
|
---|
903 | Аголни гарнитури
|
---|
904 | </Link>
|
---|
905 | </li>
|
---|
906 | <li>
|
---|
907 | <Link to="/products/dnevna/sofi">Софи</Link>
|
---|
908 | </li>
|
---|
909 | <li>
|
---|
910 | <Link to="/products/dnevna/fotelji">Фотелји</Link>
|
---|
911 | </li>
|
---|
912 | <li>
|
---|
913 | <Link to="/products/dnevna/taburetki">Табуретки</Link>
|
---|
914 | </li>
|
---|
915 | <li>
|
---|
916 | <Link to="/products/dnevna/klub-masi">Клуб Маси</Link>
|
---|
917 | </li>
|
---|
918 | <li>
|
---|
919 | <Link to="/products/dnevna/tv-komodi">ТВ Комоди</Link>
|
---|
920 | </li>
|
---|
921 | <li>
|
---|
922 | <Link to="/products/dnevna/komodi">Комоди</Link>
|
---|
923 | </li>
|
---|
924 | </ul>
|
---|
925 | </li>
|
---|
926 | <li>
|
---|
927 | <Link to="/products/hodnik/all">
|
---|
928 | <span>
|
---|
929 | <MeetingRoomIcon />
|
---|
930 | Ходник
|
---|
931 | </span>
|
---|
932 | </Link>
|
---|
933 | <ul>
|
---|
934 | <li>
|
---|
935 | <Link to="/products/hodnik/skafovi-za-cevli">
|
---|
936 | Шкафови за чевли
|
---|
937 | </Link>
|
---|
938 | </li>
|
---|
939 | <li>
|
---|
940 | <Link to="/products/hodnik/zakacalki-i-ogledala">
|
---|
941 | Закачалки и огледала
|
---|
942 | </Link>
|
---|
943 | </li>
|
---|
944 | <li>
|
---|
945 | <Link to="/products/hodnik/kolekcii-za-hodnik">
|
---|
946 | Колекции за ходник
|
---|
947 | </Link>
|
---|
948 | </li>
|
---|
949 | </ul>
|
---|
950 | </li>
|
---|
951 | <li>
|
---|
952 | <Link to="/products/kujna/all">
|
---|
953 | <span>
|
---|
954 | <KitchenIcon />
|
---|
955 | Кујна
|
---|
956 | </span>
|
---|
957 | </Link>
|
---|
958 | <ul>
|
---|
959 | <li>
|
---|
960 | <Link to="/products/kujna/kujnski-agolni-garnituri">
|
---|
961 | Кујнски аголни гарнитури
|
---|
962 | </Link>
|
---|
963 | </li>
|
---|
964 | <li>
|
---|
965 | <Link to="/products/kujna/standarni-kujni">
|
---|
966 | Стандардни кујни
|
---|
967 | </Link>
|
---|
968 | </li>
|
---|
969 | </ul>
|
---|
970 | </li>*/}
|
---|
971 | </ul>
|
---|
972 | </div>
|
---|
973 | <div className="header__dropdownColumn">
|
---|
974 | <ul>
|
---|
975 | <li>{categories[0] && results2}</li>
|
---|
976 | {/*
|
---|
977 | <li>
|
---|
978 | <Link to="/products/spalna/all">
|
---|
979 | <span>
|
---|
980 | <BedIcon />
|
---|
981 | Спална
|
---|
982 | </span>
|
---|
983 | </Link>
|
---|
984 | <ul>
|
---|
985 | <li>
|
---|
986 | <Link to="/products/spalna/spalni-kompleti">
|
---|
987 | Спални комплети
|
---|
988 | </Link>
|
---|
989 | </li>
|
---|
990 |
|
---|
991 | <li>
|
---|
992 | <Link to="/products/spalna/lezai">Лежаи</Link>
|
---|
993 | </li>
|
---|
994 |
|
---|
995 | <li>
|
---|
996 | <Link to="/products/spalna/kreveti">Кревети</Link>
|
---|
997 | </li>
|
---|
998 |
|
---|
999 | <li>
|
---|
1000 | <Link to="/products/spalna/plakari">Плакари</Link>
|
---|
1001 | </li>
|
---|
1002 | <li>
|
---|
1003 | <Link to="/products/spalna/nokni-skafcinja">
|
---|
1004 | Ноќни шкафчиња
|
---|
1005 | </Link>
|
---|
1006 | </li>
|
---|
1007 | <li>
|
---|
1008 | <Link to="/products/spalna/toaletni-masi">
|
---|
1009 | Тоалетни маси
|
---|
1010 | </Link>
|
---|
1011 | </li>
|
---|
1012 | </ul>
|
---|
1013 | </li>
|
---|
1014 | <li>
|
---|
1015 | <Link to="/products/gradina/all">
|
---|
1016 | <span>
|
---|
1017 | <DeckIcon />
|
---|
1018 | Мебел за градина
|
---|
1019 | </span>
|
---|
1020 | </Link>
|
---|
1021 | <ul>
|
---|
1022 | <li>
|
---|
1023 | <Link to="/products/gradina/gradinarski-kompleti">
|
---|
1024 | Градинарски комплети
|
---|
1025 | </Link>
|
---|
1026 | </li>
|
---|
1027 | <li>
|
---|
1028 | <Link to="/products/gradina/gradinarski-lulki">
|
---|
1029 | Градинарски лулки
|
---|
1030 | </Link>
|
---|
1031 | </li>
|
---|
1032 | <li>
|
---|
1033 | <Link to="/products/gradina/gradinarski-cadori">
|
---|
1034 | Градинарски чадори
|
---|
1035 | </Link>
|
---|
1036 | </li>
|
---|
1037 | <li>
|
---|
1038 | <Link to="/products/gradina/gradinarski-masi">
|
---|
1039 | Градинарски маси
|
---|
1040 | </Link>
|
---|
1041 | </li>
|
---|
1042 | <li>
|
---|
1043 | <Link to="/products/gradina/gradinarski-stolovi">
|
---|
1044 | Градинарски столови
|
---|
1045 | </Link>
|
---|
1046 | </li>
|
---|
1047 | <li>
|
---|
1048 | <Link to="/products/gradina/gradinarsko-osvetluvanje">
|
---|
1049 | Градинарско осветлување
|
---|
1050 | </Link>
|
---|
1051 | </li>
|
---|
1052 | </ul>
|
---|
1053 | </li>
|
---|
1054 | */}
|
---|
1055 | </ul>
|
---|
1056 | </div>
|
---|
1057 | <div className="header__dropdownColumn">
|
---|
1058 | <ul>
|
---|
1059 | <li>{categories[0] && results3}</li>
|
---|
1060 | {/*
|
---|
1061 | <li>
|
---|
1062 | <Link to="/products/kancelarija/all">
|
---|
1063 | <span>
|
---|
1064 | <ChairAltIcon />
|
---|
1065 | Канцеларија
|
---|
1066 | </span>
|
---|
1067 | </Link>
|
---|
1068 | <ul>
|
---|
1069 | <li>
|
---|
1070 | <Link to="/products/kancelarija/biroa">Бироа</Link>
|
---|
1071 | </li>
|
---|
1072 | <li>
|
---|
1073 | <Link to="/products/kancelarija/kancelariski-stolovi">
|
---|
1074 | Канцелариски столови
|
---|
1075 | </Link>
|
---|
1076 | </li>
|
---|
1077 | <li>
|
---|
1078 | <Link to="/products/kancelarija/gejmerski-stolovi">
|
---|
1079 | Гејмерски столови
|
---|
1080 | </Link>
|
---|
1081 | </li>
|
---|
1082 | <li>
|
---|
1083 | <Link to="/products/kancelarija/kancelariski-skafovi">
|
---|
1084 | Канцелариски шкафови
|
---|
1085 | </Link>
|
---|
1086 | </li>
|
---|
1087 | </ul>
|
---|
1088 | </li>
|
---|
1089 | <li>
|
---|
1090 | <Link to="/products/trpezarija/all">
|
---|
1091 | <span>
|
---|
1092 | <TableRestaurantIcon />
|
---|
1093 | Трпезарија
|
---|
1094 | </span>
|
---|
1095 | </Link>
|
---|
1096 | <ul>
|
---|
1097 | <li>
|
---|
1098 | <Link to="/products/trpezarija/trpezariski-masi">
|
---|
1099 | Трпезариски маси
|
---|
1100 | </Link>
|
---|
1101 | </li>
|
---|
1102 | <li>
|
---|
1103 | <Link to="/products/trpezarija/trpezariski-stolovi">
|
---|
1104 | Трпезариски столови
|
---|
1105 | </Link>
|
---|
1106 | </li>
|
---|
1107 | <li>
|
---|
1108 | <Link to="/products/trpezarija/kujnski-garnituri">
|
---|
1109 | Кујнски гарнитури
|
---|
1110 | </Link>
|
---|
1111 | </li>
|
---|
1112 | <li>
|
---|
1113 | <Link to="/products/trpezarija/bar-stolovi-i-masi">
|
---|
1114 | Бар столови и маси
|
---|
1115 | </Link>
|
---|
1116 | </li>
|
---|
1117 | </ul>
|
---|
1118 | </li>
|
---|
1119 | <li>
|
---|
1120 | <Link to="/products/detska/all">
|
---|
1121 | <span>
|
---|
1122 | <BedroomChildIcon />
|
---|
1123 | Детска соба
|
---|
1124 | </span>
|
---|
1125 | </Link>
|
---|
1126 | <ul>
|
---|
1127 | <li>
|
---|
1128 | <Link to="/products/detska/kolekcii-za-detska-soba">
|
---|
1129 | Колекции за детска соба
|
---|
1130 | </Link>
|
---|
1131 | </li>
|
---|
1132 | <li>
|
---|
1133 | <Link to="/products/detska/detski-biroa">
|
---|
1134 | Детски бироа
|
---|
1135 | </Link>
|
---|
1136 | </li>
|
---|
1137 | <li>
|
---|
1138 | <Link to="/products/detska/detski-lezai">Лежаи</Link>
|
---|
1139 | </li>
|
---|
1140 | </ul>
|
---|
1141 | </li>
|
---|
1142 | */}
|
---|
1143 | </ul>
|
---|
1144 | </div>
|
---|
1145 | <div className="header__dropdownColumn">
|
---|
1146 | <ul></ul>
|
---|
1147 | </div>
|
---|
1148 | </div>
|
---|
1149 | </li>
|
---|
1150 | <li className="header__aboutUs">За Нас</li>
|
---|
1151 | <li className="header__contacts">Контакти</li>
|
---|
1152 | </nav>
|
---|
1153 | <div className="header__right">
|
---|
1154 | <div className="header__buttons">
|
---|
1155 | {userInfo && userInfo.isAdmin && (
|
---|
1156 | <NavDropdown
|
---|
1157 | title={
|
---|
1158 | <span>
|
---|
1159 | <AccountCircleIcon
|
---|
1160 | className="header__login"
|
---|
1161 | fontSize="large"
|
---|
1162 | />
|
---|
1163 | <p>{userInfo.name}</p>
|
---|
1164 | </span>
|
---|
1165 | }
|
---|
1166 | id="basic-nav-dropdown"
|
---|
1167 | >
|
---|
1168 | <NavDropdown.Item
|
---|
1169 | onClick={() => {
|
---|
1170 | navigate("/profile");
|
---|
1171 | }}
|
---|
1172 | >
|
---|
1173 | Профил
|
---|
1174 | </NavDropdown.Item>
|
---|
1175 |
|
---|
1176 | <NavDropdown.Item
|
---|
1177 | onClick={() => {
|
---|
1178 | navigate("/admin/dashboard");
|
---|
1179 | }}
|
---|
1180 | >
|
---|
1181 | Dashboard
|
---|
1182 | </NavDropdown.Item>
|
---|
1183 |
|
---|
1184 | <NavDropdown.Divider />
|
---|
1185 | <NavDropdown.Item
|
---|
1186 | className="drowdown-item"
|
---|
1187 | to="#signout"
|
---|
1188 | onClick={signoutHandler}
|
---|
1189 | >
|
---|
1190 | Одјави се
|
---|
1191 | </NavDropdown.Item>
|
---|
1192 | </NavDropdown>
|
---|
1193 | )}
|
---|
1194 | {userInfo && !userInfo.isAdmin && (
|
---|
1195 | <NavDropdown
|
---|
1196 | title={
|
---|
1197 | <span>
|
---|
1198 | <AccountCircleIcon
|
---|
1199 | className="header__login"
|
---|
1200 | fontSize="large"
|
---|
1201 | />
|
---|
1202 | <p>{userInfo.name}</p>
|
---|
1203 | </span>
|
---|
1204 | }
|
---|
1205 | id="basic-nav-dropdown"
|
---|
1206 | >
|
---|
1207 | <NavDropdown.Item
|
---|
1208 | onClick={() => {
|
---|
1209 | navigate("/profile");
|
---|
1210 | }}
|
---|
1211 | >
|
---|
1212 | Профил
|
---|
1213 | </NavDropdown.Item>
|
---|
1214 |
|
---|
1215 | <NavDropdown.Item
|
---|
1216 | onClick={() => {
|
---|
1217 | navigate("/orderhistory");
|
---|
1218 | }}
|
---|
1219 | >
|
---|
1220 | Нарачки
|
---|
1221 | </NavDropdown.Item>
|
---|
1222 |
|
---|
1223 | <NavDropdown.Divider />
|
---|
1224 | <NavDropdown.Item
|
---|
1225 | className="drowdown-item"
|
---|
1226 | to="#signout"
|
---|
1227 | onClick={signoutHandler}
|
---|
1228 | >
|
---|
1229 | Одјави се
|
---|
1230 | </NavDropdown.Item>
|
---|
1231 | </NavDropdown>
|
---|
1232 | )}
|
---|
1233 | {!userInfo && (
|
---|
1234 | <Link
|
---|
1235 | to={"/signin"}
|
---|
1236 | className="link"
|
---|
1237 | onClick={() => {
|
---|
1238 | navigate("/orderhistory");
|
---|
1239 | }}
|
---|
1240 | >
|
---|
1241 | <span>
|
---|
1242 | <AccountCircleIcon className="header__login" fontSize="large" />
|
---|
1243 | <p>Најави се</p>
|
---|
1244 | </span>
|
---|
1245 | </Link>
|
---|
1246 | )}
|
---|
1247 |
|
---|
1248 | <Link to="/cart" className="badgee">
|
---|
1249 | <span>
|
---|
1250 | <ShoppingBasketIcon className="header__cart" fontSize="large" />
|
---|
1251 |
|
---|
1252 | {cart.cartItems.length > 0 && (
|
---|
1253 | <Badge pill bg="danger">
|
---|
1254 | {cart.cartItems.reduce((a, c) => a + c.quantity, 0)}
|
---|
1255 | </Badge>
|
---|
1256 | )}
|
---|
1257 | </span>
|
---|
1258 | </Link>
|
---|
1259 | </div>
|
---|
1260 | <div className="header__search">
|
---|
1261 | <input className="header__searchInput" type="text" name="text" />
|
---|
1262 | <button onClick={searchHandler}>
|
---|
1263 | <SearchIcon className="header__searchIcon" fontSize="large" />
|
---|
1264 | </button>
|
---|
1265 | </div>
|
---|
1266 | </div>
|
---|
1267 | </div>
|
---|
1268 | );
|
---|
1269 | }
|
---|
1270 |
|
---|
1271 | export default Header;
|
---|