109 lines
3.8 KiB
TypeScript
109 lines
3.8 KiB
TypeScript
import { EnvironmentType } from '@/portainer/environments/types';
|
|
import { useAnalytics } from '@/angulartics.matomo/analytics-services';
|
|
|
|
import { PageHeader } from '@@/PageHeader';
|
|
import { Widget, WidgetBody, WidgetTitle } from '@@/Widget';
|
|
import { Link } from '@@/Link';
|
|
|
|
import { Option } from '../components/Option';
|
|
|
|
import { useConnectLocalEnvironment } from './useFetchOrCreateLocalEnvironment';
|
|
import styles from './HomeView.module.css';
|
|
|
|
export function HomeView() {
|
|
const localEnvironmentAdded = useConnectLocalEnvironment();
|
|
const { trackEvent } = useAnalytics();
|
|
return (
|
|
<>
|
|
<PageHeader
|
|
title="Quick Setup"
|
|
breadcrumbs={[{ label: 'Environment Wizard' }]}
|
|
/>
|
|
|
|
<div className="row">
|
|
<div className="col-sm-12">
|
|
<Widget>
|
|
<WidgetTitle title="Environment Wizard" icon="fa-magic" />
|
|
<WidgetBody>
|
|
<div className="row">
|
|
<div className="col-sm-12 form-section-title">
|
|
Welcome to Portainer
|
|
</div>
|
|
<div className="text-muted small">
|
|
{localEnvironmentAdded.status === 'success' && (
|
|
<p>
|
|
We have connected your local environment of
|
|
{getTypeLabel(localEnvironmentAdded.type)} to Portainer.
|
|
</p>
|
|
)}
|
|
|
|
{localEnvironmentAdded.status === 'error' && (
|
|
<p>
|
|
We could not connect your local environment to Portainer.
|
|
<br />
|
|
Please ensure your environment is correctly exposed. For
|
|
help with installation visit
|
|
<a href="https://documentation.portainer.io/quickstart/">
|
|
https://documentation.portainer.io/quickstart
|
|
</a>
|
|
</p>
|
|
)}
|
|
|
|
<p>
|
|
Get started below with your local portainer or connect more
|
|
container environments.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="flex flex-wrap gap-4">
|
|
{localEnvironmentAdded.status === 'success' && (
|
|
<Link to="portainer.home" className={styles.link}>
|
|
<Option
|
|
id="get-started"
|
|
icon={
|
|
localEnvironmentAdded.type === EnvironmentType.Docker
|
|
? 'fab fa-docker'
|
|
: 'fas fa-dharmachakra'
|
|
}
|
|
title="Get Started"
|
|
description="Proceed using the local environment which Portainer is running in"
|
|
onClick={() => trackLocalEnvironmentAnalytics()}
|
|
/>
|
|
</Link>
|
|
)}
|
|
<Link to="portainer.wizard.endpoints" className={styles.link}>
|
|
<Option
|
|
id="add-environment"
|
|
title="Add Environments"
|
|
icon="fa fa-plug"
|
|
description="Connect to other environments"
|
|
/>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</WidgetBody>
|
|
</Widget>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
|
|
function trackLocalEnvironmentAnalytics() {
|
|
trackEvent('endpoint-wizard-endpoint-select', {
|
|
category: 'portainer',
|
|
metadata: { environment: 'Get-started-local-environment' },
|
|
});
|
|
}
|
|
}
|
|
|
|
function getTypeLabel(type?: EnvironmentType) {
|
|
switch (type) {
|
|
case EnvironmentType.Docker:
|
|
return 'Docker';
|
|
case EnvironmentType.KubernetesLocal:
|
|
return 'Kubernetes';
|
|
default:
|
|
return '';
|
|
}
|
|
}
|