Merge branch 'next_button' into 'main'

add next button in filters

See merge request saburly/marketalarm/kivi-za-auta-react!23

kivi-cars/src/components/Button/StandardBtn.js

@@ -8,7 +8,9 @@ const StandardBtn = (props) => {
     const clickHandler = ( e ) => {
         setData( prevState => ({
             ...prevState,
-            "Kategorija": e.target.value
+            "Category":{
+                [e.target.name]: e.target.value
+            }
         }))
     }
 

kivi-cars/src/components/Button/TimeBtn.js

@@ -1,23 +0,0 @@
-import React from 'react'
-import './button.css'
-
-const TimeBtn = (props) => {
-
-    const {data, setData, filter} = props.data
-
-    const clickHandler = ( e ) => {
-        setData( prevState => ({
-            ...prevState,
-            [e.target.name]: e.target.value
-            
-        }))
-    }
-
-    return (
-        <div className='standard-btn'>
-           <button name={filter} value={props.title} className={data.Slanje=== props.title ? "active" : "standardBtn"} onClick={e => clickHandler(e)}>{props.title}</button>
-        </div>
-    )
-}
-
-export default TimeBtn

kivi-cars/src/components/Button/button.css

@@ -12,15 +12,6 @@
     border: #02ADBA;
 }
 
-.active {
-    width: 300px;
-    background-color: #fff;
-    font-size: 25px;
-    padding: 7px 20px 7px 20px;
-    color: #02ADBA;
-    border: #02ADBA;
-}
-
 .standardBtn:hover {
     background-color:#3eced8 ;
     color: white;

kivi-cars/src/components/Filters/Advanced-filters.js

@@ -1,34 +1,55 @@
-import {useState} from "react";
+import React from "react";
 import "./Filters.css";
 import Filter from "./Filter/Filter";
 import TitleBtn from "../Button/TitleBtn";
-import { Link } from "react-router-dom";
+import {Link} from 'react-router-dom';
+import Color from '../../data/color';
+import AirCondition from "../../data/air-condition";
+import Seats from "../../data/seats";
+import Sensors from "../../data/sensors";
+import Gearbox from "../../data/gearbox";
+import Lights from "../../data/lights";
 import Checkbox from "./Filter/Checkbox";
 import CheckBox from "../../data/checkbox";
 
+
 const AdvancedFilters = (props) => {
-  const { data, setData } = props.data.data;
+
-  const [gradovi, setGradovi] = useState(data.Lokacija.gradovi)
+    const {filters, setFilters} = props.data
-  let index = 0;
+    const data1 = [Color, AirCondition, Seats, Gearbox, Sensors, Lights]
+    let index = 0
+
 
     return(
-    <div className='filters-container'>
+        <div className="filters-container">
-      <div className='checkbox-content'>
+            <div className="filters-content">
-        {CheckBox.map((item) => {
+            {
+                data1.map(item => {
                     index += 1;
                     return(
-            <Checkbox key={index} item={item} objekat={{ data, setData }} />
+                        <Filter key={index} ime={item.ime} tipovi={item.tipovi} data={{filters, setFilters}}/>
-          );
+                    )
-        })}
+                })
+            }
+            </div>
+            <div className="checkbox-content">
+            {
+                CheckBox.map(item => {
+                    index += 1;
+                    return(
+                        <Checkbox key={index} title={item} data={{filters, setFilters}}/>
+                    )
+                })
+            }
             </div>
 
             <div style={{marginTop: 50}}>
-        <Link to='/location'>
+                <Link to="/location">
-          <TitleBtn title='Dalje' />
+                    <TitleBtn title="Dalje" />
                 </Link>
             </div>
         </div>
-  );
+    )
-};
+}
 
-export default AdvancedFilters;
+export default AdvancedFilters

kivi-cars/src/components/Filters/Filter/Checkbox.js

@@ -1,38 +1,26 @@
 import React, { useState } from "react";
-import "./css/Checkbox.css";
+import './css/Checkbox.css';
+
+const Checkbox = (props) => {
+
+
+    const {setFilters} = props.data
+    const [isChecked, setIsChecked] = useState(true)
 
-const Checkbox = ({ objekat, item }) => {
-  const { data, setData } = objekat;
-  const [isChecked, setIsChecked] = useState(data.Filteri[`${item.value}`]);
 
     const changeHandler = ( event ) => {
-    setData((prevData) => ({
+        setFilters(prevData => ({
             ...prevData,
-      Filteri: {
+            [event.target.name]: isChecked
-        ...prevData.Filteri,
+        }))
-        [event.target.name]: !isChecked,
+    }
-      },
-    }));
-  };
 
     return(
-    <div className='checkbox-div'>
+        <div className="checkbox-div">
-      <label className='checkbox-title' htmlFor={`${item.title}`}>
+            <label className="checkbox-title" htmlFor={`${props.title}`}>{props.title}</label>
-        {item.title}
+            <input type="checkbox" name={props.title} className="checkbox" id={`${props.title}`} onChange={(e) => {changeHandler(e); setIsChecked(!isChecked)}}/>
-      </label>
-      <input
-        type='checkbox'
-        name={item.variable}
-        checked={data.Filteri[`${item.variable}`]}
-        className='checkbox'
-        id={`${item.title}`}
-        onChange={(e) => {
-          changeHandler(e);
-          setIsChecked(!isChecked);
-        }}
-      />
         </div>
-  );
+    )
-};
+}
 
 export default Checkbox;

kivi-cars/src/components/Filters/Filter/DoubleFilter.js

@@ -2,61 +2,39 @@ import React, { useEffect, useState } from "react";
 import "./css/DoubleFilter.css";
 
 const DoubleFilter = (props) => {
-  const { data, setData } = props.data;
+
-  const { title, fields, VName } = props.item;
+    const {setFilters} = props.data
+    const [doubleFilterData, setDoubleFilterData] = useState({})
 
     const changeHandler = ( e ) => {
-    setData((prevData) => ({
+        setDoubleFilterData(prevData => ({
             ...prevData,
-      Filteri: {
+            [e.target.name]: e.target.value     
-        ...prevData.Filteri,
+        }))
-        [VName]: {
+    }
-          ...prevData.Filteri[`${VName}`],
+
-          [e.target.name]: e.target.value,
+    useEffect(() => {
-        },
+        setFilters(prevData => ({
-      },
+            ...prevData,
-    }));
+            [props.title]: doubleFilterData
-  };
+        }))
+    }, [doubleFilterData])
 
     return (
-    <div className='doubleFilter-component'>
+        <div className="doubleFilter-component">
-      <label htmlFor='filters-div'>{title}</label>
+            <label htmlFor="filters-div">{props.title}</label>
-      <div className='double-filters' id='filters-div'>
+            <div className="double-filters" id="filters-div">
-        <div className='filter'>
+                <div className="filter">
-          <label htmlFor='od' className='filter-info'>
+                <label htmlFor="od" className="filter-info">Od</label>
-            Od
+                <input placeholder="Unesite" id="od" name="Od" className="filter-number" type="number" min={props.fields.min} max={props.fields.max} onChange={(e) => changeHandler(e)}/>
-          </label>
-          <input
-            placeholder='Unesite'
-            id='od'
-            name='Od'
-            value={data.Filteri[`${VName}`].Od}
-            className='filter-number'
-            type='number'
-            min={fields.min}
-            max={fields.max}
-            onChange={(e) => changeHandler(e)}
-          />
                 </div>
-        <div className='filter'>
+                <div className="filter"> 
-          <label htmlFor='do' className='filter-info'>
+                <label htmlFor="do" className="filter-info">Do</label>
-            Do
+                <input placeholder="Unesite" id="do" name="Do" className="filter-number" type="number" min={props.fields.min} max={props.fields.max} onChange={(e) => changeHandler(e)}/>
-          </label>
-          <input
-            placeholder='Unesite'
-            id='do'
-            name='Do'
-            value={data.Filteri[`${VName}`].Do}
-            className='filter-number'
-            type='number'
-            min={fields.min}
-            max={fields.max}
-            onChange={(e) => changeHandler(e)}
-          />
                 </div>
             </div>
         </div>
-  );
+    )
-};
+}
 
 export default DoubleFilter;

