mirror of
https://github.com/yangshun/tech-interview-handbook.git
synced 2026-04-27 20:13:10 +08:00
[resumes][feat] use primary buttons (#441)
This commit is contained in:
@@ -48,64 +48,64 @@ export default function ResumeCommentsList({
|
||||
}
|
||||
};
|
||||
|
||||
if (commentsQuery.isLoading) {
|
||||
return (
|
||||
<div className="col-span-10 pt-4">
|
||||
<Spinner display="block" size="lg" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-3">
|
||||
{commentsQuery.isLoading ? (
|
||||
<div className="col-span-10 pt-4">
|
||||
<Spinner display="block" size="lg" />
|
||||
</div>
|
||||
) : (
|
||||
<div className="mb-8 flow-root h-[calc(100vh-13rem)] w-full flex-col space-y-10 overflow-y-auto overflow-x-hidden pb-16">
|
||||
{RESUME_COMMENTS_SECTIONS.map(({ label, value }) => {
|
||||
const comments = commentsQuery.data
|
||||
? commentsQuery.data.filter((comment: ResumeComment) => {
|
||||
return (comment.section as string) === value;
|
||||
<div className="mb-8 flow-root h-[calc(100vh-13rem)] w-full flex-col space-y-10 overflow-y-auto overflow-x-hidden pb-16">
|
||||
{RESUME_COMMENTS_SECTIONS.map(({ label, value }) => {
|
||||
const comments = commentsQuery.data
|
||||
? commentsQuery.data.filter((comment: ResumeComment) => {
|
||||
return (comment.section as string) === value;
|
||||
})
|
||||
: [];
|
||||
const commentCount = comments.length;
|
||||
|
||||
return (
|
||||
<div key={value} className="space-y-4 pr-4">
|
||||
{/* CommentHeader Section */}
|
||||
<div className="text-primary-800 flex items-center space-x-2">
|
||||
<hr className="flex-grow border-slate-800" />
|
||||
{renderIcon(value)}
|
||||
|
||||
<span className="w-fit text-lg font-medium">{label}</span>
|
||||
<hr className="flex-grow border-slate-800" />
|
||||
</div>
|
||||
|
||||
{/* Comment Section */}
|
||||
<div
|
||||
className={clsx(
|
||||
'space-y-2 rounded-md border-2 bg-white px-4 py-3 drop-shadow-md',
|
||||
commentCount ? 'border-slate-300' : 'border-slate-300',
|
||||
)}>
|
||||
{commentCount > 0 ? (
|
||||
comments.map((comment) => {
|
||||
return (
|
||||
<ResumeCommentListItem
|
||||
key={comment.id}
|
||||
comment={comment}
|
||||
userId={sessionData?.user?.id}
|
||||
/>
|
||||
);
|
||||
})
|
||||
: [];
|
||||
const commentCount = comments.length;
|
||||
) : (
|
||||
<div className="flex flex-row items-center text-sm">
|
||||
<ChatBubbleLeftRightIcon className="mr-2 h-6 w-6 text-slate-500" />
|
||||
|
||||
return (
|
||||
<div key={value} className="space-y-4 pr-4">
|
||||
{/* CommentHeader Section */}
|
||||
<div className="text-primary-800 flex items-center space-x-2">
|
||||
<hr className="flex-grow border-slate-800" />
|
||||
{renderIcon(value)}
|
||||
|
||||
<span className="w-fit text-lg font-medium">{label}</span>
|
||||
<hr className="flex-grow border-slate-800" />
|
||||
<div className="text-slate-500">
|
||||
There are no comments for this section yet!
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Comment Section */}
|
||||
<div
|
||||
className={clsx(
|
||||
'space-y-2 rounded-md border-2 bg-white px-4 py-3 drop-shadow-md',
|
||||
commentCount ? 'border-slate-300' : 'border-slate-300',
|
||||
)}>
|
||||
{commentCount > 0 ? (
|
||||
comments.map((comment) => {
|
||||
return (
|
||||
<ResumeCommentListItem
|
||||
key={comment.id}
|
||||
comment={comment}
|
||||
userId={sessionData?.user?.id}
|
||||
/>
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<div className="flex flex-row items-center text-sm">
|
||||
<ChatBubbleLeftRightIcon className="mr-2 h-6 w-6 text-slate-500" />
|
||||
|
||||
<div className="text-slate-500">
|
||||
There are no comments for this section yet!
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user