mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 17:59:23 -04:00
[Guided onboarding] Add guided onboarding to the home page
This commit is contained in:
parent
ffc8fb90fd
commit
b36e80bbfa
6 changed files with 53 additions and 4 deletions
|
@ -30,6 +30,7 @@ exports[`home change home route should render a link to change the default route
|
|||
},
|
||||
}
|
||||
}
|
||||
isCloudEnabled={false}
|
||||
isDarkMode={false}
|
||||
/>
|
||||
<ManageData
|
||||
|
@ -84,6 +85,7 @@ exports[`home directories should not render directory entry when showOnHomePage
|
|||
},
|
||||
}
|
||||
}
|
||||
isCloudEnabled={false}
|
||||
isDarkMode={false}
|
||||
/>
|
||||
<ManageData
|
||||
|
@ -138,6 +140,7 @@ exports[`home directories should render ADMIN directory entry in "Manage your da
|
|||
},
|
||||
}
|
||||
}
|
||||
isCloudEnabled={false}
|
||||
isDarkMode={false}
|
||||
/>
|
||||
<ManageData
|
||||
|
@ -239,6 +242,7 @@ exports[`home directories should render solutions in the "solution section" 1`]
|
|||
},
|
||||
}
|
||||
}
|
||||
isCloudEnabled={false}
|
||||
isDarkMode={false}
|
||||
/>
|
||||
<ManageData
|
||||
|
@ -293,6 +297,7 @@ exports[`home isNewKibanaInstance should safely handle exceptions 1`] = `
|
|||
},
|
||||
}
|
||||
}
|
||||
isCloudEnabled={false}
|
||||
isDarkMode={false}
|
||||
/>
|
||||
<ManageData
|
||||
|
@ -347,6 +352,7 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to false when t
|
|||
},
|
||||
}
|
||||
}
|
||||
isCloudEnabled={false}
|
||||
isDarkMode={false}
|
||||
/>
|
||||
<ManageData
|
||||
|
@ -408,6 +414,7 @@ exports[`home should render home component 1`] = `
|
|||
},
|
||||
}
|
||||
}
|
||||
isCloudEnabled={false}
|
||||
isDarkMode={false}
|
||||
/>
|
||||
<ManageData
|
||||
|
|
|
@ -40,6 +40,7 @@ describe('AddData', () => {
|
|||
addBasePath={addBasePathMock}
|
||||
application={applicationStartMock}
|
||||
isDarkMode={false}
|
||||
isCloudEnabled={false}
|
||||
/>
|
||||
);
|
||||
expect(component).toMatchSnapshot();
|
||||
|
|
|
@ -29,9 +29,10 @@ interface Props {
|
|||
addBasePath: (path: string) => string;
|
||||
application: ApplicationStart;
|
||||
isDarkMode: boolean;
|
||||
isCloudEnabled: boolean;
|
||||
}
|
||||
|
||||
export const AddData: FC<Props> = ({ addBasePath, application, isDarkMode }) => {
|
||||
export const AddData: FC<Props> = ({ addBasePath, application, isDarkMode, isCloudEnabled }) => {
|
||||
const { trackUiMetric } = getServices();
|
||||
const canAccessIntegrations = application.capabilities.navLinks.integrations;
|
||||
if (canAccessIntegrations) {
|
||||
|
@ -67,12 +68,30 @@ export const AddData: FC<Props> = ({ addBasePath, application, isDarkMode }) =>
|
|||
<EuiSpacer />
|
||||
|
||||
<EuiFlexGroup gutterSize="m" responsive={false} wrap>
|
||||
{isCloudEnabled && (
|
||||
<EuiFlexItem grow={false}>
|
||||
{/* eslint-disable-next-line @elastic/eui/href-or-on-click */}
|
||||
<EuiButton
|
||||
data-test-subj="guidedOnboardingLink"
|
||||
fill
|
||||
href={addBasePath('#/getting_started')}
|
||||
onClick={(event: MouseEvent) => {
|
||||
trackUiMetric(METRIC_TYPE.CLICK, 'guided_onboarding_link');
|
||||
}}
|
||||
>
|
||||
<FormattedMessage
|
||||
id="home.addData.guidedOnboardingLinkLabel"
|
||||
defaultMessage="Launch Guided setup"
|
||||
/>
|
||||
</EuiButton>
|
||||
</EuiFlexItem>
|
||||
)}
|
||||
<EuiFlexItem grow={false}>
|
||||
<RedirectAppLinks application={application}>
|
||||
{/* eslint-disable-next-line @elastic/eui/href-or-on-click */}
|
||||
<EuiButton
|
||||
data-test-subj="homeAddData"
|
||||
fill
|
||||
fill={!isCloudEnabled}
|
||||
href={addBasePath('/app/integrations/browse')}
|
||||
iconType="plusInCircle"
|
||||
onClick={(event: MouseEvent) => {
|
||||
|
|
|
@ -59,6 +59,7 @@ describe('home', () => {
|
|||
return `base_path/${url}`;
|
||||
},
|
||||
hasUserDataView: jest.fn(async () => true),
|
||||
isCloudEnabled: false,
|
||||
};
|
||||
});
|
||||
|
||||
|
@ -230,6 +231,14 @@ describe('home', () => {
|
|||
|
||||
expect(component.find(Welcome).exists()).toBe(false);
|
||||
});
|
||||
|
||||
test('should redirect to guided onboarding on Cloud instead of welcome screen', async () => {
|
||||
defaultProps.isCloudEnabled = true;
|
||||
|
||||
const component = await renderHome();
|
||||
|
||||
expect(component.find(Welcome).exists()).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('isNewKibanaInstance', () => {
|
||||
|
|
|
@ -33,6 +33,7 @@ export interface HomeProps {
|
|||
localStorage: Storage;
|
||||
urlBasePath: string;
|
||||
hasUserDataView: () => Promise<boolean>;
|
||||
isCloudEnabled: boolean;
|
||||
}
|
||||
|
||||
interface State {
|
||||
|
@ -126,7 +127,7 @@ export class Home extends Component<HomeProps, State> {
|
|||
}
|
||||
|
||||
private renderNormal() {
|
||||
const { addBasePath, solutions } = this.props;
|
||||
const { addBasePath, solutions, isCloudEnabled } = this.props;
|
||||
const { application, trackUiMetric } = getServices();
|
||||
const isDarkMode = getServices().uiSettings?.get('theme:darkMode') || false;
|
||||
const devTools = this.findDirectoryById('console');
|
||||
|
@ -148,7 +149,12 @@ export class Home extends Component<HomeProps, State> {
|
|||
>
|
||||
<SolutionsSection addBasePath={addBasePath} solutions={solutions} />
|
||||
|
||||
<AddData addBasePath={addBasePath} application={application} isDarkMode={isDarkMode} />
|
||||
<AddData
|
||||
addBasePath={addBasePath}
|
||||
application={application}
|
||||
isDarkMode={isDarkMode}
|
||||
isCloudEnabled={isCloudEnabled}
|
||||
/>
|
||||
|
||||
<ManageData
|
||||
addBasePath={addBasePath}
|
||||
|
@ -182,12 +188,18 @@ export class Home extends Component<HomeProps, State> {
|
|||
|
||||
public render() {
|
||||
const { isLoading, isWelcomeEnabled, isNewKibanaInstance } = this.state;
|
||||
const { isCloudEnabled } = this.props;
|
||||
const { application } = getServices();
|
||||
|
||||
if (isWelcomeEnabled) {
|
||||
if (isLoading) {
|
||||
return this.renderLoading();
|
||||
}
|
||||
if (isNewKibanaInstance) {
|
||||
if (isCloudEnabled) {
|
||||
application.navigateToUrl('./home#/getting_started');
|
||||
return;
|
||||
}
|
||||
return this.renderWelcome();
|
||||
}
|
||||
}
|
||||
|
|
|
@ -79,6 +79,7 @@ export function HomeApp({ directories, solutions }) {
|
|||
localStorage={localStorage}
|
||||
urlBasePath={getBasePath()}
|
||||
hasUserDataView={() => dataViewsService.hasUserDataView()}
|
||||
isCloudEnabled={isCloudEnabled}
|
||||
/>
|
||||
</Route>
|
||||
<Redirect to="/" />
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue