added additional conditions for country and city

This commit is contained in:
Elyor Djalilov 2024-05-27 12:58:49 +05:00
parent cb43a107f4
commit f3ab0dae5a
6 changed files with 38 additions and 25 deletions

View File

@ -49,10 +49,14 @@ const SessionsRowContent = ({ sectionWidth, item }) => {
{platform}
{` ${browser}`}
</Text>
<Text fontSize="12px" fontWeight="600">
{country}
{` ${city}`}
</Text>
{(country || city) && (
<Text fontSize="12px" fontWeight="600">
{country}
{country && city && ` ${city}`}
</Text>
)}
<Text fontSize="12px" fontWeight="600" containerWidth="160px">
{ip}
</Text>

View File

@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
import { TableHeader } from "@docspace/shared/components/table";
const TABLE_VERSION = "5";
const TABLE_VERSION = "4";
const TABLE_COLUMNS = `SecuritySessionsColumns_ver-${TABLE_VERSION}`;
const getColumns = (defaultColumns, userId) => {
@ -62,19 +62,12 @@ const SessionsTableHeader = (props) => {
onChange: onColumnChange,
},
{
key: "Country",
title: t("Common:Country"),
key: "Location",
title: t("Common:Location"),
enable: true,
resizable: true,
onChange: onColumnChange,
},
{
key: "IpAddress",
title: t("Common:IpAddress"),
enable: false,
resizable: true,
onChange: onColumnChange,
},
];
const [columns, setColumns] = useState(getColumns(defaultColumns, userId));

View File

@ -117,6 +117,15 @@ const StyledTableRow = styled(TableRow)`
color: ${(props) => props.theme.profile.activeSessions.tableCellColor};
}
.divider {
display: inline-block;
height: 12px;
width: 2px;
background-color: ${(props) =>
props.theme.profile.activeSessions.dividerColor};
margin: -2px 5px;
}
.online {
font-weight: 600;
color: ${(props) => props.theme.profile.activeSessions.textOnlineColor};
@ -282,15 +291,14 @@ const SessionsTableRow = (props) => {
<TableCell>
<Text className="session-info" truncate>
{country},&nbsp;
</Text>
<Text className="session-info" truncate>
{city}
</Text>
</TableCell>
<TableCell>
<Text className="session-info" truncate>
{(country || city) && (
<>
{country}
{country && city && ", "}
{city}
<span className="divider"></span>
</>
)}
{ip}
</Text>
</TableCell>

View File

@ -9,7 +9,7 @@ import SessionsTableRow from "./SessionsTableRow";
import { TableContainer } from "@docspace/shared/components/table";
import { TableBody } from "@docspace/shared/components/table";
const TABLE_VERSION = "5";
const TABLE_VERSION = "4";
const COLUMNS_SIZE = `securitySessionsColumnsSize_ver-${TABLE_VERSION}`;
const INFO_PANEL_COLUMNS_SIZE = `infoPanelSessionsColumnsSize_ver-${TABLE_VERSION}`;

View File

@ -3229,13 +3229,17 @@ export const getBaseTheme = () => {
textDescriptionColor: "#A3A9AE",
},
activeSessions: {
color: "#333",
color: "#333333",
borderColor: "#eceef1",
tickIconColor: "#35AD17",
removeIconColor: "#A3A9AE",
sortHeaderColor: "#d0d5da",
textOnlineColor: "#35ad17",
boxShadowColor: "rgba(4, 15, 27, 0.07) 0px 5px 20px",
tableCellColor: "#a3a9ae",
dividerColor: "#D0D5DA",
iconColor: "#657077",
subtitleColor: "#657077",
},
},

View File

@ -3211,8 +3211,12 @@ const Dark: TTheme = {
tickIconColor: "#3BA420",
removeIconColor: "#A3A9AE",
sortHeaderColor: "#474747",
textOnlineColor: "#3BA420",
boxShadowColor: "rgba(0, 0, 0, 0.12) 0px 40px 60px",
tableCellColor: "#858585",
dividerColor: "#474747",
iconColor: "#858585",
subtitleColor: "#858585",
},
},