Skip to content

Commit

Permalink
🚀 release/2.3.1: correção de chamadas e sequência de pontos (#85)
Browse files Browse the repository at this point in the history
  • Loading branch information
Gabriel Guimarães authored Mar 29, 2023
1 parent e00d4b1 commit 5684929
Show file tree
Hide file tree
Showing 14 changed files with 120 additions and 111 deletions.
7 changes: 6 additions & 1 deletion src/assets/styles/globals.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -141,4 +141,9 @@ background-image: url(../imgs/movingMarker.svg);
.leaflet-popup-content{
margin: 0 !important;
padding: 10px 22px;
}
}
.eta {
white-space: nowrap;
max-height: 32px;
margin-left: -1.2rem;
}
6 changes: 2 additions & 4 deletions src/components/CenterButton.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,14 +1,12 @@
import { useContext, useEffect, useState } from "react";
import { Popup, useMap } from "react-leaflet";
import { useMap } from "react-leaflet";
import { CodeContext } from "../hooks/getCode";
import { MovingMarkerContext } from "../hooks/getMovingMarkers";
import { MdMyLocation } from 'react-icons/md'



export default function CenterButton({ location }) {
const { center } = useContext(MovingMarkerContext)
const { stopId } = useContext(CodeContext)
const { stopId, center } = useContext(CodeContext)
const map = useMap()
function fixCenter() {
map.setView(location);
Expand Down
9 changes: 5 additions & 4 deletions src/components/Header/Header.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,7 @@ import { GPSContext } from '../../hooks/getGPS'
export function Header(props) {
let navigate = useNavigate()
const { code, setCode, setStopId } = useContext(CodeContext)
const { setTrip } = useContext(TripContext)
const {setPoints} = useContext(ShapeContext)
const { setTrip, setSequenceInfo } = useContext(TripContext)
const {theme, setTheme, setSppo, setRouteType} = useContext(ThemeContext)
const [newCode, setNewCode] = useState("")
const [value, setValue] = useState('')
Expand All @@ -32,7 +31,7 @@ export function Header(props) {
setTrip('')
setCode("")
navigate('/')
setPoints("")
setSequenceInfo()
setPlataforms([])
setRoutes()
setResults()
Expand All @@ -56,7 +55,7 @@ export function Header(props) {
setValue()
setPlataforms([])
setRoutes()
setPoints("")
setSequenceInfo()
setTracked()
setInnerCircle([])
if (event.target.value.length == 0) {
Expand All @@ -65,6 +64,7 @@ export function Header(props) {

}
useEffect(() => {
if(newCode){
api.get("/stops/?stop_code=" + newCode.toUpperCase())
.then(response => {
if (response.data.count == 0) {
Expand All @@ -75,6 +75,7 @@ export function Header(props) {
setResults()
}
})
}
}, [newCode])

useEffect(() => {
Expand Down
28 changes: 12 additions & 16 deletions src/components/InfoCard/InfoCard.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,28 +18,24 @@ import { CodeContext } from '../../hooks/getCode'
import { TripContext } from '../../hooks/getTrips'
import { RoutesContext } from '../../hooks/getRoutes'
import { GPSContext } from "../../hooks/getGPS"
import { ServiceIdContext } from "../../hooks/getServiceId"




export function InfoCard() {
const { code, setGpsUrl, gpsUrl } = useContext(CodeContext)
const { setGpsUrl, name } = useContext(CodeContext)
const {serviceId} = useContext(ServiceIdContext)
const { routes, isParent, getMultiplePages, plataforms, setRoutes, activateLoader } = useContext(RoutesContext)
const { setTracked, arrivals, setArrivals } = useContext(MovingMarkerContext)
const { setTrip } = useContext(TripContext);
const { stopFetching } = useContext(GPSContext)
const { theme } = useContext(ThemeContext)
const { activateForm, setSelectedPlatform } = useContext(FormContext)
const [name, setName] = useState()
const [linha, setLinha] = useState(false)
const [sortedPlatforms, setSortedPlatforms] = useState()



useEffect(() => {
api.get('/stops/?stop_code=' + code.toUpperCase())
.then(response => setName(response.data.results[0].stop_name))
}, [code])

function infoLinha() {
if (!linha) {
Expand All @@ -57,17 +53,17 @@ export function InfoCard() {
.sort((a, b) => {
const platformA = Object.values(a)[0];
const platformB = Object.values(b)[0];
if (platformA.platform_code < platformB.platform_code) {
if (platformA.stop_id.platform_code < platformB.stop_id.platform_code) {
return -1;
}
if (platformA.platform_code > platformB.platform_code) {
if (platformA.stop_id.platform_code > platformB.stop_id.platform_code) {
return 1;
}
return 0;
})
.map((p) => {
const platform = Object.values(p)[0];
const isConvencionais = platform.stop_desc.includes("Convencionais");
const isConvencionais = platform.stop_id.stop_desc.includes("Convencionais");
const modifiedPlatform = {
...platform,
isConvencionais: isConvencionais
Expand Down Expand Up @@ -117,18 +113,18 @@ export function InfoCard() {
strokeWidthSecondary={4}

/> : sortedPlatforms.map((e) => Object.values(e).map((values) => {
return <li className='flex justify-between border-b py-2.5' onClick={() => { getMultiplePages("/stop_times/?stop_id=" + Object.keys(values)[0]), infoLinha(), setSelectedPlatform(Object.keys(values)), activateLoader(), setGpsUrl('?stop_id=' + Object.keys(values)[0]) }}>
return <li className='flex justify-between border-b py-2.5' onClick={() => { getMultiplePages(`/stop_times/?stop_id=${Object.keys(values)[0]}&service_id=${serviceId}`), infoLinha(), setSelectedPlatform(Object.keys(values)), activateLoader(), setGpsUrl('?stop_id=' + Object.keys(values)[0]) }}>
<div className={styles.routeName}>
{!Object.values(values)[0].isConvencionais ? <>
<div className={` ${styles.shortName} + bg-[#F8AC04]`}>
<img src={pin} alt="" />
<p className="text-sm ml-2.5">{Object.values(values)[0].stop_desc}</p>
<p className="text-sm ml-2.5">{Object.values(values)[0].stop_id.stop_desc}</p>
</div>
</>
: <>
<div className={` ${styles.shortName} + bg-[#004a80]`}>
<img src={whitePin} alt="" />
<p className="text-sm ml-2.5 text-white">{Object.values(values)[0].stop_desc}</p>
<p className="text-sm ml-2.5 text-white">{Object.values(values)[0].stop_id.stop_desc}</p>
</div>
</>}

Expand All @@ -153,7 +149,7 @@ export function InfoCard() {
/>

: arrivals.map((e) => {
return <li key={e.id} onClick={() => setTrip(e.trip_id.trip_id)} className="flex justify-between border-b py-2.5">
return <li key={e.id} onClick={() => setTrip(e.trip_id)} className="flex justify-between border-b py-2.5">
<div className={styles.routeName}>
<div className="flex">
<div className={` ${styles.shortName} ${e.trip_id.route_id.route_type === 702 ? 'bg-[#F8AC04]' :'bg-[#004a80]' }`}>
Expand All @@ -171,7 +167,7 @@ export function InfoCard() {

</div>
{e.smallestEtas != undefined ?
<p className="bg-[#F0EFEF] p-1 font-bold rounded-sm ml-4 flex">
<p className="bg-[#F0EFEF] p-1 font-bold rounded-sm ml-4 flex eta">
{Math.ceil(parseInt(e.smallestEtas)) > 1 && Math.ceil(parseInt(e.smallestEtas) > -1)
? `${Math.ceil((e.smallestEtas[0]))} min` : "Agora"}
<svg width="14" height="19" viewBox="0 0 14 19" fill="none" xmlns="http://www.w3.org/2000/svg">
Expand Down Expand Up @@ -214,7 +210,7 @@ export function InfoCard() {
strokeWidthSecondary={4}

/></> : routes.map((e) => {
return <li key={e.id} onClick={() => setTrip(e.trip_id.trip_id)} className="flex justify-between border-b py-2.5">
return <li key={e.id} onClick={() => setTrip(e.trip_id)} className="flex justify-between border-b py-2.5">
<div className={`${styles.routeName} + flex`}>
<div className={` ${styles.shortName} + bg-[#004a80]`}>
<img src={busSppo} alt="" />
Expand Down
4 changes: 4 additions & 0 deletions src/components/InfoCard/styles.module.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,10 +23,14 @@
display: flex;
border-radius: 3px;
padding: 4px 3px;
min-width: 45.5px;
max-height: 24px;


}

}

}

.directionBanner {
Expand Down
32 changes: 22 additions & 10 deletions src/components/SequenceCard/SequenceCard.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,17 +13,15 @@ import { FormContext } from "../../hooks/useForm";

export function SequenceCard() {

const { setTrip, sequenceInfo, stopInfo } = useContext(TripContext)
const { setTrip, sequenceInfo, stopInfo, setSequenceInfo } = useContext(TripContext)
const {stopId} = useContext(RoutesContext)
const {theme} = useContext(ThemeContext)
const { setPoints } = useContext(ShapeContext)
const { activateForm } = useContext(FormContext)
function clearMapInfo() {
setTrip('')
setPoints('')
setTrip()
setSequenceInfo()
}


return (
<>
<div className="fixed bottom-0 translate-x-1/2 right-1/2 w-11/12 z-[401]">
Expand Down Expand Up @@ -64,11 +62,25 @@ export function SequenceCard() {
</h1>

<ul className={styles.timeline}>
{sequenceInfo.map((e) => {
return <li key={e.id} className={`${styles.event} ${e.stop_id.stop_id == stopId ? styles.active : ''}`} >
{e.stop_id.stop_name}
</li>
})}
{sequenceInfo ?
sequenceInfo.map((e) => {
return <li key={e.id} className={`${styles.event} ${e.stop_id.stop_id == stopId ? styles.active : ''}`} >
{e.stop_id.stop_name}
</li>
})
: <>
<Oval
height={40}
width={40}
color="#707070"
wrapperStyle={{}}
visible={true}
ariaLabel='oval-loading'
secondaryColor="#707070"
strokeWidth={4}
strokeWidthSecondary={4} /></>
}


</ul>
</>
Expand Down
43 changes: 19 additions & 24 deletions src/hooks/getCode.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,24 @@ export const CodeContext = createContext()

export function CodeProvider({ children }) {
const [code, setCode] = useState('')
// PEGAR CÓDIGO PELA URL
const [searchParams, setSearchParams] = useSearchParams();
const [codeExists, setCodeExists] = useState(false)
// BOOLEANO PRA ATIVAR O LEITOR QRCODE
const [active, setActive] = useState(false)
// PEGAR STOP_ID PRA IDEN
const [stopId, setStopId] = useState()
// NOME PRA USAR NOS CARDS
const [name, setName] = useState()
// IDENTIFICAR SE É PARENT_STATION
const [locationType, setLocationType] = useState()
// PESQUISAR STOP_ID NO GPS
const [gpsUrl, setGpsUrl] = useState()
// COORDENADAS PRA USAR NO MAPA
const [center, setCenter] = useState()
// COORDENADAS PRA USAR NO SHAPE
const [stopCoords, setStopCoords] = useState()




useEffect(() => {
Expand All @@ -24,41 +36,24 @@ export function CodeProvider({ children }) {
setCode(urlCode.toUpperCase())
}
}, [])
// CHECA SE CÓDIGO PESQUISADO EXISTE
function checkCode() {
api.get("/stops/?stop_code=" + code.toUpperCase())
.then(response => {
if (response.data.count == 0 && code.length == 4) {
toast.error(`O código ${code.toUpperCase()} não existe`, {
position: "top-right",
autoClose: 5000,
hideProgressBar: true,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
theme: "colored",
});
} else {
setCodeExists(true)
}
})

}

useEffect(() => {
if (code != undefined) {
if (code) {
api
.get("/stops/?stop_code=" + code.toUpperCase())
.then(response => {
setStopId(response.data.results[0].stop_id)
setLocationType(response.data.results[0].location_type)
setName(response.data.results[0].stop_name)
setCenter([parseFloat(response.data.results[0].stop_lat), parseFloat(response.data.results[0].stop_lon)])
setStopCoords([response.data.results[0].stop_lon, response.data.results[0].stop_lat])
})
}
checkCode()

}, [code])

return (
<CodeContext.Provider value={{ code, setCode, setSearchParams, codeExists, active, setActive, stopId, locationType, setStopId, gpsUrl, setGpsUrl }}>
<CodeContext.Provider value={{ code, setCode, setSearchParams, active, setActive, stopId, locationType, setStopId, gpsUrl, setGpsUrl, name, center, stopCoords }}>
{children}
</CodeContext.Provider>
)
Expand Down
15 changes: 5 additions & 10 deletions src/hooks/getMovingMarkers.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,11 @@ export const MovingMarkerContext = createContext()

export function MovingMarkerProvider({ children }) {

const { code, stopId } = useContext(CodeContext)
const { code } = useContext(CodeContext)
const { realtime } = useContext(GPSContext)
const { setResults } = useContext(NameContext)
const { routes } = useContext(RoutesContext)
const { stopInfo } = useContext(TripContext)
const [center, setCenter] = useState()
const [radius, setRadius] = useState()
const [tracked, setTracked] = useState([])
const [innerCircle, setInnerCircle] = useState([])
const [arrivals, setArrivals] = useState([])
Expand All @@ -31,12 +29,9 @@ export function MovingMarkerProvider({ children }) {


useEffect(() => {
api.get('/stops/?stop_code=' + code.toUpperCase())
.then(response => {
setCenter([parseFloat(response.data.results[0].stop_lat), parseFloat(response.data.results[0].stop_lon)])
setRadius([parseFloat(response.data.results[0].stop_lon), parseFloat(response.data.results[0].stop_lat)])
})
setResults()
if(code){
setResults()
}
}, [code])


Expand Down Expand Up @@ -116,7 +111,7 @@ export function MovingMarkerProvider({ children }) {


return (
<MovingMarkerContext.Provider value={{ center, tracked, setTracked, innerCircle, setInnerCircle, arrivals, setArrivals }}>
<MovingMarkerContext.Provider value={{tracked, setTracked, innerCircle, setInnerCircle, arrivals, setArrivals }}>
{children}
</MovingMarkerContext.Provider>
)
Expand Down
9 changes: 6 additions & 3 deletions src/hooks/getName.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,9 @@ export const NameContext = createContext()

export function NameProvider({ children }) {
const navigate = useNavigate()
const [firstCode, setFirstCode] = useState("")
const [firstCode, setFirstCode] = useState()
const [results, setResults] = useState()
const [codeR, setCodeR] = useState()

const [codeR, setCodeR] = useState(false)



Expand Down Expand Up @@ -42,6 +41,7 @@ export function NameProvider({ children }) {


useEffect(() => {
if(firstCode != undefined){
api.get("/stops/?stop_code=" + firstCode.toUpperCase())
.then(response => {
if (response.data.count == 0 ) {
Expand All @@ -52,14 +52,17 @@ export function NameProvider({ children }) {
setResults()
}
})
}
}, [firstCode])

useEffect(() => {
if(firstCode){
if (firstCode.length == 4 && codeR && !/^[a-zA-Z]+$/.test(firstCode)) {
navigate(`/${firstCode}`)
} else if (firstCode.length == 5 && codeR) {
navigate(`/${firstCode}`)
}
}
}, [codeR])


Expand Down
Loading

0 comments on commit 5684929

Please sign in to comment.