ajout des drapeaux dans pour les langages 📦

cryptide_project/package-lock.json

@@ -20,6 +20,7 @@
         "lodash": "^4.17.21",
         "react": "^18.2.0",
         "react-bootstrap": "^2.9.1",
+        "react-country-flag": "^3.1.0",
         "react-dom": "^18.2.0",
         "react-icons": "^4.11.0",
         "react-intl": "^6.5.2",
@@ -14548,6 +14549,17 @@
         }
       }
     },
+    "node_modules/react-country-flag": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/react-country-flag/-/react-country-flag-3.1.0.tgz",
+      "integrity": "sha512-JWQFw1efdv9sTC+TGQvTKXQg1NKbDU2mBiAiRWcKM9F1sK+/zjhP2yGmm8YDddWyZdXVkR8Md47rPMJmo4YO5g==",
+      "engines": {
+        "node": ">=12"
+      },
+      "peerDependencies": {
+        "react": ">=16"
+      }
+    },
     "node_modules/react-dev-utils": {
       "version": "12.0.1",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz",

cryptide_project/package.json

@@ -14,6 +14,7 @@
     "lodash": "^4.17.21",
     "react": "^18.2.0",
     "react-bootstrap": "^2.9.1",
+    "react-country-flag": "^3.1.0",
     "react-dom": "^18.2.0",
     "react-icons": "^4.11.0",
     "react-intl": "^6.5.2",

cryptide_project/src/Components/NavBar.tsx

@@ -12,9 +12,11 @@ import { BsFillPersonPlusFill } from 'react-icons/bs';
 import { HiLanguage } from 'react-icons/hi2';
 
 /* Components */
-import './NavBar.css';
+import ReactCountryFlag from "react-country-flag"
+
 
 /* Style */
+import './NavBar.css';
 import { useTheme } from '../Style/ThemeContext';
 
 // @ts-ignore
@@ -55,9 +57,23 @@ function AppNavbar({changeLocale}) {
                     title={<span><HiLanguage /></span>}
                     className="navbar-title" id="basic-nav-dropdown">
                         <NavDropdown.Item onClick={() => changeLocale('fr')}> 
+                            <ReactCountryFlag countryCode="FR"
+                                                svg
+                                                style={{
+                                                    width: '30px',
+                                                    height: '20px',
+                                                    margin: 'auto 10px 3px auto',
+                                                }}/>        
                             <FormattedMessage id="languageSelector.french"/> 
                         </NavDropdown.Item>
                         <NavDropdown.Item onClick={() => changeLocale('en')}> 
+                            <ReactCountryFlag countryCode="GB" 
+                                                svg
+                                                style={{
+                                                    width: '30px',
+                                                    height: '20px',
+                                                    margin: 'auto 10px 3px auto',
+                                                }}/>
                             <FormattedMessage id="languageSelector.english"/> 
                         </NavDropdown.Item>
                     </NavDropdown>

cryptide_project/yarn.lock

@@ -8105,6 +8105,11 @@ react-bootstrap@^2.9.1:
     uncontrollable "^7.2.1"
     warning "^4.0.3"
 
+react-country-flag@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.npmjs.org/react-country-flag/-/react-country-flag-3.1.0.tgz"
+  integrity sha512-JWQFw1efdv9sTC+TGQvTKXQg1NKbDU2mBiAiRWcKM9F1sK+/zjhP2yGmm8YDddWyZdXVkR8Md47rPMJmo4YO5g==
+
 react-dev-utils@^12.0.1:
   version "12.0.1"
   resolved "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz"
@@ -8291,7 +8296,7 @@ react-transition-group@^4.4.5:
     loose-envify "^1.4.0"
     prop-types "^15.6.2"
 
-react@*, "react@^15.3.0 || ^16.0.0 || ^17.0.0 || ^18.0.0", "react@^16.6.0 || 17 || 18", "react@^16.8.0 || ^17.0.0-rc.1 || ^18.0.0", react@^18.0.0, react@^18.2.0, "react@>= 16", react@>=0.14.0, react@>=15.0.0, react@>=16.14.0, react@>=16.3, react@>=16.6.0, react@>=16.8, react@>=16.8.0:
+react@*, "react@^15.3.0 || ^16.0.0 || ^17.0.0 || ^18.0.0", "react@^16.6.0 || 17 || 18", "react@^16.8.0 || ^17.0.0-rc.1 || ^18.0.0", react@^18.0.0, react@^18.2.0, "react@>= 16", react@>=0.14.0, react@>=15.0.0, react@>=16, react@>=16.14.0, react@>=16.3, react@>=16.6.0, react@>=16.8, react@>=16.8.0:
   version "18.2.0"
   resolved "https://registry.npmjs.org/react/-/react-18.2.0.tgz"
   integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==