kivi-cars/src/components/Filters/Filter/Filter.js

@@ -1,42 +1,29 @@
-import React, { useEffect, useState } from "react";
+import React from "react";
-import "./css/Filter.css";
+import './css/Filter.css';
 
 const Filter = (props) => {
-  const { data, setData } = props.data;
+
-  const { ime, VName, tipovi } = props.item;
+    const {setFilters} = props.data
 
     const changeHandler = ( e ) => {
-    setData((prevData) => ({
+        setFilters( prevData => ({
             ...prevData,
-      Filteri: {
+            [e.target.name]: e.target.value
-        ...prevData.Filteri,
+        }))
-        [e.target.name]: e.target.value,
+    }
-      },
-    }));
-  };
 
     return(
-    <div className='filter-component'>
+        <div className="filter-component">
-      <label htmlFor={VName} className='filter-name'>
+            <label htmlFor={props.ime} className="filter-name">{props.ime}</label>
-        {ime}
+            <select className="dropdown-list" name={props.ime} id={props.ime} onChange={(e) => changeHandler(e)}>
-      </label>
+                {props.tipovi.map((tip, i) => {
-      <select
-        className='dropdown-list'
-        name={VName}
-        id={VName}
-        value={data.Filteri[`${VName}`]}
-        onChange={(e) => changeHandler(e)}
-      >
-        {tipovi.map((tip, i) => {
                     return (
-            <option key={i} value={tip} name={tip}>
+                        <option key={i} value={tip} name={tip}>{tip}</option>
-              {tip}
+                    )
-            </option>
-          );
                 })}
             </select>
         </div>
-  );
+    )
-};
+}
 
 export default Filter;

kivi-cars/src/components/Filters/Filter/LocationCheckbox.js

@@ -1,96 +1,28 @@
-import { React, useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
-import "./css/LocationCheckbox.css";
+import './css/LocationCheckbox.css';
 
 const LocationCheckbox = (props) => {
-  const { data, setData } = props.data;
-  const [checked, setChecked] = useState(false);
-  const [value, setValue] = useState(false);
 
-  // useEffect(() => {
+    const {setCheckboxStatus} = props.data;
-  //     data.Lokacija.gradovi.forEach(grad => {
+    const [checked, setChecked] = useState(true)
-  //         if(grad === props.title){
-  //             return setValue(true)
-  //         }return setValue(false)
-  //     })
-  // }, [data.Lokacija.gradovi])
 
-  // na pocetku dobijem prazan niz, ukoliko oznaci jedan grad, treba ga dodati u niz
+    const changeHandler = (e) => {
-  // prije svakog dodavanja treba provjeriti da li je taj grad u nizu, ukoliko nije treba ga dodati
+        setCheckboxStatus(prevStatus => ({
-  // brisanje gradova iz niza samo ukoliko je taj grad u nizu
+            ...prevStatus,
-
+            [e.target.name]: checked
-  const dodajGrad = (e) => {
+        }))
-    console.log("dodajem", e.target.name);
-    if (!data.Lokacija.gradovi[`${e.target.name}`]) {
-      setData((prevData) => ({
-        ...prevData,
-        Lokacija: {
-          ...prevData.Lokacija,
-          gradovi: [...prevData.Lokacija.gradovi, e.target.name],
-        },
-      }));
     }
-  };
 
-  const obrisiGrad = (e) => {
-    console.log("brisem", e.target.name);
-    setData((prevData) => ({
-      ...prevData,
-      Lokacija: {
-        ...prevData.Lokacija,
-        gradovi: [
-          ...prevData.Lokacija.gradovi.splice(
-            data.Lokacija.gradovi.indexOf(e.target.name),
-            1
-          ),
-        ],
-      },
-    }));
-  };
-
-  const clickHandler = (e) => {
-    if (checked) {
-      return obrisiGrad(e);
-    }
-    dodajGrad(e);
-  };
-
-  // const isChecked = () => {
-  //     if(data.Lokacija.gradovi[0]){
-  //         console.log("true")
-  //         return true
-  //     } return false
-  // }
-
-  // const checkHandler = (item) => {
-  //     data.Lokacija.gradovi.map( grad => {
-  //         if(grad === item){
-  //             return false
-  //         } return true
-  //     })
-  // }
-
-  // popraviti bug koji ima (checkboxi koji su oznaceni, 
-  // nakon ponovnog prikaza komponente se ne prikazuju)
-  // nakon promjene kantona gradovi ostaju
 
     return (
-    <div className='checkbox'>
+        <div className="checkbox">
-      <label className='checkbox-title' htmlFor={props.title}>
+            <label className="checkbox-title" htmlFor={props.title}>{props.title}</label>
-        {props.title}
+            <input className="check-box" type="checkbox" name={props.title} id={props.title} onChange={(e)=> {
-      </label>
+                setChecked(!checked)
-      <input
+                changeHandler(e)
-        className='check-box'
+                }}/>
-        checked={checked}
-        type='checkbox'
-        name={props.title}
-        id={props.title}
-        onChange={(e) => {
-          clickHandler(e);
-          setChecked(!checked);
-        }}
-      />
         </div>
-  );
+    )
-};
+}
 
 export default LocationCheckbox;

kivi-cars/src/components/Filters/Filters.css

@@ -9,7 +9,7 @@
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
-    justify-content: center;
+    justify-content: space-between;
 }
 
 .filters-content{
@@ -36,9 +36,11 @@
         padding: 2em 5em;
     }
 
-    .checkbox-content{
+    
+
+    /* .checkbox-content{
         width: ;
-    }
+    } */
 
 
 }

kivi-cars/src/components/Filters/Standard-filters.js

@@ -1,109 +1,64 @@
 import React, { useEffect, useState } from "react";
-import { Link } from "react-router-dom";
+import {Link} from 'react-router-dom';
 import "./Filters.css";
 import Filter from "./Filter/Filter";
 import DoubleFilter from "./Filter/DoubleFilter";
 import TitleBtn from "../Button/TitleBtn";
