mirror of
https://github.com/owncast/owncast.git
synced 2024-10-10 19:16:02 +00:00
cleanup
This commit is contained in:
parent
9812f4c874
commit
add2f1329b
@ -1,6 +1,6 @@
|
|||||||
/* eslint-disable react/no-array-index-key */
|
/* eslint-disable react/no-array-index-key */
|
||||||
import React, { useContext, useState, useEffect } from 'react';
|
import React, { useContext, useState, useEffect } from 'react';
|
||||||
import { Typography, Tag, Input } from 'antd';
|
import { Typography, Tag } from 'antd';
|
||||||
|
|
||||||
import { ServerStatusContext } from '../../../utils/server-status-context';
|
import { ServerStatusContext } from '../../../utils/server-status-context';
|
||||||
import { FIELD_PROPS_TAGS, RESET_TIMEOUT, postConfigUpdateToAPI } from './constants';
|
import { FIELD_PROPS_TAGS, RESET_TIMEOUT, postConfigUpdateToAPI } from './constants';
|
||||||
@ -18,10 +18,9 @@ import {
|
|||||||
const { Title } = Typography;
|
const { Title } = Typography;
|
||||||
|
|
||||||
export default function EditInstanceTags() {
|
export default function EditInstanceTags() {
|
||||||
const [newTagInput, setNewTagInput] = useState('');
|
const [newTagInput, setNewTagInput] = useState<string | number>('');
|
||||||
const [fieldStatus, setFieldStatus] = useState<StatusState>(null);
|
const [fieldStatus, setFieldStatus] = useState<StatusState>(null);
|
||||||
// const [submitStatus, setSubmitStatus] = useState(null);
|
|
||||||
// const [submitStatusMessage, setSubmitStatusMessage] = useState('');
|
|
||||||
const serverStatusData = useContext(ServerStatusContext);
|
const serverStatusData = useContext(ServerStatusContext);
|
||||||
const { serverConfig, setFieldInConfigState } = serverStatusData || {};
|
const { serverConfig, setFieldInConfigState } = serverStatusData || {};
|
||||||
|
|
||||||
@ -39,8 +38,6 @@ export default function EditInstanceTags() {
|
|||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const resetStates = () => {
|
const resetStates = () => {
|
||||||
// setSubmitStatus(null);
|
|
||||||
// setSubmitStatusMessage('');
|
|
||||||
setFieldStatus(null);
|
setFieldStatus(null);
|
||||||
resetTimer = null;
|
resetTimer = null;
|
||||||
clearTimeout(resetTimer);
|
clearTimeout(resetTimer);
|
||||||
@ -56,17 +53,11 @@ export default function EditInstanceTags() {
|
|||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
setFieldInConfigState({ fieldName: 'tags', value: postValue, path: configPath });
|
setFieldInConfigState({ fieldName: 'tags', value: postValue, path: configPath });
|
||||||
setFieldStatus(createInputStatus(STATUS_SUCCESS, 'Tags updated.'));
|
setFieldStatus(createInputStatus(STATUS_SUCCESS, 'Tags updated.'));
|
||||||
|
|
||||||
// setSubmitStatus('success');
|
|
||||||
// setSubmitStatusMessage('Tags updated.');
|
|
||||||
setNewTagInput('');
|
setNewTagInput('');
|
||||||
resetTimer = setTimeout(resetStates, RESET_TIMEOUT);
|
resetTimer = setTimeout(resetStates, RESET_TIMEOUT);
|
||||||
},
|
},
|
||||||
onError: (message: string) => {
|
onError: (message: string) => {
|
||||||
setFieldStatus(createInputStatus(STATUS_ERROR, message));
|
setFieldStatus(createInputStatus(STATUS_ERROR, message));
|
||||||
|
|
||||||
// setSubmitStatus('error');
|
|
||||||
// setSubmitStatusMessage(message);
|
|
||||||
resetTimer = setTimeout(resetStates, RESET_TIMEOUT);
|
resetTimer = setTimeout(resetStates, RESET_TIMEOUT);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@ -76,9 +67,6 @@ export default function EditInstanceTags() {
|
|||||||
if (!fieldStatus) {
|
if (!fieldStatus) {
|
||||||
setFieldStatus(null);
|
setFieldStatus(null);
|
||||||
}
|
}
|
||||||
// if (submitStatusMessage !== '') {
|
|
||||||
// setSubmitStatusMessage('');
|
|
||||||
// }
|
|
||||||
setNewTagInput(value);
|
setNewTagInput(value);
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -88,14 +76,10 @@ export default function EditInstanceTags() {
|
|||||||
const newTag = newTagInput.trim();
|
const newTag = newTagInput.trim();
|
||||||
if (newTag === '') {
|
if (newTag === '') {
|
||||||
setFieldStatus(createInputStatus(STATUS_WARNING, 'Please enter a tag'));
|
setFieldStatus(createInputStatus(STATUS_WARNING, 'Please enter a tag'));
|
||||||
|
|
||||||
// setSubmitStatusMessage('Please enter a tag');
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (tags.some(tag => tag.toLowerCase() === newTag.toLowerCase())) {
|
if (tags.some(tag => tag.toLowerCase() === newTag.toLowerCase())) {
|
||||||
setFieldStatus(createInputStatus(STATUS_WARNING, 'This tag is already used!'));
|
setFieldStatus(createInputStatus(STATUS_WARNING, 'This tag is already used!'));
|
||||||
|
|
||||||
// setSubmitStatusMessage('This tag is already used!');
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -110,11 +94,6 @@ export default function EditInstanceTags() {
|
|||||||
postUpdateToAPI(updatedTags);
|
postUpdateToAPI(updatedTags);
|
||||||
};
|
};
|
||||||
|
|
||||||
// const {
|
|
||||||
// icon: newStatusIcon = null,
|
|
||||||
// message: newStatusMessage = '',
|
|
||||||
// } = fieldStatus || {};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="tag-editor-container">
|
<div className="tag-editor-container">
|
||||||
<Title level={3}>Add Tags</Title>
|
<Title level={3}>Add Tags</Title>
|
||||||
@ -132,9 +111,7 @@ export default function EditInstanceTags() {
|
|||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
{/* <div className={`status-message ${submitStatus || ''}`}>
|
|
||||||
{newStatusIcon} {newStatusMessage} {submitStatusMessage}
|
|
||||||
</div> */}
|
|
||||||
<div className="add-new-tag-section">
|
<div className="add-new-tag-section">
|
||||||
<TextField
|
<TextField
|
||||||
fieldName="tag-input"
|
fieldName="tag-input"
|
||||||
@ -145,7 +122,6 @@ export default function EditInstanceTags() {
|
|||||||
maxLength={maxLength}
|
maxLength={maxLength}
|
||||||
placeholder={placeholder}
|
placeholder={placeholder}
|
||||||
status={fieldStatus}
|
status={fieldStatus}
|
||||||
// message={`${newStatusIcon} ${newStatusMessage} ${submitStatusMessage}`}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -30,7 +30,7 @@ export default function TextFieldWithSubmit(props: TextFieldWithSubmitProps) {
|
|||||||
const [fieldStatus, setFieldStatus] = useState<StatusState>(null);
|
const [fieldStatus, setFieldStatus] = useState<StatusState>(null);
|
||||||
|
|
||||||
const [hasChanged, setHasChanged] = useState(false);
|
const [hasChanged, setHasChanged] = useState(false);
|
||||||
const [fieldValueForSubmit, setFieldValueForSubmit] = useState<string | number>('');
|
// const [fieldValueForSubmit, setFieldValueForSubmit] = useState<string | number>('');
|
||||||
|
|
||||||
const serverStatusData = useContext(ServerStatusContext);
|
const serverStatusData = useContext(ServerStatusContext);
|
||||||
const { setFieldInConfigState } = serverStatusData || {};
|
const { setFieldInConfigState } = serverStatusData || {};
|
||||||
@ -44,16 +44,7 @@ export default function TextFieldWithSubmit(props: TextFieldWithSubmitProps) {
|
|||||||
...textFieldProps // rest of props
|
...textFieldProps // rest of props
|
||||||
} = props;
|
} = props;
|
||||||
|
|
||||||
const {
|
const { fieldName, required, status, value, onChange, onSubmit } = textFieldProps;
|
||||||
fieldName,
|
|
||||||
required,
|
|
||||||
status,
|
|
||||||
// type,
|
|
||||||
value,
|
|
||||||
onChange,
|
|
||||||
// onBlur,
|
|
||||||
onSubmit,
|
|
||||||
} = textFieldProps;
|
|
||||||
|
|
||||||
// Clear out any validation states and messaging
|
// Clear out any validation states and messaging
|
||||||
const resetStates = () => {
|
const resetStates = () => {
|
||||||
@ -73,7 +64,7 @@ export default function TextFieldWithSubmit(props: TextFieldWithSubmitProps) {
|
|||||||
// show submit button
|
// show submit button
|
||||||
resetStates();
|
resetStates();
|
||||||
setHasChanged(true);
|
setHasChanged(true);
|
||||||
setFieldValueForSubmit(value);
|
// setFieldValueForSubmit(value);
|
||||||
}
|
}
|
||||||
}, [value]);
|
}, [value]);
|
||||||
|
|
||||||
@ -93,24 +84,18 @@ export default function TextFieldWithSubmit(props: TextFieldWithSubmitProps) {
|
|||||||
|
|
||||||
// how to get current value of input
|
// how to get current value of input
|
||||||
const handleSubmit = async () => {
|
const handleSubmit = async () => {
|
||||||
if ((required && fieldValueForSubmit !== '') || fieldValueForSubmit !== initialValue) {
|
if ((required && value !== '') || value !== initialValue) {
|
||||||
setFieldStatus(createInputStatus(STATUS_PROCESSING));
|
setFieldStatus(createInputStatus(STATUS_PROCESSING));
|
||||||
|
|
||||||
// setSubmitStatus('validating');
|
|
||||||
|
|
||||||
await postConfigUpdateToAPI({
|
await postConfigUpdateToAPI({
|
||||||
apiPath,
|
apiPath,
|
||||||
data: { value: fieldValueForSubmit },
|
data: { value },
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
setFieldInConfigState({ fieldName, value: fieldValueForSubmit, path: configPath });
|
setFieldInConfigState({ fieldName, value, path: configPath });
|
||||||
setFieldStatus(createInputStatus(STATUS_SUCCESS));
|
setFieldStatus(createInputStatus(STATUS_SUCCESS));
|
||||||
// setSubmitStatus('success');
|
|
||||||
},
|
},
|
||||||
onError: (message: string) => {
|
onError: (message: string) => {
|
||||||
setFieldStatus(createInputStatus(STATUS_ERROR, `There was an error: ${message}`));
|
setFieldStatus(createInputStatus(STATUS_ERROR, `There was an error: ${message}`));
|
||||||
|
|
||||||
// setSubmitStatus('error');
|
|
||||||
// setSubmitStatusMessage(`There was an error: ${message}`);
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
resetTimer = setTimeout(resetStates, RESET_TIMEOUT);
|
resetTimer = setTimeout(resetStates, RESET_TIMEOUT);
|
||||||
|
|||||||
@ -1,6 +1,5 @@
|
|||||||
// TS types for elements on the Config pages
|
// TS types for elements on the Config pages
|
||||||
|
|
||||||
|
|
||||||
// for dropdown
|
// for dropdown
|
||||||
export interface SocialHandleDropdownItem {
|
export interface SocialHandleDropdownItem {
|
||||||
icon: string;
|
icon: string;
|
||||||
@ -17,15 +16,15 @@ export interface UpdateArgs {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export interface ApiPostArgs {
|
export interface ApiPostArgs {
|
||||||
apiPath: string,
|
apiPath: string;
|
||||||
data: object,
|
data: object;
|
||||||
onSuccess?: (arg: any) => void,
|
onSuccess?: (arg: any) => void;
|
||||||
onError?: (arg: any) => void,
|
onError?: (arg: any) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ConfigDirectoryFields {
|
export interface ConfigDirectoryFields {
|
||||||
enabled: boolean;
|
enabled: boolean;
|
||||||
instanceUrl: string,
|
instanceUrl: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ConfigInstanceDetailsFields {
|
export interface ConfigInstanceDetailsFields {
|
||||||
@ -33,14 +32,13 @@ export interface ConfigInstanceDetailsFields {
|
|||||||
logo: string;
|
logo: string;
|
||||||
name: string;
|
name: string;
|
||||||
nsfw: boolean;
|
nsfw: boolean;
|
||||||
socialHandles: SocialHandle[],
|
socialHandles: SocialHandle[];
|
||||||
streamTitle: string;
|
streamTitle: string;
|
||||||
summary: string;
|
summary: string;
|
||||||
tags: string[];
|
tags: string[];
|
||||||
title: string;
|
title: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
export type CpuUsageLevel = 1 | 2 | 3 | 4 | 5;
|
export type CpuUsageLevel = 1 | 2 | 3 | 4 | 5;
|
||||||
|
|
||||||
// from data
|
// from data
|
||||||
@ -51,7 +49,7 @@ export interface SocialHandle {
|
|||||||
|
|
||||||
export interface VideoVariant {
|
export interface VideoVariant {
|
||||||
key?: number; // unique identifier generated on client side just for ant table rendering
|
key?: number; // unique identifier generated on client side just for ant table rendering
|
||||||
cpuUsageLevel: CpuUsageLevel,
|
cpuUsageLevel: CpuUsageLevel;
|
||||||
framerate: number;
|
framerate: number;
|
||||||
|
|
||||||
audioPassthrough: boolean;
|
audioPassthrough: boolean;
|
||||||
@ -61,11 +59,10 @@ export interface VideoVariant {
|
|||||||
}
|
}
|
||||||
export interface VideoSettingsFields {
|
export interface VideoSettingsFields {
|
||||||
latencyLevel: number;
|
latencyLevel: number;
|
||||||
videoQualityVariants: VideoVariant[],
|
videoQualityVariants: VideoVariant[];
|
||||||
cpuUsageLevel: CpuUsageLevel,
|
cpuUsageLevel: CpuUsageLevel;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
export interface ConfigDetails {
|
export interface ConfigDetails {
|
||||||
ffmpegPath: string;
|
ffmpegPath: string;
|
||||||
instanceDetails: ConfigInstanceDetailsFields;
|
instanceDetails: ConfigInstanceDetailsFields;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user