Validations added temporarily
This commit is contained in:
@@ -19,6 +19,13 @@ const AddServices = () => {
|
||||
const [disableScaling, setDisableScaling] = useState(true);
|
||||
const [disableReadiness, setDisableReadiness] = useState(true);
|
||||
const [disableLiveness, setDisableLiveness] = useState(true);
|
||||
const [minPods, setMinPods] = useState("");
|
||||
const [maxPods, setMaxPods] = useState("");
|
||||
const [readinessPath, setReadinessPath] = useState("");
|
||||
const [readinessPort, setReadinessPort] = useState("");
|
||||
const [livenessPath, setLivenessPath] = useState("");
|
||||
const [livenessPort, setLivenessPort] = useState("");
|
||||
|
||||
return (
|
||||
<div className={globalStyle.section}>
|
||||
{triggerAddVariable && (
|
||||
@@ -40,7 +47,7 @@ const AddServices = () => {
|
||||
requiredButtons={["title", "save"]}
|
||||
/>
|
||||
<div className={styles.contentContainer}>
|
||||
<div className={styles.fieldsContainerCreateNew}>
|
||||
<form className={styles.fieldsContainerCreateNew} id="form">
|
||||
<div className={styles.projectDetails}>
|
||||
<div className={styles.projectDetailsHeader}>
|
||||
<p>Project Details</p>
|
||||
@@ -59,11 +66,11 @@ const AddServices = () => {
|
||||
<div>
|
||||
<div>
|
||||
<p>Name</p>
|
||||
<TextField placeHolder="Enter service name" />
|
||||
<TextField placeHolder="Enter service name" required />
|
||||
</div>
|
||||
<div>
|
||||
<p>Version</p>
|
||||
<TextField placeHolder="Service version" />
|
||||
<TextField placeHolder="Service version" required />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
@@ -71,13 +78,13 @@ const AddServices = () => {
|
||||
<p>
|
||||
Image <span>(Optional)</span>
|
||||
</p>
|
||||
<TextField placeHolder="Enter image name" />
|
||||
<TextField placeHolder="Enter image name" required />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<p>Port</p>
|
||||
<TextField placeHolder="Enter port" />
|
||||
<TextField placeHolder="Enter port" required />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
@@ -114,21 +121,21 @@ const AddServices = () => {
|
||||
<div>
|
||||
<div>
|
||||
<p>CPU Request (MB)</p>
|
||||
<TextField placeHolder="250" />
|
||||
<TextField placeHolder="250" required />
|
||||
</div>
|
||||
<div>
|
||||
<p>CPU Limit (MB)</p>
|
||||
<TextField placeHolder="250" />
|
||||
<TextField placeHolder="250" required />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
<p>Memory Request (MB)</p>
|
||||
<TextField placeHolder="250" />
|
||||
<TextField placeHolder="250" required />
|
||||
</div>
|
||||
<div>
|
||||
<p>Memory Limit (MB)</p>
|
||||
<TextField placeHolder="500" />
|
||||
<TextField placeHolder="500" required />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -141,7 +148,11 @@ const AddServices = () => {
|
||||
<p>Auto Scaling</p>
|
||||
<CustomCheckbox
|
||||
id="scalingCheckBox"
|
||||
setChecked={() => setDisableScaling(!disableScaling)}
|
||||
setChecked={() => {
|
||||
setDisableScaling(!disableScaling);
|
||||
setMinPods("");
|
||||
setMaxPods("");
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -154,12 +165,18 @@ const AddServices = () => {
|
||||
<TextField
|
||||
placeHolder="1"
|
||||
disabled={disableScaling}
|
||||
required={maxPods.trim() !== ""}
|
||||
onChange={(e) => setMinPods(e.target.value)}
|
||||
value={minPods}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p>Maximum pods</p>
|
||||
<TextField
|
||||
placeHolder="1"
|
||||
value={maxPods}
|
||||
required={minPods.trim() !== ""}
|
||||
onChange={(e) => setMaxPods(e.target.value)}
|
||||
disabled={disableScaling}
|
||||
/>
|
||||
</div>
|
||||
@@ -175,9 +192,11 @@ const AddServices = () => {
|
||||
<p>Readiness</p>
|
||||
<CustomCheckbox
|
||||
id="readiNessCheckBox"
|
||||
setChecked={() =>
|
||||
setDisableReadiness(!disableReadiness)
|
||||
}
|
||||
setChecked={() => {
|
||||
setDisableReadiness(!disableReadiness);
|
||||
setReadinessPath("");
|
||||
setReadinessPort("");
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -190,6 +209,9 @@ const AddServices = () => {
|
||||
<TextField
|
||||
placeHolder="Enter Readiness path"
|
||||
disabled={disableReadiness}
|
||||
value={readinessPath}
|
||||
required={readinessPort.trim() !== ""}
|
||||
onChange={(e) => setReadinessPath(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
@@ -197,6 +219,9 @@ const AddServices = () => {
|
||||
<TextField
|
||||
placeHolder="Enter Readiness port"
|
||||
disabled={disableReadiness}
|
||||
value={readinessPort}
|
||||
required={readinessPath.trim() !== ""}
|
||||
onChange={(e) => setReadinessPort(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -214,6 +239,8 @@ const AddServices = () => {
|
||||
setChecked={() => {
|
||||
console.log("alsdjhfkjas");
|
||||
setDisableLiveness(!disableLiveness);
|
||||
setLivenessPath("");
|
||||
setLivenessPort("");
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@@ -226,14 +253,19 @@ const AddServices = () => {
|
||||
<TextField
|
||||
placeHolder="Enter liveness path"
|
||||
disabled={disableLiveness}
|
||||
value={livenessPath}
|
||||
required={livenessPort.trim() !== ""}
|
||||
onChange={(e) => setLivenessPath(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p>Liveness Port</p>
|
||||
|
||||
<TextField
|
||||
placeHolder="Enter liveness port"
|
||||
disabled={disableLiveness}
|
||||
value={livenessPort}
|
||||
required={livenessPath.trim() !== ""}
|
||||
onChange={(e) => setLivenessPort(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -242,7 +274,7 @@ const AddServices = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div className={variableStyles.variables}>
|
||||
<div className={variableStyles.variablesHeader}>
|
||||
<div>
|
||||
|
||||
@@ -65,7 +65,7 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
gap: 8px;
|
||||
align-self: stretch;
|
||||
}
|
||||
.fieldsCreateNew > div:nth-child(1) {
|
||||
@@ -98,30 +98,7 @@
|
||||
.resourceFields > div > div p > span {
|
||||
color: #85869b;
|
||||
}
|
||||
.fieldsCreateNew > div > div input,
|
||||
.fieldsCreateNew > div > div select,
|
||||
.resourceFields > div > div input,
|
||||
.resourceFields > div > div select {
|
||||
display: flex;
|
||||
padding: 12px;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
align-self: stretch;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #4b4f6d;
|
||||
background-color: transparent;
|
||||
color: white;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
letter-spacing: 0.16px;
|
||||
}
|
||||
.fieldsCreateNew > div > div input::placeholder,
|
||||
.resourceFields > div > div input::placeholder {
|
||||
color: #85869b;
|
||||
}
|
||||
|
||||
.repositoryForm {
|
||||
display: flex;
|
||||
padding: 12px;
|
||||
|
||||
Reference in New Issue
Block a user