Added prettier-plugin-tailwindcss and sorted the classes + some small fixes (#630)

* Added prettier-plugin-tailwindcss and sorted the classes

* Added tsc into staged check + some type improvements
This commit is contained in:
yuri-sakharov
2025-11-30 22:11:52 +02:00
committed by GitHub
parent 73f74d77bb
commit f10cc6d8a5
43 changed files with 271 additions and 183 deletions

View File

@@ -27,7 +27,7 @@ const HealthStatus = ({ statusData }: Props) => {
: cond.status === "Progressing"
? "bg-warning"
: "bg-danger"
} w-2.5 h-2.5 rounded-xs`}
} h-2.5 w-2.5 rounded-xs`}
></span>
</Tooltip>
);

View File

@@ -80,7 +80,7 @@ export default function InstalledPackageCard({
ref={ref}
className={`${
borderLeftColor[release.status]
} text-xs grid grid-cols-12 items-center bg-white rounded-md p-2 py-6 my-2 custom-shadow border-l-4 border-l-[${statusColor}] cursor-pointer ${
} custom-shadow my-2 grid grid-cols-12 items-center rounded-md border-l-4 bg-white p-2 py-6 text-xs border-l-[${statusColor}] cursor-pointer ${
isMouseOver && "custom-shadow-lg"
}`}
onMouseOver={handleMouseOver}
@@ -90,31 +90,31 @@ export default function InstalledPackageCard({
<img
src={release.icon || HelmGrayIcon}
alt="helm release icon"
className="w-[45px] mx-4 col-span-1 min-w-[45px]"
className="col-span-1 mx-4 w-[45px] min-w-[45px]"
/>
<div className="col-span-11 -mb-5">
<div className="grid grid-cols-11">
<div className="col-span-3 font-bold text-xl mr-0.5 font-roboto-slab">
<div className="col-span-3 mr-0.5 font-roboto-slab text-xl font-bold">
{release.name}
</div>
<div className="col-span-3">
<StatusLabel status={release.status} />
</div>
<div className="col-span-2 font-bold">{release.chart}</div>
<div className="col-span-1 font-bold text-xs">
<div className="col-span-1 text-xs font-bold">
#{release.revision}
</div>
<div className="col-span-1 font-bold text-xs">
<div className="col-span-1 text-xs font-bold">
{release.namespace}
</div>
<div className="col-span-1 font-bold text-xs">{getAge(release)}</div>
<div className="col-span-1 text-xs font-bold">{getAge(release)}</div>
</div>
<div
className="grid grid-cols-11 text-xs mt-3"
className="mt-3 grid grid-cols-11 text-xs"
style={{ marginBottom: "12px" }}
>
<div className="col-span-3 h-12 line-clamp-3 mr-1">
<div className="col-span-3 mr-1 line-clamp-3 h-12">
{release.description}
</div>
<div className="col-span-3 mr-2">
@@ -124,11 +124,11 @@ export default function InstalledPackageCard({
<Spinner size={4} />
)}
</div>
<div className="col-span-2 text-muted flex flex-col items">
<div className="items col-span-2 flex flex-col text-muted">
<span>CHART VERSION</span>
{(canUpgrade || installRepoSuggestion) && (
<div
className="text-upgradable flex flex-row items-center gap-1 font-bold"
className="flex flex-row items-center gap-1 font-bold text-upgradable"
title={`upgrade available: ${latestVersionData?.version} from ${latestVersionData?.repository}`}
>
{canUpgrade && !installRepoSuggestion ? (

View File

@@ -17,22 +17,22 @@ export default function InstalledPackagesHeader({
!isLoading && (numOfPackages === undefined || numOfPackages === 0)
);
return (
<div className="custom-shadow rounded-t-md ">
<div className="flex items-center justify-between bg-white px-2 py-0.5 font-inter rounded-t-md ">
<div className="custom-shadow rounded-t-md">
<div className="flex items-center justify-between rounded-t-md bg-white px-2 py-0.5 font-inter">
<div className="flex items-center">
<img
src={HeaderLogo}
alt="Helm-DashBoard"
className="display-inline h-12 ml-3 mr-3 w-[28px] "
className="display-inline mr-3 ml-3 h-12 w-[28px]"
/>
<h2 className="display-inline font-bold text-base ">{`Installed Charts (${
<h2 className="display-inline text-base font-bold">{`Installed Charts (${
numOfPackages || "0"
})`}</h2>
</div>
<div className="w-1/3">
<input
className="border border-installed-charts-filter rounded-sm p-1 text-sm w-11/12"
className="w-11/12 rounded-sm border border-installed-charts-filter p-1 text-sm"
placeholder="Filter..."
type="text"
onChange={(ev) => setFilterKey(ev.target.value)}
@@ -41,7 +41,7 @@ export default function InstalledPackagesHeader({
</div>
{showNoPackageAlert && (
<div className="bg-white rounded-sm shadow-sm display-none no-charts mt-3 text-sm p-4">
<div className="display-none no-charts mt-3 rounded-sm bg-white p-4 text-sm shadow-sm">
Looks like you don&apos;t have any charts installed.
&quot;Repository&quot; section may be a good place to start.
</div>