diff --git a/src/components/channels/updateChannelModal.tsx b/src/components/channels/updateChannelModal.tsx new file mode 100644 index 00000000..3522bc88 --- /dev/null +++ b/src/components/channels/updateChannelModal.tsx @@ -0,0 +1,241 @@ +import { AccountContext } from '@components/accountProvider'; +import { AvatarUploader } from '@components/avatarUploader'; +import { RelayContext } from '@components/relaysProvider'; + +import { DEFAULT_AVATAR, WRITEONLY_RELAYS } from '@stores/constants'; + +import { dateToUnix } from '@utils/getDate'; +import { getChannel, updateChannelMetadata } from '@utils/storage'; + +import { Dialog, Transition } from '@headlessui/react'; +import { Cancel, EditPencil } from 'iconoir-react'; +import { getEventHash, signEvent } from 'nostr-tools'; +import { Fragment, useContext, useEffect, useState } from 'react'; +import { useForm } from 'react-hook-form'; + +export const UpdateChannelModal = ({ id }: { id: string }) => { + const pool: any = useContext(RelayContext); + const activeAccount: any = useContext(AccountContext); + + const [isOpen, setIsOpen] = useState(false); + const [image, setImage] = useState(DEFAULT_AVATAR); + const [loading, setLoading] = useState(false); + + const closeModal = () => { + setIsOpen(false); + }; + + const openModal = () => { + setIsOpen(true); + }; + + const { + register, + handleSubmit, + reset, + setValue, + formState: { isDirty, isValid }, + } = useForm({ + defaultValues: async () => { + const channel = await getChannel(id); + const metadata = JSON.parse(channel.metadata); + // update image state + setImage(metadata.picture); + // set default values + return metadata; + }, + }); + + const onSubmit = (data: any) => { + setLoading(true); + + const event: any = { + content: JSON.stringify(data), + created_at: dateToUnix(), + kind: 41, + pubkey: activeAccount.pubkey, + tags: [], + }; + event.id = getEventHash(event); + event.sig = signEvent(event, activeAccount.privkey); + + // publish channel + pool.publish(event, WRITEONLY_RELAYS); + // update channel metadata in database + updateChannelMetadata(event.id, event.content); + // reset form + reset(); + // close modal + setIsOpen(false); + }; + + useEffect(() => { + setValue('picture', image); + }, [setValue, image]); + + return ( + <> + + + + +
+ +
+ + +
+
+
+ + Update channel + + +
+ + Channels are freedom square, everyone can speech freely, no one can stop you or deceive what to + speech + +
+
+
+
+ +
+ +
+ channel picture +
+ +
+
+
+
+ +
+ +
+
+
+ +
+