master
alex 2024-01-26 20:18:14 +01:00
parent a26af8f20c
commit 153b59ba61
3 changed files with 0 additions and 148 deletions

View File

@ -1,61 +0,0 @@
import { Tooltip } from "antd";
import { useEffect, useState } from "react";
import { FormatDatetime } from "../../utils";
import { useTranslation } from "react-i18next";
// Calculate elapsed time in seconds, minutes, hours, or days
function calculatedTimeAgo(startTime, t) {
const currentTime = new Date();
const elapsedMilliseconds = currentTime - new Date(startTime);
let timeAgoText;
if (elapsedMilliseconds < 60000) {
const secondsAgo = Math.floor(elapsedMilliseconds / 1000);
timeAgoText =
secondsAgo === 0
? "just now"
: secondsAgo === 1
? t("liveTimeAgo.second", { count: secondsAgo })
: t("liveTimeAgo.second_plural", { count: secondsAgo });
} else if (elapsedMilliseconds < 3600000) {
const minutesAgo = Math.floor(elapsedMilliseconds / 60000);
timeAgoText =
minutesAgo === 1
? t("liveTimeAgo.minute", { count: minutesAgo })
: t("liveTimeAgo.minute_plural", { count: minutesAgo });
} else if (elapsedMilliseconds < 86400000) {
const hoursAgo = Math.floor(elapsedMilliseconds / 3600000);
timeAgoText =
hoursAgo === 1
? t("liveTimeAgo.hour", { count: hoursAgo })
: t("liveTimeAgo.hour_plural", { count: hoursAgo });
} else {
const daysAgo = Math.floor(elapsedMilliseconds / 86400000);
timeAgoText =
daysAgo === 1
? t("liveTimeAgo.day", { count: daysAgo })
: t("liveTimeAgo.day_plural", { count: daysAgo });
}
return timeAgoText;
}
export default function LiveTimeAgo({ startTime }) {
const { t } = useTranslation();
const [timeAgo, setTimeAgo] = useState(calculatedTimeAgo(startTime, t));
useEffect(() => {
const interval = setInterval(() => {
setTimeAgo(calculatedTimeAgo(startTime, t));
}, 1000); // Update every second
return () => clearInterval(interval); // Clean up on component unmount
}, [startTime]);
return (
<Tooltip title={FormatDatetime(startTime)}>
<span>{timeAgo}</span>
</Tooltip>
);
}

View File

@ -1,50 +0,0 @@
import { UserOutlined } from "@ant-design/icons";
import { Avatar, Tooltip } from "antd";
import { Constants } from "../../utils";
export function MyAvatar({
avatarWidth,
avatar,
tooltip,
tooltipTitle,
allUsers,
userId,
}) {
if (!avatar) {
if (allUsers && userId) {
const user = allUsers.find((u) => u.Id === userId);
if (user) {
avatar = user.Avatar;
tooltipTitle = user.Username;
}
}
}
const avatarContent = avatar ? (
<Avatar
size={avatarWidth}
src={Constants.STATIC_CONTENT_ADDRESS + "avatars/" + avatar}
/>
) : (
<Avatar size={avatarWidth} icon={<UserOutlined />} />
);
return tooltip ? (
<Tooltip placement="top" trigger="hover" title={tooltipTitle}>
{avatarContent}
</Tooltip>
) : (
avatarContent
);
}
export function MyUserAvatar({ avatar, size = "default" }) {
if (avatar === "") return <Avatar icon={<UserOutlined />} size={size} />;
return (
<Avatar
src={Constants.STATIC_CONTENT_ADDRESS + "avatars/" + avatar}
size={size}
/>
);
}

View File

@ -1,37 +0,0 @@
import { EditOutlined } from "@ant-design/icons";
import { Input, Typography } from "antd";
import { useState } from "react";
export default function MyTypography({ value, setValue, maxLength }) {
const [editing, setEditing] = useState(false);
return (
<div
style={{
display: "flex",
flexDirection: "row",
gap: 10,
marginRight: 26,
alignItems: "center",
}}
>
{editing ? (
<Input
value={value}
onChange={(e) => setValue(e.target.value)}
maxLength={maxLength}
showCount
/>
) : (
<Typography.Title level={3} style={{ margin: 0 }}>
{value}
</Typography.Title>
)}
<EditOutlined
style={{ fontSize: 24 }}
onClick={() => setEditing(!editing)}
/>
</div>
);
}