From 387e946dfef839814a6d1844f7e62d0ccf2e641e Mon Sep 17 00:00:00 2001
From: sylenien <nikita@openreplay.com>
Date: Mon, 16 May 2022 09:35:31 +0200
Subject: [PATCH] fix(ui): removed popup from country flag component; added bg
 to toggler head

---
 .../app/components/ui/CountryFlag/CountryFlag.js  | 15 ++++-----------
 1 file changed, 4 insertions(+), 11 deletions(-)

diff --git a/frontend/app/components/ui/CountryFlag/CountryFlag.js b/frontend/app/components/ui/CountryFlag/CountryFlag.js
index db6a4491b..2ca032048 100644
--- a/frontend/app/components/ui/CountryFlag/CountryFlag.js
+++ b/frontend/app/components/ui/CountryFlag/CountryFlag.js
@@ -7,24 +7,17 @@ const CountryFlag = React.memo(({ country, className, style = {}, label = false
 	const knownCountry = !!country && country !== 'UN';
   	const countryFlag = knownCountry ? country.toLowerCase() : '';
   	const countryName = knownCountry ? countries[ country ] : 'Unknown Country';
-	
+
 	return (
 		<div className="flex items-center" style={style}>
-			<Popup
-				trigger={ knownCountry 
+			{knownCountry
 				?  <div className={ cn(`flag flag-${ countryFlag }`, className, stl.default) } />
 				: (
 					<div className="flex items-center w-full">
 						<Icon name="flag-na" size="22" className="" />
 						<div className="ml-2 leading-none" style={{ whiteSpace: 'nowrap'}}>Unknown Country</div>
 					</div>
-				)
-				// : <div className={ cn('text-sm', className) }>{ "N/A" }</div>
-				}
-				content={ countryName }
-				inverted
-				size="tiny"
-			/>
+			)}
 			{ knownCountry && label && <div className={ stl.label }>{ countryName }</div> }
 		</div>
 	);
@@ -32,4 +25,4 @@ const CountryFlag = React.memo(({ country, className, style = {}, label = false
 
 CountryFlag.displayName = "CountryFlag";
 
-export default CountryFlag;
\ No newline at end of file
+export default CountryFlag;