-import Cars from "../../data/cars-brands";
+import vehicleService from "../../services/vehicle-service";
-import Trucks from "../../data/trucks-brands";
-import Motors from "../../data/motors-brands";
-import Cubes from "../../data/cubes";
-import Type from "../../data/type";
-import Fuel from "../../data/fuel";
-import Transmission from "../../data/transmission";
-import Condition from "../../data/condition";
-import Year from "../../data/year";
-import Price from "../../data/price";
-import HorsePower from "../../data/horsepower";
-import Kilowats from "../../data/kilowats";
-import Kilometers from "../../data/kilometers";
-import Color from "../../data/color";
-import AirCondition from "../../data/air-condition";
-import Drive from "../../data/drive";
-import Doors from "../../data/doors";
-import Sensors from "../../data/sensors";
-import Gearbox from "../../data/gearbox";
 
 const StandardFilters = (props) => {
-  const { data, setData } = props.data.data;
+
+    const {data, filters, setFilters} = props.data;
     const [brandIndex, setBrandIndex] = useState(0);
-  const [model, showModel] = useState(true);
     let index = 0;
-  let brands;
+    let details, marke;
 
-  // if(data.Category.Vozilo === "Auto"){
+    details = vehicleService(data.Category.Vozilo);
-  //     showModel(true)
+    const {show, brands, data1, data2, data3} = details;
-  //     return
-  //     })
 
-  // }else if(data.Category.Vozilo === "Motor"){
+    const [model, setModel] = useState(show);
-  //     showModel(false)
-  //     return brands = Motors.map(brand => {
-  //         return brand.brand
-  //     })
-  // }else if(data.Category.Vozilo === "Teretno vozilo"){
-  //     return brands = Trucks.map(brand => {
-  //         return brand.brand
-  //     })
-  // }
 
-  brands = Cars.map((brand) => {
-    return brand.brand;
-  });
 
     useEffect(() => {
-    // console.log(data, setData)
+        if(filters.Marka)setBrandIndex(marke.indexOf(filters.Marka))
-    if (data.Filteri.Brend !== "")
+    }, [filters])
-      setBrandIndex(brands.indexOf(data.Filteri.Brend));
-  }, [data]);
 
-  const models = Cars[brandIndex].models;
 
