122 lines
3.0 KiB
TypeScript
122 lines
3.0 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import FormModal from "./FormModal";
|
|
import { z } from "zod";
|
|
import useEvents from "@/lib/hooks/useEvents";
|
|
import { createEvent } from "@/lib/actions/create";
|
|
import { unixTimeNowInSeconds } from "@/lib/nostr/dates";
|
|
import { useModal } from "@/app/_providers/modal/provider";
|
|
import { toast } from "sonner";
|
|
import { useNDK } from "@/app/_providers/ndk";
|
|
import useCurrentUser from "@/lib/hooks/useCurrentUser";
|
|
|
|
const EditProfileSchema = z.object({
|
|
display_name: z.string().optional(),
|
|
name: z.string().optional(),
|
|
image: z.string().optional(),
|
|
about: z.string().optional(),
|
|
banner: z.string().optional(),
|
|
website: z.string().optional(),
|
|
nip05: z.string().optional(),
|
|
lud16: z.string().optional(),
|
|
});
|
|
|
|
type EditProfileType = z.infer<typeof EditProfileSchema>;
|
|
|
|
export default function EditProfileModal() {
|
|
const modal = useModal();
|
|
const [isLoading, setIsLoading] = useState(false);
|
|
const [sent, setSent] = useState(false);
|
|
const { ndk } = useNDK();
|
|
const { currentUser, updateUser } = useCurrentUser();
|
|
const { events } = useEvents({
|
|
filter: {
|
|
kinds: [0],
|
|
authors: [currentUser?.pubkey ?? ""],
|
|
since: unixTimeNowInSeconds() - 10,
|
|
limit: 1,
|
|
},
|
|
enabled: sent,
|
|
});
|
|
useEffect(() => {
|
|
if (events.length) {
|
|
console.log("Done!");
|
|
setIsLoading(false);
|
|
toast.success("Profile Updated!");
|
|
modal?.hide();
|
|
}
|
|
}, [events]);
|
|
|
|
async function handleSubmit(userData: EditProfileType) {
|
|
setIsLoading(true);
|
|
const content = JSON.stringify({ ...userData, picture: userData.image });
|
|
const result = await createEvent(ndk!, {
|
|
content,
|
|
kind: 0,
|
|
tags: [],
|
|
});
|
|
if (result) {
|
|
updateUser(JSON.stringify({ ...userData, npub: currentUser?.npub }));
|
|
}
|
|
setSent(true);
|
|
}
|
|
|
|
return (
|
|
<FormModal
|
|
title="Edit Profile"
|
|
fields={[
|
|
{
|
|
label: "Display name",
|
|
type: "input",
|
|
slug: "display_name",
|
|
},
|
|
{
|
|
label: "Name",
|
|
type: "input",
|
|
slug: "name",
|
|
},
|
|
{
|
|
label: "Image",
|
|
type: "upload",
|
|
slug: "image",
|
|
},
|
|
{
|
|
label: "About",
|
|
type: "text-area",
|
|
slug: "about",
|
|
},
|
|
{
|
|
label: "Banner",
|
|
type: "upload",
|
|
slug: "banner",
|
|
},
|
|
{
|
|
label: "Website",
|
|
type: "input",
|
|
slug: "website",
|
|
},
|
|
{
|
|
label: "NIP-05",
|
|
type: "input",
|
|
slug: "nip05",
|
|
placeholder: "name@example.com",
|
|
},
|
|
{
|
|
label: "Bitcoin lightning address (lud16)",
|
|
type: "input",
|
|
slug: "lud16",
|
|
},
|
|
]}
|
|
defaultValues={{
|
|
...currentUser?.profile,
|
|
display_name: currentUser?.profile?.displayName,
|
|
}}
|
|
formSchema={EditProfileSchema}
|
|
onSubmit={handleSubmit}
|
|
isSubmitting={isLoading}
|
|
cta={{
|
|
text: "Save Changes",
|
|
}}
|
|
/>
|
|
);
|
|
}
|