Skip to content

Commit

Permalink
fixed cluster list issue in new env, clone env and new msvc (#336)
Browse files Browse the repository at this point in the history
  • Loading branch information
tulsiojha authored Nov 29, 2024
1 parent 56d3e74 commit 8671d55
Show file tree
Hide file tree
Showing 5 changed files with 105 additions and 77 deletions.
9 changes: 4 additions & 5 deletions src/apps/console/hooks/use-cluster-status-v3.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,8 @@ const ctx = createContext<{
}>({
// clusters: {},
// setClusters: () => {},
addToWatchList: () => {},
removeFromWatchList: () => {},
addToWatchList: () => { },
removeFromWatchList: () => { },
});

const ClusterStatusProvider = ({
Expand Down Expand Up @@ -167,7 +167,6 @@ export const useClusterStatusV3 = ({
}) => {
const cCtx = useOutletContext<IAccountContext>();

logger.trace('useClusterStatusV3', cCtx);
const { clustersMap } = cCtx || {};

const { addToWatchList, removeFromWatchList: _ } = useContext(ctx);
Expand All @@ -176,11 +175,11 @@ export const useClusterStatusV3 = ({
useDebounce(
() => {
if (isLoading) {
return () => {};
return () => { };
}

if (!clusterName && !clusterNames) {
return () => {};
return () => { };
}

if (clusterName) {
Expand Down
35 changes: 20 additions & 15 deletions src/apps/console/page-components/handle-environment.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import { NameIdView } from '../components/name-id-view';
import { IDialog } from '../components/types.d';
import { useConsoleApi } from '../server/gql/api-provider';
import { IEnvironment } from '../server/gql/queries/environment-queries';
import { parseName } from '../server/r-utils/common';
import { parseName, parseNodes } from '../server/r-utils/common';
import { DIALOG_TYPE } from '../utils/commons';
import { useClusterStatusV3 } from '../hooks/use-cluster-status-v3';

Expand Down Expand Up @@ -63,25 +63,30 @@ const HandleEnvironment = ({ show, setShow }: IDialog<IEnvironment | null>) => {

const getClusters = useCallback(async () => {
try {
const data = Object.values(clustersMap).map((cm) => {
if (cm == null) {
return {};
}
const { name, displayName, isOnline } = cm;
return {
label: displayName,
value: name,
ready: isOnline,
disabled: () => !isOnline,
const { data: cl, errors } = await api.listAllClusters({})
if (errors) {
throw errors[0]
}

const data = parseNodes(cl).map((c) => {
const n = parseName(c)
let cs = clustersMap[n]

return ({
label: c.displayName,
value: n,
ready: cs?.isOnline,
disabled: () => !cs?.isOnline,
render: ({ disabled }: { disabled: boolean }) => (
<ClusterSelectItem
label={displayName}
value={name}
label={c.displayName}
value={n}
disabled={disabled}
/>
),
};
});
})
})

setClusterList(data);
} catch (err) {
handleError(err);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { Trash } from '~/console/components/icons';
import { generateKey, titleCase } from '@kloudlite/design-system/utils';
import {
ListItem,
ListItemV2,
ListTitle,
} from '~/console/components/console-list-components';
import Grid from '~/console/components/grid';
Expand All @@ -28,6 +29,8 @@ import ListV2 from '~/console/components/listV2';
import { SyncStatusV2 } from '~/console/components/sync-status';
import { constants } from '~/console/server/utils/constants';
import { IEnvironmentContext } from '../../_layout';
import { useClusterStatusV3 } from '~/console/hooks/use-cluster-status-v3';
import { Badge } from '@kloudlite/design-system/atoms/badge';

const RESOURCE_NAME = 'helm chart';
type BaseType = ExtractNodeType<IHelmCharts>;
Expand Down Expand Up @@ -119,6 +122,12 @@ const GridView = ({ items = [], onAction }: IResource) => {
};

const ListView = ({ items = [], onAction }: IResource) => {
const { environment } = useOutletContext<IEnvironmentContext>();
const { clustersMap: clusterStatus } = useClusterStatusV3({
clusterName: environment.clusterName,
});


return (
<ListV2.Root
linkComponent={Link}
Expand Down Expand Up @@ -152,14 +161,34 @@ const ListView = ({ items = [], onAction }: IResource) => {
],
rows: items.map((i) => {
const { name, id, updateInfo } = parseItem(i);
const isClusterOnline =
!!clusterStatus[environment.clusterName]?.isOnline;

return {
columns: {
name: {
render: () => <ListTitle title={name} subtitle={id} />,
},

status: {
render: () => <SyncStatusV2 item={i} />,
render: () => {
if (environment.spec?.suspend) {
return null;
}

if (environment.clusterName === '') {
return <ListItemV2 className="px-4xl" data="-" />;
}

if (clusterStatus[environment.clusterName] === undefined) {
return null;
}

if (!isClusterOnline) {
return <Badge type="warning">Cluster Offline</Badge>;
}

return <SyncStatusV2 item={i} />;
},
},
updated: {
render: () => (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import { IDialogBase } from '~/console/components/types.d';
import { ClusterSelectItem } from '~/console/page-components/handle-environment';
import { useConsoleApi } from '~/console/server/gql/api-provider';
import { IEnvironments } from '~/console/server/gql/queries/environment-queries';
import { ExtractNodeType, parseName } from '~/console/server/r-utils/common';
import { ExtractNodeType, parseName, parseNodes } from '~/console/server/r-utils/common';
import { useReload } from '~/root/lib/client/helpers/reloader';
import useForm, { dummyEvent } from '~/root/lib/client/hooks/use-form';
import Yup from '~/root/lib/server/helpers/yup';
Expand All @@ -30,26 +30,29 @@ const Root = (props: IDialog) => {

const getClusters = useCallback(async () => {
try {
const data = Object.values(clustersMap).map((cm) => {
if (cm == null) {
return {};
}
const { data: cl, errors } = await api.listAllClusters({})
if (errors) {
throw errors[0]
}

const { name, displayName, isOnline } = cm;
return {
label: displayName,
value: name,
ready: isOnline,
disabled: () => !isOnline,
const data = parseNodes(cl).map((c) => {
const n = parseName(c)
let cs = clustersMap[n]
return ({
label: c.displayName,
value: n,
ready: cs?.isOnline,
disabled: () => !cs?.isOnline,
render: ({ disabled }: { disabled: boolean }) => (
<ClusterSelectItem
label={displayName}
value={name}
label={c.displayName}
value={n}
disabled={disabled}
/>
),
};
});
})
})

setClusterList(data);
} catch (err) {
handleError(err);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ import {
IMSvPlugin,
IMsvPlugins,
} from '~/console/server/gql/queries/managed-templates-queries';
import { parseName } from '~/console/server/r-utils/common';
import { parseName, parseNodes } from '~/console/server/r-utils/common';
import { keyconstants } from '~/console/server/r-utils/key-constants';
import { ensureAccountClientSide } from '~/console/server/utils/auth-utils';
import { flatM, flatMapValidations } from '~/console/utils/commons';
Expand Down Expand Up @@ -201,8 +201,8 @@ const RenderHelmFields = ({
Search for or enter the repo url
</div>
}
// error={!!errors[fieldKey]}
// message={errors[fieldKey]}
// error={!!errors[fieldKey]}
// message={errors[fieldKey]}
/>
);
case 'chart.name':
Expand Down Expand Up @@ -351,8 +351,7 @@ const RenderField = ({
onChange={({ target }) => {
onChange(`res.${field.input}`)(
dummyEvent(
`${parseFloat(target.value) * (field.multiplier || 1)}${
field.unit
`${parseFloat(target.value) * (field.multiplier || 1)}${field.unit
}`
)
);
Expand Down Expand Up @@ -397,9 +396,8 @@ const RenderField = ({
if (field.type === 'int-range') {
return (
<div className="flex flex-col gap-md">
<div className="bodyMd-medium text-text-default">{`${field.label}${
field.required ? ' *' : ''
}`}</div>
<div className="bodyMd-medium text-text-default">{`${field.label}${field.required ? ' *' : ''
}`}</div>
<div className="flex flex-row gap-xl items-center">
<div className="flex flex-row gap-xl items-end flex-1 ">
<div className="flex-1">
Expand All @@ -412,16 +410,14 @@ const RenderField = ({
onChange={({ target }) => {
onChange(`res.${field.input}.min`)(
dummyEvent(
`${parseFloat(target.value) * (field.multiplier || 1)}${
field.unit
`${parseFloat(target.value) * (field.multiplier || 1)}${field.unit
}`
)
);
if (qos) {
onChange(`res.${field.input}.max`)(
dummyEvent(
`${parseFloat(target.value) * (field.multiplier || 1)}${
field.unit
`${parseFloat(target.value) * (field.multiplier || 1)}${field.unit
}`
)
);
Expand All @@ -441,8 +437,7 @@ const RenderField = ({
onChange={({ target }) => {
onChange(`res.${field.input}.max`)(
dummyEvent(
`${parseFloat(target.value) * (field.multiplier || 1)}${
field.unit
`${parseFloat(target.value) * (field.multiplier || 1)}${field.unit
}`
)
);
Expand All @@ -459,9 +454,8 @@ const RenderField = ({
if (field.type === 'Resource') {
return (
<div className="flex flex-col gap-md">
<div className="bodyMd-medium text-text-default">{`${field.label}${
field.required ? ' *' : ''
}`}</div>
<div className="bodyMd-medium text-text-default">{`${field.label}${field.required ? ' *' : ''
}`}</div>
<div className="flex flex-row gap-xl items-center">
<div className="flex flex-row gap-xl items-end flex-1 ">
<div className="flex-1">
Expand All @@ -474,16 +468,14 @@ const RenderField = ({
onChange={({ target }) => {
onChange(`res.${field.input}.min`)(
dummyEvent(
`${parseFloat(target.value) * (field.multiplier || 1)}${
field.unit
`${parseFloat(target.value) * (field.multiplier || 1)}${field.unit
}`
)
);
if (qos) {
onChange(`res.${field.input}.max`)(
dummyEvent(
`${parseFloat(target.value) * (field.multiplier || 1)}${
field.unit
`${parseFloat(target.value) * (field.multiplier || 1)}${field.unit
}`
)
);
Expand All @@ -503,8 +495,7 @@ const RenderField = ({
onChange={({ target }) => {
onChange(`res.${field.input}.max`)(
dummyEvent(
`${parseFloat(target.value) * (field.multiplier || 1)}${
field.unit
`${parseFloat(target.value) * (field.multiplier || 1)}${field.unit
}`
)
);
Expand Down Expand Up @@ -716,7 +707,7 @@ const FieldView = ({
showclear
error={!!errors.clusterName}
message={errors.clusterName}
// loading={cIsLoading || byokCIsLoading}
// loading={cIsLoading || byokCIsLoading}
/>
{getRenderField()}

Expand Down Expand Up @@ -923,28 +914,29 @@ export const ManagedServiceLayoutV2 = () => {
const getClusters = useCallback(async () => {
ensureAccountClientSide(params);
try {
const data = Object.values(clustersMap).map((cm) => {
if (cm == null) {
return {};
}

const { name, displayName, isOnline } = cm;
const { data: cl, errors } = await api.listAllClusters({})
if (errors) {
throw errors[0]
}

return {
label: displayName,
value: name,
ready: isOnline,
disabled: () => !isOnline,
// eslint-disable-next-line react/no-unused-prop-types
const data = parseNodes(cl).map((c) => {
const n = parseName(c)
let cs = clustersMap[n]
return ({
label: c.displayName,
value: n,
ready: cs?.isOnline,
disabled: () => !cs?.isOnline,
render: ({ disabled }: { disabled: boolean }) => (
<ClusterSelectItem
label={displayName}
value={name}
label={c.displayName}
value={n}
disabled={disabled}
/>
),
};
});
})
})

setClusterList(data);
} catch (err) {
handleError(err);
Expand Down

0 comments on commit 8671d55

Please sign in to comment.