egutierrez/linkwarden
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

merged "AuthSubmitButton" with the "SubmitButton" + updated the other pages that needed this change

Browse Source
This commit is contained in:
daniel31x13
2023-10-23 01:20:08 -04:00
parent b3295e136d
commit ec4bfa6ba9
6 changed files with 217 additions and 234 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/choose-username.tsx
+46 -41
View File
@@ -1,6 +1,6 @@
import SubmitButton from "@/components/SubmitButton";
import { signOut } from "next-auth/react";
import { useState } from "react";
import { FormEvent, useState } from "react";
import { toast } from "react-hot-toast";
import { useSession } from "next-auth/react";
import useAccountStore from "@/store/account";
@@ -15,7 +15,9 @@ export default function ChooseUsername() {
const { updateAccount, account } = useAccountStore();
async function submitUsername() {
async function submitUsername(event: FormEvent<HTMLFormElement>) {
event.preventDefault();
setSubmitLoader(true);
const redirectionToast = toast.loading("Applying...");
@@ -38,50 +40,53 @@ export default function ChooseUsername() {
return (
<CenteredForm>
<div className="p-4 mx-auto flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 dark:border-neutral-700 dark:bg-neutral-800 rounded-2xl shadow-md border border-sky-100">
<p className="text-2xl text-center text-black dark:text-white font-bold">
Choose a Username (Last step)
</p>
<div>
<p className="text-sm text-black dark:text-white w-fit font-semibold mb-1">
Username
<form onSubmit={submitUsername}>
<div className="p-4 mx-auto flex flex-col gap-3 justify-between sm:w-[30rem] w-80 bg-slate-50 dark:border-neutral-700 dark:bg-neutral-800 rounded-2xl shadow-md border border-sky-100">
<p className="text-2xl text-center text-black dark:text-white font-bold">
Choose a Username (Last step)
</p>
<TextInput
placeholder="john"
value={inputedUsername}
className="bg-white"
onChange={(e) => setInputedUsername(e.target.value)}
<div>
<p className="text-sm text-black dark:text-white w-fit font-semibold mb-1">
Username
</p>
<TextInput
autoFocus
placeholder="john"
value={inputedUsername}
className="bg-white"
onChange={(e) => setInputedUsername(e.target.value)}
/>
</div>
<div>
<p className="text-md text-gray-500 dark:text-gray-400 mt-1">
Feel free to reach out to us at{" "}
<a
className="font-semibold underline"
href="mailto:support@linkwarden.app"
>
support@linkwarden.app
</a>{" "}
in case of any issues.
</p>
</div>
<SubmitButton
type="submit"
label="Complete Registration"
className="mt-2 w-full text-center"
loading={submitLoader}
/>
</div>
<div>
<p className="text-md text-gray-500 dark:text-gray-400 mt-1">
Feel free to reach out to us at{" "}
<a
className="font-semibold underline"
href="mailto:support@linkwarden.app"
>
support@linkwarden.app
</a>{" "}
in case of any issues.
</p>
</div>
<SubmitButton
onClick={submitUsername}
label="Complete Registration"
className="mt-2 w-full text-center"
loading={submitLoader}
/>
<div
onClick={() => signOut()}
className="w-fit mx-auto cursor-pointer text-gray-500 dark:text-gray-400 font-semibold "
>
Sign Out
<div
onClick={() => signOut()}
className="w-fit mx-auto cursor-pointer text-gray-500 dark:text-gray-400 font-semibold "
>
Sign Out
</div>
</div>
</div>
</form>
</CenteredForm>
);
}