ben.carrasco/prowler
1
0
Fork 0
mirror of https://github.com/prowler-cloud/prowler.git synced 2026-07-23 12:31:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: replace icon for check connection component

Browse Source
This commit is contained in:
Pablo Lara
2024-10-10 15:43:41 +02:00
parent bd46196fd0
commit 4cf7a3244f
2 changed files with 90 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/icons/Icons.tsx
+83
View File
@@ -575,6 +575,89 @@ export const ConnectionIcon: React.FC<IconSvgProps> = ({
);
};
export const ConnectionTrue: React.FC<IconSvgProps> = ({
size = 24,
width,
height,
...props
}) => (
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
height={size || height || 24}
viewBox="0 0 24 24"
width={size || width || 24}
{...props}
>
<path
d="M12 20h.012M8.25 17c2-2 5.5-2 7.5 0m2.75-3c-3.768-3.333-9-3.333-13 0M2 11c3.158-2.667 6.579-4 10-4m3 .5s1 0 2 2c0 0 2.477-3.9 5-5.5"
color="currentColor"
/>
</svg>
);
export const ConnectionFalse: React.FC<IconSvgProps> = ({
size = 24,
width,
height,
...props
}) => (
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
height={size || height || 24}
viewBox="0 0 24 24"
width={size || width || 24}
{...props}
>
<path
d="M12 18h.012M8.25 15c2-2 5.5-2 7.5 0m2.75-3a11 11 0 0 0-.231-.199M5.5 12c2.564-2.136 5.634-2.904 8.5-2.301M2 9c3.466-2.927 7.248-4.247 11-3.962M22 5l-6 6m6 0-6-6"
color="currentColor"
/>
</svg>
);
export const ConnectionPending: React.FC<IconSvgProps> = ({
size = 24,
width,
height,
...props
}) => (
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
stroke="currentColor"
strokeWidth="1.05"
height={size || height || 24}
viewBox="0 0 24 24"
width={size || width || 24}
{...props}
>
<g fill="none" stroke="currentColor" strokeWidth="1.05">
<circle cx="12" cy="18" r="2" />
<path strokeOpacity=".2" d="M7.757 13.757a6 6 0 0 1 8.486 0" />
<path
strokeOpacity=".2"
d="M4.929 10.93c3.905-3.905 10.237-3.905 14.142 0"
opacity=".8"
/>
<path
strokeOpacity=".2"
d="M2.101 8.1c5.467-5.468 14.331-5.468 19.798 0"
opacity=".8"
/>
</g>
</svg>
);
export const SuccessIcon: React.FC<IconSvgProps> = ({
size = 24,
width,
components/providers/provider-info.tsx
+7 -7
View File
@@ -1,6 +1,6 @@
import React from "react";
import { ConnectionIcon } from "../icons";
import { ConnectionFalse, ConnectionPending, ConnectionTrue } from "../icons";
import {
AWSProviderBadge,
AzureProviderBadge,
@@ -23,24 +23,24 @@ export const ProviderInfo: React.FC<ProviderInfoProps> = ({
switch (connected) {
case true:
return (
<div className="flex items-center justify-center rounded-medium border border-system-success bg-system-success-lighter p-1">
<ConnectionIcon className="text-system-success" size={24} />
<div className="flex items-center justify-center rounded-medium border-2 border-system-success bg-system-success-lighter p-1">
<ConnectionTrue className="text-system-success" size={24} />
</div>
);
case false:
return (
<div className="flex items-center justify-center rounded-medium border border-danger bg-system-error-lighter p-1">
<ConnectionIcon className="text-danger" size={24} />
<div className="flex items-center justify-center rounded-medium border-2 border-danger bg-system-error-lighter p-1">
<ConnectionFalse className="text-danger" size={24} />
</div>
);
case null:
return (
<div className="bg-info-lighter border-info-lighter flex items-center justify-center rounded-medium border p-1">
<ConnectionIcon className="text-info" size={24} />
<ConnectionPending className="text-info" size={24} />
</div>
);
default:
return <ConnectionIcon size={24} />;
return <ConnectionPending size={24} />;
}
};