Skip to content

Commit

Permalink
Merge branch 'x0sina-dev' into dev
Browse files Browse the repository at this point in the history
SaintShit committed Nov 18, 2023
2 parents 6d0442d + ef696c6 commit 43ae256
Showing 19 changed files with 1,307 additions and 8,224 deletions.
41 changes: 13 additions & 28 deletions app/dashboard/build/404.html
Original file line number Diff line number Diff line change
@@ -1,32 +1,15 @@
<!DOCTYPE html>
<html lang="en">
<head>

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Marzban</title>
<link
rel="apple-touch-icon"
sizes="180x180"
href="/dashboard/favicon/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="/dashboard/favicon/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="/dashboard/favicon/favicon-16x16.png"
/>
<link rel="apple-touch-icon" sizes="180x180" href="/dashboard/favicon/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/dashboard/favicon/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/dashboard/favicon/favicon-16x16.png" />
<link rel="manifest" href="/dashboard/favicon/site.webmanifest" />
<link
rel="mask-icon"
href="/dashboard/favicon/safari-pinned-tab.svg"
color="#5bbad5"
/>
<link rel="mask-icon" href="/dashboard/favicon/safari-pinned-tab.svg" color="#5bbad5" />
<link rel="shortcut icon" href="/dashboard/favicon/favicon.ico" />
<meta name="apple-mobile-web-app-title" content="Marzban" />
<meta name="application-name" content="Marzban" />
@@ -36,9 +19,11 @@
<script type="module" crossorigin src="/dashboard/assets/index.3e4b5441.js"></script>
<link rel="modulepreload" crossorigin href="/dashboard/assets/vendor.11357817.js">
<link rel="stylesheet" href="/dashboard/assets/index.4d516efb.css">
</head>
<body>
</head>

<body>
<div id="root"></div>

</body>
</html>

</body>

</html>
1 change: 0 additions & 1 deletion app/dashboard/build/assets/add_file.2cd9a851.svg

This file was deleted.

6 changes: 6 additions & 0 deletions app/dashboard/build/assets/index.14386dcd.css

Large diffs are not rendered by default.

14 changes: 0 additions & 14 deletions app/dashboard/build/assets/index.3e4b5441.js

This file was deleted.

6 changes: 0 additions & 6 deletions app/dashboard/build/assets/index.4d516efb.css

This file was deleted.

14 changes: 14 additions & 0 deletions app/dashboard/build/assets/index.bbbeb280.js

Large diffs are not rendered by default.

15 changes: 0 additions & 15 deletions app/dashboard/build/assets/index.e40384a1.js

This file was deleted.

14 changes: 0 additions & 14 deletions app/dashboard/build/assets/index.fbfffb9e.js

This file was deleted.

3 changes: 0 additions & 3 deletions app/dashboard/build/assets/logo.2507bd68.svg

This file was deleted.

2,465 changes: 0 additions & 2,465 deletions app/dashboard/build/assets/vendor.2afa31c8.js

This file was deleted.

2,465 changes: 0 additions & 2,465 deletions app/dashboard/build/assets/vendor.4e8f7a1b.js

This file was deleted.

Large diffs are not rendered by default.

18 changes: 9 additions & 9 deletions app/dashboard/build/index.html
Original file line number Diff line number Diff line change
@@ -7,35 +7,35 @@
<link
rel="apple-touch-icon"
sizes="180x180"
href="/dashboard/favicon/apple-touch-icon.png"
href="/favicon/apple-touch-icon.png"
/>
<link
rel="icon"
type="image/png"
sizes="32x32"
href="/dashboard/favicon/favicon-32x32.png"
href="/favicon/favicon-32x32.png"
/>
<link
rel="icon"
type="image/png"
sizes="16x16"
href="/dashboard/favicon/favicon-16x16.png"
href="/favicon/favicon-16x16.png"
/>
<link rel="manifest" href="/dashboard/favicon/site.webmanifest" />
<link rel="manifest" href="/favicon/site.webmanifest" />
<link
rel="mask-icon"
href="/dashboard/favicon/safari-pinned-tab.svg"
href="/favicon/safari-pinned-tab.svg"
color="#5bbad5"
/>
<link rel="shortcut icon" href="/dashboard/favicon/favicon.ico" />
<link rel="shortcut icon" href="/favicon/favicon.ico" />
<meta name="apple-mobile-web-app-title" content="Marzban" />
<meta name="application-name" content="Marzban" />
<meta name="msapplication-TileColor" content="#2b5797" />
<meta name="msapplication-config" content="/favicon/browserconfig.xml" />
<meta name="theme-color" content="#3B81F6" />
<script type="module" crossorigin src="/dashboard/assets/index.3e4b5441.js"></script>
<link rel="modulepreload" crossorigin href="/dashboard/assets/vendor.11357817.js">
<link rel="stylesheet" href="/dashboard/assets/index.4d516efb.css">
<script type="module" crossorigin src="/assets/index.bbbeb280.js"></script>
<link rel="modulepreload" crossorigin href="/assets/vendor.59907391.js">
<link rel="stylesheet" href="/assets/index.14386dcd.css">
</head>
<body>
<div id="root"></div>
4,094 changes: 973 additions & 3,121 deletions app/dashboard/package-lock.json

