michael/ripster
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

0.10.2-11 Layout

Browse Source
This commit is contained in:
mboehmlaender
2026-03-16 11:30:09 +00:00
parent 42eceea521
commit bf72c40ae1
9 changed files with 214 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/DynamicSettingsForm.jsx
+52 -124
View File
@@ -1,5 +1,6 @@
import { useEffect, useRef, useState } from 'react';
import { TabView, TabPanel } from 'primereact/tabview';
import { Accordion, AccordionTab } from 'primereact/accordion';
import { InputText } from 'primereact/inputtext';
import { InputNumber } from 'primereact/inputnumber';
import { InputSwitch } from 'primereact/inputswitch';
@@ -68,7 +69,8 @@ const EXPERT_ONLY_SETTING_KEYS = new Set([
'makemkv_analyze_extra_args_dvd',
'makemkv_rip_extra_args_bluray',
'makemkv_rip_extra_args_dvd',
'cdparanoia_command'
'cdparanoia_command',
'script_test_timeout_ms'
]);
function toBoolean(value) {
@@ -331,51 +333,6 @@ function SettingField({
);
}
function PathMediumCard({ title, pathSettings, settingsByKey, values, errors, dirtyKeys, onChange }) {
// Filter out _owner keys since they're rendered inline
const visibleSettings = pathSettings.filter(
(s) => !String(s?.key || '').endsWith('_owner')
);
if (visibleSettings.length === 0) {
return null;
}
return (
<div className="path-medium-card">
<div className="path-medium-card-header">
<h4>{title}</h4>
</div>
<div className="settings-grid">
{visibleSettings.map((setting) => {
const value = values?.[setting.key];
const error = errors?.[setting.key] || null;
const dirty = Boolean(dirtyKeys?.has?.(setting.key));
const ownerKey = `${setting.key}_owner`;
const ownerSetting = settingsByKey.get(ownerKey) || null;
const ownerValue = values?.[ownerKey];
const ownerError = errors?.[ownerKey] || null;
const ownerDirty = Boolean(dirtyKeys?.has?.(ownerKey));
return (
<SettingField
key={setting.key}
setting={setting}
value={value}
error={error}
dirty={dirty}
ownerSetting={ownerSetting}
ownerValue={ownerValue}
ownerError={ownerError}
ownerDirty={ownerDirty}
onChange={onChange}
/>
);
})}
</div>
</div>
);
}
function PathCategoryTab({ settings, values, errors, dirtyKeys, onChange, effectivePaths }) {
const list = Array.isArray(settings) ? settings : [];
@@ -478,84 +435,55 @@ function PathCategoryTab({ settings, values, errors, dirtyKeys, onChange, effect
</div>
</div>
{/* Medium-Karten */}
<div className="path-medium-cards">
<PathMediumCard
title="Blu-ray"
pathSettings={bluraySettings}
settingsByKey={settingsByKey}
values={values}
errors={errors}
dirtyKeys={dirtyKeys}
onChange={onChange}
/>
<PathMediumCard
title="DVD"
pathSettings={dvdSettings}
settingsByKey={settingsByKey}
values={values}
errors={errors}
dirtyKeys={dirtyKeys}
onChange={onChange}
/>
<PathMediumCard
title="CD / Audio"
pathSettings={cdSettings}
settingsByKey={settingsByKey}
values={values}
errors={errors}
dirtyKeys={dirtyKeys}
onChange={onChange}
/>
<PathMediumCard
title="Audiobook"
pathSettings={audiobookSettings}
settingsByKey={settingsByKey}
values={values}
errors={errors}
dirtyKeys={dirtyKeys}
onChange={onChange}
/>
<PathMediumCard
title="Downloads"
pathSettings={downloadSettings}
settingsByKey={settingsByKey}
values={values}
errors={errors}
dirtyKeys={dirtyKeys}
onChange={onChange}
/>
</div>
{/* Log-Ordner */}
{logSettings.length > 0 && (
<div className="path-medium-card">
<div className="path-medium-card-header">
<h4>Logs</h4>
</div>
<div className="settings-grid">
{logSettings.map((setting) => {
const value = values?.[setting.key];
const error = errors?.[setting.key] || null;
const dirty = Boolean(dirtyKeys?.has?.(setting.key));
return (
<SettingField
key={setting.key}
setting={setting}
value={value}
error={error}
dirty={dirty}
ownerSetting={null}
ownerValue={null}
ownerError={null}
ownerDirty={false}
onChange={onChange}
/>
);
})}
</div>
</div>
)}
{/* Medium-Karten als Accordion */}
<Accordion className="path-medium-accordion">
{[
{ title: 'Blu-ray', pathSettings: bluraySettings },
{ title: 'DVD', pathSettings: dvdSettings },
{ title: 'CD / Audio', pathSettings: cdSettings },
{ title: 'Audiobook', pathSettings: audiobookSettings },
{ title: 'Downloads', pathSettings: downloadSettings },
...(logSettings.length > 0 ? [{ title: 'Logs', pathSettings: logSettings }] : [])
]
.filter(({ pathSettings }) =>
pathSettings.filter((s) => !String(s?.key || '').endsWith('_owner')).length > 0
)
.map(({ title, pathSettings }) => {
const visibleSettings = pathSettings.filter(
(s) => !String(s?.key || '').endsWith('_owner')
);
return (
<AccordionTab key={title} header={title}>
<div className="settings-grid">
{visibleSettings.map((setting) => {
const value = values?.[setting.key];
const error = errors?.[setting.key] || null;
const dirty = Boolean(dirtyKeys?.has?.(setting.key));
const ownerKey = `${setting.key}_owner`;
const ownerSetting = settingsByKey.get(ownerKey) || null;
const ownerValue = values?.[ownerKey];
const ownerError = errors?.[ownerKey] || null;
const ownerDirty = Boolean(dirtyKeys?.has?.(ownerKey));
return (
<SettingField
key={setting.key}
setting={setting}
value={value}
error={error}
dirty={dirty}
ownerSetting={ownerSetting}
ownerValue={ownerValue}
ownerError={ownerError}
ownerDirty={ownerDirty}
onChange={onChange}
/>
);
})}
</div>
</AccordionTab>
);
})}
</Accordion>
</div>
);
}