mirror of
https://github.com/owncast/owncast.git
synced 2024-10-10 19:16:02 +00:00
fix streamtitle change field on index
This commit is contained in:
parent
2c4bfab9db
commit
b37b57feda
@ -5,6 +5,7 @@ import { ServerStatusContext } from '../../../utils/server-status-context';
|
|||||||
import { TEXTFIELD_PROPS_FFMPEG, TEXTFIELD_PROPS_RTMP_PORT, TEXTFIELD_PROPS_STREAM_KEY, TEXTFIELD_PROPS_WEB_PORT, } from './constants';
|
import { TEXTFIELD_PROPS_FFMPEG, TEXTFIELD_PROPS_RTMP_PORT, TEXTFIELD_PROPS_STREAM_KEY, TEXTFIELD_PROPS_WEB_PORT, } from './constants';
|
||||||
|
|
||||||
import configStyles from '../../../styles/config-pages.module.scss';
|
import configStyles from '../../../styles/config-pages.module.scss';
|
||||||
|
import { UpdateArgs } from '../../../types/config-section';
|
||||||
|
|
||||||
export default function EditInstanceDetails() {
|
export default function EditInstanceDetails() {
|
||||||
const [formDataValues, setFormDataValues] = useState(null);
|
const [formDataValues, setFormDataValues] = useState(null);
|
||||||
@ -23,7 +24,7 @@ export default function EditInstanceDetails() {
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleFieldChange = (fieldName: string, value: string) => {
|
const handleFieldChange = ({ fieldName, value }: UpdateArgs) => {
|
||||||
setFormDataValues({
|
setFormDataValues({
|
||||||
...formDataValues,
|
...formDataValues,
|
||||||
[fieldName]: value,
|
[fieldName]: value,
|
||||||
@ -41,7 +42,6 @@ export default function EditInstanceDetails() {
|
|||||||
type={TEXTFIELD_TYPE_PASSWORD}
|
type={TEXTFIELD_TYPE_PASSWORD}
|
||||||
onChange={handleFieldChange}
|
onChange={handleFieldChange}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<TextField
|
<TextField
|
||||||
fieldName="ffmpegPath"
|
fieldName="ffmpegPath"
|
||||||
{...TEXTFIELD_PROPS_FFMPEG}
|
{...TEXTFIELD_PROPS_FFMPEG}
|
||||||
|
|||||||
@ -8,7 +8,7 @@ TODO: Link each overview value to the sub-page that focuses on it.
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { useState, useEffect, useContext } from "react";
|
import React, { useState, useEffect, useContext } from "react";
|
||||||
import { Skeleton, Card, Statistic, Form } from "antd";
|
import { Skeleton, Card, Statistic } from "antd";
|
||||||
import { UserOutlined, ClockCircleOutlined } from "@ant-design/icons";
|
import { UserOutlined, ClockCircleOutlined } from "@ant-design/icons";
|
||||||
import { formatDistanceToNow, formatRelative } from "date-fns";
|
import { formatDistanceToNow, formatRelative } from "date-fns";
|
||||||
import { ServerStatusContext } from "../utils/server-status-context";
|
import { ServerStatusContext } from "../utils/server-status-context";
|
||||||
@ -24,6 +24,7 @@ import {
|
|||||||
FETCH_INTERVAL,
|
FETCH_INTERVAL,
|
||||||
} from "../utils/apis";
|
} from "../utils/apis";
|
||||||
import { formatIPAddress, isEmptyObject } from "../utils/format";
|
import { formatIPAddress, isEmptyObject } from "../utils/format";
|
||||||
|
import { UpdateArgs } from "../types/config-section";
|
||||||
|
|
||||||
function streamDetailsFormatter(streamDetails) {
|
function streamDetailsFormatter(streamDetails) {
|
||||||
return (
|
return (
|
||||||
@ -39,9 +40,10 @@ export default function Home() {
|
|||||||
const serverStatusData = useContext(ServerStatusContext);
|
const serverStatusData = useContext(ServerStatusContext);
|
||||||
const { broadcaster, serverConfig: configData } = serverStatusData || {};
|
const { broadcaster, serverConfig: configData } = serverStatusData || {};
|
||||||
const { remoteAddr, streamDetails } = broadcaster || {};
|
const { remoteAddr, streamDetails } = broadcaster || {};
|
||||||
|
const { instanceDetails } = configData;
|
||||||
|
|
||||||
const encoder = streamDetails?.encoder || "Unknown encoder";
|
const encoder = streamDetails?.encoder || "Unknown encoder";
|
||||||
const [streamTitle, setStreamTitle] = useState(configData.instanceDetails.streamTitle);
|
const [streamTitle, setStreamTitle] = useState('');
|
||||||
|
|
||||||
const [logsData, setLogs] = useState([]);
|
const [logsData, setLogs] = useState([]);
|
||||||
const getLogs = async () => {
|
const getLogs = async () => {
|
||||||
@ -56,6 +58,10 @@ export default function Home() {
|
|||||||
getLogs();
|
getLogs();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setStreamTitle(instanceDetails.streamTitle);
|
||||||
|
}, [instanceDetails]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
getMoreStats();
|
getMoreStats();
|
||||||
|
|
||||||
@ -77,7 +83,7 @@ export default function Home() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleStreamTitleChanged = (fieldName: string, value: string) => {
|
const handleStreamTitleChanged = ({ value }: UpdateArgs) => {
|
||||||
setStreamTitle(value);
|
setStreamTitle(value);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -156,7 +162,7 @@ export default function Home() {
|
|||||||
fieldName="streamTitle"
|
fieldName="streamTitle"
|
||||||
{...TEXTFIELD_PROPS_STREAM_TITLE}
|
{...TEXTFIELD_PROPS_STREAM_TITLE}
|
||||||
value={streamTitle}
|
value={streamTitle}
|
||||||
initialValue={streamTitle}
|
initialValue={instanceDetails.streamTitle}
|
||||||
onChange={handleStreamTitleChanged}
|
onChange={handleStreamTitleChanged}
|
||||||
/>
|
/>
|
||||||
</Card>
|
</Card>
|
||||||
|
|||||||
@ -11,8 +11,8 @@ export interface SocialHandleDropdownItem {
|
|||||||
export type FieldUpdaterFunc = (args: UpdateArgs) => void;
|
export type FieldUpdaterFunc = (args: UpdateArgs) => void;
|
||||||
|
|
||||||
export interface UpdateArgs {
|
export interface UpdateArgs {
|
||||||
fieldName: string;
|
|
||||||
value: any;
|
value: any;
|
||||||
|
fieldName?: string;
|
||||||
path?: string;
|
path?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user