[WEB-3892] chore: link item improvements (#6944)

* chore: code refactor

* chore: global link block component added

* chore: link item improvement and code refactor
This commit is contained in:
Anmol Singh Bhatia 2025-04-17 20:08:53 +05:30 committed by GitHub
parent 18fb3b8450
commit be5d77d978
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 210 additions and 212 deletions

View file

@ -1,9 +1,10 @@
import { observer } from "mobx-react";
import { Copy, LinkIcon, Pencil, Trash2 } from "lucide-react";
import { Copy, Pencil, Trash2 } from "lucide-react";
// plane types
import { ILinkDetails } from "@plane/types";
// plane ui
import { setToast, TOAST_TYPE, Tooltip } from "@plane/ui";
import { getIconForLink } from "@plane/utils";
// helpers
import { calculateTimeAgo } from "@/helpers/date-time.helper";
import { copyTextToClipboard } from "@/helpers/string.helper";
@ -27,6 +28,8 @@ export const ModulesLinksListItem: React.FC<Props> = observer((props) => {
// platform os
const { isMobile } = usePlatformOS();
const Icon = getIconForLink(link.url);
const copyToClipboard = (text: string) => {
copyTextToClipboard(text).then(() =>
setToast({
@ -42,7 +45,7 @@ export const ModulesLinksListItem: React.FC<Props> = observer((props) => {
<div className="flex w-full items-start justify-between gap-2">
<div className="flex items-start gap-2 truncate">
<span className="py-1">
<LinkIcon className="h-3 w-3 flex-shrink-0" />
<Icon className="size-3 stroke-2 text-custom-text-350 group-hover:text-custom-text-100 flex-shrink-0" />
</span>
<Tooltip tooltipContent={link.title && link.title !== "" ? link.title : link.url} isMobile={isMobile}>
<a href={link.url} target="_blank" rel="noopener noreferrer" className="cursor-pointer truncate text-xs">
@ -87,9 +90,8 @@ export const ModulesLinksListItem: React.FC<Props> = observer((props) => {
</div>
</div>
<div className="px-5">
<p className="mt-0.5 stroke-[1.5] text-xs text-custom-text-300">
Added {calculateTimeAgo(link.created_at)}
<br />
<p className="flex items-center gap-1.5 mt-0.5 stroke-[1.5] text-xs text-custom-text-300">
Added {calculateTimeAgo(link.created_at)}{" "}
{createdByDetails && (
<>by {createdByDetails?.is_bot ? createdByDetails?.first_name + " Bot" : createdByDetails?.display_name}</>
)}