refactor: improve feed event item display

This commit is contained in:
moonrailgun 2024-06-30 20:09:08 +08:00
parent 56bbe09005
commit 17f87c191a
3 changed files with 24 additions and 5 deletions

View File

@ -4,6 +4,7 @@ import { Badge } from '../ui/badge';
import dayjs from 'dayjs';
import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';
import { MarkdownViewer } from '../MarkdownEditor';
import { FeedIcon } from './FeedIcon';
type FeedEventItemType = AppRouterOutput['feed']['events'][number];
@ -12,7 +13,10 @@ export const FeedEventItem: React.FC<{ event: FeedEventItemType }> = React.memo(
return (
<div className="border-muted flex items-center rounded-lg border px-4 py-2">
<div className="flex-1 gap-2">
<div className="mb-2 flex gap-2">
<div className="mb-2 flex items-center gap-2 text-sm">
<div className="border-muted rounded-lg border p-2">
<FeedIcon source={event.source} size={24} />
</div>
<div>
<MarkdownViewer value={event.eventContent} />
</div>
@ -30,7 +34,7 @@ export const FeedEventItem: React.FC<{ event: FeedEventItemType }> = React.memo(
</div>
<Tooltip>
<TooltipTrigger className="cursor-default">
<TooltipTrigger className="cursor-default self-end text-xs opacity-60">
<div>{dayjs(event.createdAt).fromNow()}</div>
</TooltipTrigger>
<TooltipContent>

View File

@ -0,0 +1,15 @@
import React from 'react';
import { LuGithub, LuPlug } from 'react-icons/lu';
interface FeedIconProps {
source: string;
size: number;
}
export const FeedIcon: React.FC<FeedIconProps> = React.memo((props) => {
if (props.source === 'github') {
return <LuGithub size={props.size} />;
}
return <LuPlug size={props.size} />;
});
FeedIcon.displayName = 'FeedIcon';

View File

@ -45,7 +45,9 @@ export const feedIntegrationRouter = router({
if (eventType === 'push') {
const pusherName = _.get(data, 'pusher.name');
const pusherEmail = _.get(data, 'pusher.email');
const commits = _.map(_.get(data, 'commits') as any[], 'id').join(', ');
const commits = _.map(_.get(data, 'commits') as any[], (val) =>
String(val.id).substring(0, 9)
).join(', ');
const fullName = _.get(data, 'repository.full_name');
const repoUrl = _.get(data, 'repository.html_url');
const ref = String(_.get(data, 'ref'));
@ -71,8 +73,6 @@ export const feedIntegrationRouter = router({
serializeJSON(event)
);
console.log('serializeJSON(event)', serializeJSON(event));
return 'ok';
} else if (eventType === 'star') {
const starCount = _.get(data, 'repository.stargazers_count');