Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 6373 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
6372 stevensc 1 
import React, { useState, useRef, useEffect } from 'react'
2 
import { useLocation } from 'react-router-dom'
3 
import { axios, jsonToParams } from '../../utils'
4 
 
5 
import FiltersSidebar from '../components/FiltersSidebar'
6 
import SearchByCategory from '../components/filters/SearchByCategory'
7 
import SearchByLocation from '../components/filters/SearchByLocation'
8 
import Spinner from '../../shared/loading-spinner/Spinner'
9 
import EntityTemplate from '../components/entity-template/EntityTemplate'
10 
import EmptySection from '../../shared/empty-section/EmptySection'
11 
import PaginationComponent from '../../shared/pagination/PaginationComponent'
12 
 
13 
const SearchGrid = ({ filters }) => {
14 
  const [entities, setEntities] = useState([])
15 
  const [loading, setLoading] = useState(true)
16 
  const [category, setCategory] = useState('user')
17 
  const [currentPage, setCurrentPage] = useState(1)
18 
  const [pages, setPages] = useState(1)
19 
 
20 
  const activeFilters = useRef([])
21 
  const addressKeys = useRef([])
22 
 
23 
  const location = useLocation()
24 
 
25 
  // getting keyword
26 
  const locationParams = new URLSearchParams(location.search)
27 
  const keyword = locationParams.get('keyword')
28 
 
29 
  useEffect(() => {
30 
    loadEntities()
6374 stevensc 31 
  }, [keyword, category])
6372 stevensc 32 
 
33 
  const getAddressHandler = (addresObject) => {
34 
    const { address_components } = addresObject
35 
    if (address_components) {
36 
      addressKeys.current = []
37 
      address_components.map((address_component) => {
38 
        const address_component_name = address_component.long_name
39 
        const address_component_type = address_component.types[0]
40 
        switch (address_component_type) {
41 
          case 'route':
42 
            addressKeys.current = [
43 
              ...addressKeys.current,
44 
              { type: 'route', name: address_component_name },
45 
            ]
46 
            break
47 
          case 'sublocality':
48 
            addressKeys.current = [
49 
              ...addressKeys.current,
50 
              { type: 'sublocality', name: address_component_name },
51 
            ]
52 
            break
53 
          case 'locality':
54 
            addressKeys.current = [
55 
              ...addressKeys.current,
56 
              { type: 'locality', name: address_component_name },
57 
            ]
58 
            break
59 
          case 'administrative_area_level_2':
60 
            addressKeys.current = [
61 
              ...addressKeys.current,
62 
              {
63 
                type: 'administrative_area_level_2',
64 
                name: address_component_name,
65 
              },
66 
            ]
67 
            break
68 
          case 'administrative_area_level_1':
69 
            addressKeys.current = [
70 
              ...addressKeys.current,
71 
              {
72 
                type: 'administrative_area_level_1',
73 
                name: address_component_name,
74 
              },
75 
            ]
76 
            break
77 
          case 'country':
78 
            addressKeys.current = [
79 
              ...addressKeys.current,
80 
              { type: 'country', name: address_component_name },
81 
            ]
82 
            break
83 
          case 'postal_code':
84 
            addressKeys.current = [
85 
              ...addressKeys.current,
86 
              { type: 'postal_code', name: address_component_name },
87 
            ]
88 
            break
89 
          default:
90 
            break
91 
        }
92 
      })
93 
      loadEntities()
94 
    } else {
95 
      if (addressKeys.current.length) {
96 
        loadEntities()
97 
      }
98 
    }
99 
  }
100 
 
101 
  const loadEntities = async (page = 1) => {
102 
    setLoading(true)
103 
    setCurrentPage(page)
104 
    const urlParams = {
105 
      page,
106 
      keyword,
107 
    }
108 
    addressKeys.current.forEach(({ name, type }) => {
109 
      urlParams[type] = name
110 
    })
111 
    activeFilters.current.forEach(({ name, value }) => {
112 
      urlParams[name] = value
113 
    })
114 
    await axios
115 
      .get(`/search/entity/${category}?${jsonToParams(urlParams)}`)
116 
      .then((response) => {
117 
        const responseData = response.data
118 
        if (responseData.success) {
119 
          setEntities(responseData.data.current.items)
120 
          setPages(responseData.data.total.pages)
121 
        }
122 
      })
123 
    setLoading(false)
124 
  }
125 
 
126 
  const onChangePageHandler = (currentPage) => {
127 
    setCurrentPage(currentPage)
128 
  }
129 
 
130 
  return (
131 
    <main className="main-section-data container px-0 mt-3">
132 
      <FiltersSidebar>
6373 stevensc 133 
        {() => (
134 
          <>
135 
            <SearchByCategory
136 
              allowSearchCompany={filters.allowSearchCompany}
137 
              onChange={(value) => setCategory(value)}
138 
            />
139 
            <SearchByLocation onChange={getAddressHandler} />
140 
          </>
141 
        )}
6372 stevensc 142 
      </FiltersSidebar>
143 
      <div className="main-ws-sec">
144 
        <div className="posts-section">
145 
          {loading && <Spinner />}
146 
          {entities.length ? (
147 
            entities.map((entity) => (
148 
              <EntityTemplate
149 
                entity={entity}
150 
                key={entity.id}
151 
                onChangePage={onChangePageHandler}
152 
              />
153 
            ))
154 
          ) : (
155 
            <EmptySection message="No hay resultados" />
156 
          )}
157 
        </div>
158 
        <PaginationComponent
159 
          pages={pages}
160 
          currentActivePage={currentPage}
161 
          onChangePage={loadEntities}
162 
        />
163 
      </div>
164 
      <div className="right-sidebar" />
165 
    </main>
166 
  )
167 
}
168 
 
169 
export default SearchGrid