Allow enrollment flyout to load well on slow networks (#71487)
This commit is contained in:
parent
649a16bd88
commit
3031ff7447
|
@ -13,7 +13,7 @@ import { sendGetEnrollmentAPIKeys, useCore } from '../../../../hooks';
|
|||
import { AgentConfigPackageBadges } from '../agent_config_package_badges';
|
||||
|
||||
type Props = {
|
||||
agentConfigs: AgentConfig[];
|
||||
agentConfigs?: AgentConfig[];
|
||||
onConfigChange?: (key: string) => void;
|
||||
} & (
|
||||
| {
|
||||
|
@ -37,9 +37,16 @@ export const EnrollmentStepAgentConfig: React.FC<Props> = (props) => {
|
|||
const [selectedState, setSelectedState] = useState<{
|
||||
agentConfigId?: string;
|
||||
enrollmentAPIKeyId?: string;
|
||||
}>({
|
||||
agentConfigId: agentConfigs.length ? agentConfigs[0].id : undefined,
|
||||
});
|
||||
}>({});
|
||||
|
||||
useEffect(() => {
|
||||
if (agentConfigs && agentConfigs.length && !selectedState.agentConfigId) {
|
||||
setSelectedState({
|
||||
...selectedState,
|
||||
agentConfigId: agentConfigs[0].id,
|
||||
});
|
||||
}
|
||||
}, [agentConfigs, selectedState]);
|
||||
|
||||
useEffect(() => {
|
||||
if (onConfigChange && selectedState.agentConfigId) {
|
||||
|
@ -110,7 +117,8 @@ export const EnrollmentStepAgentConfig: React.FC<Props> = (props) => {
|
|||
/>
|
||||
</EuiText>
|
||||
}
|
||||
options={agentConfigs.map((config) => ({
|
||||
isLoading={!agentConfigs}
|
||||
options={(agentConfigs || []).map((config) => ({
|
||||
value: config.id,
|
||||
text: config.name,
|
||||
}))}
|
||||
|
|
|
@ -24,12 +24,12 @@ import { StandaloneInstructions } from './standalone_instructions';
|
|||
|
||||
interface Props {
|
||||
onClose: () => void;
|
||||
agentConfigs: AgentConfig[];
|
||||
agentConfigs?: AgentConfig[];
|
||||
}
|
||||
|
||||
export const AgentEnrollmentFlyout: React.FunctionComponent<Props> = ({
|
||||
onClose,
|
||||
agentConfigs = [],
|
||||
agentConfigs,
|
||||
}) => {
|
||||
const [mode, setMode] = useState<'managed' | 'standalone'>('managed');
|
||||
|
||||
|
|
|
@ -21,10 +21,10 @@ import { ManualInstructions } from '../../../../components/enrollment_instructio
|
|||
import { DownloadStep, AgentConfigSelectionStep } from './steps';
|
||||
|
||||
interface Props {
|
||||
agentConfigs: AgentConfig[];
|
||||
agentConfigs?: AgentConfig[];
|
||||
}
|
||||
|
||||
export const ManagedInstructions: React.FunctionComponent<Props> = ({ agentConfigs = [] }) => {
|
||||
export const ManagedInstructions: React.FunctionComponent<Props> = ({ agentConfigs }) => {
|
||||
const { getHref } = useLink();
|
||||
const core = useCore();
|
||||
const fleetStatus = useFleetStatus();
|
||||
|
@ -85,7 +85,7 @@ export const ManagedInstructions: React.FunctionComponent<Props> = ({ agentConfi
|
|||
}}
|
||||
/>
|
||||
</>
|
||||
)}{' '}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -25,12 +25,12 @@ import { DownloadStep, AgentConfigSelectionStep } from './steps';
|
|||
import { configToYaml, agentConfigRouteService } from '../../../../services';
|
||||
|
||||
interface Props {
|
||||
agentConfigs: AgentConfig[];
|
||||
agentConfigs?: AgentConfig[];
|
||||
}
|
||||
|
||||
const RUN_INSTRUCTIONS = './elastic-agent run';
|
||||
|
||||
export const StandaloneInstructions: React.FunctionComponent<Props> = ({ agentConfigs = [] }) => {
|
||||
export const StandaloneInstructions: React.FunctionComponent<Props> = ({ agentConfigs }) => {
|
||||
const core = useCore();
|
||||
const { notifications } = core;
|
||||
|
||||
|
|
|
@ -46,7 +46,7 @@ export const AgentConfigSelectionStep = ({
|
|||
setSelectedAPIKeyId,
|
||||
setSelectedConfigId,
|
||||
}: {
|
||||
agentConfigs: AgentConfig[];
|
||||
agentConfigs?: AgentConfig[];
|
||||
setSelectedAPIKeyId?: (key: string) => void;
|
||||
setSelectedConfigId?: (configId: string) => void;
|
||||
}) => {
|
||||
|
|
Loading…
Reference in a new issue