cange location layout for history view table

src/app/ui/tracking-page/tracking-history-view.tsx

@@ -84,15 +84,23 @@ export function TrackingHistoryView() {
 		return nameWithoutExtension.substring(0, maxNameLength) + '...';
 	}
 
-	const editLocationName = (location: string | undefined | null) => {
+	function EditLocationName({ location }: { location: string | undefined | null }) {
-		if (!location) return '';
+		if (!location) return (
+			<div></div>
+		);
 
 		const [city, country] = location.split('/');
 
 		const translatedCity = city === 'unknow' ? t('not-defined-city') : city;
 		const translatedCountry = country === 'unknow' ? t('not-defined-country') : country;
 
-		return `${translatedCity}/${translatedCountry}`;
+		return (
+			<div>
+				{t('city')}: <strong>{translatedCity}</strong>
+				<br />
+				{t('country')}: <strong>{translatedCountry}</strong>
+			</div>
+		);
 	}
 
 	const columns = useMemo<ColumnDef<HistoryViewItem>[]>(
@@ -213,7 +221,7 @@ export function TrackingHistoryView() {
 			{
 				accessorKey: 'location',
 				header: ({ column }) => (
-					<div className="column">
+					<div className="column column-location">
 						<span>
 							{t('location')}
 						</span>
@@ -243,7 +251,7 @@ export function TrackingHistoryView() {
 							{row.original.country === 'unknow/unknow' ? (
 								t('not-defined')
 							) : (
-								`${editLocationName(row.original.country)}`
+								<EditLocationName location={row.original.country} />
 							)}
 						</div>
 					)
@@ -252,7 +260,7 @@ export function TrackingHistoryView() {
 		],
 		[]
 	);
-
+	/* `${editLocationName(row.original.country)}` */
 	// Создание таблицы
 	const table = useReactTable({
 		data: tableData,
@@ -287,13 +295,14 @@ export function TrackingHistoryView() {
 			className="block-wrapper"
 		>
 			<div className="tanstak-table-wrapper">
-				<h3
+
-					className="tanstak-table-title"
-				>
-					{t('history-of-opened')}
-				</h3>
 				{/* Фильтры */}
 				<div className="tanstak-table-filtres">
+					<h3
+						className="tanstak-table-title"
+					>
+						{t('history-of-opened')}
+					</h3>
 					<div className="table-filtres-wrapper text-filter-search end">
 						<div className="table-filtres-item">
 							<div className="table-filtres-label">{t('items-per-page')}:</div>

src/i18n/messages/en.json

@@ -473,12 +473,13 @@
 		"location": "Location",
 		"history-of-opened": "History of opened",
 		"not-defined": "Not defined",
-		"not-defined-city": "The city is not defined",
+		"not-defined-city": "Not defined",
-		"not-defined-country": "Country not defined",
+		"not-defined-country": "Not defined",
 		"total-document-openings": "Total document openings",
 		"total-matches": "Total matches",
 		"total-complaints": "Total complaints",
-		"total-claims": "Total claims"
+		"total-claims": "Total claims",
+		"city": "City"
 	},
 	"Login-register-form": {
 		"and": "and",

src/i18n/messages/ru.json

@@ -473,12 +473,13 @@
 		"location": "Местоположение",
 		"history-of-opened": "История открытий",
 		"not-defined": "Не определено",
-		"not-defined-city": "Город не определен",
+		"not-defined-city": "Не определен",
-		"not-defined-country": "Страна не определена",
+		"not-defined-country": "Не определена",
 		"total-document-openings": "Всего открытий документов",
 		"total-matches": "Всего совпадений",
 		"total-complaints": "Всего нарушений",
-		"total-claims": "Всего претензий"
+		"total-claims": "Всего претензий",
+		"city": "Город"
 	},
 	"Login-register-form": {
 		"and": "и",