fix: Open Folder Button in Image Viewer Does Nothing (Fixes #959)

[Code-With-Devansh]

Summary by CodeRabbit

• Bug Fixes
  • Enhanced the open-folder functionality with improved environment compatibility checks and error handling to ensure reliable operation across all environments.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[github-actions]

⚠️ No issue was linked in the PR description.
Please make sure to link an issue (e.g., 'Fixes #issue_number')

[coderabbitai]

📝 Walkthrough

Walkthrough

The change adds Tauri-specific folder-open functionality to MediaView.tsx with runtime environment checks. It introduces guarded dynamic imports of the Tauri plugin-opener and includes error handling for missing or unavailable functions.

Changes

Cohort / File(s)	Summary
Tauri folder-open enhancement frontend/src/components/Media/MediaView.tsx	Adds isTauriEnvironment import and refactors handleOpenFolder with: early-exit guard for non-Tauri environments, dynamic import of @tauri-apps/plugin-opener, function existence check before invoking opener.revealItemInDir, and fallback warning logs for missing function.

Sequence Diagram(s)

sequenceDiagram
    actor User
    participant MediaView
    participant isTauriEnvironment
    participant Tauri Plugin
    
    User->>MediaView: Click open folder
    MediaView->>isTauriEnvironment: Check environment
    alt Not Tauri
        isTauriEnvironment-->>MediaView: false
        MediaView->>MediaView: Log warning & return
    else Is Tauri
        isTauriEnvironment-->>MediaView: true
        MediaView->>Tauri Plugin: Dynamic import opener
        Tauri Plugin-->>MediaView: Plugin loaded
        alt revealItemInDir exists
            MediaView->>Tauri Plugin: Call revealItemInDir(imagePath)
            Tauri Plugin-->>User: Reveal item in directory
        else Function missing
            MediaView->>MediaView: Log warning
        end
    end

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• feat(media-view): Implement open folder and enhance controls (#539) #577: Modifies MediaView's folder-opening behavior and the onOpenFolder handler implementation with related control-path changes.

Suggested labels

bug, frontend

Suggested reviewers

• rahulharpal1603
• Aditya30ag

Poem

🐰 Tauri's paths now guarded true,
With runtime checks for me and you,
Dynamically we load and test,
Folder reveals serve the best! 📁✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main fix: enabling the 'Open Folder' button functionality in the image viewer by adding Tauri-specific implementation with proper environment checks.

✨ Finishing touches

• 📝 Generate docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

⚠️ No issue was linked in the PR description.
Please make sure to link an issue (e.g., 'Fixes #issue_number')

[coderabbitai]

Actionable comments posted: 0

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

frontend/src/components/Media/MediaView.tsx (1)

106-109: Remove duplicate error logging.

Both console.log(err) and console.error('Failed to open folder.') are present. The console.log(err) is redundant since the error details are already captured. Keep only the console.error with the error object for better debugging context.

🔎 Proposed fix

 } catch (err) {
-  console.log(err);
-  console.error('Failed to open folder.');
+  console.error('Failed to open folder:', err);
 }

🧹 Nitpick comments (2)

frontend/src/components/Media/MediaView.tsx (2)

3-3: Remove commented-out import.

The commented import is no longer needed since the plugin is now dynamically imported. Consider removing it to keep the codebase clean.

🔎 Cleanup suggestion

-// import { revealItemInDir } from '@tauri-apps/plugin-opener';

---

100-105: Consider simplifying the function existence check.

The dynamic import approach is correct for lazy-loading the Tauri plugin. However, the typeof opener.revealItemInDir === 'function' check is unnecessary—revealItemInDir is a documented, stable API in v2.5.2 that is consistently exported and always available when the module imports successfully.

🔎 Suggested simplification

 const opener = await import('@tauri-apps/plugin-opener');
-if (typeof opener.revealItemInDir === 'function') {
-  await opener.revealItemInDir(currentImage.path);
-} else {
-  console.warn('revealItemInDir function not found');
-}
+await opener.revealItemInDir(currentImage.path);

📜 Review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 63330a8 and 4b9d8a6.

📒 Files selected for processing (1)

• frontend/src/components/Media/MediaView.tsx

🧰 Additional context used

🧬 Code graph analysis (1)

frontend/src/components/Media/MediaView.tsx (1)

frontend/src/utils/tauriUtils.ts (1)

• isTauriEnvironment (15-38)

🔇 Additional comments (2)

frontend/src/components/Media/MediaView.tsx (2)

24-24: LGTM!

The import of isTauriEnvironment is appropriate for guarding Tauri-specific functionality.

---

95-98: LGTM!

The environment check properly guards against calling Tauri-specific functionality in non-Tauri environments (e.g., web browser).

[github-actions]

⚠️ No issue was linked in the PR description.
Please make sure to link an issue (e.g., 'Fixes #issue_number')