Large diffs are not rendered by default.

46 changes: 46 additions & 0 deletions app/dashboard/src/components/OnlineBadge.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
import { FC } from "react";

type UserStatusProps = {
lastOnline?: string | null;
};

export const OnlineBadge: FC<UserStatusProps> = ({ lastOnline }) => {
const convertDateFormat = (
lastOnline: string | null | undefined
): number | null => {
if (lastOnline === null || lastOnline === undefined) {
// Handle the case where lastOnline is null or undefined
return null;
}

// Parse the input date string
const gmtDate = new Date(lastOnline + "Z"); // Append 'Z' to indicate it's in GMT

// Get the browser's time zone
const browserTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;

// Create a new date object with the browser's time zone
const localDate = new Date(
gmtDate.toLocaleString(undefined, { timeZone: browserTimeZone })
);

// Calculate the Unix timestamp (in seconds)
const unixTimestamp = Math.floor(localDate.getTime() / 1000);

return unixTimestamp;
};
const currentTimeInSeconds = Math.floor(Date.now() / 1000); // Current time in seconds

const unixTime = convertDateFormat(lastOnline);

const timeDifferenceInSeconds = unixTime
? currentTimeInSeconds - unixTime
: 0;

if (timeDifferenceInSeconds <= 61 && timeDifferenceInSeconds > 0)
return <div className="circle pulse green"></div>;
else if (timeDifferenceInSeconds === 0)
return <div className="circle pulse orange"></div>;

return <div className="circle pulse red"></div>;
};
65 changes: 65 additions & 0 deletions app/dashboard/src/components/OnlineStatus.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
import { Text } from "@chakra-ui/react";

import { FC } from "react";
import { relativeExpiryDate } from "utils/dateFormatter";

type UserStatusProps = {
lastOnline: string | null;
};

export const OnlineStatus: FC<UserStatusProps> = ({ lastOnline }) => {
const convertDateFormat = (
lastOnline: string | null | undefined
): number | null => {
if (lastOnline === null || lastOnline === undefined) {
// Handle the case where lastOnline is null or undefined
return null;
}

// Parse the input date string
const gmtDate = new Date(lastOnline + "Z"); // Append 'Z' to indicate it's in GMT

// Get the browser's time zone
const browserTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;

// Create a new date object with the browser's time zone
const localDate = new Date(
gmtDate.toLocaleString(undefined, { timeZone: browserTimeZone })
);

// Calculate the Unix timestamp (in seconds)
const unixTimestamp = Math.floor(localDate.getTime() / 1000);

return unixTimestamp;
};
const currentTimeInSeconds = Math.floor(Date.now() / 1000); // Current time in seconds

const unixTime = convertDateFormat(lastOnline);

const timeDifferenceInSeconds = unixTime
? currentTimeInSeconds - unixTime
: 0;

const dateInfo = relativeExpiryDate(convertDateFormat(lastOnline));

return (
<>

<Text
display="inline-block"
fontSize="xs"
fontWeight="medium"
ml="2"
color="gray.600"
_dark={{
color: "gray.400",
}}
>
{timeDifferenceInSeconds <= 61 && timeDifferenceInSeconds > 0 && "Online"}
{timeDifferenceInSeconds > 61 && `${dateInfo.time} ago`}
{timeDifferenceInSeconds === 0 && "No Data"}
</Text>

</>
);
};
16 changes: 14 additions & 2 deletions app/dashboard/src/components/UsersTable.tsx
Original file line number Diff line number Diff line change
@@ -44,6 +44,8 @@ import CopyToClipboard from "react-copy-to-clipboard";
import { useTranslation } from "react-i18next";
import { User } from "types/User";
import { formatBytes } from "utils/formatByte";
import { OnlineBadge } from "./OnlineBadge";
import { OnlineStatus } from "./OnlineStatus";
import { Pagination } from "./Pagination";
import { StatusBadge } from "./StatusBadge";