-  const Brands = {
+    marke = brands.map(marka => {return marka.brand})
-    ime: "Marka",
-    VName: "Brend",
-    tipovi: brands,
-  };
-
-  const Models = {
-    ime: "Model",
-    VName: "Model",
-    tipovi: models,
-  };
-
-  const data2 = [Price, Year, Kilometers, Cubes, HorsePower, Kilowats];
-  const data1 = [Type, Condition, Transmission, Fuel, Drive, Doors, Color, AirCondition, Gearbox, Sensors];
 
     return(
-    <div className='filters-container'>
+        <div className="filters-container">
-      <Filter item={Brands} data={{ data, setData }} />
+            <Filter ime={"Marka"} tipovi={marke} data={{data, filters, setFilters}}/>
-      {model && <Filter item={Models} data={{ data, setData }} />}
+            {model ? (<Filter ime={"Model"} tipovi={brands[brandIndex].models} data={{data, filters, setFilters}}/>): null}
 
-      {data1.map((item) => {
+            {data1.map(item => {
                 index += 1;
-        return <Filter key={index} item={item} data={{ data, setData }} />;
+                return(
+                    <Filter key={index} ime={item.ime} tipovi={item.tipovi} data={{data, filters, setFilters}}/>
+                )
             })}
 
-      {data2.map((item) => {
+            {data2.map(item => {
                 index += 1;
                 return(
-          <DoubleFilter
+                    <DoubleFilter key={index} title={item.title} fields={item.fields} data={{data, filters, setFilters}}/>
-            key={index}
+                )
-            item={item}
+            })}
-            title={item.title}
+            
-            fields={item.fields}
+            {data3.map(item => {
-            data={{ data, setData }}
+                index += 1;
-          />
+                return(
-        );
+                    <Filter key={index} ime={item.ime} tipovi={item.tipovi} data={{data, filters, setFilters}}/>
+                )
             })}
 
             <div style={{marginTop: 50}}>
-        <Link to='/location'>
+                <Link to="/location">
-          <TitleBtn title='Dalje' />
+                    <TitleBtn title="Dalje" />
                 </Link>
             </div>
         </div>
-  );
+    )
-};
+}
 
-export default StandardFilters;
+export default StandardFilters

kivi-cars/src/components/FiltersNavbar/FiltersNav.css

@@ -45,6 +45,7 @@
     .filters-link {
         line-height: 54px;
         font-size: 24px;
+
     }
 
     .filters-links {

kivi-cars/src/components/Location/LocationFilter.js

@@ -4,15 +4,12 @@ import Location from "../../data/location";
 
 const LocationFilter = (props) => {
 
-    const {data, setData} = props.data;
+    const {setLocationData} = props.data;
 
     const clickHandler = (e) => {
-        setData( prevData => ({
+        setLocationData( prevData => ( {
                 ...prevData,
-            Lokacija: {
-                ...prevData.Lokacija,
                 "kanton": e.target.value
-            }
             }))
     }
 
@@ -20,7 +17,7 @@ const LocationFilter = (props) => {
     return (
         <div className="locationFilter-div">
             <label className="location-title" htmlFor={Location.ime}>Izaberite lokaciju:</label>
-            <select name={Location.ime} value={data.Lokacija.kanton} id={Location.ime} onChange={(e) => clickHandler(e) }>
+            <select name={Location.ime} id={Location.ime} onChange={(e) => clickHandler(e) }>
                 <option value="Svi">Svi</option>
                 <optgroup label={Location.entiteti[0].entitet}>
                     {Location.entiteti[0].kantoni.map((kanton, i) => {

kivi-cars/src/containers/App.js

@@ -1,142 +1,37 @@
-import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
+import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
-import "./css/App.css";
+import './css/App.css';
-import { React, useEffect, useState } from "react";
+import { React, useEffect, useState } from 'react';
-import CategoryPage from "./CategoryPage";
+import CategoryPage from './CategoryPage';
-import LandingPage from "./LandingPage";
+import LandingPage from './LandingPage';
-import FiltersPage from "./FiltersPage";
+import FiltersPage from './FiltersPage';
-import LocationPage from "./LocationPage";
+import LocationPage from './LocationPage';
-import EmailPage from "./EmailPage";
+import EmailPage from './EmailPage';
-import CongratsPage from "./CongratsPage";
+import CongratsPage from './CongratsPage';
-import LinkR from "../data/routes";
+import LinkR from '../data/routes';
+  
 
 function App() {
+
   // const info = 'Dobrodosli na stranicu kivi!'
-  const [data, setData] = useState({
+  const [data, setData] = useState({})
-    Kategorija: "",
-    Email: "",
-    NapredniFilteri: false,
-    Filteri: {
-      Brend: "",
-      Model: "",
-      ABS: false,
-      Airbag: false,
-      Alarm: false,
-      AutoKuka: false,
-      CentralnaBrava: false,
-      DaljinskoZakljucavanje: false,
-      ESP: false,
-      ElektricniPodizaciStakala: false,
-      ElektricniRetrovizori: false,
-      GrijanjeSjedista: false,
-      HladjenjeSjedista: false,
-      ISOFIX: false,
-      KomandeNaVolanu: false,
-      Koza: false,
-      LED: false,
-      Laser: false,
-      Xenon: false,
-      MasaznaSjedista: false,
-      MemorijaSjedista: false,
-      Metalik: false,
-      NaslonZaRuku: false,
-      Navigacija: false,
-      ParkingAssistent: false,
-      Panorama: false,
-      PosjedujeKlimu: false,
-      Registrovan: false,
-      SenzorMrtvogUgla: false,
-      ServisnaKnjiga: false,
-      ServoVolan: false,
-      Siber: false,
-      StartStop: false,
-      Tempomat: false,
-      Turbo: false,
-      RoloZavjese: false,
-      DPFFAP: false,
-      Stanje: "",
-      Gorivo: "",
-      BrojVrata: "",
-      TipVozila: "",
-      Pogon: "",
-      EmisioniStandard: "",
-      VelicinaFelgi: "",
-      Transmisija: "",
-      BrojStepenihPrijenosa: "",
-      Boja: "",
-      TipKlime: "",
-      ParkingSenzori: "",
-      Cijena: {
-        Od: "",
-        Do: "",
-      },
-      Godiste: {
-        Od: "",
-        Do: "",
-      },
-      Kilometraza: {
-        Od: "",
-        Do: "",
-      },
-      Kilovata: {
-        Od: "",
-        Do: "",
-      },
-      KonjskihSnaga: {
-        Od: "",
-        Do: "",
-      },
-      Kubikaza: {
-        Od: "",
-        Do: "",
-      },
-    },
-    Lokacija: {
-      entitet: "Svi",
-      kanton: "Svi",
-      gradovi: [],
-    },
-    Slanje: "Odmah",
-  });
 
   useEffect(() => {
-    console.log(data);
+    console.log(data)
-  }, [data]);
+  }, [data])
+
 
   return (
-    <div className='App'>
+    <div className="App">
       <Router>
         <Routes>
+        
           <Route path='/' element={<LandingPage />} />
-          <Route
+          <Route path='category' element={<CategoryPage data={{data, setData}} routes={LinkR.category} />}/>
-            path='category'
+          <Route path='filters' element={<FiltersPage data={{data, setData}} routes={LinkR.filters}/>}/>
-            element={
+          <Route path='location' element={<LocationPage data={{data, setData}} routes={LinkR.location}/>}/>
-              <CategoryPage data={{ data, setData }} routes={LinkR.category} />
+          <Route path='email' element={<EmailPage data={{data, setData}} routes={LinkR.email} />}/>
-            }
+          <Route path='congrats' element={<CongratsPage data={{data, setData}} routes={LinkR.congrats} />}/>
-          />
+        
-          <Route
-            path='filters'
-            element={
-              <FiltersPage data={{ data, setData }} routes={LinkR.filters} />
-            }
-          />
-          <Route
-            path='location'
-            element={
-              <LocationPage data={{ data, setData }} routes={LinkR.location} />
-            }
-          />
-          <Route
-            path='email'
-            element={
-              <EmailPage data={{ data, setData }} routes={LinkR.email} />
-            }
-          />
-          <Route
-            path='congrats'
-            element={
-              <CongratsPage data={{ data, setData }} routes={LinkR.congrats} />
-            }
-          />
         </Routes>
       </Router>
     </div>

kivi-cars/src/containers/CategoryPage.js

@@ -1,14 +1,15 @@
-import Header from "../components/Header/Header";
+import Header from '../components/Header/Header';
-import ButtonsToolbar from "../components/ButtonsToolbar/ButtonsToolbar";
+import ButtonsToolbar from '../components/ButtonsToolbar/ButtonsToolbar';
-import CategoryBtns from "../components/CategoryBtns/categorybtns";
+import CategoryBtns from '../components/CategoryBtns/categorybtns'
-import "./css/CategoryPage.css";
+import './css/CategoryPage.css'
 
 function CategoryPage(props) {
-  const { data, setData } = props.data;
 
-  const naslov = "IZABERITE KATEGORIJU";
+  const {data, setData} = props.data
+
+  const naslov = 'IZABERITE KATEGORIJU'
   return (
-    <div className='category'>
+    <div className="category">
         <Header header={naslov}/>
         <ButtonsToolbar routes={props.routes}/>
         <div className='category-buttons'>

kivi-cars/src/containers/CongratsPage.js

@@ -1,25 +1,22 @@
-import Header from "../components/Header/Header";
+import Header from '../components/Header/Header';
-import TitleBtn from "../components/Button/TitleBtn";
+import TitleBtn from '../components/Button/TitleBtn';
-import "./css/CongratsPage.css";
+import './css/CongratsPage.css'
-import { Link } from "react-router-dom";
+import { Link } from 'react-router-dom';
 
 function CongratsPage() {
-  const naslov = "ČESTITAMO!";
+
-  const btnTitle = "NOVA PRETRAGA";
+  const naslov = 'ČESTITAMO!'
+  const btnTitle = 'NOVA PRETRAGA'
 
   return (
-    <div className='congrats-page'>
+    <div className="congrats-page">
       <Header header={naslov}/>
       <div className='paragh-div'>
           <div className='first-paragh'>
-          <h2 className='h2'>
+              <h2 className='h2'>ČESTITAMO! Potvrđeni email je poslat na vašu email adresu.</h2>
-            ČESTITAMO! Potvrđeni email je poslat na vašu email adresu.
-          </h2>
           </div>
           <div className='second-paragh'>
-          <h2 className='h2'>
+              <h2 className='h2'>Svi rezultati će u najkraćem roku biti poslani na vašu adresu.</h2>
-            Svi rezultati će u najkraćem roku biti poslani na vašu adresu.
-          </h2>
           </div>
           <div className='third-paragh'>
               <h1 className='h1'>Ako želite novu pretragu idete na</h1>
@@ -28,6 +25,7 @@ function CongratsPage() {
           <Link to='/'>
             <TitleBtn title={btnTitle}/>
           </Link>
+          
       </div>
     </div>
   );

kivi-cars/src/containers/EmailPage.js

@@ -1,106 +1,95 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect} from 'react';
-import "./css/EmailPage.css";
+import './css/EmailPage.css'
-import Header from "../components/Header/Header";
+import Header from '../components/Header/Header';
-import ButtonsToolbar from "../components/ButtonsToolbar/ButtonsToolbar";
+import ButtonsToolbar from '../components/ButtonsToolbar/ButtonsToolbar';
-import TimeBtn from "../components/Button/TimeBtn";
+import StandardBtn from '../components/Button/StandardBtn';
-import TitleBtn from "../components/Button/TitleBtn";
+import TitleBtn from '../components/Button/TitleBtn';
-import { Link } from "react-router-dom";
+import { Link } from 'react-router-dom';
-import postData from "../services/search-post-service";
+
 
 function EmailPage(props) {
-  const { data, setData } = props.data;
+
-  const [error, setError] = useState(false);
+    const {data, setData} = props.data
-  const [toggleButtons, setToggle] = useState(true);
+    const [error, setError] = useState(false)
+
 
     const [state, setState] = useState({
         email: "",
-    confirmEmail: "",
+        confirmEmail: ""
-  });
+    })
 
     const header = "SLANJE OBAVJEŠTENJA";
-  let title1 = "Odmah";
+    let title1 = 'Odmah';
-  let title2 = "Dnevno";
+    let title2 = 'Dnevno';
-  let title3 = "ZAVRŠI";
+    let title3 = 'ZAVRŠI';
-  let errmsg = "Email does not match!";
+    let errmsg = 'Email does not match!';
-  let filter = "Slanje";
+    let filter = 'Slanje'
+
 
     const emailCheck = (e, ec) => {
         if(e !== "" && e === ec){
-      setError(false);
+            setError(false)
-      setData((prevData) => ({
+            setData(prevData => ({
                 ...prevData,
-        Email: state.email,
+                "Email": state.email
-      }));
+            }))
-      return error;
+            return error
         }else {
-      setError(true);
+            setError(true)
-      return error;
+            return error
+        }
     }
-  };
 
     const updateInput = (event) => {
-    setState((prevState) => ({
+        setState(prevState => ({
             ...prevState,
-      [event.target.name]: event.target.value,
+            [event.target.name]: event.target.value
-    }));
+        }))
-  };
+    }
 
     useEffect(() => {
-    emailCheck(state.email, state.confirmEmail);
+        emailCheck(state.email, state.confirmEmail)
-  }, [state]);
+    }, [state])
 
     return ( 
         <div>
             <Header header={header}/>
             <ButtonsToolbar routes={props.routes}/>
-      <div className='info'>
+            <div className="info">
                 <h2 className='h2'>Slanje obavještenja</h2>
             </div>
             <div className='buttons-container'>
-        <TimeBtn data={{ data, setData, filter }} title={title1} />
+                <StandardBtn data={{data, setData, filter}} title={title1}/>
-        <TimeBtn data={{ data, setData, filter }} title={title2} />
+                <StandardBtn data={{data, setData, filter}} title={title2}/>
             </div>
             <div className='form'>
-        <form method='POST' id='form-email'>
+                <form method="POST" id="form-email">
                     <div className='email-div'>
-            <input
+                        <input type="email" id="email" name='email' placeholder='vas.email@mail.com' required size='250' onChange={updateInput} />
-              type='email'
+                        <input type="email" id="confirmEmail" name='confirmEmail' placeholder='potvrdite.email@mail.com' required size='250' onChange={updateInput} />
-              id='email'
-              name='email'
-              placeholder='vas.email@mail.com'
-              required
-              size='250'
-              onChange={updateInput}
-            />
-            <input
-              type='email'
-              id='confirmEmail'
-              name='confirmEmail'
-              placeholder='potvrdite.email@mail.com'
-              required
-              size='250'
-              onChange={updateInput}
-            />
                         <p style={{color: "red"}} >{error ? errmsg : null}</p>
                     </div>
+
                 </form>
             </div>
             <div>
-        <h3 className='h3-2'>
+                <h3 className='h3-2'>*U svakom trenutku možete prekinuti slanje objava kroz
-          *U svakom trenutku možete prekinuti slanje objava kroz link u vašem
+                    link u vašem emailu
-          emailu
                 </h3>
             </div>
             <div>
-        {error ? (
+                {error ? (<TitleBtn title={title3} /> ) : (
-          <TitleBtn title={title3} />
+                <Link to="/congrats">
-        ) : (
-          <Link to='/congrats' onClick={() => postData(data)}>
                     <TitleBtn title={title3} />    
                 </Link>
                 )}      
             </div>
         </div>
+        
+
+        
+
+
      );
 }
 

kivi-cars/src/containers/FiltersPage.js

@@ -6,22 +6,32 @@ import FiltersNav from '../components/FiltersNavbar/FiltersNav';
 import StandardFilters from "../components/Filters/Standard-filters";
 import AdvancedFilters from "../components/Filters/Advanced-filters";
 
-const FiltersPage = ({routes, data, setData}) => {
+const FiltersPage = (props) => {
 
     const naslov = "Filteri za pretrazivanje"
     const [toggle, setToggle] = useState(true)
+    const [filters, setFilters] = useState({});
+    const {data, setData} = props.data
+    
+
+    useEffect(() => {
+        setData( prevData => ({
+            ...prevData,
+            "Filters": filters
+        }))
+    }, [filters])
 
     const showFilters = (toggle) => {
         if(toggle){
-            return <StandardFilters data={{data, setData}}/>
+            return <StandardFilters data={{data, filters, setFilters}}/>
         }
-        return <AdvancedFilters data={{data, setData}}/>;
+        return <AdvancedFilters data={{data, filters, setFilters}}/>;
     }
 
     return(
         <div className="FiltersPage">
             <Header header={naslov}/>
-            <ButtonsToolbar routes={routes}/> 
+            <ButtonsToolbar routes={props.routes}/> 
             <FiltersNav toggle={{toggle, setToggle}}/>
             {showFilters(toggle)}
         </div>

kivi-cars/src/containers/LocationPage.js

@@ -1,71 +1,87 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState } from 'react';
-import "./css/LocationPage.css";
+import './css/LocationPage.css';
 import Header from "../components/Header/Header";
-import Location from "../data/location";
+import Location from '../data/location';
-import LocationFilter from "../components/Location/LocationFilter";
+import LocationFilter from '../components/Location/LocationFilter';
-import ButtonsToolbar from "../components/ButtonsToolbar/ButtonsToolbar";
+import ButtonsToolbar from '../components/ButtonsToolbar/ButtonsToolbar';
-import LocationCheckbox from "../components/Filters/Filter/LocationCheckbox";
+import LocationCheckbox from '../components/Filters/Filter/LocationCheckbox';
-import TitleBtn from "../components/Button/TitleBtn";
+import TitleBtn from '../components/Button/TitleBtn';
-import { Link } from "react-router-dom";
+import { Link } from 'react-router-dom';
 
 const LocationPage = (props) => {
-  const { data, setData } = props.data;
+
-  const [gradovi, setGradovi] = useState([]);
+    const {data, setData} = props.data
-  const naslov = "Dodajte lokaciju";
+    const [locationData, setLocationData] = useState({})
+    const [locationInfo, setLocationInfo] = useState({"gradovi": []})
+    const [checkboxStatus, setCheckboxStatus] = useState({})
+    const [location, setLocation] = useState({});
+    const naslov = "Dodajte lokaciju"
 
     let id = 0;
 
     useEffect(() => {
-    if (data.Lokacija.kanton) {
+        if(locationData.kanton){
-      Location.entiteti.map((entity) => {
+            Location.entiteti.map(entity => {
-        return entity.kantoni.map((kantony) => {
+                return entity.kantoni.map(kantony => {
-          if (data.Lokacija.kanton === "Distrikt Brčko") {
+                    if(locationData.kanton === kantony.kanton){
-            setGradovi([]);
+                        return setLocationInfo({
-            return setData((prevData) => ({
+                            "entitet": entity.entitet,
-              ...prevData,
+                            "kanton": kantony.kanton,
-              Lokacija: {
+                            "gradovi": kantony.gradovi
-                ...prevData.Lokacija,
+                        })
-                entitet: entity.entitet,
-                gradovi: ["Brčko"],
-              },
-            }));
-          } else if (data.Lokacija.kanton === kantony.kanton) {
-            setGradovi(kantony.gradovi);
-            return setData((prevData) => ({
-              ...prevData,
-              Lokacija: {
-                ...prevData.Lokacija,
-                entitet: entity.entitet,
-              },
-            }));
                     }
-        });
+                })
-      });
+            })
-    }
+        }setCheckboxStatus({})
-  }, [data.Lokacija.kanton]);
+            console.log("locationInfo", locationInfo)
+    }, [locationData])
 
     useEffect(() => {
-    console.log("parent object", gradovi);
+        if(locationData.kanton === 'Distrikt Brcko'){
-  }, [data.Lokacija.gradovi]);
+            setLocation(
+                {
+                "entitet": "Distrikt Brcko",
+                "kanton": "Distrikt Brcko",
+                "gradovi": "Brcko"
+                }
+            )
+        }else{
+            setLocation( prevData => ({
+                ...prevData,
+                "entitet": locationInfo.entitet,
+                "kanton": locationInfo.kanton,
+                "gradovi": checkboxStatus
+            }))}
+            console.log("location", location)
+    }, [checkboxStatus])
+
+    useEffect(() => {
+        setData( prevData => ({
+            ...prevData,
+            "Location": location
+        }))
+        console.log("data", data)
+    }, [location])
+
     
     return (
         <div className='location-div'>
             <Header header={naslov}/>
             <ButtonsToolbar routes={props.routes}/>
-      <LocationFilter data={{ data, setData }} />
+            <LocationFilter data={{setLocationData}}/>
             <div className='checkbox-div'>
-        {gradovi.map((grad) => {
+                {locationInfo.gradovi.map((grad) => {
-          id += 1;
+                    id += 1
                     return(
-            <LocationCheckbox key={id} title={grad} data={{ data, setData }} />
+                        <LocationCheckbox key={id} title={grad} data={{checkboxStatus, setCheckboxStatus}}/>
-          );
+                    )
                 })}
             </div>
-      <Link to='/email'>
+            <Link to="/email">
-        <TitleBtn title='Naredna stranica' />
+                <TitleBtn title="Naredna stranica"/>
             </Link>
         </div>
     );
-};
+}
 
-export default LocationPage;
+export default LocationPage

kivi-cars/src/containers/css/LocationPage.css

@@ -15,6 +15,5 @@
     .checkbox-div{
         flex-direction: row;
         justify-content: space-around;
-        margin-bottom: 50px;
     }
 }

kivi-cars/src/data/air-condition.js

@@ -1,6 +1,5 @@
 const AirCondition = {
     "ime" : "Klima",
-    "VName": "TipKlime",
     "tipovi" : [
         "Odaberite",
         "Jednozonska",

kivi-cars/src/data/checkbox.js

@@ -1,179 +1,38 @@
 const CheckBox = [
-  {
+    "ABS",
-    title: "ABS",
+    "ESP",
-    value: false,
+    "Tempomat",
-    variable: "ABS",
+    "Alarm",
-  },
+    "Airbag",
-  {
+    "Šiber",
-    title: "ESP",
+    "Servo volan",
-    value: false,
+    "Koža",
-    variable: "ESP",
+    "Klima",
-  },
+    "Centralna brava",
-  {
+    "Daljinsko zaključavanje",
-    title: "Alarm",
+    "ISOFIX",
-    value: false,
+    "Registrovan",
-    variable: "Alarm",
+    "Xenon",
-  },
+    "LED",
-  {
+    "Laser",
-    title: "Airbag",
+    "Električni podizači stakala",
-    value: false,
+    "Naslon za ruke", 
-    variable: "Airbag",
+    "Električni retrovizor",
-  },
+    "Start/Stop",
-  {
+    "Turbo",
-    title: "Šiber",
+    "Stranac",   
-    value: false,
+    "Pakring assistent",
-    variable: "Siber",
+    "Senzor mrtvog ugla",
-  },
+    "Servisna knjiga",
-  {
+    "Komande na volanu",
-    title: "Servo volan",
+    "Navigacija",
-    value: false,
+    "Grijanje sjedišta",
-    variable: "ServoVolan",
+    "Masažna sjedišta",
-  },
+    "Memorija sjedišta",
-  {
+    "Panorama",
-    title: "Koža",
+    "Ocarinjen",
-    value: false,
+    "Udaren",
-    variable: "Koza",
+    
-  },
+]
-  {
-    title: "Klima",
-    value: false,
-    variable: "PosjedujeKlimu",
-  },
-  {
-    title: "Centralna brava",
-    value: false,
-    variable: "CentralnaBrava",
-  },
-  {
-    title: "Daljinsko zaključavanje",
-    value: false,
-    variable: "DaljinskoZakljucavanje",
-  },
-  {
-    title: "Kuka",
-    value: false,
-    variable: "AutoKuka",
-  },
-  {
-    title: "ISOFIX",
-    value: false,
-    variable: "ISOFIX",
-  },
-  {
-    title: "Registrovan",
-    value: false,
-    variable: "Registrovan",
-  },
-  {
-    title: "Xenon",
-    value: false,
-    variable: "Xenon",
-  },
-  {
-    title: "LED",
-    value: false,
-    variable: "LED",
-  },
-  {
-    title: "Laser",
-    value: false,
-    variable: "Laser",
-  },
-  {
-    title: "Električni podizači stakala",
-    value: false,
-    variable: "ElektricniPodizaciStakala",
-  },
-  {
-    title: "Naslon za ruku",
-    value: false,
-    variable: "NaslonZaRuku",
-  },
-  {
-    title: "Električni retrovizor",
-    value: false,
-    variable: "ElektricniRetrovizori",
-  },
-  {
-    title: "Start/Stop",
-    value: false,
-    variable: "StartStop",
-  },
-  {
-    title: "Tempomat",
-    value: false,
-    variable: "Tempomat",
-  },
-  {
-    title: "Turbo",
-    value: false,
-    variable: "Turbo",
-  },
-  {
-    title: "DPF/FAP",
-    value: false,
-    variable: "DPFFAP",
-  },
-  {
-    title: "Pakring assistent",
-    value: false,
-    variable: "ParkingAssistent",
-  },
-  {
-    title: "Senzor mrtvog ugla",
-    value: false,
-    variable: "SenzorMrtvogUgla",
-  },
-  {
-    title: "Servisna knjiga",
-    value: false,
-    variable: "ServisnaKnjiga",
-  },
-  {
-    title: "Komande na volanu",
-    value: false,
-    variable: "KomandeNaVolanu",
-  },
-  {
-    title: "Navigacija",
-    value: false,
-    variable: "Navigacija",
-  },
-  {
-    title: "Grijanje sjedišta",
-    value: false,
-    variable: "GrijanjeSjedista",
-  },
-  {
-    title: "Hlađenje sjedišta",
-    value: false,
-    variable: "HladjenjeSjedista",
-  },
-  {
-    title: "Masažna sjedišta",
-    value: false,
-    variable: "MasaznaSjedista",
-  },
-  {
-    title: "Memorija sjedišta",
-    value: false,
-    variable: "MemorijaSjedista",
-  },
-  {
-    title: "Panorama",
-    value: false,
-    variable: "Panorama",
-  },
-  {
-    title: "Rolo zavjese",
-    value: false,
-    variable: "RoloZavjese",
-  },
-  {
-    title: "Metalik",
-    value: false,
-    variable: "Metalik",
-  },
-];
 
 export default CheckBox;

kivi-cars/src/data/color.js

@@ -1,6 +1,5 @@
 const Color = {
     "ime": "Boja",
-    "VName": "Boja",
     "tipovi": [
         "Odaberite",
         "Bež",

kivi-cars/src/data/condition.js

@@ -1,6 +1,5 @@
 const Condition = {
     "ime": "Stanje",
-    "VName": "Stanje",
     "tipovi": [
         "Odaberite",
         "Novo",

kivi-cars/src/data/cubes.js

@@ -1,6 +1,5 @@
 const Cubes = {
     "title": "Kubikaza",
-    "VName": "Kubikaza",
     "fields": {
         "min": 0.8,
         "max": 6.2,

kivi-cars/src/data/doors.js

@@ -1,6 +1,5 @@
 const Doors = {
     "ime": "Broj vrata",
-    "VName": "BrojVrata",
     "tipovi" : [
         "Odaberite",
         "2/3",

kivi-cars/src/data/drive.js

@@ -1,6 +1,5 @@
 const Drive = {
     "ime" : "Pogon",
-    "VName": "Pogon",
     "tipovi": [
         "Odaberite",
         "Prednji",

kivi-cars/src/data/fuel.js

@@ -1,11 +1,10 @@
 const Fuel = {
     "ime": "Gorivo",
-    "VName": "Gorivo",
     "tipovi": [
         "Odaberite",
         "Dizel",
         "Benzin",
-        "Plin",
+        "Benzin/Plin",
         "Cng",
         "Hybrid",
         "Elektro"

kivi-cars/src/data/gearbox.js

@@ -1,6 +1,5 @@
 const Gearbox = {
     "ime": "Broj brzina",
-    "VName": "BrojStepenihPrijenosa",
     "tipovi": [
         "Odaberite",
         "3+R",

kivi-cars/src/data/horsepower.js

@@ -1,6 +1,5 @@
 const HorsePower = {
     "title": "Konjskih snaga",
-    "VName": "KonjskihSnaga",
     "fields": {
         "min": 0,
         "max": 2000,

kivi-cars/src/data/kilometers.js

@@ -1,6 +1,5 @@
 const Kilometers = {
     "title": "Kilometraza",
-    "VName": "Kilometraza",
     "fields": {
         "min": 0,
         "max": 1000000,

kivi-cars/src/data/kilowats.js

@@ -1,6 +1,5 @@
 const Kilowats = {
     "title": "Kilovata",
-    "VName": "Kilovata",
     "fields": {
         "min": 0,
         "max": 1000,

kivi-cars/src/data/lights.js

@@ -0,0 +1,13 @@
+const Lights = {
+    "ime": "Svjetla",
+    "tipovi": [
+        "Odaberite",
+        "Halogena",
+        "Xenon",
+        "Led",
+        "Laser",
+        "Ostalo"
+    ]
+}
+
+export default Lights;

kivi-cars/src/data/location.js

@@ -1,12 +1,10 @@
 const Location = {
-  ime: "Lokacija",
+    "ime": "Lokacija",
-  entiteti: [
+    "entiteti": [
-    {
+        {"entitet":"Federacija BiH",
-      entitet: "Federacija BiH",
+            "kantoni": [
-      kantoni: [
+                {"kanton": "Sarajevo",
-        {
+                    "gradovi": [
-          kanton: "Sarajevo",
-          gradovi: [
                         "Hadžići",
                         "Ilidža",                       
                         "Ilijaš",                       
@@ -15,12 +13,11 @@ const Location = {
                         "Sarajevo-Novo Sarajevo",                       
                         "Sarajevo-Stari Grad",                       
                         "Trnovo",                       
-            "Vogošća",
+                        "Vogošća"
-          ],
+                    ]
                 },
-        {
+                {"kanton":"Unsko-sanski",
-          kanton: "Unsko-sanski",
+                    "gradovi": [
-          gradovi: [
                         "Bihać",
                         "Bosanska Krupa",                       
                         "Bosanski Petrovac",                       
@@ -28,16 +25,19 @@ const Location = {
                         "Cazin",                       
                         "Ključ",                       
                         "Sanski Most",                       
-            "Velika Kladuša",
+                        "Velika Kladuša"
-          ],
+                    ]
                 },
-        {
+                {"kanton": "Posavski",
-          kanton: "Posavski",
+                    "gradovi": [
-          gradovi: ["Domaljevac", "Odžak", "Orašje", "Šamac"],
+                        "Domaljevac",
+                        "Odžak",                       
+                        "Orašje",                       
+                        "Šamac"
+                    ]
                 },                
-        {
+                {"kanton":"Tuzlanski",
-          kanton: "Tuzlanski",
+                    "gradovi": [
-          gradovi: [
                         "Banovići",
                         "Doboj-Istok",                       
                         "Gradačac",                       
@@ -50,12 +50,11 @@ const Location = {
                         "Teočak",                       
                         "Tuzla",                       
                         "Čelić",                       
-            "Živinice",
+                        "Živinice"
-          ],
+                    ]
                 },
-        {
+                {"kanton":"Zeničko-dobojski",
-          kanton: "Zeničko-dobojski",
+                    "gradovi": [
-          gradovi: [
                         "Breza",
                         "Doboj-Jug",                       
                         "Kakanj",                       
@@ -67,13 +66,18 @@ const Location = {
                         "Visoko",                       
                         "Zavidovići",                       
                         "Zenica",                       
-            "Žepče",
+                        "Žepče"
-          ],
+                    ]
                 },
-        { kanton: "Bosansko-podrinjski", gradovi: ["Foča", "Goražde", "Pale"] },
+                {"kanton":"Bosansko-podrinjski",
-        {
+                    "gradovi": [
-          kanton: "Srednjobosanski",
+                        "Foča",
-          gradovi: [
+                        "Goražde",                       
+                        "Pale"
+                    ]
+                },
+                {"kanton":"Srednjobosanski",
+                    "gradovi": [
                         "Bugojno",
                         "Busovača",                       
                         "Dobretići",                       
@@ -85,12 +89,11 @@ const Location = {
                         "Kreševo",                       
                         "Novi Travnik",                       
                         "Travnik",                       
-            "Vitez",
+                        "Vitez"
-          ],
+                    ]
                 },
-        {
+                {"kanton":"Hercegovačko-neretvanski",
-          kanton: "Hercegovačko-neretvanski",
+                    "gradovi": [
-          gradovi: [
                         "Grad Mostar",
                         "Jablanica",                       
                         "Konjic",                       
@@ -99,32 +102,33 @@ const Location = {
                         "Ravno",                       
                         "Stolac",                       
                         "Čapljina",                       
-            "Čitluk",
+                        "Čitluk"
-          ],
+                    ]
                 },
-        {
+                {"kanton":"Zapadno-hercegovački",
-          kanton: "Zapadno-hercegovački",
+                    "gradovi": [
-          gradovi: ["Grude", "Ljubuški", "Posušje", "Široki Brijeg"],
+                        "Grude",
+                        "Ljubuški",                       
+                        "Posušje",                       
+                        "Široki Brijeg"
+                    ]
                 },
-        {
+                {"kanton":"Livanjski",
-          kanton: "Livanjski",
+                    "gradovi": [
-          gradovi: [
                         "Bosansko Grahovo",
                         "Drvar",                       
                         "Glamoč",                       
                         "Kupres",                       
                         "Livno",                       
-            "Tomislavgrad",
+                        "Tomislavgrad"
-          ],
+                    ]
+                }
+            ]
         },
-      ],
+        {"entitet":"Republika Srpska",
-    },
+            "kantoni": [
-    {
+                {"kanton":"Banjalučka",
-      entitet: "Republika Srpska",
+                    "gradovi": [
-      kantoni: [
-        {
-          kanton: "Banjalučka",
-          gradovi: [
                         "Banja Luka",
                         "Gradiška",                       
                         "Istočni Drvar",                       
@@ -145,12 +149,11 @@ const Location = {
                         "Ribnik",                       
                         "Srbac",                       
                         "Čelinac",                       
-            "Šipovo",
+                        "Šipovo"
-          ],
+                    ]
                 },
-        {
+                {"kanton":"Dobojsko-Bijeljinska",
-          kanton: "Dobojsko-Bijeljinska",
+                    "gradovi": [
-          gradovi: [
                         "Bijeljina",
                         "Brod",                       
                         "Derventa",                       
@@ -167,12 +170,11 @@ const Location = {
                         "Tuzla",                      
                         "Ugljevik",                       
                         "Vukosavlje",                       
-            "Šamac",
+                        "Šamac"
-          ],
+                    ]
                 },
-        {
+                {"kanton":"Sarajevsko-Zvornička",
-          kanton: "Sarajevsko-Zvornička",
+                    "gradovi": [
-          gradovi: [
                         "Bratunac",
                         "Han Pijesak",                       
                         "Ilijaš",                       
@@ -195,12 +197,11 @@ const Location = {
                         "Vlasenica",                       
                         "Zvornik",                       
                         "Šekovići",                       
-            "Žepa",
+                        "Žepa"
-          ],
+                    ]
                 },
-        {
+                {"kanton":"Trebinjsko-Fočanska",
-          kanton: "Trebinjsko-Fočanska",
+                    "gradovi": [
-          gradovi: [
                         "Berkovići",
                         "Bileća",                       
                         "Foča",                       
@@ -210,16 +211,21 @@ const Location = {
                         "Ljubinje",                       
                         "Nevesinje",                       
                         "Trebinje",                       
-            "Čajniče",
+                        "Čajniče"
-          ],
+                    ]
+                }
+            ]
         },
-      ],
+        {"entitet":"Distrikt Brcko",
-    },
+            "kantoni": [
-    {
+                {"kanton": "Distrikt Brcko",
-      entitet: "Distrikt Brčko",
+                    "gradovi":[
-      kantoni: [{ kanton: "Distrikt Brčko", gradovi: ["Brčko"] }],
+                        
-    },
+                    ]
-  ],
+                }
-};
+            ]
+        }
+    ]
+}
 
 export default Location;

kivi-cars/src/data/price.js

@@ -1,6 +1,5 @@
 const Price = {
     "title": "Cijena",
-    "VName": "Cijena",
     "fields": {
         "min": 0,
         "max": 1000000,

kivi-cars/src/data/seats.js

@@ -1,6 +1,5 @@
 const Seats = {
     "ime": "Sjedišta",
-    "VName": "BrojSjedista",
     "tipovi": [
         "Odaberite",
         "1",

kivi-cars/src/data/sensors.js

@@ -1,6 +1,5 @@
 const Sensors = {
     "ime": "Senzori",
-    "VName": "ParkingSenzori",
     "tipovi": [
         "Odaberite",
         "naprijed",

kivi-cars/src/data/transmission.js

@@ -1,6 +1,5 @@
 const Transmission = {
     "ime": "Transmisija",
-    "VName": "Transmisija",
     "tipovi": [
         "Odaberite",
         "Automatski mjenjač",

kivi-cars/src/data/type.js

@@ -1,6 +1,5 @@
 const Type = {
     "ime": "Vrsta vozila",
-    "VName": "TipVozila",
     "tipovi": [
         "Odaberite",
         "Karavan",

kivi-cars/src/data/year.js

@@ -1,6 +1,5 @@
 const Year = {
     "title": "Godiste",
-    "VName": "Godiste",
     "fields": {
         "min": 1960,
         "max": new Date().getFullYear(),

kivi-cars/src/services/search-post-service.js

@@ -1,18 +0,0 @@
-async function postData(data) {
-  // Default options are marked with *
-  const response = await fetch("http://localhost:8000/search/", {
-    method: "POST", // *GET, POST, PUT, DELETE, etc.
-    mode: "cors", // no-cors, *cors, same-origin
-    cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached
-    credentials: "same-origin", // include, *same-origin, omit
-    headers: {
-      "Content-Type": "application/json",
-    },
-    redirect: "follow",
-    referrerPolicy: "no-referrer",
-    body: JSON.stringify(data),
-  });
-  return console.log(response);
-}
-
-export default postData;

kivi-cars/src/services/vehicle-service.js

@@ -0,0 +1,50 @@
+import Cars from "../data/cars-brands";
+import Trucks from "../data/trucks-brands";
+import Motors from "../data/motors-brands"
+import Cubes from "../data/cubes";
+import Type from "../data/type";
+import Fuel from "../data/fuel";
+import Transmission from "../data/transmission";
+import Drive from "../data/drive";
+import Condition from "../data/condition";
+import Doors from "../data/doors";
+import Year from "../data/year";
+import Price from "../data/price";
+import HorsePower from "../data/horsepower";
+import Kilowats from "../data/kilowats";
+import Kilometers from "../data/kilometers";
+
+const vehicleService = (vehicle) => {
+        let data1, data2, data3, brands, show;
+        if(vehicle === "Auto"){
+            show = true;
+            data1 = [Fuel, Type]
+            data2 = [Price, Year, Kilometers, Cubes, HorsePower, Kilowats]
+            data3 = [Transmission, Drive, Condition, Doors]
+            brands = Cars.map(brand => {
+                return brand})
+        }
+        else if(vehicle === "Motor"){
+            show = false;
+            data1 = [Condition]
+            data2 = [Price, Year, Kilometers, Cubes, HorsePower, Kilowats]
+            data3 = []
+            brands = Motors.map(brand => {
+                return brand
+            })
+        }
+        else if(vehicle === "Teretno vozilo"){
+            show = false;
+            data1 = [Condition, Fuel]
+            data2 = [Price, Year, Kilometers, Cubes, HorsePower, Kilowats]
+            data3 = []
+            brands = Trucks.map(brand => {
+                return brand
+            })
+        }
+
+            
+    return {"show": show, "brands": brands, "data1": data1, "data2": data2, "data3": data3}
+}
+
+export default vehicleService;