From 6a036ab81e45514efcc90821c0a5322cf355a46f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Domaga=C5=82a?= <kontakt@mateuszdomagala.pl>
Date: Wed, 12 Jan 2022 19:37:00 +0100
Subject: [PATCH] [Finishes #26] API is not supported anymore #27

# Story Title

[API is not supported anymore](https://github.com/mateuszdomagala/vue-rest-countries-api/issues/26)

## Changes made

* fix: replace API with a new one

## How does the solution address the problem

This PR will replace [the original API](https://github.com/apilayer/restcountries), which [no longer works and is not supported](https://github.com/apilayer/restcountries/issues/253), with [a similar one](https://gitlab.com/amatos/rest-countries) based on a clone of the original.

## Linked issues

Resolves #26
---
 src/components/Search.vue | 2 ++
 src/views/CountryPage.vue | 6 +++---
 src/views/Home.vue        | 2 +-
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/Search.vue b/src/components/Search.vue
index e61541e..a93107b 100644
--- a/src/components/Search.vue
+++ b/src/components/Search.vue
@@ -39,6 +39,8 @@ export default {
         border: 0;
         background-color: inherit;
         color: inherit;
+        width: 80%;
+        outline: 0;
     }
 
     @media (min-width: 660px) {
diff --git a/src/views/CountryPage.vue b/src/views/CountryPage.vue
index 89aa0a2..b67ae95 100644
--- a/src/views/CountryPage.vue
+++ b/src/views/CountryPage.vue
@@ -48,12 +48,12 @@ export default {
         
         onMounted(async () => {
             try {
-                const countryResponse = await fetch(`https://restcountries.eu/rest/v2/name/${props.name}?fields=name;nativeName;population;region;subregion;capital;topLevelDomain;currencies;languages;borders;flag`)
+                const countryResponse = await fetch(`https://restcountries.com/v2/name/${props.name}?fields=name,nativeName,population,region,subregion,capital,topLevelDomain,currencies,languages,borders,flag`)
                 country.value = await countryResponse.json()
                 country.value = country.value[0]
-                alpha3Codes.value = country.value.borders.join(';')
+                alpha3Codes.value = country.value.borders.join(',')
 
-                const bordersResponse = await fetch(`https://restcountries.eu/rest/v2/alpha?codes=${alpha3Codes.value}`)
+                const bordersResponse = await fetch(`https://restcountries.com/v2/alpha?codes=${alpha3Codes.value}`)
                 borderCountries.value = await bordersResponse.json()
             } catch(e) {
                 error.value = e
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 3dba175..506caeb 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -32,7 +32,7 @@ export default {
 
     onMounted(async () => {
       try {
-        const res = await fetch('https://restcountries.eu/rest/v2/all?fields=name;capital;region;population;flag;alpha3Code')
+        const res = await fetch('https://restcountries.com/v2/all?fields=name,capital,region,population,flag,alpha3Code')
         countries.value = await res.json()
       } catch(e) {
         error.value = e