fix: add auth complete

.gitignore

···
 *.njsproj
 *.sln
 *.sw?
+
+docs/node_modules
+docs/.next
+docs/public/_pagefind

docs/app/auth/complete/page.tsx

···
+"use client";
+
+import { useEffect } from "react";
+import { useSearchParams } from "next/navigation";
+
+export default function AuthComplete() {
+  const searchParams = useSearchParams();
+
+  useEffect(() => {
+    // Get all URL parameters
+    const params = new URLSearchParams();
+    searchParams.forEach((value, key) => {
+      params.append(key, value);
+    });
+
+    // Construct the redirect URL with all parameters
+    const redirectUrl = `atprotobackups://auth?${params.toString()}`;
+
+    // Open the URL in the system's default handler
+    window.location.href = redirectUrl;
+  }, [searchParams]);
+
+  return (
+    <div className="min-h-screen flex items-center justify-center bg-gray-50">
+      <div className="max-w-md w-full space-y-8 p-8 bg-white rounded-lg shadow-md">
+        <div className="text-center">
+          <h2 className="mt-6 text-3xl font-bold text-gray-900">
+            Authentication Complete
+          </h2>
+          <p className="mt-2 text-sm text-gray-600">
+            Redirecting you back to the application...
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}

docs/public/client_metadata.json

···
     "tos_uri": "https://atproto-backup.pages.dev/tos",
     "policy_uri": "https://atproto-backup.pages.dev/policy",
     "redirect_uris": [
-        "atprotobackups://auth"
+        "https://atproto-backup.pages.dev/auth/complete"
     ],
     "scope": "atproto",
     "grant_types": [

src-tauri/capabilities/default.json

···
     "opener:default",
     "core:window:default",
     "core:window:allow-start-dragging",
+    "core:event:default",
     "deep-link:default"
   ]
 }

src-tauri/lib.rs

···
-#[cfg_attr(mobile, tauri::mobile_entry_point)]
-pub fn run() {
-    let mut builder = tauri::Builder::default();
-
-    #[cfg(desktop)]
-    {
-        builder = builder.plugin(tauri_plugin_single_instance::init(|_app, argv, _cwd| {
-          println!("a new app instance was opened with {argv:?} and the deep link event was already triggered");
-          // when defining deep link schemes at runtime, you must also check `argv` here
-        }));
-    }
-
-    builder = builder.plugin(tauri_plugin_deep_link::init());
-}

src-tauri/src/lib.rs

···
 // Learn more about Tauri commands at https://tauri.app/develop/calling-rust/
+use tauri_plugin_deep_link::DeepLinkExt;
+
 #[tauri::command]
 fn greet(name: &str) -> String {
     format!("Hello, {}! You've been greeted from Rust!", name)
···
 
 #[cfg_attr(mobile, tauri::mobile_entry_point)]
 pub fn run() {
-    tauri::Builder::default()
+    let mut builder = tauri::Builder::default()
         .plugin(tauri_plugin_deep_link::init())
         .plugin(tauri_plugin_opener::init())
         .invoke_handler(tauri::generate_handler![greet])
+        .setup(|app| {
+            #[cfg(any(windows, target_os = "linux"))]
+            {
+                app.deep_link().register_all()?;
+            }
+            Ok(())
+        });
+
+    #[cfg(desktop)]
+    {
+        builder = builder.plugin(tauri_plugin_single_instance::init(|_app, argv, _cwd| {
+            println!("A new app instance was opened with {argv:?} and the deep link event was already triggered.");
+        }));
+    }
+
+    builder
         .run(tauri::generate_context!())
         .expect("error while running tauri application");
 }

src/App.tsx

···
 import { invoke } from "@tauri-apps/api/core";
 import "./App.css";
 import { Button } from "./components/ui/button";
+import LoginPage from "./routes/Login";
 
 function App() {
   const [greetMsg, setGreetMsg] = useState("");
···
   }
 
   return (
-    <main className="container dark">
-      <div className="titlebar">
-        <div data-tauri-drag-region></div>
+    <main className="dark">
+      <div className="titlebar" data-tauri-drag-region>
         <div className="controls">
           <Button variant="ghost" id="titlebar-minimize" title="minimize">
             <svg
···
           </button>
         </div>
       </div>
+
+      <LoginPage />
     </main>
   );
 }

src/routes/Login.tsx

···
   BrowserOAuthClient,
   BrowserOAuthClientOptions,
 } from "@atproto/oauth-client-browser";
+import { onOpenUrl } from "@tauri-apps/plugin-deep-link";
 
 type LoginMethod = "credential" | "oauth";
 
···
   useEffect(() => {
     const initOAuthClient = async () => {
       try {
-        const client = new BrowserOAuthClient({
-          clientMetadata: {
-            client_id: "http://localhost:3000", // Replace with your actual client ID
-            redirect_uris: ["http://localhost:3000/callback"], // Replace with your redirect URI
-            client_name: "ATProto Backup App",
-            client_uri: "http://localhost:3000",
-            scope: "atproto",
-          },
+        const client = await BrowserOAuthClient.load({
+          clientId: "https://atproto-backup.pages.dev/client_metadata.json",
         });
         setOauthClient(client);
       } catch (err) {
···
     initOAuthClient();
   }, []);
 
-  const handleCredentialLogin = async () => {
-    setLoading(true);
-    setError("");
-    const agent = new Agent(new CredentialSession());
-
-    try {
-      const result = await agent.login({ identifier, password });
-      console.log("Credential login successful!", result);
-      // Store session, redirect, etc.
-    } catch (err: any) {
-      console.error(err);
-      setError(err.message || "Credential login failed");
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  const handleOAuthLogin = async () => {
+  const handleLogin = async () => {
     if (!oauthClient) {
       setError("OAuth client not initialized");
       return;
···
 
     handleCallback();
   }, [oauthClient]);
-
-  const handleLogin = () => {
-    if (loginMethod === "credential") {
-      handleCredentialLogin();
-    } else {
-      handleOAuthLogin();
-    }
-  };
-
   return (
     <div className="min-h-screen flex items-center justify-center bg-background px-4">
       <Card className="w-full max-w-sm">
         <CardHeader>
-          <CardTitle>Login to Bluesky</CardTitle>
+          <CardTitle>Login to your Bluesky account</CardTitle>
         </CardHeader>
         <CardContent className="space-y-4">
           <Input
···
             value={identifier}
             onChange={(e) => setIdentifier(e.target.value)}
           />
-          <Input
-            type="password"
-            placeholder="Password"
-            value={password}
-            onChange={(e) => setPassword(e.target.value)}
-          />
           {error && <p className="text-sm text-red-500">{error}</p>}
-          <Button className="w-full" onClick={handleLogin} disabled={loading}>
+          <Button
+            className="w-full"
+            onClick={handleLogin}
+            disabled={loading || identifier == null}
+          >
             {loading ? "Logging in..." : "Login"}
           </Button>
         </CardContent>