From e795c2b33e1c257e3b6d227fad1bab0d3bce4bc1 Mon Sep 17 00:00:00 2001
From: Ingo Oppermann <ingo@datarhei.com>
Date: Tue, 8 Nov 2022 11:31:52 +0100
Subject: [PATCH] Move component to common collection to avoid duplication

---
 src/misc/coders/Encoders/video/VP9.js  | 22 +---------------------
 src/misc/coders/Encoders/video/X264.js | 18 +-----------------
 src/misc/coders/Encoders/video/X265.js | 18 +-----------------
 src/misc/coders/settings/Video.js      | 25 +++++++++++++++++++++++++
 4 files changed, 28 insertions(+), 55 deletions(-)

diff --git a/src/misc/coders/Encoders/video/VP9.js b/src/misc/coders/Encoders/video/VP9.js
index c82f9ca..ec1f7bc 100644
--- a/src/misc/coders/Encoders/video/VP9.js
+++ b/src/misc/coders/Encoders/video/VP9.js
@@ -2,11 +2,7 @@ import React from 'react';
 import SemverSatisfies from 'semver/functions/satisfies';
 
 import Grid from '@mui/material/Grid';
-import MenuItem from '@mui/material/MenuItem';
 
-import { Trans } from '@lingui/macro';
-
-import Select from '../../../Select';
 import Video from '../../settings/Video';
 
 function init(initialState) {
@@ -65,22 +61,6 @@ function createMapping(settings, skills) {
 	return mapping;
 }
 
-function FpsMode(props) {
-	return (
-		<Select label={<Trans>Frames per second mode</Trans>} value={props.value} onChange={props.onChange}>
-			<MenuItem value="passthrough"><Trans>Frame is passed (Passthrough)</Trans></MenuItem>
-			<MenuItem value="cfr"><Trans>Constant frame rate (CFR)</Trans></MenuItem>
-			<MenuItem value="vfr"><Trans>Variable frame rate (VFR)</Trans></MenuItem>
-			<MenuItem value="auto"><Trans>Chooses between CRF and VFR (Auto)</Trans></MenuItem>
-		</Select>
-	);
-}
-
-FpsMode.defaultProps = {
-	value: '',
-	onChange: function (event) {},
-};
-
 function Coder(props) {
 	const settings = init(props.settings);
 	let ffversion = 4;
@@ -125,7 +105,7 @@ function Coder(props) {
 			</Grid>
 			{ffversion === 5 && (
 				<Grid item xs={12}>
-					<FpsMode value={settings.fps_mode} onChange={update('fps_mode')} />
+					<Video.FpsMode value={settings.fps_mode} onChange={update('fps_mode')} />
 				</Grid>
 			)}
 		</Grid>
diff --git a/src/misc/coders/Encoders/video/X264.js b/src/misc/coders/Encoders/video/X264.js
index 5ebeb71..d390153 100644
--- a/src/misc/coders/Encoders/video/X264.js
+++ b/src/misc/coders/Encoders/video/X264.js
@@ -118,22 +118,6 @@ Tune.defaultProps = {
 	onChange: function (event) {},
 };
 
-function FpsMode(props) {
-	return (
-		<Select label={<Trans>Frames per second mode</Trans>} value={props.value} onChange={props.onChange}>
-			<MenuItem value="passthrough"><Trans>Frame is passed (Passthrough)</Trans></MenuItem>
-			<MenuItem value="cfr"><Trans>Constant frame rate (CFR)</Trans></MenuItem>
-			<MenuItem value="vfr"><Trans>Variable frame rate (VFR)</Trans></MenuItem>
-			<MenuItem value="auto"><Trans>Chooses between CRF and VFR (Auto)</Trans></MenuItem>
-		</Select>
-	);
-}
-
-FpsMode.defaultProps = {
-	value: '',
-	onChange: function (event) {},
-};
-
 function Coder(props) {
 	const settings = init(props.settings);
 	let ffversion = 4;
@@ -178,7 +162,7 @@ function Coder(props) {
 			</Grid>
 			{ffversion === 5 && (
 				<Grid item xs={12}>
-					<FpsMode value={settings.fps_mode} onChange={update('fps_mode')} />
+					<Video.FpsMode value={settings.fps_mode} onChange={update('fps_mode')} />
 				</Grid>
 			)}
 			<Grid item xs={6}>
diff --git a/src/misc/coders/Encoders/video/X265.js b/src/misc/coders/Encoders/video/X265.js
index 3ace30d..7db0742 100644
--- a/src/misc/coders/Encoders/video/X265.js
+++ b/src/misc/coders/Encoders/video/X265.js
@@ -118,22 +118,6 @@ Tune.defaultProps = {
 	onChange: function (event) {},
 };
 
-function FpsMode(props) {
-	return (
-		<Select label={<Trans>Frames per second mode</Trans>} value={props.value} onChange={props.onChange}>
-			<MenuItem value="passthrough"><Trans>Frame is passed (Passthrough)</Trans></MenuItem>
-			<MenuItem value="cfr"><Trans>Constant frame rate (CFR)</Trans></MenuItem>
-			<MenuItem value="vfr"><Trans>Variable frame rate (VFR)</Trans></MenuItem>
-			<MenuItem value="auto"><Trans>Chooses between CRF and VFR (Auto)</Trans></MenuItem>
-		</Select>
-	);
-}
-
-FpsMode.defaultProps = {
-	value: '',
-	onChange: function (event) {},
-};
-
 function Coder(props) {
 	const settings = init(props.settings);
 	let ffversion = 4;
@@ -178,7 +162,7 @@ function Coder(props) {
 			</Grid>
 			{ffversion === 5 && (
 				<Grid item xs={12}>
-					<FpsMode value={settings.fps_mode} onChange={update('fps_mode')} />
+					<Video.FpsMode value={settings.fps_mode} onChange={update('fps_mode')} />
 				</Grid>
 			)}
 			<Grid item xs={6}>
diff --git a/src/misc/coders/settings/Video.js b/src/misc/coders/settings/Video.js
index 71b786d..dacf3f1 100644
--- a/src/misc/coders/settings/Video.js
+++ b/src/misc/coders/settings/Video.js
@@ -327,6 +327,30 @@ Format.defaultProps = {
 	onChange: function (event) {},
 };
 
+function FpsMode(props) {
+	return (
+		<Select label={<Trans>Framerate mode</Trans>} value={props.value} onChange={props.onChange}>
+			<MenuItem value="passthrough">
+				<Trans>Frame is passed through (Passthrough)</Trans>
+			</MenuItem>
+			<MenuItem value="cfr">
+				<Trans>Constant frame rate (CFR)</Trans>
+			</MenuItem>
+			<MenuItem value="vfr">
+				<Trans>Variable frame rate (VFR)</Trans>
+			</MenuItem>
+			<MenuItem value="auto">
+				<Trans>Choose between CFR and VFR (Auto)</Trans>
+			</MenuItem>
+		</Select>
+	);
+}
+
+FpsMode.defaultProps = {
+	value: '',
+	onChange: function (event) {},
+};
+
 export default {
 	Bitrate,
 	GOP,
@@ -336,4 +360,5 @@ export default {
 	Width,
 	Height,
 	Format,
+	FpsMode,
 };