Implement WAV file picker for custom sounds

Co-Authored-By: SamsidParty <[email protected]>

Author: SamarthMP

TopNotify/GUI/MainCommands.cs

@@ -113,5 +113,11 @@ public static async Task OpenAppFolder(WebWindow target)
         {
             Process.Start("explorer.exe", Settings.GetAppDataFolder());
         }
+
+        [Command("OpenSoundFolder")]
+        public static async Task OpenSoundFolder(WebWindow target)
+        {
+            Process.Start("explorer.exe", SoundFinder.ImportedSoundFolder);
+        }
     }
 }

TopNotify/GUI/SoundFinder.cs

@@ -1,4 +1,5 @@
 using IgniteView.Core;
+using IgniteView.FileDialogs;
 using Newtonsoft.Json;
 using System;
 using System.Collections.Generic;
@@ -14,6 +15,8 @@ namespace TopNotify.GUI
 {
     public class SoundFinder
     {
+        public static string ImportedSoundFolder => Path.Join(Settings.GetAppDataFolder(), "NotificationSounds", "imported");
+
         [Command("FindSounds")]
         public static string FindSounds()
         {
@@ -23,7 +26,7 @@ public static string FindSounds()
 
             // Inject Files From Music Folder Into The JSON File
             dynamic packToInject = soundPacks.Where((dynamic pack) => pack.ID == "custom_sound_path").FirstOrDefault();
-            var wavFiles = GetWAVFilesInMusicFolder();
+            var wavFiles = GetImportedWAVFiles();
 
             foreach (var wavFile in wavFiles)
             {
@@ -38,6 +41,33 @@ public static string FindSounds()
             return JsonConvert.SerializeObject(soundPacks);
         }
 
+        /// <summary>
+        /// Opens a file dialog to select a sound file and imports it
+        /// </summary>
+        [Command("ImportSound")]
+        public static string[] ImportSound()
+        {
+            var soundPath = FileDialog.PickFile(new FileFilter("wav"));
+
+            if (!string.IsNullOrEmpty(soundPath) && File.Exists(soundPath) && Path.GetExtension(soundPath).ToLower() == ".wav")
+            {
+                GetImportedWAVFiles(); // Makes sure ImportedSoundFolder exists
+                var soundName = Path.GetFileNameWithoutExtension(soundPath);
+
+                // Prevent duplicate files
+                while (File.Exists(Path.Join(ImportedSoundFolder, soundName + ".wav")))
+                {
+                    soundName += "_";
+                }
+
+                var copiedSoundPath = Path.Join(ImportedSoundFolder, soundName + ".wav");
+                File.Copy(soundPath, copiedSoundPath, true);
+                return new string[] { "custom_sound_path/" + copiedSoundPath, Path.GetFileNameWithoutExtension(soundPath) };
+            }
+
+            return new string[0];
+        }
+
         /// <summary>
         /// Plays the provided sound ID
         /// </summary>
@@ -50,17 +80,23 @@ public static void PreviewSound(string soundID)
         /// <summary>
         /// Returns A List Of WAV Files In The Music Folder
         /// </summary>
-        public static string[] GetWAVFilesInMusicFolder()
+        public static string[] GetImportedWAVFiles()
         {
             try
             {
                 var musicFolder = Environment.ExpandEnvironmentVariables("%USERPROFILE%\\Music");
 
+                if (!Directory.Exists(ImportedSoundFolder)) { Directory.CreateDirectory(ImportedSoundFolder); }
+
+                var importedFiles = Directory.GetFiles(ImportedSoundFolder, "*.wav", SearchOption.AllDirectories);
+
                 // Music folder doesn't always exist https://github.com/SamsidParty/TopNotify/issues/40#issuecomment-2692353622
                 if (Directory.Exists(musicFolder))
                 {
-                    return Directory.GetFiles(musicFolder, "*.wav", SearchOption.AllDirectories);
+                    return Directory.GetFiles(musicFolder, "*.wav", SearchOption.AllDirectories).Concat(importedFiles).ToArray();
                 }
+
+                return importedFiles;
             }
             catch { }
 

TopNotify/iv2runtime/TopNotify.igniteview

@@ -1,7 +1,7 @@
 [
     {
         "Name": "Your Collection",
-        "Description": ".WAV files from your music folder will show up here",
+        "Description": "Use your own custom .WAV files as your notification sound",
         "ID": "custom_sound_path",
         "Sounds": [
             {

TopNotify/src-vite/public/Meta/SoundPacks.json

@@ -76,8 +76,13 @@
     height: calc(17vw);
 }
 
-.soundItem img {
-    height: 60px;
+.soundItem img, .soundItem > .soundItemButton svg {
+    height: 50px;
+    width: 50px;
+}
+
+.soundItem > .soundItemButton * {
+    color: #757DF9;
 }
 
 .soundItem .iconButton {

TopNotify/src-vite/src/CSS/NotificationSounds.css

@@ -1,7 +1,6 @@
 import { Button, Divider } from "@chakra-ui/react";
 
 import { Fragment, useState } from "react";
-import { useFirstRender } from "./Helper.jsx";
 
 import "./CSS/NotificationSounds.css";
 
@@ -12,7 +11,8 @@ import {
     DrawerFooter,
     DrawerHeader
 } from "@chakra-ui/react";
-import {TbAlertTriangle, TbChevronDown, TbPencil, TbVolume, TbX} from "react-icons/tb";
+import React from "react";
+import { TbAlertTriangle, TbChevronDown, TbFolder, TbMusicPlus, TbPencil, TbVolume, TbX } from "react-icons/tb";
 
 export default function ManageNotificationSounds() {
 
@@ -93,7 +93,7 @@ export default function ManageNotificationSounds() {
                     </DrawerFooter>
                 </DrawerContent>
             </Drawer>
-            <SoundPicker applySound={applySound} setIsPickerOpen={setIsPickerOpen} isOpen={isPickerOpen}></SoundPicker>
+            <SoundPicker applySound={applySound} setIsPickerOpen={setIsPickerOpen} key={window.soundPickerReferenceID + isPickerOpen || "soundPicker"} isOpen={isPickerOpen}></SoundPicker>
         </div>
     );
 }
@@ -118,14 +118,7 @@ function AppReferenceSoundItem(props) {
 
 function SoundPicker(props) {
 
-    let [soundPacks, setSoundPacks] = useState([]);
-
-    if (useFirstRender()) {
-        setTimeout(async () => {
-            let newSounds = JSON.parse(await igniteView.commandBridge.FindSounds());
-            setSoundPacks(newSounds);
-        }, 0);
-    }
+    const soundPacks = JSON.parse(igniteView.withReact(React).useCommandResult("FindSounds") || "[]");
 
     return (
         <Drawer
@@ -182,6 +175,21 @@ function SoundPack(props) {
                         );
                     })
                 }
+                {
+                    props.soundPack.Name == "Your Collection" && (
+                        <div className="soundItem" key={"add"}>
+                            <Button onClick={async () => {
+                                let result = await igniteView.commandBridge.ImportSound();
+                                if (result.length == 2) {
+                                    props.applySound({ Path: result[0], Name: result[1] });
+                                }
+                            }} className="soundItemButton">
+                                <TbMusicPlus/>
+                            </Button>
+                            <h5>Import&nbsp;<Button onClick={() => igniteView.commandBridge.OpenSoundFolder()} className="iconButton"><TbFolder/></Button></h5>
+                        </div>
+                    )
+                }
             </div>
         </div>
     );