refactor: optimize socket connection handling, improve messaging cache management, and simplify SpecializationCard UI
This commit is contained in:
@@ -29,11 +29,11 @@ export function SpecializationCard({
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-white rounded-[20px] p-6 text-center flex flex-col border-[0.7px] border-[#E58625] relative">
|
||||
<div className="bg-white rounded-[20px] p-6 text-center flex flex-col border-[0.7px] border-[#E58625]">
|
||||
<div className="flex justify-center mb-3">{icon}</div>
|
||||
<h4 className="font-bold text-[#00293D] text-[14px] leading-[17px] mb-4 font-fractul">{title}</h4>
|
||||
<div className="flex-1">
|
||||
{items.slice(0, initialItemsToShow).map((item, idx) => (
|
||||
{displayedItems.map((item, idx) => (
|
||||
<p key={idx} className="text-[#00293D] text-[14px] leading-[25px] font-normal font-serif text-center">
|
||||
{item}
|
||||
</p>
|
||||
@@ -56,35 +56,6 @@ export function SpecializationCard({
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{/* Expanded overlay showing all items */}
|
||||
{isExpanded && hasMoreItems && (
|
||||
<div className="absolute inset-0 bg-white rounded-[20px] p-6 text-center flex flex-col border-[0.7px] border-[#E58625] z-10 shadow-lg">
|
||||
<div className="flex justify-center mb-3">{icon}</div>
|
||||
<h4 className="font-bold text-[#00293D] text-[14px] leading-[17px] mb-4 font-fractul">{title}</h4>
|
||||
<div className="flex-1 overflow-y-auto">
|
||||
{items.map((item, idx) => (
|
||||
<p key={idx} className="text-[#00293D] text-[14px] leading-[25px] font-normal font-serif text-center">
|
||||
{item}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
<div className="mt-4 flex justify-center">
|
||||
<button
|
||||
onClick={handleToggle}
|
||||
className="inline-flex items-center justify-center gap-1 h-[20px] px-3 border border-[#e58625] rounded-[20px] text-[#e58625] text-[10px] leading-[22px] font-bold font-serif hover:bg-[#e58625]/5 transition-colors cursor-pointer"
|
||||
>
|
||||
Show Less
|
||||
<Image
|
||||
src="/assets/icons/chevron-down-icon.svg"
|
||||
alt="Show less"
|
||||
width={10}
|
||||
height={10}
|
||||
className="transition-transform duration-200 rotate-180"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user