Update application assets and modify screenshot references

- Replaced the old AppScreenshot.webp with a new VoiceBoxAppScreenshot.webp.
- Removed the obsolete AppScreenshot.webp file.
- Updated the landing page to reference the new VoiceBoxAppScreenshot.webp.
- Commented out the ReactQueryDevtools import in main.tsx for cleaner code.

landing/src/app/page.tsx

@@ -141,7 +141,7 @@ export default function Home() {
             <div className="hidden lg:block relative">
               <div className="absolute right-0 top-0 -mt-10 w-[200%] -mr-[100%]">
                 <Image
-                  src="/AppScreenshot.webp"
+                  src="/VoiceBoxAppScreenshot.webp"
                   alt="Voicebox Application Screenshot"
                   width={1920}
                   height={1080}

tauri/src/main.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
+// import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import App from '@/App';
 // Import CSS from app directory using alias so Tailwind can scan the source files
 import '@/index.css';
@@ -21,7 +21,7 @@ ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
     <QueryClientProvider client={queryClient}>
       <App />
-      <ReactQueryDevtools initialIsOpen={false} />
+      {/* <ReactQueryDevtools initialIsOpen={false} /> */}
     </QueryClientProvider>
   </React.StrictMode>,
 );