Initial localization work (#3980)
* First pass at configuring localization * Add CI job for translations * Update CI job * Update default value * Update parser config * Update defaults again * try to fix the multiple parsing of a file * Update crowdlin config * Update configs * New Crowdin translations by GitHub Action (#3448) Co-authored-by: Crowdin Bot <support+bot@crowdin.com> * Point to updated translated files * Tooltip i18n * Run translation job when web components are updated * Commit updated translations * Translations update (#3453) * Update source file strings.json Updated translations * New translations strings.json (French) Updated translations * New translations strings.json (Spanish) Updated translations * New translations strings.json (German) Updated translations * New translations strings.json (English, United States) Updated translations * Commit updated translations * New Crowdin translations by GitHub Action (#3452) Co-authored-by: Owncast <owncast@owncast.online> * chore(deps): update to next config to address build errors * New Crowdin translations by GitHub Action (#3455) Co-authored-by: Crowdin Bot <support+bot@crowdin.com> * Translations update (#3456) * New translations strings.json (Arabic) Updated translations * New translations strings.json (German) Updated translations * New translations strings.json (Greek) Updated translations * New translations strings.json (Irish) Updated translations * New translations strings.json (Italian) Updated translations * New translations strings.json (Japanese) Updated translations * New translations strings.json (Korean) Updated translations * New translations strings.json (Dutch) Updated translations * New translations strings.json (Norwegian) Updated translations * New translations strings.json (Punjabi) Updated translations * New translations strings.json (Russian) Updated translations * New translations strings.json (Swedish) Updated translations * New translations strings.json (Chinese Traditional) Updated translations * New translations strings.json (Vietnamese) Updated translations * New translations strings.json (Bengali) Updated translations * New translations strings.json (Thai) Updated translations * New translations strings.json (Croatian) Updated translations * New translations strings.json (Hindi) Updated translations * New translations strings.json (Malay) Updated translations * New Crowdin translations by GitHub Action (#3457) * New translations strings.json (Arabic) Updated translations * New translations strings.json (German) Updated translations * New translations strings.json (Greek) Updated translations * New translations strings.json (Irish) Updated translations * New translations strings.json (Italian) Updated translations * New translations strings.json (Japanese) Updated translations * New translations strings.json (Korean) Updated translations * New translations strings.json (Dutch) Updated translations * New translations strings.json (Norwegian) Updated translations * New translations strings.json (Punjabi) Updated translations * New translations strings.json (Russian) Updated translations * New translations strings.json (Swedish) Updated translations * New translations strings.json (Chinese Traditional) Updated translations * New translations strings.json (Vietnamese) Updated translations * New translations strings.json (Bengali) Updated translations * New translations strings.json (Thai) Updated translations * New translations strings.json (Croatian) Updated translations * New translations strings.json (Hindi) Updated translations * New translations strings.json (Malay) Updated translations * New Crowdin translations by GitHub Action --------- Co-authored-by: Gabe Kangas <gabek@real-ity.com> Co-authored-by: Crowdin Bot <support+bot@crowdin.com> * Commit updated API documentation * Update translations job * New Crowdin translations by GitHub Action (#3698) Co-authored-by: Crowdin Bot <support+bot@crowdin.com> * Update Crowdin configuration file * Translations update (#3700) * New translations strings.json (French) Updated translations * New translations strings.json (Italian) Updated translations * Translations update (#3699) * New translations strings.json (French) Updated translations * New translations strings.json (Spanish) Updated translations * New translations strings.json (Italian) Updated translations * New translations strings.json (Japanese) Updated translations * New translations strings.json (Polish) Updated translations * New translations strings.json (Russian) Updated translations * New translations strings.json (Portuguese, Brazilian) Updated translations * Commit updated API documentation --------- Co-authored-by: Owncast <owncast@owncast.online> * New Crowdin translations by GitHub Action (#3701) * New translations strings.json (French) Updated translations * New translations strings.json (Spanish) Updated translations * New translations strings.json (Italian) Updated translations * New translations strings.json (Japanese) Updated translations * New translations strings.json (Polish) Updated translations * New translations strings.json (Russian) Updated translations * New translations strings.json (Portuguese, Brazilian) Updated translations * New Crowdin translations by GitHub Action --------- Co-authored-by: Gabe Kangas <gabek@real-ity.com> Co-authored-by: Crowdin Bot <support+bot@crowdin.com> * Draft: Mark strings for translation. (#3458) * Mark strings for translation. * Mark up strings for translation * fix(web): fix linter warnings --------- Co-authored-by: Le fractal <17422-fractal@users.noreply.framagit.org> Co-authored-by: Gabe Kangas <gabek@real-ity.com> * do not pull from cowdin via workflow * Commit updated translations * feat: add translations support to admin pages and components (#3977) * feat: add translations support to admin pages and components Added translations support admin main page and its components, help page, handware-info page. Added translations support for LogTable, NewsFeed and StreamHealthOverview components. * update package.json * fix rendering issue * Commit updated API documentation --------- Co-authored-by: Owncast <owncast@owncast.online> Co-authored-by: Gabe Kangas <gabek@real-ity.com> * Offline banner i18n formatting (#3997) * Fix "Last live ago" string formatting with i18n interpolation * Change some base translation jsons to use i18n interpolation * Linting fix * chore(js): ignore i18n pkgs in knip * fix(test): fix browser ui test * fix(js): remove unused var --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Crowdin Bot <support+bot@crowdin.com> Co-authored-by: Owncast <owncast@owncast.online> Co-authored-by: taintedcypher <119351153+taintedcypher@users.noreply.github.com> Co-authored-by: Le fractal <17422-fractal@users.noreply.framagit.org> Co-authored-by: Sufyaan Khateeb <81009832+SufyaanKhateeb@users.noreply.github.com> Co-authored-by: mahmed2000 <mahmad2000@protonmail.com>
This commit is contained in:
Gabe Kangas
@@ -3,6 +3,7 @@ import { Table, Tag, Typography } from 'antd';
|
||||
import Linkify from 'react-linkify';
|
||||
import { SortOrder, TablePaginationConfig } from 'antd/lib/table/interface';
|
||||
import { format } from 'date-fns';
|
||||
import { useTranslation } from 'next-export-i18n';
|
||||
|
||||
const { Title } = Typography;
|
||||
|
||||
@@ -28,39 +29,41 @@ export type LogTableProps = {
|
||||
};
|
||||
|
||||
export const LogTable: FC<LogTableProps> = ({ logs, initialPageSize }) => {
|
||||
if (!logs?.length) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { t } = useTranslation();
|
||||
const [pageSize, setPageSize] = useState(initialPageSize);
|
||||
|
||||
const handleTableChange = (pagination: TablePaginationConfig) => {
|
||||
setPageSize(pagination.pageSize);
|
||||
};
|
||||
|
||||
if (!logs?.length) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: 'Level',
|
||||
title: t('Level'),
|
||||
dataIndex: 'level',
|
||||
key: 'level',
|
||||
filters: [
|
||||
{
|
||||
text: 'Info',
|
||||
text: t('Info'),
|
||||
value: 'info',
|
||||
},
|
||||
{
|
||||
text: 'Warning',
|
||||
text: t('Warning'),
|
||||
value: 'warning',
|
||||
},
|
||||
{
|
||||
text: 'Error',
|
||||
value: 'error',
|
||||
text: t('Error'),
|
||||
value: 'Error',
|
||||
},
|
||||
],
|
||||
onFilter: (level, row) => row.level.indexOf(level) === 0,
|
||||
render: renderColumnLevel,
|
||||
},
|
||||
{
|
||||
title: 'Timestamp',
|
||||
title: t('Timestamp'),
|
||||
dataIndex: 'time',
|
||||
key: 'time',
|
||||
render: timestamp => {
|
||||
@@ -72,7 +75,7 @@ export const LogTable: FC<LogTableProps> = ({ logs, initialPageSize }) => {
|
||||
defaultSortOrder: 'descend' as SortOrder,
|
||||
},
|
||||
{
|
||||
title: 'Message',
|
||||
title: t('Message'),
|
||||
dataIndex: 'message',
|
||||
key: 'message',
|
||||
render: renderMessage,
|
||||
@@ -81,7 +84,7 @@ export const LogTable: FC<LogTableProps> = ({ logs, initialPageSize }) => {
|
||||
|
||||
return (
|
||||
<div className="logs-section">
|
||||
<Title>Logs</Title>
|
||||
<Title>{t('Logs')}</Title>
|
||||
<Table
|
||||
size="middle"
|
||||
dataSource={logs}
|
||||
|
||||
@@ -4,6 +4,7 @@ import React, { useState, useEffect, FC } from 'react';
|
||||
import { Collapse, Typography, Skeleton } from 'antd';
|
||||
import { format } from 'date-fns';
|
||||
|
||||
import { useTranslation } from 'next-export-i18n';
|
||||
import { fetchExternalData } from '../../utils/apis';
|
||||
|
||||
const { Panel } = Collapse;
|
||||
@@ -27,6 +28,7 @@ const ArticleItem: FC<ArticleProps> = ({
|
||||
date_published: date,
|
||||
defaultOpen = false,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const dateObject = new Date(date);
|
||||
const dateString = format(dateObject, 'MMM dd, yyyy, HH:mm');
|
||||
return (
|
||||
@@ -36,7 +38,7 @@ const ArticleItem: FC<ArticleProps> = ({
|
||||
<p className="timestamp">
|
||||
{dateString} (
|
||||
<Link href={`${OWNCAST_BASE_URL}${url}`} target="_blank" rel="noopener noreferrer">
|
||||
Link
|
||||
{t('Link')}
|
||||
</Link>
|
||||
)
|
||||
</p>
|
||||
@@ -48,6 +50,7 @@ const ArticleItem: FC<ArticleProps> = ({
|
||||
};
|
||||
|
||||
export const NewsFeed = () => {
|
||||
const { t } = useTranslation();
|
||||
const [feed, setFeed] = useState<ArticleProps[]>([]);
|
||||
const [loading, setLoading] = useState<Boolean>(true);
|
||||
|
||||
@@ -69,11 +72,11 @@ export const NewsFeed = () => {
|
||||
}, []);
|
||||
|
||||
const loadingSpinner = loading ? <Skeleton loading active /> : null;
|
||||
const noNews = !loading && feed.length === 0 ? <div>No news.</div> : null;
|
||||
const noNews = !loading && feed.length === 0 ? <div>{t('No news.')}</div> : null;
|
||||
|
||||
return (
|
||||
<section className="news-feed form-module">
|
||||
<Title level={2}>News & Updates from Owncast</Title>
|
||||
<Title level={2}>{t('News & Updates from Owncast')}</Title>
|
||||
{loadingSpinner}
|
||||
{feed.map(item => (
|
||||
<ArticleItem {...item} key={item.url} defaultOpen={feed.length === 1} />
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { useTranslation } from 'next-export-i18n';
|
||||
import { Card, Col, Row, Typography } from 'antd';
|
||||
import Link from 'next/link';
|
||||
import { FC, useContext } from 'react';
|
||||
@@ -43,6 +44,7 @@ export type OfflineProps = {
|
||||
export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
const serverStatusData = useContext(ServerStatusContext);
|
||||
|
||||
const { t } = useTranslation();
|
||||
const { serverConfig } = serverStatusData || {};
|
||||
const { rtmpServerPort, streamKeyOverridden } = serverConfig;
|
||||
const instanceUrl = global.window?.location.hostname || '';
|
||||
@@ -55,7 +57,7 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
const data = [
|
||||
{
|
||||
icon: <BookTwoTone twoToneColor="#6f42c1" />,
|
||||
title: 'Use your broadcasting software',
|
||||
title: t('Use your broadcasting software'),
|
||||
content: (
|
||||
<div>
|
||||
<a
|
||||
@@ -63,12 +65,13 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Learn how to point your existing software to your new server and start streaming your
|
||||
content.
|
||||
{t(
|
||||
'Learn how to point your existing software to your new server and start streaming your content.',
|
||||
)}
|
||||
</a>
|
||||
<div className="stream-info-container">
|
||||
<Text strong className="stream-info-label">
|
||||
Streaming URL:
|
||||
{t('Streaming URL:')}
|
||||
</Text>
|
||||
{rtmpURL && (
|
||||
<Paragraph className="stream-info-box" copyable>
|
||||
@@ -76,14 +79,14 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
</Paragraph>
|
||||
)}
|
||||
<Text strong className="stream-info-label">
|
||||
Streaming Keys:
|
||||
{t('Streaming Keys:')}
|
||||
</Text>
|
||||
<Text strong className="stream-info-box">
|
||||
{!streamKeyOverridden ? (
|
||||
<Link href="/admin/config/server"> View </Link>
|
||||
<Link href="/admin/config/server"> {t('View')} </Link>
|
||||
) : (
|
||||
<span style={{ paddingLeft: '10px', fontWeight: 'normal' }}>
|
||||
Overridden via command line.
|
||||
{t('Overridden via command line.')}
|
||||
</span>
|
||||
)}
|
||||
</Text>
|
||||
@@ -93,7 +96,7 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
},
|
||||
{
|
||||
icon: <PlaySquareTwoTone twoToneColor="#f9826c" />,
|
||||
title: 'Embed your video onto other sites',
|
||||
title: t('Embed your video onto other sites'),
|
||||
content: (
|
||||
<div>
|
||||
<a
|
||||
@@ -101,7 +104,7 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
Learn how you can add your Owncast stream to other sites you control.
|
||||
{t('Learn how you can add your Owncast stream to other sites you control.')}
|
||||
</a>
|
||||
</div>
|
||||
),
|
||||
@@ -111,19 +114,19 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
if (!config?.chatDisabled) {
|
||||
data.push({
|
||||
icon: <MessageTwoTone twoToneColor="#0366d6" />,
|
||||
title: 'Chat is disabled',
|
||||
content: <span>Chat will continue to be disabled until you begin a live stream.</span>,
|
||||
title: t('Chat is disabled'),
|
||||
content: <span>{t('Chat will continue to be disabled until you begin a live stream.')}</span>,
|
||||
});
|
||||
}
|
||||
|
||||
if (!config?.yp?.enabled) {
|
||||
data.push({
|
||||
icon: <ProfileTwoTone twoToneColor="#D18BFE" />,
|
||||
title: 'Find an audience on the Owncast Directory',
|
||||
title: t('Find an audience on the Owncast Directory'),
|
||||
content: (
|
||||
<div>
|
||||
List yourself in the Owncast Directory and show off your stream. Enable it in{' '}
|
||||
<Link href="/admin/config/general/">settings.</Link>
|
||||
{t('List yourself in the Owncast Directory and show off your stream. Enable it in')}{' '}
|
||||
<Link href="/admin/config/general/">{t('settings.')}</Link>
|
||||
</div>
|
||||
),
|
||||
});
|
||||
@@ -132,12 +135,13 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
if (!config?.federation?.enabled) {
|
||||
data.push({
|
||||
icon: <img alt="fediverse" width="20px" src="/img/fediverse-color.png" />,
|
||||
title: 'Add your Owncast instance to the Fediverse',
|
||||
title: t('Add your Owncast instance to the Fediverse'),
|
||||
content: (
|
||||
<div>
|
||||
<Link href="/admin/config-federation/">Enable Owncast social</Link> features to have your
|
||||
instance join the Fediverse, allowing people to follow, share and engage with your live
|
||||
stream.
|
||||
<Link href="/admin/config-federation/">{t('Enable Owncast social features')}</Link>{' '}
|
||||
{t(
|
||||
'to have your instance join the Fediverse, allowing people to follow, share and engage with your live stream.',
|
||||
)}
|
||||
</div>
|
||||
),
|
||||
});
|
||||
@@ -152,8 +156,8 @@ export const Offline: FC<OfflineProps> = ({ logs = [], config }) => {
|
||||
<OwncastLogo variant="simple" />
|
||||
</span>
|
||||
<div>
|
||||
<Title level={2}>No stream is active</Title>
|
||||
<p>You should start one.</p>
|
||||
<Title level={2}>{t('No stream is active')}</Title>
|
||||
<p>{t('You should start one.')}</p>
|
||||
</div>
|
||||
</div>
|
||||
</Col>
|
||||
|
||||
@@ -2,6 +2,7 @@ import { Alert, Button, Card, Col, Row, Statistic, Typography } from 'antd';
|
||||
import dynamic from 'next/dynamic';
|
||||
import Link from 'next/link';
|
||||
import React, { FC, useContext } from 'react';
|
||||
import { useTranslation } from 'next-export-i18n';
|
||||
import { ServerStatusContext } from '../../utils/server-status-context';
|
||||
|
||||
// Lazy loaded components
|
||||
@@ -22,6 +23,7 @@ export type StreamHealthOverviewProps = {
|
||||
};
|
||||
|
||||
export const StreamHealthOverview: FC<StreamHealthOverviewProps> = ({ showTroubleshootButton }) => {
|
||||
const { t } = useTranslation();
|
||||
const serverStatusData = useContext(ServerStatusContext);
|
||||
const { health } = serverStatusData;
|
||||
if (!health) {
|
||||
@@ -45,15 +47,15 @@ export const StreamHealthOverview: FC<StreamHealthOverviewProps> = ({ showTroubl
|
||||
<Row gutter={8}>
|
||||
<Col span={12}>
|
||||
<Statistic
|
||||
title="Healthy Stream"
|
||||
value={healthy ? 'Yes' : 'No'}
|
||||
title={t('Healthy Stream')}
|
||||
value={healthy ? t('Yes') : t('No')}
|
||||
valueStyle={{ color }}
|
||||
prefix={healthy ? <CheckCircleOutlined /> : <ExclamationCircleOutlined />}
|
||||
/>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Statistic
|
||||
title="Playback Health"
|
||||
title={t('Playback Health')}
|
||||
value={healthPercentage}
|
||||
valueStyle={{ color }}
|
||||
suffix="%"
|
||||
@@ -65,8 +67,7 @@ export const StreamHealthOverview: FC<StreamHealthOverviewProps> = ({ showTroubl
|
||||
type="secondary"
|
||||
style={{ textAlign: 'center', fontSize: '0.7em', opacity: '0.3' }}
|
||||
>
|
||||
Stream health represents {representation}% of all known players. Other player status is
|
||||
unknown.
|
||||
{`${t('Stream health represents')} ${representation}% ${t('of all known players. Other player status is unknown.')}`}
|
||||
</Typography.Text>
|
||||
</Row>
|
||||
<Row
|
||||
@@ -82,7 +83,7 @@ export const StreamHealthOverview: FC<StreamHealthOverviewProps> = ({ showTroubl
|
||||
showTroubleshootButton && (
|
||||
<Link passHref href="/admin/stream-health">
|
||||
<Button size="small" type="text" style={{ color: 'black' }}>
|
||||
TROUBLESHOOT
|
||||
{t('TROUBLESHOOT')}
|
||||
</Button>
|
||||
</Link>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user