feat(ui): allow directory selection and include all files recursively… (#58)

* feat(ui): allow directory selection and include all files recursively #57

* refactor: use walkdir crate instead of own solution #57

Author: CodeF0x

Cargo.lock

@@ -1,7 +1,7 @@
 use clap::Parser;
+use colored::*;
 use ffzap_core::{load_paths, CmdArgs, Logger, Processor, Progress};
 use std::sync::Arc;
-use colored::*;
 
 fn main() {
     let cmd_args = CmdArgs::parse();

cli/src/main.rs

@@ -21,6 +21,7 @@ clap.workspace = true
 serde = { workspace = true, features = ["derive"] }
 tauri = { workspace = true, optional = true }
 colored = { workspace = true }
+walkdir = "2.5.0"
 
 
 [features]

core/Cargo.toml

@@ -3,19 +3,20 @@ pub mod logger;
 pub mod processor;
 pub mod progress;
 
-use std::process::exit;
-use std::{fs, io::ErrorKind};
-#[cfg(feature = "ui")]
-use tauri::{AppHandle, Emitter};
 pub use args::CmdArgs;
 pub use logger::Logger;
 pub use processor::Processor;
 pub use progress::Progress;
+use std::path::Path;
+use std::process::exit;
+use std::{fs, io::ErrorKind};
+#[cfg(feature = "ui")]
+use tauri::{AppHandle, Emitter};
+use walkdir::WalkDir;
 
 pub fn load_paths(
     cmd_args: &CmdArgs,
-    #[cfg(feature = "ui")]
-    app_handle: &AppHandle
+    #[cfg(feature = "ui")] app_handle: &AppHandle,
 ) -> Vec<String> {
     if let Some(input_file_path) = &cmd_args.file_list {
         match fs::read_to_string(input_file_path) {
@@ -33,7 +34,8 @@ pub fn load_paths(
                         exit(1);
                     }
                     ErrorKind::PermissionDenied => {
-                        let error = format!("Permission denied when reading file {input_file_path}.");
+                        let error =
+                            format!("Permission denied when reading file {input_file_path}.");
                         eprintln!("{}", error);
                         #[cfg(not(feature = "ui"))]
                         exit(1);
@@ -76,6 +78,43 @@ pub fn load_paths(
             }
         }
     } else {
-        cmd_args.input.clone().unwrap()
+        let paths = cmd_args.input.clone().unwrap();
+        let mut files: Vec<String> = vec![];
+
+        for p in paths {
+            let path = Path::new(&p);
+            if path.is_file() {
+                files.push(p);
+            } else if path.is_dir() {
+                for entry in WalkDir::new(path)
+                    .follow_links(false)
+                    .into_iter()
+                    .filter_entry(|e| !e.path_is_symlink())
+                {
+                    match entry {
+                        Ok(entry) => {
+                            if entry.file_type().is_file() {
+                                files.push(entry.path().to_str().unwrap().to_string());
+                            }
+                        }
+                        Err(err) => {
+                            let error = format!(
+                                "Failed to read directory {}: {}",
+                                &err.path().unwrap().display(),
+                                err
+                            );
+
+                            #[cfg(not(feature = "ui"))]
+                            eprintln!("{}", error);
+
+                            #[cfg(feature = "ui")]
+                            let _ = app_handle.emit("file-list-error", error);
+                        }
+                    }
+                }
+            }
+        }
+
+        files
     }
 }

core/src/lib.rs

@@ -2,12 +2,12 @@
 use tauri::AppHandle;
 
 use crate::progress::Progress;
+use colored::*;
 use std::fs;
 use std::fs::File;
 use std::io::Write;
 use std::path::{Display, PathBuf};
 use std::sync::{Arc, Mutex, MutexGuard};
-use colored::*;
 
 pub struct Logger {
     progress: Arc<Progress>,

core/src/logger.rs

@@ -32,9 +32,15 @@ <h2>Input Files</h2>
                 <button class="browse-btn" id="browse-files-btn">
                   Browse Files
                 </button>
+                <button class="browse-btn" id="browse-folder-btn">
+                  Browse Folders
+                </button>
               </div>
               <div class="selected-files">
                 <h3>Selected Files (<span id="file-amount">0</span>)</h3>
+                <div class="info-text">
+                  If you selected an entire folder, not all files will be listed. They'll show up in the log / progressbar once you start the job.
+                </div>
                 <div class="file-list" id="file-list">Non selected</div>
               </div>
             </div>
@@ -45,9 +51,9 @@ <h3>Selected Files (<span id="file-amount">0</span>)</h3>
                   Browse Files
                 </button>
               </div>
-              <div class="selected-files">
+              <div class="selected-file-list">
                 <h3>File List Path</h3>
-                <div class="file-list-path" id="file-list-path">
+                <div class="file-list" id="file-list-path">
                   None selected
                 </div>
               </div>
@@ -74,7 +80,7 @@ <h2>Processing Options</h2>
                 <span class="info-text"
                   >Most systems can handle 2. Increase for powerful computers.
                   Adding more threads does not automatically make your job
-                  faster!</span
+                  faster! Balance out your ffmpeg options accordingly.</span
                 >
               </div>
             </div>

ui/index.html

@@ -34,6 +34,7 @@ document.addEventListener('DOMContentLoaded', () => {
   const browseListBtn = document.getElementById(
     'browse-list-btn',
   ) as HTMLButtonElement;
+  const browseFolderBtn = document.getElementById('browse-folder-btn') as HTMLButtonElement;
 
   browseFilesBtn.addEventListener('click', async () => {
     const files: string[] | null = await open({
@@ -49,6 +50,20 @@ document.addEventListener('DOMContentLoaded', () => {
     updateFileList(filesList);
     validateButton(allFiles, filesList);
   });
+  browseFolderBtn.addEventListener('click', async () => {
+    const path: string | null = await open({
+      multiple: false,
+      directory: true,
+    });
+
+    allFiles = path ? [path] : [];
+    filesList = null;
+
+    updateFileCount(allFiles?.length ?? 0);
+    updatePathsList(allFiles);
+    updateFileList(filesList);
+    validateButton(allFiles, filesList);
+  })
   browseListBtn.addEventListener('click', async () => {
     const file: string | null = await open({
       multiple: false,

ui/src/main.ts

@@ -195,6 +195,7 @@ body {
 /* File Input Section */
 .browse-files-btn-container {
   display: flex;
+  gap: var(--space-md);
   justify-content: center;
 }
 
@@ -226,12 +227,21 @@ body {
   margin-top: var(--space-xl);
 }
 
-.selected-files h3 {
+.selected-files h3,
+.selected-file-list h3 {
   font-size: var(--font-lg);
-  margin-bottom: var(--space-md);
+  margin-bottom: 0;
   color: var(--text-color);
 }
 
+.selected-files .info-text {
+  margin-bottom: var(--space-md);
+}
+
+.selected-file-list h3 {
+  margin-bottom: var(--space-md);
+}
+
 .file-list-input {
   display: flex;
   gap: var(--space-sm);