search

SJDiggs / vehicle-spelunker

0 stars 0 forks source link

GROW: Handling punching out to an external site #14

Open SJDiggs opened 11 months ago

SJDiggs commented 11 months ago

One of the big struggles I encountered was how to handle punching out of the react site to an external site. In the process flow the user is presented with several vehicles for sale that match their research query, they can view a vehicle by clicking on an tag which invokes an onClick function to navigate to the external listing site {clickoffURL} https:// value passed in from the returned data from the API call. The solution I landed on was to use window.open to force a new page, but in doing so the react site lost its state and you would need to re-enter the site URL wheely smart. This following code is used in this scenario:

const handleClick = (listing) => { // Add "https://" to the beginning of the URL otherwise the react url will be prefixed to the external link const externalUrl = https://${listing.clickoffUrl}; window.open(externalUrl); }

doniellekinchen commented 11 months ago

Yes, I noticed this when exploring the site that when wanting to see further details of a vehicle, I'm met with an error. I think to give a temporary fix, maybe trying having it route back to your website and you can create a component to show the information of the vehicle from the external site on your site, and provide a link to the external site towards the bottom or be the main source of the car/dealership information. I hope this helps as a work-around until you can fix/figure out the main issue.

UPDATE: This was for at least two different vehicles, but the external link for a 3rd vehicle worked well, so maybe it's an issue with the external link. But when going back to your site, the screen is blank. This may be a deployer issue.

Another small issue, and it has to do with styling, when typing in the search box for the make, model and year of the car, the letters are white and I cannot see what I am typing if I don't highlight it. Maybe try changing the color to black or another dark color.

Overall, I love this site and this could serve as a good site to take out in the long run! I've used similar sites but any good ones are few and far between. I am also a car girly so this is an interesting project to look at! I would suggest try pulling in car news from an API source for extra traffic to your site! Good job on this!