chore: update dependencies and refactor Vuex store for country data

- Updated dependencies in package.json to latest versions for axios, bulma, core-js, vue, vuex, and testing libraries.
- Refactored actions.js to use the new REST Countries API v3 with a fallback to v2, improving error handling and data mapping.
- Simplified Vuex store structure by defining state and mutations directly in index.js, removing unnecessary imports.
- Updated mutations.js to use a consistent naming convention for setting countries.
- Cleaned up state.js to maintain a clear structure for Vuex state management.
This commit is contained in:
Dan Dobos
2025-10-16 17:24:58 +02:00
parent bf2ef01f18
commit 46ea3e5e55
6 changed files with 24444 additions and 16270 deletions
+24371 -16234
View File
File diff suppressed because it is too large Load Diff
+13 -15
View File
@@ -36,31 +36,29 @@
"deploy": "sh deploy.sh"
},
"dependencies": {
"axios": "^0.21.1",
"bulma": "^0.9.1",
"core-js": "^3.6.5",
"vue": "^2.6.11",
"vuex": "^3.6.0",
"vue-template-compiler": "^2.6.12"
"axios": "^1.12.2",
"bulma": "^0.9.4",
"core-js": "^3.46.0",
"vue": "^2.7.16",
"vuex": "^3.6.2"
},
"devDependencies": {
"@babel/core": "^7.12.10",
"@babel/preset-env": "^7.12.11",
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-babel": "^3.12.1",
"@vue/cli-plugin-eslint": "^3.12.1",
"@vue/cli-service": "~4.5.0",
"@vue/test-utils": "^1.1.2",
"@vue/test-utils": "^2.4.6",
"babel-core": "^7.0.0-bridge.0",
"babel-eslint": "^10.1.0",
"babel-jest": "^26.6.3",
"eslint": "^6.7.2",
"babel-jest": "^30.2.0",
"eslint": "^7.32.0",
"eslint-plugin-jest": "^24.1.3",
"eslint-plugin-vue": "^6.2.2",
"jest": "^26.6",
"eslint-plugin-vue": "^7.20.0",
"jest": "^30.2.0",
"jest-serializer-vue": "^2.0.2",
"regenerator-runtime": "^0.13.7",
"vue-jest": "^3.0.7",
"vue-template-compiler": "^2.6.11"
"vue-template-compiler": "^2.7.16"
},
"eslintConfig": {
"root": true,
+44 -9
View File
@@ -1,16 +1,51 @@
// ...existing code...
import axios from 'axios';
const actions = {
async getCountries({ commit }) {
const url = 'https://restcountries.com/v2/all';
await axios
.get(url)
.then((response) => {
commit('SET_COUNTRIES', response.data);
})
.catch((error) => {
console.log(error);
const fields = 'name,cca3,population,region,capital,flags';
const urlV3 = 'https://restcountries.com/v3.1/all?fields=' + fields;
const urlV2 = 'https://restcountries.com/v2/all';
const mapV3 = function (data) {
return data.map(function (c) {
return {
name: (c.name && c.name.common) ? c.name.common : c.name,
alpha3Code: c.cca3 || c.alpha3Code,
population: c.population,
region: c.region,
capital: Array.isArray(c.capital) ? c.capital[0] : c.capital,
flag: (c.flags && (c.flags.png || c.flags.svg)) || c.flag
};
});
};
try {
const res = await axios.get(urlV3);
commit('SET_COUNTRIES', mapV3(res.data));
return;
} catch (err) {
// eslint-disable-next-line no-console
console.error('restcountries v3 (fields) request failed:', {
message: err.message,
status: err.response && err.response.status,
responseData: err.response && err.response.data
});
}
// fallback to v2 endpoint
try {
const res2 = await axios.get(urlV2);
commit('SET_COUNTRIES', res2.data);
return;
} catch (err2) {
// eslint-disable-next-line no-console
console.error('restcountries v2 fallback failed:', {
message: err2.message,
status: err2.response && err2.response.status,
responseData: err2.response && err2.response.data
});
}
},
};
export default actions;
export default actions;
+12 -6
View File
@@ -1,15 +1,21 @@
import Vue from 'vue';
import Vuex from 'vuex';
import state from './state';
import getters from './getters';
import actions from './actions';
import mutations from './mutations';
Vue.use(Vuex);
const state = {
countries: []
};
const mutations = {
SET_COUNTRIES(state, countries) {
state.countries = countries;
}
};
export default new Vuex.Store({
state,
getters,
actions,
mutations,
});
actions
});
+2 -4
View File
@@ -1,6 +1,4 @@
const mutations = {
SET_COUNTRIES(state, countries) {
state.countries = countries;
},
};
setCountries (state, list) { state.countries = list }
}
export default mutations;
+2 -2
View File
@@ -1,4 +1,4 @@
const state = {
countries: [],
};
countries: []
}
export default state;