refactor: improve feed event item display
This commit is contained in:
parent
56bbe09005
commit
17f87c191a
@ -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>
|
||||
|
15
src/client/components/feed/FeedIcon.tsx
Normal file
15
src/client/components/feed/FeedIcon.tsx
Normal 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';
|
@ -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');
|
||||
|
Loading…
Reference in New Issue
Block a user