diff options
| author | MohamedBassem <me@mbassem.com> | 2024-03-13 21:43:44 +0000 |
|---|---|---|
| committer | Mohamed Bassem <me@mbassem.com> | 2024-03-14 16:40:45 +0000 |
| commit | 04572a8e5081b1e4871e273cde9dbaaa44c52fe0 (patch) | |
| tree | 8e993acb732a50d1306d4d6953df96c165c57f57 /packages/browser-extension/src/SignInPage.tsx | |
| parent | 2df08ed08c065e8b91bc8df0266bd4bcbb062be4 (diff) | |
| download | karakeep-04572a8e5081b1e4871e273cde9dbaaa44c52fe0.tar.zst | |
structure: Create apps dir and copy tooling dir from t3-turbo repo
Diffstat (limited to 'packages/browser-extension/src/SignInPage.tsx')
| -rw-r--r-- | packages/browser-extension/src/SignInPage.tsx | 89 |
1 files changed, 0 insertions, 89 deletions
diff --git a/packages/browser-extension/src/SignInPage.tsx b/packages/browser-extension/src/SignInPage.tsx deleted file mode 100644 index 6db7c348..00000000 --- a/packages/browser-extension/src/SignInPage.tsx +++ /dev/null @@ -1,89 +0,0 @@ -import { useState } from "react"; -import { api } from "./utils/trpc"; -import usePluginSettings from "./utils/settings"; -import { useNavigate } from "react-router-dom"; -import Logo from "./Logo"; - -export default function SignInPage() { - const navigate = useNavigate(); - const { setSettings } = usePluginSettings(); - - const { - mutate: login, - error, - isPending, - } = api.apiKeys.exchange.useMutation({ - onSuccess: (resp) => { - setSettings((s) => ({ ...s, apiKey: resp.key })); - navigate("/options"); - }, - onError: () => {}, - }); - - const [formData, setFormData] = useState<{ - email: string; - password: string; - }>({ - email: "", - password: "", - }); - - const onSubmit = (e: React.FormEvent) => { - e.preventDefault(); - const randStr = (Math.random() + 1).toString(36).substring(5); - login({ ...formData, keyName: `Browser extension: (${randStr})` }); - }; - - let errorMessage = ""; - if (error) { - if (error.data?.code == "UNAUTHORIZED") { - errorMessage = "Wrong username or password"; - } else { - errorMessage = error.message; - } - } - - return ( - <div className="flex flex-col space-y-2"> - <Logo /> - <p className="text-lg">Login</p> - <p className="text-red-500">{errorMessage}</p> - <form className="flex flex-col gap-y-2" onSubmit={onSubmit}> - <div className="flex flex-col gap-y-1"> - <label className="my-auto font-bold">Email</label> - <input - value={formData.email} - onChange={(e) => - setFormData((f) => ({ ...f, email: e.target.value })) - } - type="text" - name="email" - className="h-8 flex-1 rounded-lg border border-gray-300 p-2" - /> - </div> - <div className="flex flex-col gap-y-1"> - <label className="my-auto font-bold">Password</label> - <input - value={formData.password} - onChange={(e) => - setFormData((f) => ({ - ...f, - password: e.target.value, - })) - } - type="password" - name="password" - className="h-8 flex-1 rounded-lg border border-gray-300 p-2" - /> - </div> - <button - className="bg-black text-white" - type="submit" - disabled={isPending} - > - Login - </button> - </form> - </div> - ); -} |
