Skip to content

Commit

Permalink
update msvc page
Browse files Browse the repository at this point in the history
  • Loading branch information
nxtCoder19 committed Nov 28, 2024
1 parent af58d52 commit 75bb6d0
Show file tree
Hide file tree
Showing 17 changed files with 2,050 additions and 151 deletions.
3 changes: 2 additions & 1 deletion fake-data-generator/gen.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,8 @@ const types: string[] = [
'ConsoleListRegistryImagesQuery',
'ConsoleListImagePullSecretsQuery',
'ConsoleListHelmChartsQuery',
'ConsoleListServiceBindingQuery'
'ConsoleListServiceBindingQuery',
'ConsoleListMSvPluginsQuery',
];

async function fake(files: string[], types: string[] = []) {
Expand Down
69 changes: 69 additions & 0 deletions gql-queries-generator/doc/queries.graphql
Original file line number Diff line number Diff line change
Expand Up @@ -3402,6 +3402,75 @@ query consoleListMSvTemplates {
}
}

query consoleGetMSvPlugin($category: String!, $name: String!) {
core_getManagedServicePlugin(category: $category, name: $name) {
meta {
logo
}
plugin
spec {
apiVersion
services {
active
description
inputs {
defaultValue
displayUnit
input
label
max
min
multiplier
required
type
unit
}
kind
resources {
description
kind
}
}
}
}
}

query consoleListMSvPlugins {
core_listManagedServicePlugins {
category
items {
meta {
logo
}
plugin
spec {
apiVersion
services {
active
description
inputs {
defaultValue
displayUnit
input
label
max
min
multiplier
required
type
unit
}
kind
resources {
description
kind
}
}
}
}
}
}

