24 changed files with 733 additions and 643 deletions
@ -1,4 +1,9 @@
@@ -1,4 +1,9 @@
|
||||
{ |
||||
"useTabs": false, |
||||
"printWidth": 100, |
||||
"tabWidth": 2, |
||||
"useTabs": false |
||||
"singleQuote": true, |
||||
"trailingComma": "all", |
||||
"jsxBracketSameLine": false, |
||||
"arrowParens": "avoid" |
||||
} |
||||
|
||||
@ -1,167 +1,210 @@
@@ -1,167 +1,210 @@
|
||||
import { Button, Card, Col, Divider, Result, Row } from 'antd' |
||||
import Meta from 'antd/lib/card/Meta' |
||||
import Title from 'antd/lib/typography/Title' |
||||
import { Button, Card, Col, Divider, Result, Row } from 'antd'; |
||||
import Meta from 'antd/lib/card/Meta'; |
||||
import Title from 'antd/lib/typography/Title'; |
||||
import { |
||||
AlertOutlined, |
||||
ApiTwoTone, |
||||
BookOutlined, |
||||
BugTwoTone, |
||||
CameraTwoTone, |
||||
DatabaseTwoTone, |
||||
EditTwoTone, |
||||
Html5TwoTone, |
||||
LinkOutlined, |
||||
QuestionCircleTwoTone, |
||||
SettingTwoTone, |
||||
SlidersTwoTone, |
||||
} from '@ant-design/icons' |
||||
import React from 'react' |
||||
AlertOutlined, |
||||
ApiTwoTone, |
||||
BookOutlined, |
||||
BugTwoTone, |
||||
CameraTwoTone, |
||||
DatabaseTwoTone, |
||||
EditTwoTone, |
||||
Html5TwoTone, |
||||
LinkOutlined, |
||||
QuestionCircleTwoTone, |
||||
SettingTwoTone, |
||||
SlidersTwoTone, |
||||
} from '@ant-design/icons'; |
||||
import React from 'react'; |
||||
|
||||
interface Props { } |
||||
interface Props {} |
||||
|
||||
export default function Help(props: Props) { |
||||
const questions = [ |
||||
{ |
||||
icon: <SettingTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I want to configure my owncast instance", |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/configuration/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a> |
||||
</div> |
||||
) |
||||
}, |
||||
{ |
||||
icon: <CameraTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I need help configuring my broadcasting software", |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/broadcasting/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a> |
||||
</div> |
||||
) |
||||
}, |
||||
{ |
||||
icon: <Html5TwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I want to embed my stream into another site", |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/embed/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a> |
||||
</div> |
||||
) |
||||
}, |
||||
{ |
||||
icon: <EditTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I want to customize my website", |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/website/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a> |
||||
</div> |
||||
) |
||||
}, |
||||
{ |
||||
icon: <SlidersTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I want to tweak my encoding quality or performance", |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/encoding/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a> |
||||
</div> |
||||
) |
||||
}, |
||||
{ |
||||
icon: <DatabaseTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I want to offload my video to an external storage provider", |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/s3/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a> |
||||
</div> |
||||
) |
||||
}, |
||||
] |
||||
|
||||
const otherResources = [ |
||||
{ |
||||
icon: <BugTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I found a bug", |
||||
content: ( |
||||
<div> |
||||
If you found a bug, then please |
||||
<a href="https://github.com/owncast/owncast/issues/new/choose" target="_blank" rel="noopener noreferrer"> let us know</a> |
||||
</div> |
||||
) |
||||
}, |
||||
{ |
||||
icon: <QuestionCircleTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I have a general question", |
||||
content: ( |
||||
<div> |
||||
Most general questions are answered in our |
||||
<a href="https://owncast.online/docs/faq/" target="_blank" rel="noopener noreferrer"> FAQ</a> or exist in our <a href="https://github.com/owncast/owncast/discussions">discussions</a> |
||||
</div> |
||||
) |
||||
}, |
||||
{ |
||||
icon: <ApiTwoTone style={{ fontSize: '24px' }} />, |
||||
title: "I want to use the API", |
||||
content: ( |
||||
<div> |
||||
You can view the API documentation for either the |
||||
<a href="https://owncast.online/api/latest" target="_blank" rel="noopener noreferrer"> latest </a> |
||||
or |
||||
<a href="https://owncast.online/api/development" target="_blank" rel="noopener noreferrer"> development </a> |
||||
release. |
||||
</div> |
||||
) |
||||
} |
||||
] |
||||
const questions = [ |
||||
{ |
||||
icon: <SettingTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I want to configure my owncast instance', |
||||
content: ( |
||||
<div> |
||||
<a |
||||
href="https://owncast.online/docs/configuration/" |
||||
target="_blank" |
||||
rel="noopener noreferrer" |
||||
> |
||||
<LinkOutlined /> Learn more |
||||
</a> |
||||
</div> |
||||
), |
||||
}, |
||||
{ |
||||
icon: <CameraTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I need help configuring my broadcasting software', |
||||
content: ( |
||||
<div> |
||||
<a |
||||
href="https://owncast.online/docs/broadcasting/" |
||||
target="_blank" |
||||
rel="noopener noreferrer" |
||||
> |
||||
<LinkOutlined /> Learn more |
||||
</a> |
||||
</div> |
||||
), |
||||
}, |
||||
{ |
||||
icon: <Html5TwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I want to embed my stream into another site', |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/embed/" target="_blank" rel="noopener noreferrer"> |
||||
<LinkOutlined /> Learn more |
||||
</a> |
||||
</div> |
||||
), |
||||
}, |
||||
{ |
||||
icon: <EditTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I want to customize my website', |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/website/" target="_blank" rel="noopener noreferrer"> |
||||
<LinkOutlined /> Learn more |
||||
</a> |
||||
</div> |
||||
), |
||||
}, |
||||
{ |
||||
icon: <SlidersTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I want to tweak my encoding quality or performance', |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/encoding/" target="_blank" rel="noopener noreferrer"> |
||||
<LinkOutlined /> Learn more |
||||
</a> |
||||
</div> |
||||
), |
||||
}, |
||||
{ |
||||
icon: <DatabaseTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I want to offload my video to an external storage provider', |
||||
content: ( |
||||
<div> |
||||
<a href="https://owncast.online/docs/s3/" target="_blank" rel="noopener noreferrer"> |
||||
<LinkOutlined /> Learn more |
||||
</a> |
||||
</div> |
||||
), |
||||
}, |
||||
]; |
||||
|
||||
return ( |
||||
const otherResources = [ |
||||
{ |
||||
icon: <BugTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I found a bug', |
||||
content: ( |
||||
<div> |
||||
<Title style={{textAlign: 'center'}}>How can we help you?</Title> |
||||
<Row gutter={[16, 16]} justify="space-around" align="middle"> |
||||
<Col xs={24} lg={12} style={{textAlign: 'center'}}> |
||||
<Result status="500" /> |
||||
<Title level={2}>Troubleshooting</Title> |
||||
<Button target="_blank" rel="noopener noreferrer" href="https://owncast.online/docs/troubleshooting/" icon={<LinkOutlined/>} type="primary">Read Troubleshoting</Button> |
||||
</Col> |
||||
<Col xs={24} lg={12} style={{textAlign: 'center'}}> |
||||
<Result status="404" /> |
||||
<Title level={2}>Documentation</Title> |
||||
<Button target="_blank" rel="noopener noreferrer" href="https://owncast.online/" icon={<LinkOutlined/>} type="primary">Read the Docs</Button> |
||||
</Col> |
||||
</Row> |
||||
<Divider /> |
||||
<Title level={2}>Common tasks</Title> |
||||
<Row gutter={[16, 16]}> |
||||
{ |
||||
questions.map(question => ( |
||||
<Col xs={24} lg={12}> |
||||
<Card key={question.title}> |
||||
<Meta |
||||
avatar={question.icon} |
||||
title={question.title} |
||||
description={question.content} |
||||
/> |
||||
</Card> |
||||
</Col> |
||||
)) |
||||
} |
||||
</Row> |
||||
<Divider /> |
||||
<Title level={2}>Other</Title> |
||||
<Row gutter={[16, 16]}> |
||||
{ |
||||
otherResources.map(question => ( |
||||
<Col xs={24} lg={12}> |
||||
<Card key={question.title}> |
||||
<Meta |
||||
avatar={question.icon} |
||||
title={question.title} |
||||
description={question.content} |
||||
/> |
||||
</Card> |
||||
</Col> |
||||
)) |
||||
} |
||||
</Row> |
||||
If you found a bug, then please |
||||
<a |
||||
href="https://github.com/owncast/owncast/issues/new/choose" |
||||
target="_blank" |
||||
rel="noopener noreferrer" |
||||
> |
||||
{' '} |
||||
let us know |
||||
</a> |
||||
</div> |
||||
) |
||||
), |
||||
}, |
||||
{ |
||||
icon: <QuestionCircleTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I have a general question', |
||||
content: ( |
||||
<div> |
||||
Most general questions are answered in our |
||||
<a href="https://owncast.online/docs/faq/" target="_blank" rel="noopener noreferrer"> |
||||
{' '} |
||||
FAQ |
||||
</a>{' '} |
||||
or exist in our <a href="https://github.com/owncast/owncast/discussions">discussions</a> |
||||
</div> |
||||
), |
||||
}, |
||||
{ |
||||
icon: <ApiTwoTone style={{ fontSize: '24px' }} />, |
||||
title: 'I want to use the API', |
||||
content: ( |
||||
<div> |
||||
You can view the API documentation for either the |
||||
<a href="https://owncast.online/api/latest" target="_blank" rel="noopener noreferrer"> |
||||
latest |
||||
</a> |
||||
or |
||||
<a |
||||
href="https://owncast.online/api/development" |
||||
target="_blank" |
||||
rel="noopener noreferrer" |
||||
> |
||||
development |
||||
</a> |
||||
release. |
||||
</div> |
||||
), |
||||
}, |
||||
]; |
||||
|
||||
return ( |
||||
<div> |
||||
<Title style={{ textAlign: 'center' }}>How can we help you?</Title> |
||||
<Row gutter={[16, 16]} justify="space-around" align="middle"> |
||||
<Col xs={24} lg={12} style={{ textAlign: 'center' }}> |
||||
<Result status="500" /> |
||||
<Title level={2}>Troubleshooting</Title> |
||||
<Button |
||||
target="_blank" |
||||
rel="noopener noreferrer" |
||||
href="https://owncast.online/docs/troubleshooting/" |
||||
icon={<LinkOutlined />} |
||||
type="primary" |
||||
> |
||||
Read Troubleshoting |
||||
</Button> |
||||
</Col> |
||||
<Col xs={24} lg={12} style={{ textAlign: 'center' }}> |
||||
<Result status="404" /> |
||||
<Title level={2}>Documentation</Title> |
||||
<Button |
||||
target="_blank" |
||||
rel="noopener noreferrer" |
||||
href="https://owncast.online/" |
||||
icon={<LinkOutlined />} |
||||
type="primary" |
||||
> |
||||
Read the Docs |
||||
</Button> |
||||
</Col> |
||||
</Row> |
||||
<Divider /> |
||||
<Title level={2}>Common tasks</Title> |
||||
<Row gutter={[16, 16]}> |
||||
{questions.map(question => ( |
||||
<Col xs={24} lg={12}> |
||||
<Card key={question.title}> |
||||
<Meta avatar={question.icon} title={question.title} description={question.content} /> |
||||
</Card> |
||||
</Col> |
||||
))} |
||||
</Row> |
||||
<Divider /> |
||||
<Title level={2}>Other</Title> |
||||
<Row gutter={[16, 16]}> |
||||
{otherResources.map(question => ( |
||||
<Col xs={24} lg={12}> |
||||
<Card key={question.title}> |
||||
<Meta avatar={question.icon} title={question.title} description={question.content} /> |
||||
</Card> |
||||
</Col> |
||||
))} |
||||
</Row> |
||||
</div> |
||||
); |
||||
} |
||||
|
||||
Loading…
Reference in new issue