feat: upgraded to tw v4

This commit is contained in:
=
2025-10-09 22:37:42 +05:30
parent 2da35b389d
commit 7b0a51f5cf
669 changed files with 2856 additions and 3143 deletions
@@ -76,10 +76,10 @@ const PageContent = () => {
<img
alt={`${details.name} data source`}
src={`/images/integrations/${details.image}`}
className="ml-1 mt-3 w-14"
className="mt-3 ml-1 w-14"
/>
<div>
<p className="text-3xl font-semibold text-white">{dataSource.name}</p>
<p className="text-3xl font-medium text-white">{dataSource.name}</p>
<p className="leading-3 text-bunker-300">{details.name} Data Source</p>
</div>
</div>
@@ -26,7 +26,7 @@ export const SecretScanningDataSourceSection = ({ dataSource }: Props) => {
<div className="flex w-full flex-col gap-3 rounded-lg border border-mineshaft-600 bg-mineshaft-900 px-4 py-3">
<div className="flex items-center justify-between border-b border-mineshaft-400 pb-2">
<div className="mr-2 flex flex-1 items-center justify-between">
<h3 className="font-semibold text-mineshaft-100">Details</h3>
<h3 className="font-medium text-mineshaft-100">Details</h3>
{isDisconnected && (
<Tooltip
className="text-xs"
@@ -79,7 +79,7 @@ export const SecretScanningDataSourceSection = ({ dataSource }: Props) => {
<span>Enabled</span>
</Badge>
) : (
<Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
<Badge className="flex h-5 w-min items-center gap-1.5 bg-mineshaft-400/50 whitespace-nowrap text-bunker-300">
<FontAwesomeIcon icon={faBan} />
<span>Disabled</span>
</Badge>
@@ -133,7 +133,7 @@ export const SecretScanningResourceRow = ({ resource, dataSource }: Props) => {
)}
key={`resource-${id}`}
>
<Td className="!min-w-[8rem] max-w-0">
<Td className="max-w-0 min-w-32!">
<div className="flex w-full items-center">
<p className="truncate">{name}</p>
</div>
@@ -143,7 +143,7 @@ export const SecretScanningResourceRow = ({ resource, dataSource }: Props) => {
{lastScanStatus?.match(/queued|scanning/) ? (
<Badge
variant="primary"
className="flex h-5 w-min animate-pulse items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300"
className="flex h-5 w-min animate-pulse items-center gap-1.5 bg-mineshaft-400/50 whitespace-nowrap text-bunker-300"
>
<FontAwesomeIcon icon={faSearch} />
<span>Scanning For Leaks</span>
@@ -210,7 +210,7 @@ export const SecretScanningResourceRow = ({ resource, dataSource }: Props) => {
content={`This ${resourceDetails.singularNoun} will not be scanned due to exclusion in Data Source configuration.`}
>
<div className="ml-auto">
<Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
<Badge className="flex h-5 w-min items-center gap-1.5 bg-mineshaft-400/50 whitespace-nowrap text-bunker-300">
<FontAwesomeIcon icon={faBan} />
<span>Inactive</span>
</Badge>
@@ -47,7 +47,7 @@ export const SecretScanningResourceSection = ({ dataSource }: Props) => {
<div className="w-full rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
<div className="mb-4 flex items-center justify-between">
<div>
<p className="text-xl font-semibold text-mineshaft-100">{resourceDetails.pluralTitle}</p>
<p className="text-xl font-medium text-mineshaft-100">{resourceDetails.pluralTitle}</p>
<p className="text-sm text-bunker-300">
{resourceDetails.pluralTitle} associated with this{" "}
{SECRET_SCANNING_DATA_SOURCE_MAP[dataSource.type].name} Data Source
@@ -224,7 +224,7 @@ export const SecretScanningResourcesTable = ({ dataSource }: Props) => {
<FontAwesomeIcon icon={faFilter} />
</IconButton>
</DropdownMenuTrigger>
<DropdownMenuContent className="thin-scrollbar max-h-[70vh] overflow-y-auto" align="end">
<DropdownMenuContent className="max-h-[70vh] thin-scrollbar overflow-y-auto" align="end">
<DropdownMenuLabel className="flex w-full items-center justify-between">
Status
<Tooltip
@@ -76,7 +76,7 @@ export const SecretScanningScanRow = ({ scan }: Props) => {
<span className="text-mineshaft-300">{format(createdAt, "h:mm aa")}</span>
</p>
</Td>
<Td className="!min-w-[8rem] max-w-0">
<Td className="max-w-0 min-w-32!">
<div className="flex flex-col">
<p className="truncate">{resourceName}</p>
</div>
@@ -14,7 +14,7 @@ export const SecretScanningScanSection = ({ dataSource }: Props) => {
<div className="w-full rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
<div className="mb-4 flex items-center justify-between">
<div>
<p className="text-xl font-semibold text-mineshaft-100">Scan History</p>
<p className="text-xl font-medium text-mineshaft-100">Scan History</p>
<p className="text-sm text-bunker-300">
Detailed history of when {resourceDetails.singularNoun} scans occurred and their
findings
@@ -184,7 +184,7 @@ export const SecretScanningScanTable = ({ dataSource }: Props) => {
<FontAwesomeIcon icon={faFilter} />
</IconButton>
</DropdownMenuTrigger>
<DropdownMenuContent className="thin-scrollbar max-h-[70vh] overflow-y-auto" align="end">
<DropdownMenuContent className="max-h-[70vh] thin-scrollbar overflow-y-auto" align="end">
<DropdownMenuLabel>{resourceDetails.pluralTitle}</DropdownMenuLabel>
{scans.length ? (
[...new Set(scans.map(({ resourceName }) => resourceName))].map((resourceName) => {
@@ -116,7 +116,7 @@ export const SecretScanningDataSourceRow = ({
)}
key={`data-source-${id}`}
>
<Td className="!min-w-[8rem] max-w-0">
<Td className="max-w-0 min-w-32!">
<div className="flex w-full items-center">
<img
alt={`${sourceDetails.name} Data Source`}
@@ -126,7 +126,7 @@ export const SecretScanningDataSourceRow = ({
<p className="ml-2 truncate">{sourceDetails.name}</p>
</div>
</Td>
<Td className="!min-w-[8rem] max-w-0">
<Td className="max-w-0 min-w-32!">
<div className="flex w-full items-center">
<p className="truncate">{name}</p>
{description && (
@@ -141,7 +141,7 @@ export const SecretScanningDataSourceRow = ({
{lastScanStatus?.match(/queued|scanning/) ? (
<Badge
variant="primary"
className="flex h-5 w-min animate-pulse items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300"
className="flex h-5 w-min animate-pulse items-center gap-1.5 bg-mineshaft-400/50 whitespace-nowrap text-bunker-300"
>
<FontAwesomeIcon icon={faSearch} />
<span>Scanning For Leaks</span>
@@ -207,7 +207,7 @@ export const SecretScanningDataSourceRow = ({
content={`Auto-Scan is disabled. Scans will not be automatically triggered when a ${autoScanDescription.verb} occurs to ${autoScanDescription.pluralNoun} associated with this data source`}
>
<div className="ml-auto">
<Badge className="flex h-5 w-min items-center gap-1.5 whitespace-nowrap bg-mineshaft-400/50 text-bunker-300">
<Badge className="flex h-5 w-min items-center gap-1.5 bg-mineshaft-400/50 whitespace-nowrap text-bunker-300">
<FontAwesomeIcon icon={faBan} />
<span>Auto-Scan Disabled</span>
</Badge>
@@ -41,13 +41,13 @@ export const SecretScanningDataSourcesSection = () => {
<div className="mb-4 flex items-center justify-between">
<div>
<div className="flex items-center gap-1">
<p className="text-xl font-semibold text-mineshaft-100">Data Sources</p>
<p className="text-xl font-medium text-mineshaft-100">Data Sources</p>
<a
href="https://infisical.com/docs/documentation/platform/secret-scanning/overview"
target="_blank"
rel="noopener noreferrer"
>
<div className="ml-1 mt-[0.32rem] inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
<div className="mt-[0.32rem] ml-1 inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
<span>Docs</span>
<FontAwesomeIcon
@@ -248,7 +248,7 @@ export const SecretScanningDataSourcesTable = ({ dataSources }: Props) => {
<FontAwesomeIcon icon={faFilter} />
</IconButton>
</DropdownMenuTrigger>
<DropdownMenuContent className="thin-scrollbar max-h-[70vh] overflow-y-auto" align="end">
<DropdownMenuContent className="max-h-[70vh] thin-scrollbar overflow-y-auto" align="end">
<DropdownMenuLabel>Platform</DropdownMenuLabel>
{dataSources.length ? (
[...new Set(dataSources.map(({ type }) => type))].map((type) => {
@@ -102,7 +102,7 @@ export const SecretScanningFindingRow = ({
}}
/>
</Td>
<Td className="!min-w-[4rem] max-w-0">
<Td className="max-w-0 min-w-16!">
<div className="flex w-full items-center">
<img
alt={`${sourceDetails.name} Data Source`}
@@ -118,7 +118,7 @@ export const SecretScanningFindingRow = ({
<p className="text-mineshaft-300">{format(createdAt, "h:mm aa")}</p>
</div>
</Td>
<Td className="!min-w-[8rem] max-w-0">
<Td className="max-w-0 min-w-32!">
<div className="w-full items-center">
<p className="truncate">{resourceName}</p>
<p className="truncate text-xs text-mineshaft-400">{dataSourceName}</p>
@@ -172,10 +172,10 @@ export const SecretScanningFindingRow = ({
</Td>
</Tr>
<Tr>
<Td colSpan={6} className="!border-none p-0">
<Td colSpan={6} className="border-none! p-0">
<div
className={`w-full overflow-hidden bg-mineshaft-900/75 transition-all duration-500 ${
isExpanded ? "max-h-[50rem] opacity-100" : "max-h-0"
isExpanded ? "max-h-200 opacity-100" : "max-h-0"
}`}
>
<div className="grid gap-4 p-4 2xl:grid-cols-6">
@@ -24,13 +24,13 @@ export const SecretScanningFindingsSection = () => {
<div className="mb-4 flex items-center justify-between">
<div>
<div className="flex items-center gap-1">
<p className="text-xl font-semibold text-mineshaft-100">Findings</p>
<p className="text-xl font-medium text-mineshaft-100">Findings</p>
<a
href="https://infisical.com/docs/documentation/platform/secret-scanning/overview"
target="_blank"
rel="noopener noreferrer"
>
<div className="ml-1 mt-[0.32rem] inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
<div className="mt-[0.32rem] ml-1 inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
<span>Docs</span>
<FontAwesomeIcon
@@ -217,7 +217,7 @@ export const SecretScanningFindingsTable = ({ findings }: Props) => {
<FontAwesomeIcon icon={faFilter} />
</IconButton>
</DropdownMenuTrigger>
<DropdownMenuContent className="thin-scrollbar max-h-[70vh] overflow-y-auto" align="end">
<DropdownMenuContent className="max-h-[70vh] thin-scrollbar overflow-y-auto" align="end">
<DropdownMenuLabel>Status</DropdownMenuLabel>
{Object.values(SecretScanningFindingStatus).map((status) => (
<DropdownMenuItem
@@ -323,7 +323,7 @@ export const SecretScanningFindingsTable = ({ findings }: Props) => {
}}
/>
</Th>
<Th className="min-w-[10rem]">Platform</Th>
<Th className="min-w-40">Platform</Th>
<Th className="w-1/4">
<div className="flex items-center">
Timestamp
@@ -128,7 +128,7 @@ const Content = ({ findings, onComplete }: ContentProps) => {
render={({ field, fieldState: { error } }) => {
return (
<FormControl label="Remarks" isError={Boolean(error)} errorText={error?.message}>
<TextArea className="h-40 !resize-none" {...field} />
<TextArea className="h-40 resize-none!" {...field} />
</FormControl>
);
}}
@@ -61,7 +61,7 @@ export const SecretScanningConfigForm = ({ config }: Props) => {
<div className="rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
<div className="mb-4">
<div className="flex items-center gap-2">
<h2 className="text-xl font-semibold text-mineshaft-100">Project Configuration</h2>
<h2 className="text-xl font-medium text-mineshaft-100">Project Configuration</h2>
<a
target="_blank"
href="https://infisical.com/docs/documentation/platform/secret-scanning/overview#configuration"
@@ -69,7 +69,7 @@ export const SecretScanningConfigForm = ({ config }: Props) => {
rel="noopener noreferrer"
>
<div className="inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mb-[0.03rem] mr-1 text-[12px]" />
<FontAwesomeIcon icon={faBookOpen} className="mr-1 mb-[0.03rem] text-[12px]" />
<span>Docs</span>
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
@@ -99,7 +99,7 @@ export const SecretScanningConfigForm = ({ config }: Props) => {
}
{...field}
rows={3}
className="thin-scrollbar min-h-[36rem] w-full !resize-none !resize-y"
className="min-h-144 thin-scrollbar w-full resize-none! resize-y!"
isDisabled={!isAllowed}
/>
</FormControl>