Skip to content

feat(ui): adding Kubernetes logo #5285

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open

feat(ui): adding Kubernetes logo #5285

Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
20a86e2
feat(ui): adding Kubernetes logo
Kamalesh-Seervi Oct 27, 2025
469a879
Merge branch 'master' into fix/adding-chaos-k8s-logs
PriteshKiri Oct 29, 2025
8d892fc
Merge branch 'master' into fix/adding-chaos-k8s-logs
PriteshKiri Oct 29, 2025
862d0e9
Merge branch 'master' into fix/adding-chaos-k8s-logs
Kamalesh-Seervi Oct 30, 2025
1f71a14
Refactor FaultCard to include GCP in chartName check
Kamalesh-Seervi Oct 30, 2025
03365db
Merge branch 'master' into fix/adding-chaos-k8s-logs
PriteshKiri Oct 31, 2025
508802d
Merge branch 'master' into fix/adding-chaos-k8s-logs
PriteshKiri Oct 31, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 11 additions & 8 deletions chaoscenter/web/src/views/ChaosHub/ChaosFaults/ChaosFaults.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,14 @@ import { Icon } from '@harnessio/icons';
import { FontVariation, Color } from '@harnessio/design-system';
import { Link, useParams } from 'react-router-dom';
import { withErrorBoundary } from 'react-error-boundary';
import { toTitleCase } from '@utils';
import { toTitleCase, getScope } from '@utils';
import { useStrings } from '@strings';
import NoExperiments from '@images/NoExperiments.svg';
import { Fallback } from '@errors';
import Loader from '@components/Loader';
import { useSearchParams, useRouteWithBaseUrl } from '@hooks';
import type { ListFaultResponse } from '@api/core';
import config from '@config';
import css from './ChaosFaults.module.scss';

interface ChaosFaultsProps {
Expand Down Expand Up @@ -41,6 +42,7 @@ function ChaosFaults({ hubDetails, faultCategories, loading, searchValue }: Chao
const searchParams = useSearchParams();
const hubName = searchParams.get('hubName');
const isDefault = searchParams.get('isDefault');
const scope = getScope();
const tags: TagProps[] = [];
const faultsArray: Fault[] = [];
const [activeTag, setActiveTag] = React.useState<string>('All');
Expand Down Expand Up @@ -89,7 +91,6 @@ function ChaosFaults({ hubDetails, faultCategories, loading, searchValue }: Chao
};

const FaultCard = (fault: Fault): React.ReactElement => {
const isGcpFault = fault.tag.toLowerCase() === 'gcp';
return (
<Link
to={{
Expand All @@ -100,13 +101,15 @@ function ChaosFaults({ hubDetails, faultCategories, loading, searchValue }: Chao
<Card key={fault.name} interactive className={css.insideCard}>
<Layout.Vertical spacing="medium">
<Layout.Horizontal spacing="small">
{isGcpFault ? (
{fault.chartName.toLowerCase() === 'kubernetes' || fault.chartName.toLowerCase() === 'gcp' ? (
<img
src="https://hub.litmuschaos.io/api/icon/3.22.0/gcp/gcp-vm-instance-stop.png"
alt="GCP"
width={23}
height={23}
style={{ objectFit: 'contain' }}
src={
isDefault === 'true'
? `${config.restEndpoints?.chaosManagerUri}/icon/default/${hubName}/${fault.chartName}/${fault.name}.png`
: `${config.restEndpoints?.chaosManagerUri}/icon/${scope.projectID}/${hubName}/${fault.chartName}/${fault.name}.png`
}
alt={`${fault.name} icon`}
style={{ width: 23, height: 23, objectFit: 'contain' }}
/>
) : (
<Icon size={23} name="chaos-litmuschaos" />
Expand Down