style(StorePage): refactor button element to improve readability and maintainability

fix(StorePage): fix className prop on Button component to correctly apply error styling
fix(StorePage): fix className prop on IconComponent to correctly apply loading animation
fix(StorePage): fix onClick event on IconComponent to correctly update searchText state
This commit is contained in:
anovazzi1 2023-11-10 19:38:19 -03:00
commit 630fabc328

View file

@ -158,16 +158,17 @@ export default function StorePage(): JSX.Element {
}} }}
value={inputText} value={inputText}
/> />
<IconComponent <button
name={loading ? "Loader2" : "Search"} className="absolute bottom-0 right-4 top-0 my-auto h-6 cursor-pointer stroke-1 text-muted-foreground"
onClick={() => { onClick={() => {
setSearchText(inputText); setSearchText(inputText);
}} }}
className={ >
"absolute bottom-0 right-4 top-0 my-auto h-6 cursor-pointer stroke-1 text-muted-foreground" + <IconComponent
(loading ? " animate-spin" : "") name={loading ? "Loader2" : "Search"}
} className={loading ? " animate-spin" : ""}
/> />
</button>
</div> </div>
<div className="ml-4 flex w-full gap-2 border-b border-border"> <div className="ml-4 flex w-full gap-2 border-b border-border">
<button <button