@@ -344,7 +346,10 @@ export const UsersTable: FC<UsersTableProps> = (props) => {
cursor="pointer"
>
<Td borderBottom={0} minW="100px" pl={4} pr={4}>
{user.username}
<div className="flex-status">
<OnlineBadge lastOnline={user.online_at} />
{user.username}
</div>
</Td>
<Td borderBottom={0} minW="50px" pl={0} pr={0}>
<StatusBadge
@@ -431,6 +436,7 @@ export const UsersTable: FC<UsersTableProps> = (props) => {
expiryDate={user.expire}
status={user.status}
/>
<OnlineStatus lastOnline={user.online_at} />
</Box>
<HStack>
<ActionButtons user={user} />
@@ -571,7 +577,13 @@ export const UsersTable: FC<UsersTableProps> = (props) => {
})}
onClick={() => onEditingUser(user)}
>
<Td minW="140px">{user.username}</Td>
<Td minW="140px">
<div className="flex-status">
<OnlineBadge lastOnline={user.online_at} />
{user.username}
<OnlineStatus lastOnline={user.online_at} />
</div>
</Td>
<Td width="400px" minW="150px">
<StatusBadge
expiryDate={user.expire}
97 changes: 91 additions & 6 deletions app/dashboard/src/index.scss
Original file line number Diff line number Diff line change
@@ -9,6 +9,7 @@
from {
backdrop-filter: blur(1px);
}

to {
backdrop-filter: blur(10px);
}
@@ -22,6 +23,7 @@
from {
transform: rotate(0deg);
}

to {
transform: rotate(360deg);
}
@@ -31,6 +33,7 @@ table thead {
th:first-of-type {
border-top-left-radius: 8px;
}

th:last-of-type {
border-top-right-radius: 8px;
}
@@ -40,6 +43,7 @@ table thead {
td:first-of-type {
border-bottom-left-radius: 8px;
}

td:last-of-type {
border-bottom-right-radius: 8px;
}
@@ -48,16 +52,20 @@ table thead {
.slick-prev {
left: -40px;
}

.slick-next {
right: -40px;
}

.slick-prev,
.slick-next {
z-index: 100;
}

.chakra-popover__popper {
z-index: 9999 !important;
}

.inbound-item .chakra-checkbox__label {
max-width: 100%;
width: 100%;
@@ -156,18 +164,18 @@ table thead {
color: var(--chakra-colors-gray-500) !important;
}

.react-datepicker__day--keyboard-selected,
.react-datepicker__day--selected,
.react-datepicker__day--in-selecting-range,
.react-datepicker__day--keyboard-selected,
.react-datepicker__day--selected,
.react-datepicker__day--in-selecting-range,
.react-datepicker__day--in-range {
border-radius: 0.3rem;
background-color: var(--chakra-colors-primary-500) !important;
color: var(--chakra-colors-white) !important;
}

.chakra-ui-dark .react-datepicker__day--keyboard-selected,
.chakra-ui-dark .react-datepicker__day--selected,
.chakra-ui-dark .react-datepicker__day--in-selecting-range,
.chakra-ui-dark .react-datepicker__day--keyboard-selected,
.chakra-ui-dark .react-datepicker__day--selected,
.chakra-ui-dark .react-datepicker__day--in-selecting-range,
.chakra-ui-dark .react-datepicker__day--in-range {
border-radius: 0.3rem;
background-color: var(--chakra-colors-primary-200) !important;
@@ -194,4 +202,81 @@ table thead {
border-radius: unset;
display: inline-block;
position: relative;
}

.green {
background: #66ff99;
}

.red {
background: #e53e3e;
}

.orange {
background: #fbd38d;
}

.circle {
min-width: 10px;
min-height: 10px;
border-radius: 50%;

box-shadow: 0px 0px 1px 1px #0000001a;
}

.pulse {
animation: pulse-animation 3s infinite;
}
.pulse.green {
animation: green-pulse-animation 3s infinite;
}
.pulse.red{
animation: red-pulse-animation 3s infinite;
}
.pulse.orange{
animation: orange-pulse-animation 3s infinite;
}

@keyframes pulse-animation {
0% {
box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.4);
}

100% {
box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
}
}
@keyframes green-pulse-animation {
0% {
box-shadow: 0 0 0 0px #66ff9975;
}

100% {
box-shadow: 0 0 0 10px #66ff9900;
}
}
@keyframes red-pulse-animation {
0% {
box-shadow: 0 0 0 0px #e53e3e8c;
}

100% {
box-shadow: 0 0 0 10px #e53e3e00;
}
}
@keyframes orange-pulse-animation {
0% {
box-shadow: 0 0 0 0px #fbd38d85;
}

100% {
box-shadow: 0 0 0 10px #fbd38d00;
}
}

.flex-status {
display: flex;
align-items: center;
justify-content: start;
gap: .7rem;
}
1 change: 1 addition & 0 deletions app/dashboard/src/types/User.ts
Original file line number Diff line number Diff line change
@@ -48,6 +48,7 @@ export type User = {
subscription_url: string;
inbounds: UserInbounds;
note: string;
online_at: string;
};

export type UserCreate = Pick<

0 comments on commit 43ae256

Please sign in to comment.