|
|
@@ -1,11 +1,37 @@
|
|
|
-import React, { useContext } from 'react'
|
|
|
+import React, { useContext, useState } from 'react'
|
|
|
import styled from 'styled-components';
|
|
|
import Heading from 'components/values-form/Heading';
|
|
|
import Helper from "components/values-form/Helper";
|
|
|
+import InputRow from "components/values-form/InputRow";
|
|
|
import { Context } from 'shared/Context';
|
|
|
+import api from "shared/api";
|
|
|
|
|
|
-export const ClusterSettings = () => {
|
|
|
+const ClusterSettings: React.FC = () => {
|
|
|
const context = useContext(Context);
|
|
|
+ const [accessKeyId, setAccessKeyId] = useState<string>("");
|
|
|
+ const [secretKey, setSecretKey] = useState<string>("");
|
|
|
+ const [startRotateCreds, setStartRotateCreds] = useState<boolean>(false);
|
|
|
+ const [successfulRotate, setSuccessfulRotate] = useState<boolean>(false);
|
|
|
+
|
|
|
+ let rotateCredentials = () => {
|
|
|
+ api.overwriteAWSIntegration(
|
|
|
+ "<token>",
|
|
|
+ {
|
|
|
+ aws_access_key_id: accessKeyId,
|
|
|
+ aws_secret_access_key: secretKey
|
|
|
+ },
|
|
|
+ {
|
|
|
+ projectID: context.currentProject.id,
|
|
|
+ awsIntegrationID: context.currentCluster.aws_integration_id,
|
|
|
+ cluster_id: context.currentCluster.id,
|
|
|
+ }
|
|
|
+ ).then(({ data }) => {
|
|
|
+ setSuccessfulRotate(true)
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ setSuccessfulRotate(false)
|
|
|
+ })
|
|
|
+ }
|
|
|
|
|
|
let helperText = <Helper>
|
|
|
Delete this cluster and underlying infrastructure. To
|
|
|
@@ -29,9 +55,69 @@ export const ClusterSettings = () => {
|
|
|
</Helper>
|
|
|
}
|
|
|
|
|
|
+ let keyRotationSection = null
|
|
|
+
|
|
|
+ if (context.currentCluster?.aws_integration_id && context.currentCluster?.aws_integration_id != 0) {
|
|
|
+ if (successfulRotate) {
|
|
|
+ keyRotationSection = <div>
|
|
|
+ <Heading>Credential Rotation</Heading>
|
|
|
+ <Helper>
|
|
|
+ Successfully rotated credentials!
|
|
|
+ </Helper>
|
|
|
+ </div>
|
|
|
+ } else if (startRotateCreds) {
|
|
|
+ keyRotationSection = <div>
|
|
|
+ <Heading>Credential Rotation</Heading>
|
|
|
+ <Helper>
|
|
|
+ Input the new credentials for the EKS cluster.
|
|
|
+ </Helper>
|
|
|
+ <InputRow
|
|
|
+ type="text"
|
|
|
+ value={accessKeyId}
|
|
|
+ setValue={(x: string) => setAccessKeyId(x)}
|
|
|
+ label="👤 AWS Access ID"
|
|
|
+ placeholder="ex: AKIAIOSFODNN7EXAMPLE"
|
|
|
+ width="100%"
|
|
|
+ isRequired={true}
|
|
|
+ />
|
|
|
+ <InputRow
|
|
|
+ type="password"
|
|
|
+ value={secretKey}
|
|
|
+ setValue={(x: string) => setSecretKey(x)}
|
|
|
+ label="🔒 AWS Secret Key"
|
|
|
+ placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
|
|
|
+ width="100%"
|
|
|
+ isRequired={true}
|
|
|
+ />
|
|
|
+ <Button
|
|
|
+ color="#616FEEcc"
|
|
|
+ onClick={rotateCredentials}
|
|
|
+ >
|
|
|
+ Submit
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ } else {
|
|
|
+ keyRotationSection = <div>
|
|
|
+ <Heading>Credential Rotation</Heading>
|
|
|
+ <Helper>
|
|
|
+ Rotate the credentials that this cluster uses to connect to the cluster.
|
|
|
+ </Helper>
|
|
|
+ <Button
|
|
|
+ color="#616FEEcc"
|
|
|
+ onClick={() => setStartRotateCreds(true)}
|
|
|
+ >
|
|
|
+ Rotate Credentials
|
|
|
+ </Button>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
return (
|
|
|
<div>
|
|
|
<StyledSettingsSection showSource={false}>
|
|
|
+ {keyRotationSection}
|
|
|
<Heading>Delete Cluster</Heading>
|
|
|
{helperText}
|
|
|
<Button
|
|
|
@@ -45,6 +131,7 @@ export const ClusterSettings = () => {
|
|
|
)
|
|
|
}
|
|
|
|
|
|
+export default ClusterSettings
|
|
|
|
|
|
const StyledSettingsSection = styled.div<{ showSource: boolean }>`
|
|
|
margin-top: 35px;
|