forked from github/plane
f88109ef04
* fix: issue activity and comment change * chore: posthog enabled * chore: comment creation in activity * chore: comment crud in store mutation * fix: issue activity/ comments `disable` and `showAccessSpecifier` logic. * chore: comment reaction serializer change * conflicts: merge conflicts resolved * conflicts: merge conflicts resolved * chore: add issue activity/ comments to peek-overview. * imporve `showAccessIdentifier` logic. * chore: remove quotes from issue activity. * chore: use `projectLabels` instead of `workspaceLabels` in labels activity. * fix: project publish `is_deployed` not updating bug. * cleanup * fix: posthog enabled * fix: typos and the comment endpoint updates * fix: issue activity icons update --------- Co-authored-by: NarayanBavisetti <narayan3119@gmail.com> Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com>
53 lines
1.7 KiB
TypeScript
53 lines
1.7 KiB
TypeScript
import { FC, ReactNode } from "react";
|
|
import { Network } from "lucide-react";
|
|
// hooks
|
|
import { useIssueDetail } from "hooks/store";
|
|
// ui
|
|
import { Tooltip } from "@plane/ui";
|
|
// components
|
|
import { IssueUser } from "../";
|
|
// helpers
|
|
import { renderFormattedTime, renderFormattedDate, calculateTimeAgo } from "helpers/date-time.helper";
|
|
|
|
type TIssueActivityBlockComponent = {
|
|
icon?: ReactNode;
|
|
activityId: string;
|
|
ends: "top" | "bottom" | undefined;
|
|
children: ReactNode;
|
|
};
|
|
|
|
export const IssueActivityBlockComponent: FC<TIssueActivityBlockComponent> = (props) => {
|
|
const { icon, activityId, ends, children } = props;
|
|
// hooks
|
|
const {
|
|
activity: { getActivityById },
|
|
} = useIssueDetail();
|
|
|
|
const activity = getActivityById(activityId);
|
|
|
|
if (!activity) return <></>;
|
|
return (
|
|
<div
|
|
className={`relative flex items-center gap-3 text-xs ${
|
|
ends === "top" ? `pb-2` : ends === "bottom" ? `pt-2` : `py-2`
|
|
}`}
|
|
>
|
|
<div className="absolute left-[13px] top-0 bottom-0 w-0.5 bg-custom-background-80" aria-hidden={true} />
|
|
<div className="flex-shrink-0 ring-6 w-7 h-7 rounded-full overflow-hidden flex justify-center items-center z-10 bg-custom-background-80 text-custom-text-200">
|
|
{icon ? icon : <Network className="w-3.5 h-3.5" />}
|
|
</div>
|
|
<div className="w-full text-custom-text-200">
|
|
<IssueUser activityId={activityId} />
|
|
<span> {children} </span>
|
|
<span>
|
|
<Tooltip
|
|
tooltipContent={`${renderFormattedDate(activity.created_at)}, ${renderFormattedTime(activity.created_at)}`}
|
|
>
|
|
<span className="whitespace-nowrap"> {calculateTimeAgo(activity.created_at)}</span>
|
|
</Tooltip>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|