92 lines
3.3 KiB
JavaScript
92 lines
3.3 KiB
JavaScript
import React, { useState } from "react";
|
|
import styles from "./styles.module.css";
|
|
import CloseIcon from "@/app/components/icons/close";
|
|
import TextField from "@/app/components/fields/textfield";
|
|
import AddIcon from "@/app/components/icons/add";
|
|
import PrimaryButton from "@/app/components/buttons/primarybutton/PrimaryButton";
|
|
import SelectField from "@/app/components/select/SelectField";
|
|
import RadioButton from "@/app/components/radio-button/RadioButton";
|
|
const AddConfigMapModal = (props) => {
|
|
const [typeOption, setTypeOption] = useState("raw");
|
|
return (
|
|
<div className={styles.container}>
|
|
<div className={styles.modal}>
|
|
<div className={styles.header}>
|
|
<p>Config Maps</p>
|
|
<CloseIcon onClick={() => props.setTriggerAddConfigMap(false)} />
|
|
</div>
|
|
<div className={styles.contentContainer}>
|
|
<div>
|
|
<div className={styles.fieldContainer}>
|
|
<div className={styles.fields}>
|
|
<div className={styles.horizontalInput}>
|
|
<div>
|
|
<div>
|
|
<p>Sub Path</p>
|
|
<TextField placeHolder="Enter volume name" />
|
|
</div>
|
|
<div>
|
|
<p>Mount Path</p>
|
|
<TextField placeHolder="Enter path " />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className={styles.radioButtonsContainer}>
|
|
<div>
|
|
<p>Type</p>
|
|
<div>
|
|
<RadioButton
|
|
name="typeOption"
|
|
value="raw"
|
|
checked={typeOption === "raw"}
|
|
onChange={(e) => setTypeOption(e.target.value)}
|
|
label="Raw"
|
|
/>
|
|
<RadioButton
|
|
name="typeOption"
|
|
value="credential"
|
|
checked={typeOption === "credential"}
|
|
onChange={(e) => setTypeOption(e.target.value)}
|
|
label="Credential"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className={styles.verticalInput}>
|
|
<div>
|
|
<div>
|
|
<p>Value</p>
|
|
</div>
|
|
|
|
{typeOption === "raw" ? (
|
|
<textarea
|
|
name=""
|
|
id=""
|
|
placeholder="Enter a description"
|
|
></textarea>
|
|
) : (
|
|
<SelectField
|
|
label="Select"
|
|
options={[
|
|
{ label: "Option", value: "option" },
|
|
{ label: "Option 1", value: "option 1" },
|
|
{ label: "Option 2", value: "option 2" },
|
|
]}
|
|
/>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className={styles.addButtonContainer}>
|
|
<PrimaryButton text=" Add " icon={<AddIcon />} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
export default AddConfigMapModal;
|