Skip to content

Conversation

@OfekSagiv
Copy link

done with region button and search box filtering

Copy link

@GilHeller GilHeller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall great job.

Consider to write comments only when they are truly needed.

See my comments

js/common.js Outdated
* @param {string} param - The name of the query parameter containing the country name.
* @returns {string|null} - The country name, or null if the parameter doesn't exist.
*/
function getQueryParameter(param) {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

use arrow functions

js/details.js Outdated
Comment on lines 46 to 48
function logError(message) {
console.error(message);
}

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

redundant

js/details.js Outdated

/** Finds a country by name in a list of countries. */
function findCountryByName(countries, name) {
return countries.find((country) => country.name === name) || null;

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do you return null? When find not finds a match it returns undefined

js/details.js Outdated
Comment on lines 18 to 28
fetchData(jsonFilePath)
.then((countries) => {
const country = findCountryByName(countries, countryName);
if (!country) throw new Error(`Country with name "${countryName}" not found!`);

clearElementContent(countryDetailsSection);
countryDetailsSection.appendChild(createCountryElement(country, {isGrid: false}));
})
.catch((error) => logError(error.message || 'Error fetching country details'))
.finally(() => hideLoader(loader));
});

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

consider using the await syntax instead

js/common.js Outdated
Comment on lines 135 to 144
toast.style.position = 'fixed';
toast.style.bottom = '10px';
toast.style.left = '50%';
toast.style.transform = 'translateX(-50%)';
toast.style.backgroundColor = '#444';
toast.style.color = '#fff';
toast.style.padding = '8px 15px';
toast.style.borderRadius = '4px';
toast.style.fontSize = '14px';
toast.style.display = 'none';

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

move to a css file as a class

js/common.js Outdated
// Toggle theme on button click
toggleButton.addEventListener('click', () => {
const isDark = body.classList.toggle('dark-theme'); // Toggle dark theme class
localStorage.setItem('theme', isDark ? 'dark' : 'light'); // Save updated theme in localStorage

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

save the hard coded dark mode and light mode values as a const variable.

js/details.js Outdated

/** Clears the content of an HTML element. */
function clearElementContent(element) {
if (element) element.innerHTML = '';

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider using removeChild() instead

const parent = document.getElementById("parent");
const child = document.getElementById("child");
const throwawayNode = parent.removeChild(child);

@OfekSagiv
Copy link
Author

changes are in [Remove .idea .DS_Stor from tracking] commit

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants