fix(nodepool): adds stateful field in nodepool

kloudlite · Mar 2, 2024 · 8da3775 · 8da3775
1 parent b75c8d6
commit 8da3775
Show file tree

Hide file tree

Showing 5 changed files with 97 additions and 63 deletions.
diff --git a/gql-queries-generator/doc/queries.graphql b/gql-queries-generator/doc/queries.graphql
@@ -564,6 +564,7 @@ query consoleGetNodePool($clusterName: String!, $poolName: String!) {
     }
     creationTime
     displayName
+    stateful
     kind
     lastUpdatedBy {
       userEmail
@@ -663,6 +664,7 @@ query consoleListNodePools($clusterName: String!, $search: SearchNodepool, $pagi
         }
         creationTime
         displayName
+        stateful
         lastUpdatedBy {
           userEmail
           userId

diff --git a/src/apps/console/routes/_main+/$account+/infra+/$cluster+/nodepools/handle-nodepool.tsx b/src/apps/console/routes/_main+/$account+/infra+/$cluster+/nodepools/handle-nodepool.tsx
@@ -1,7 +1,7 @@
 /* eslint-disable react/destructuring-assignment */
 import { useMemo } from 'react';
 import { toast } from 'react-toastify';
-import { NumberInput } from '~/components/atoms/input';
+import {NumberInput, TextInput} from '~/components/atoms/input';
 import Select from '~/components/atoms/select';
 import Popup from '~/components/molecule/popup';
 import { useConsoleApi } from '~/console/server/gql/api-provider';
@@ -53,6 +53,7 @@ const Root = (props: IDialog) => {
             taints: [],
             autoScale: props.data.spec.minCount !== props.data.spec.maxCount,
             isNameError: false,
+            stateful: props.data.stateful || false
           }
         : {
             nvidiaGpuEnabled: false,
@@ -72,6 +73,7 @@ const Root = (props: IDialog) => {
             labels: [],
             taints: [],
             isNameError: false,
+            stateful: false
           },
       validationSchema: Yup.object({
         name: Yup.string().required('id is required'),
@@ -155,6 +157,7 @@ const Root = (props: IDialog) => {
                   cloudProvider: 'aws',
                   ...getNodeConf(),
                 },
+                stateful: val.stateful || false
               },
             });
             if (e) {
@@ -174,6 +177,7 @@ const Root = (props: IDialog) => {
                   minCount: Number.parseInt(val.minimum, 10),
                   ...getNodeConf(),
                 },
+                stateful: val.stateful || false
               },
             });
             if (e) {
@@ -217,79 +221,98 @@ const Root = (props: IDialog) => {
           />
 
           {cloudProvider === 'aws' && (
-            <>
-              <Select
-                label="Provision Mode"
-                // eslint-disable-next-line react-hooks/rules-of-hooks
-                value={values.poolType}
-                options={async () => provisionTypes}
-                onChange={(_, value) => {
-                  handleChange('poolType')(dummyEvent(value));
-                }}
-              />
+              <>
+                <Select
+                    label="Provision Mode"
+                    // eslint-disable-next-line react-hooks/rules-of-hooks
+                    value={values.poolType}
+                    options={async () => provisionTypes}
+                    onChange={(_, value) => {
+                      handleChange('poolType')(dummyEvent(value));
+                    }}
+                />
+
+                <Select
+                    label="Availability Zone"
+                    value={values.awsAvailabilityZone}
+                    options={async () =>
+                        mapper(
+                            awsRegions.find((v) => v.Name === clusterRegion)?.Zones ||
+                            [],
+                            (v) => ({
+                              value: v,
+                              label: v,
+                            })
+                        )
+                    }
+                    onChange={(_, v) => {
+                      handleChange('awsAvailabilityZone')(dummyEvent(v));
+                    }}
+                />
 
-              <Select
-                label="Availability Zone"
-                value={values.awsAvailabilityZone}
-                options={async () =>
-                  mapper(
-                    awsRegions.find((v) => v.Name === clusterRegion)?.Zones ||
-                      [],
-                    (v) => ({
-                      value: v,
-                      label: v,
-                    })
-                  )
-                }
-                onChange={(_, v) => {
-                  handleChange('awsAvailabilityZone')(dummyEvent(v));
-                }}
-              />
+                <div className="flex flex-row gap-xl items-end">
+                  <div className="flex flex-row gap-xl items-end flex-1">
+                    <div className="flex-1">
+                      <Select
+                        // eslint-disable-next-line react-hooks/rules-of-hooks
+                        value={useMemo(() => {
+                          const plan = findNodePlan(values.instanceType);
+                          return plan?.value;
+                        }, [values.instanceType])}
+                        label="Node plan"
+                        options={async () => nodePlans}
+                        onChange={(value) => {
+                          handleChange('instanceType')(dummyEvent(value.value));
+                          handleChange('nvidiaGpuEnabled')(
+                            dummyEvent(!!value.gpuEnabled)
+                          );
+                        }}
+                      />
+                    </div>
+                  </div>
 
-              <Select
-                // eslint-disable-next-line react-hooks/rules-of-hooks
-                value={useMemo(() => {
-                  const plan = findNodePlan(values.instanceType);
-                  return plan?.value;
-                }, [values.instanceType])}
-                label="Node plan"
-                options={async () => nodePlans}
-                onChange={(value) => {
-                  handleChange('instanceType')(dummyEvent(value.value));
-                  handleChange('nvidiaGpuEnabled')(
-                    dummyEvent(!!value.gpuEnabled)
-                  );
-                }}
-              />
-            </>
+                  <div className="flex flex-col gap-md ">
+                    <div className="bodyMd-medium text-text-default">Stateful</div>
+                    <div className="flex items-center h-6xl">
+                      <Switch
+                          label=""
+                          checked={values.stateful}
+                          onChange={(val) => {
+                            handleChange('stateful')(dummyEvent(val));
+                          }}
+                      />
+                    </div>
+                  </div>
+                </div>
+              </>
           )}
 
           <div className="flex flex-row gap-xl items-end">
             <div className="flex flex-row gap-xl items-end flex-1 ">
               <div className="flex-1">
                 <NumberInput
-                  label={values.autoScale ? 'Min Node Count' : `Node Count`}
-                  placeholder="Minimum"
-                  value={values.minimum}
-                  error={!!errors.minimum}
-                  message={errors.minimum}
-                  onChange={(e) => {
-                    handleChange('minimum')(e);
-                    if (!values.autoScale) {
-                      handleChange('maximum')(e);
-                    }
-                  }}
+                    label={values.autoScale ? 'Min Node Count' : `Node Count`}
+                    placeholder="Minimum"
+                    value={values.minimum}
+                    error={!!errors.minimum}
+                    message={errors.minimum}
+                    onChange={(e) => {
+                      handleChange('minimum')(e);
+                      if (!values.autoScale) {
+                        handleChange('maximum')(e);
+                      }
+                    }}
                 />
               </div>
               {values.autoScale && (
-                <div className="flex-1">
-                  <NumberInput
-                    error={!!errors.maximum}
-                    message={errors.maximum}
-                    label="Max Node Count"
-                    placeholder="Maximum"
-                    value={values.maximum}
-                    onChange={handleChange('maximum')}
+                  <div className="flex-1">
+                    <NumberInput
+                        error={!!errors.maximum}
+                        message={errors.maximum}
+                        label="Max Node Count"
+                        placeholder="Maximum"
+                        value={values.maximum}
+                        onChange={handleChange('maximum')}
                   />
                 </div>
               )}

diff --git a/src/apps/console/server/gql/queries/nodepool-queries.ts b/src/apps/console/server/gql/queries/nodepool-queries.ts
@@ -29,6 +29,7 @@ export const nodepoolQueries = (executor: IExecutor) => ({
           }
           creationTime
           displayName
+          stateful
           kind
           lastUpdatedBy {
             userEmail
@@ -157,6 +158,7 @@ export const nodepoolQueries = (executor: IExecutor) => ({
               }
               creationTime
               displayName
+              stateful
               lastUpdatedBy {
                 userEmail
                 userId

diff --git a/src/generated/gql/sdl.graphql b/src/generated/gql/sdl.graphql
@@ -3020,6 +3020,7 @@ type NodePool {
   metadata: Metadata
   recordVersion: Int!
   spec: Github__com___kloudlite___operator___apis___clusters___v1__NodePoolSpec!
+  stateful: Boolean!
   status: Github__com___kloudlite___operator___pkg___operator__Status
   syncStatus: Github__com___kloudlite___api___pkg___types__SyncStatus!
   updateTime: Date!
@@ -3036,6 +3037,7 @@ input NodePoolIn {
   kind: String
   metadata: MetadataIn
   spec: Github__com___kloudlite___operator___apis___clusters___v1__NodePoolSpecIn!
+  stateful: Boolean!
 }
 
 type NodePoolPaginatedRecords {
@@ -3475,6 +3477,7 @@ input SearchNamespaces {
 }
 
 input SearchNodepool {
+  isStateful: MatchFilterIn
   text: MatchFilterIn
 }
 

diff --git a/src/generated/gql/server.ts b/src/generated/gql/server.ts
@@ -318,6 +318,7 @@ export type SearchNamespaces = {
 };
 
 export type SearchNodepool = {
+  isStateful?: InputMaybe<MatchFilterIn>;
   text?: InputMaybe<MatchFilterIn>;
 };
 
@@ -961,6 +962,7 @@ export type NodePoolIn = {
   kind?: InputMaybe<Scalars['String']['input']>;
   metadata?: InputMaybe<MetadataIn>;
   spec: Github__Com___Kloudlite___Operator___Apis___Clusters___V1__NodePoolSpecIn;
+  stateful: Scalars['Boolean']['input'];
 };
 
 export type Github__Com___Kloudlite___Operator___Apis___Clusters___V1__NodePoolSpecIn =
@@ -2014,6 +2016,7 @@ export type ConsoleGetNodePoolQuery = {
     clusterName: string;
     creationTime: any;
     displayName: string;
+    stateful: boolean;
     kind?: string;
     markedForDeletion?: boolean;
     updateTime: any;
@@ -2101,6 +2104,7 @@ export type ConsoleListNodePoolsQuery = {
         clusterName: string;
         creationTime: any;
         displayName: string;
+        stateful: boolean;
         markedForDeletion?: boolean;
         recordVersion: number;
         updateTime: any;