encryption
This commit is contained in:
@@ -74,20 +74,20 @@ const validationMessage = (warningValidation: string, isWarning: boolean) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export type EncryptionFormValues = {
|
export type EncryptionFormValues = {
|
||||||
enabled: boolean;
|
enabled?: boolean;
|
||||||
serve_plain_dns: boolean;
|
serve_plain_dns?: boolean;
|
||||||
server_name: string;
|
server_name?: string;
|
||||||
force_https: boolean;
|
force_https?: boolean;
|
||||||
port_https: number;
|
port_https?: number;
|
||||||
port_dns_over_tls: number;
|
port_dns_over_tls?: number;
|
||||||
port_dns_over_quic: number;
|
port_dns_over_quic?: number;
|
||||||
certificate_chain: string;
|
certificate_chain?: string;
|
||||||
private_key: string;
|
private_key?: string;
|
||||||
certificate_path: string;
|
certificate_path?: string;
|
||||||
private_key_path: string;
|
private_key_path?: string;
|
||||||
certificate_source: string;
|
certificate_source?: string;
|
||||||
key_source: string;
|
key_source?: string;
|
||||||
private_key_saved: boolean;
|
private_key_saved?: boolean;
|
||||||
};
|
};
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
@@ -173,11 +173,11 @@ export const Form = ({
|
|||||||
serve_plain_dns: servePlainDns,
|
serve_plain_dns: servePlainDns,
|
||||||
certificate_chain: certificateChain,
|
certificate_chain: certificateChain,
|
||||||
private_key: privateKey,
|
private_key: privateKey,
|
||||||
certificate_path: certificatePath,
|
|
||||||
private_key_path: privateKeyPath,
|
private_key_path: privateKeyPath,
|
||||||
certificate_source: certificateSource,
|
|
||||||
private_key_saved: privateKeySaved,
|
|
||||||
key_source: privateKeySource,
|
key_source: privateKeySource,
|
||||||
|
private_key_saved: privateKeySaved,
|
||||||
|
certificate_path: certificatePath,
|
||||||
|
certificate_source: certificateSource,
|
||||||
} = watchedValues;
|
} = watchedValues;
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -185,7 +185,6 @@ export const Form = ({
|
|||||||
|
|
||||||
if (JSON.stringify(previousValues) !== JSON.stringify(watchedValues)) {
|
if (JSON.stringify(previousValues) !== JSON.stringify(watchedValues)) {
|
||||||
// TODO(ik) onChange TLS config validation
|
// TODO(ik) onChange TLS config validation
|
||||||
console.log('debouncedConfigValidation');
|
|
||||||
previousValuesRef.current = watchedValues;
|
previousValuesRef.current = watchedValues;
|
||||||
}
|
}
|
||||||
}, [watchedValues]);
|
}, [watchedValues]);
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import React, { useEffect, useCallback } from 'react';
|
import React, { useEffect, useCallback, useMemo } from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { debounce } from 'lodash';
|
import { debounce } from 'lodash';
|
||||||
import { DEBOUNCE_TIMEOUT, ENCRYPTION_SOURCE } from '../../../helpers/constants';
|
import { DEBOUNCE_TIMEOUT, ENCRYPTION_SOURCE } from '../../../helpers/constants';
|
||||||
@@ -24,17 +24,17 @@ export const Encryption = ({ encryption, setTlsConfig, validateTlsConfig }: Prop
|
|||||||
}
|
}
|
||||||
}, [encryption, validateTlsConfig]);
|
}, [encryption, validateTlsConfig]);
|
||||||
|
|
||||||
const getInitialValues = useCallback((data: any): EncryptionFormValues => {
|
const initialValues = useMemo((): EncryptionFormValues => {
|
||||||
const { certificate_chain, private_key, private_key_saved } = data;
|
const { certificate_chain, private_key, private_key_saved } = encryption;
|
||||||
const certificate_source = certificate_chain ? ENCRYPTION_SOURCE.CONTENT : ENCRYPTION_SOURCE.PATH;
|
const certificate_source = certificate_chain ? ENCRYPTION_SOURCE.CONTENT : ENCRYPTION_SOURCE.PATH;
|
||||||
const key_source = private_key || private_key_saved ? ENCRYPTION_SOURCE.CONTENT : ENCRYPTION_SOURCE.PATH;
|
const key_source = private_key || private_key_saved ? ENCRYPTION_SOURCE.CONTENT : ENCRYPTION_SOURCE.PATH;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...data,
|
...encryption,
|
||||||
certificate_source,
|
certificate_source,
|
||||||
key_source,
|
key_source,
|
||||||
};
|
};
|
||||||
}, []);
|
}, [encryption]);
|
||||||
|
|
||||||
const getSubmitValues = useCallback((values: any) => {
|
const getSubmitValues = useCallback((values: any) => {
|
||||||
const { certificate_source, key_source, private_key_saved, ...config } = values;
|
const { certificate_source, key_source, private_key_saved, ...config } = values;
|
||||||
@@ -67,18 +67,15 @@ export const Encryption = ({ encryption, setTlsConfig, validateTlsConfig }: Prop
|
|||||||
[getSubmitValues, setTlsConfig],
|
[getSubmitValues, setTlsConfig],
|
||||||
);
|
);
|
||||||
|
|
||||||
const debouncedConfigValidation = useCallback(
|
const validateConfig = useCallback((values) => {
|
||||||
debounce((values) => {
|
const submitValues = getSubmitValues(values);
|
||||||
const submitValues = getSubmitValues(values);
|
|
||||||
|
|
||||||
if (submitValues.enabled) {
|
if (submitValues.enabled) {
|
||||||
validateTlsConfig(submitValues);
|
validateTlsConfig(submitValues);
|
||||||
}
|
}
|
||||||
}, DEBOUNCE_TIMEOUT),
|
}, []);
|
||||||
[],
|
|
||||||
);
|
|
||||||
|
|
||||||
const initialValues = getInitialValues(encryption);
|
const debouncedConfigValidation = useCallback(debounce(validateConfig, DEBOUNCE_TIMEOUT), [validateConfig]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="encryption">
|
<div className="encryption">
|
||||||
|
|||||||
Reference in New Issue
Block a user