query consoleGetManagedResource($name: String!, $msvcName: String, $envName: String) {
core_getManagedResource(name: $name, msvcName: $msvcName, envName: $envName) {
accountName
Expand Down
23 changes: 19 additions & 4 deletions src/apps/console/routes/_main+/$account+/_layout.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import Popup from '@kloudlite/design-system/molecule/popup';
import { redirect } from '@remix-run/node';
import {
Link,
Expand All @@ -9,7 +10,6 @@ import {
useParams,
} from '@remix-run/react';
import { ReactNode, useEffect, useRef, useState } from 'react';
import Popup from '@kloudlite/design-system/molecule/popup';
import {
Buildings,
Check,
Expand All @@ -33,7 +33,11 @@ import { cn } from '@kloudlite/design-system/utils';
import MenuSelect, { SelectItem } from '~/console/components/menu-select';
import ClusterStatusProvider from '~/console/hooks/use-cluster-status-v3';
import { useConsoleApi } from '~/console/server/gql/api-provider';
import { IMSvTemplates } from '~/console/server/gql/queries/managed-templates-queries';
import { clustersStatusMap } from '~/console/server/gql/queries/cluster-queries';
import {
IMsvPlugins,
IMSvTemplates,
} from '~/console/server/gql/queries/managed-templates-queries';
import { GQLServerHandler } from '~/console/server/gql/saved-queries';
import {
ensureAccountClientSide,
Expand All @@ -47,7 +51,6 @@ import withContext from '~/root/lib/app-setup/with-contxt';
import { useSearch } from '~/root/lib/client/helpers/search-filter';
import useCustomSwr from '~/root/lib/client/hooks/use-custom-swr';
import { handleError } from '~/root/lib/utils/common';
import { clustersStatusMap } from '~/console/server/gql/queries/cluster-queries';
import { IConsoleRootContext } from '../_layout/_layout';

export const loader = async (ctx: IExtRemixCtx) => {
Expand All @@ -70,6 +73,13 @@ export const loader = async (ctx: IExtRemixCtx) => {
throw msvError[0];
}

const { data: msvPlugins, errors: msvPluginError } = await GQLServerHandler(
ctx.request
).listMSvPlugins({});
if (msvPluginError) {
throw msvPluginError[0];
}

const { data: clusterList, errors: clusterError } = await GQLServerHandler(
ctx.request
).listClusterStatus({
Expand All @@ -92,6 +102,7 @@ export const loader = async (ctx: IExtRemixCtx) => {

return withContext(ctx, {
msvtemplates: msvTemplates,
msvPlugins,
account: data,
clustersMap: clusterList,
});
Expand All @@ -101,6 +112,7 @@ export const loader = async (ctx: IExtRemixCtx) => {
return k as {
account: typeof acccountData;
msvtemplates: IMSvTemplates;
msvPlugins: IMsvPlugins;
clustersMap: clustersStatusMap;
};
}
Expand Down Expand Up @@ -179,7 +191,8 @@ const _AccountMenu = ({ account }: { account: IAccount }) => {
};

const Account = () => {
const { account, msvtemplates, clustersMap } = useLoaderData<typeof loader>();
const { account, msvtemplates, msvPlugins, clustersMap } =
useLoaderData<typeof loader>();
const rootContext = useOutletContext<IConsoleRootContext>();
const { unloadState, reset, proceed } = useUnsavedChanges();

Expand All @@ -201,6 +214,7 @@ const Account = () => {
...rootContext,
account,
msvtemplates,
msvPlugins,
clustersMap: cm,
setclustersMap: setCm,
}}
Expand Down Expand Up @@ -520,6 +534,7 @@ export const handle = ({ account }: any) => {
export interface IAccountContext extends IConsoleRootContext {
account: LoaderResult<typeof loader>['account'];
msvtemplates: IMSvTemplates;
msvPlugins: IMsvPlugins;
clustersMap: clustersStatusMap;
setClustersMap: React.Dispatch<React.SetStateAction<clustersStatusMap>>;
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,49 +1,70 @@
import { createContext, ReactNode, useContext, useEffect, useState } from "react";
import { HelmChartIn } from "~/root/src/generated/gql/server";
import {
createContext,
ReactNode,
useContext,
useEffect,
useState,
} from 'react';
import { HelmChartIn } from '~/root/src/generated/gql/server';

const HelmChartContext = createContext<{
helmChart: HelmChartIn,
readOnlyHelmChart: HelmChartIn,
setHelmChart: (helmChart: HelmChartIn) => void
setReadOnlyHelmChart: (helmChart: HelmChartIn) => void
helmChart: HelmChartIn;
readOnlyHelmChart: HelmChartIn;
setHelmChart: (helmChart: HelmChartIn) => void;
setReadOnlyHelmChart: (helmChart: HelmChartIn) => void;
}>({
helmChart: {
displayName: ""
}, readOnlyHelmChart: {
displayName: ""
}, setHelmChart: () => { }, setReadOnlyHelmChart() {

displayName: '',
},
readOnlyHelmChart: {
displayName: '',
},
})
setHelmChart: () => {},
setReadOnlyHelmChart() {},
});

const HelmChartContextProvider = ({ initialHelmChartState, children }: {
initialHelmChartState:
HelmChartIn, children?: ReactNode
const HelmChartContextProvider = ({
initialHelmChartState,
children,
}: {
initialHelmChartState: HelmChartIn;
children?: ReactNode;
}) => {
const [helmChart, setHelmChart] = useState<HelmChartIn>(initialHelmChartState)
const [readOnlyHelmChart, setReadOnlyHelmChart] = useState(initialHelmChartState)
const [helmChart, setHelmChart] = useState<HelmChartIn>(
initialHelmChartState
);
const [readOnlyHelmChart, setReadOnlyHelmChart] = useState(
initialHelmChartState
);

useEffect(() => {
setHelmChart(initialHelmChartState)
setReadOnlyHelmChart(initialHelmChartState)
setHelmChart(initialHelmChartState);
setReadOnlyHelmChart(initialHelmChartState);

console.log("put...pp")
}, [initialHelmChartState])
console.log('put...pp');
}, [initialHelmChartState]);

const putHelmChart = (h: HelmChartIn) => {
setHelmChart(h)
console.log("put")
}
setHelmChart(h);
console.log('put');
};

return <HelmChartContext.Provider value={{
helmChart, readOnlyHelmChart,
setHelmChart: putHelmChart,
setReadOnlyHelmChart
}}>{children}</HelmChartContext.Provider>
}
return (
<HelmChartContext.Provider
value={{
helmChart,
readOnlyHelmChart,
setHelmChart: putHelmChart,
setReadOnlyHelmChart,
}}
>
{children}
</HelmChartContext.Provider>
);
};

export const useHelmChartState = () => {
return useContext(HelmChartContext)
}
return useContext(HelmChartContext);
};

export default HelmChartContextProvider
export default HelmChartContextProvider;
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
/* eslint-disable react/destructuring-assignment */
import { TextInput } from '@kloudlite/design-system/atoms/input';
import Popup from '@kloudlite/design-system/molecule/popup';
import { useOutletContext } from '@remix-run/react';
import yaml from 'js-yaml';
import { IDialogBase } from '~/console/components/types.d';
import { useConsoleApi } from '~/console/server/gql/api-provider';
import { IHelmCharts } from '~/console/server/gql/queries/helm-chart-queries';
Expand All @@ -9,19 +11,17 @@ 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';
import { handleError } from '~/root/lib/utils/common';
import yaml from 'js-yaml';
import { useOutletContext } from '@remix-run/react';

import { useEffect, useRef, useState } from 'react';
import Select from '@kloudlite/design-system/atoms/select';
import { useEffect, useRef, useState } from 'react';
import { NameIdView } from '~/console/components/name-id-view';

import ExtendedFilledTab from '~/console/components/extended-filled-tab';
import { keyconstants } from '~/console/server/r-utils/key-constants';

import { IEnvironmentContext } from '../../_layout';
import CodeEditorClient from '~/root/lib/client/components/editor-client';
import { LoadingPlaceHolder } from '~/console/components/loading';
import CodeEditorClient from '~/root/lib/client/components/editor-client';
import { IEnvironmentContext } from '../../_layout';
import useFetchHelmCharts from './helm-utils/use-fetch-helmcharts';
import useFetchHelmValue from './helm-utils/use-fetch-helmvalues';

Expand All @@ -38,7 +38,7 @@ type IHelmDoc = {
const filterUniqueVersions = (versions: IHelmDoc['entries']['keys']) => {
return versions.filter(
(obj, index, self) =>
index === self.findIndex((t) => t.version === obj.version),
index === self.findIndex((t) => t.version === obj.version)
);
};

Expand Down Expand Up @@ -167,8 +167,8 @@ const Root = (props: IDialog) => {
setChartVersions(
filterUniqueVersions(
helmCharts.find((v) => v.value === props.data.spec?.chartName)
?.item || [],
),
?.item || []
)
);
setChartName({
label: props.data.spec?.chartName || '',
Expand Down Expand Up @@ -215,7 +215,7 @@ const Root = (props: IDialog) => {
errors={errors.name}
handleChange={handleChange}
nameErrorLabel="isNameError"
isUpdate={true}
isUpdate
/>

<TextInput
Expand Down Expand Up @@ -281,7 +281,7 @@ const Root = (props: IDialog) => {
}
lang="yaml"
onChange={(e) => {
const path = editorRef.current.getModel().uri.path;
const { path } = editorRef.current.getModel().uri;

if (
values.activeTab === 'values' &&
Expand Down
Loading

0 comments on commit 75bb6d0

Please sign in to comment.