Refactor: insight and list headers

[a0m0rajab]

Type of feature

🧑‍💻 Refactor

Current behavior

If you check the code for insight and list header, you could find a some similarities like the one provided:

app/components/ListHeader/list-header.tsx

Lines 40 to 51 in 6c79d5e

	<div className="relative flex flex-row justify-between w-full">
	<div className="flex flex-col md:flex-row ">
	<div className="header-image mr-2 p-2 min-w-[130px]">
	<ContextThumbnail size={120} ContextThumbnailURL={""}></ContextThumbnail>
	</div>
	<div className="flex flex-col justify-center p-2 header-info grow">
	<div className="flex gap-2">
	<Title level={1} className="!text-2xl font-semibold text-slate-900">
	{(name && truncateString(name, 30)) || "List"}
	</Title>
	{<Badge isPublic={isPublic} />}
	</div>

app/components/molecules/InsightHeader/insight-header.tsx

Lines 56 to 69 in 6c79d5e

	return (
	<div className="relative flex flex-row justify-between w-full">
	<div className="flex flex-col md:flex-row ">
	<div className="header-image mr-2 p-2 min-w-[130px]">
	<ContextThumbnail size={120} ContextThumbnailURL={""}></ContextThumbnail>
	</div>
	<div className="flex flex-col justify-center p-2 header-info grow">
	<div className="flex gap-2">
	<Title level={1} className="!text-2xl font-semibold text-slate-900">
	{(insight && truncateString(insight.name, 30)) || "Insights"}
	</Title>
	{insight && <Badge isPublic={insight?.is_public} />}
	</div>
	<div className="flex items-center gap-2 mt-4">

I thought it would worth to mention it to see if it's worthy to refactor that code.

Suggested solution

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Contributing Docs

• I agree to follow this project's Contribution Docs

[github-actions]

Thanks for the issue, our team will look into it as soon as possible! If you would like to work on this issue, please wait for us to decide if it's ready. The issue will be ready to work on once we remove the "needs triage" label.

To claim an issue that does not have the "needs triage" label, please leave a comment that says ".take". If you have any questions, please reach out to us on Discord or follow up on the issue itself.

For full info on how to contribute, please check out our contributors guide.