-
Notifications
You must be signed in to change notification settings - Fork 2.7k
/
GetStartedPage.tsx
68 lines (62 loc) · 2.97 KB
/
GetStartedPage.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
import * as React from 'react';
import { PlatformContext, Page, IPageProps, IPageSectionProps } from '@uifabric/example-app-base/lib/index2';
import { GetStartedPageProps } from './GetStartedPage.doc';
import { Platforms } from '../../../interfaces/Platforms';
import { getSubTitle } from '../../../utilities/index';
export interface IGetStartedPageProps extends IPageProps<Platforms> {}
const baseUrl = 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/apps/fabric-website/src/pages/Overviews/GetStartedPage/';
// en dashes look like regular dashes in a monospace font
const enDash = '–';
const GetStartedPageBase: React.StatelessComponent<IGetStartedPageProps> = props => {
const { platform } = props;
return (
<Page
title="Get started"
subTitle={getSubTitle(platform)}
{...props}
{...GetStartedPageProps[platform]}
otherSections={_otherSections(platform) as IPageSectionProps[]}
/>
);
};
function _otherSections(platform: Platforms): IPageSectionProps[] {
switch (platform) {
case 'web':
return [
{
sectionName: 'Fabric React',
editUrl: baseUrl + 'docs/web/GetStartedDevelopExisting.md',
content: require('!raw-loader!@uifabric/fabric-website/src/pages/Overviews/GetStartedPage/docs/web/GetStartedDevelopExisting.md') as string,
jumpLinks: [{ text: enDash + ' Add to existing project', url: 'add-to-existing-project' }]
},
{
sectionName: 'Start a new Fabric React project',
jumpLinkName: enDash + ' Start a new project',
editUrl: baseUrl + 'docs/web/GetStartedDevelopSimple.md',
content: require('!raw-loader!@uifabric/fabric-website/src/pages/Overviews/GetStartedPage/docs/web/GetStartedDevelopSimple.md') as string
},
{
sectionName: 'Next steps with Fabric React',
jumpLinkName: enDash + ' Next steps',
editUrl: baseUrl + 'docs/web/GetStartedNextSteps.md',
content: require('!raw-loader!@uifabric/fabric-website/src/pages/Overviews/GetStartedPage/docs/web/GetStartedNextSteps.md') as string
},
{
sectionName: 'Fabric Core',
editUrl: baseUrl + 'docs/web/GetStartedDevelopCore.md',
content: require('!raw-loader!@uifabric/fabric-website/src/pages/Overviews/GetStartedPage/docs/web/GetStartedDevelopCore.md') as string
},
{
sectionName: 'Use our design language in your site',
jumpLinkName: 'Design language',
editUrl: baseUrl + 'docs/web/GetStartedDesign.md',
content: require('!raw-loader!@uifabric/fabric-website/src/pages/Overviews/GetStartedPage/docs/web/GetStartedDesign.md') as string
}
];
default:
return [];
}
}
export const GetStartedPage: React.StatelessComponent<IGetStartedPageProps> = (props: IGetStartedPageProps) => (
<PlatformContext.Consumer>{(platform: Platforms) => <GetStartedPageBase platform={platform} {...props} />}</PlatformContext.Consumer>
);