(null);
+
+ const value = localValue !== null ? localValue : displayPath;
+
+ return (
+
+ setLocalValue(displayPath)}
+ onChange={(e) => {
+ const val = e.target.value;
+ setLocalValue(val);
+ const basePrefix = base + '/';
+
+ if (!val.trim()) {
+ settings.setCategoryDirectoryOverride(category, undefined);
+ settings.setCategorySubfolder(category, '');
+ } else if (val.startsWith(basePrefix)) {
+ settings.setCategoryDirectoryOverride(category, undefined);
+ settings.setCategorySubfolder(category, val.substring(basePrefix.length));
+ } else {
+ settings.setCategoryDirectoryOverride(category, val);
+ }
+ }}
+ onBlur={() => {
+ setLocalValue(null);
+ // Normalize subfolder if not an override
+ const currentOverride = settings.categoryDirectoryOverrides[category];
+ if (!currentOverride) {
+ settings.setCategorySubfolder(
+ category,
+ normalizeCategorySubfolder(
+ settings.categorySubfolders[category] || '',
+ DEFAULT_CATEGORY_SUBFOLDERS[category as keyof typeof DEFAULT_CATEGORY_SUBFOLDERS]
+ )
+ );
+ }
+ }}
+ className="app-control flex-1 max-w-[280px] text-[12px] px-3 py-1.5 bg-surface-overlay/50 border-border-color/50 focus:border-accent-color focus:bg-surface-overlay"
+ aria-label={`${category} subfolder`}
+ />
+
+ {override && (
+
+ )}
+
+ );
+};
+
+// ... inside render:
{DOWNLOAD_CATEGORIES.map((category) => (
{category}
-
- settings.setCategorySubfolder(category, e.target.value)}
- onBlur={(e) => settings.setCategorySubfolder(
- category,
- normalizeCategorySubfolder(
- e.target.value,
- DEFAULT_CATEGORY_SUBFOLDERS[category]
- )
- )}
- className="app-control flex-1 max-w-[280px] text-[12px] px-3 py-1.5 bg-surface-overlay/50 border-border-color/50 focus:border-accent-color focus:bg-surface-overlay"
- aria-label={`${category} subfolder`}
- />
-
- {settings.categoryDirectoryOverrides[category] && (
-
- )}
-
+
handleBrowseCategory(category)}
+ />
- {settings.categoryDirectoryOverrides[category] && (
-
-
- Override
-
- {settings.categoryDirectoryOverrides[category]}
-
-
-
- )}
))}