-
Notifications
You must be signed in to change notification settings - Fork 66
/
index.tsx
87 lines (82 loc) 路 2.16 KB
/
index.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
/* eslint-disable global-require */
import React from 'react';
import clsx from 'clsx';
import Translate from '@docusaurus/Translate';
import Link from '@docusaurus/Link';
import Heading from '@theme/Heading';
const WelcomeGuides = [
{
name: '馃憞 Getting Started',
url: './getting-started/overview',
description: (
<Translate >
Set up Tracetest and start trace-based testing your distributed system.
</Translate>
),
button: 'Start',
},
{
name: '馃ぉ Open Source',
url: 'https://github.com/kubeshop/tracetest',
description: (
<Translate>
Check out the Tracetest GitHub repo! Please consider giving us a star! 猸愶笍
</Translate>
),
button: 'Go to GitHub',
},
{
name: '鈿欙笍 Configure trace data stores',
url: '/configuration/overview#supported-trace-data-stores',
description: (
<Translate>
Connect your existing trace data store or send traces to Tracetest directly!
</Translate>
),
button: 'Configure',
},
{
name: '馃檮 New to Trace-based Testing?',
url: '/concepts/what-is-trace-based-testing',
description: (
<Translate>
Read about the concepts of trace-based testing to learn more!
</Translate>
),
button: 'View Concepts',
},
];
interface Props {
name: string;
url: string;
button: string;
description: JSX.Element;
}
function WelcomeGuideCard({name, url, description, button}: Props) {
return (
<div className="col col--6 margin-bottom--lg">
<div className={clsx('card')}>
<div className="card__body">
<Heading as="h3">{name}</Heading>
<p>{description}</p>
</div>
<div className="card__footer">
<div className="button-group button-group--block">
<Link className="button button--secondary" to={url}>
{button}
</Link>
</div>
</div>
</div>
</div>
);
}
export function WelcomeGuideCardsRow(): JSX.Element {
return (
<div className="row">
{WelcomeGuides.map((WelcomeGuide) => (
<WelcomeGuideCard key={WelcomeGuide.name} {...WelcomeGuide} />
))}
</div>
);
}