reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip: migrate to zustand

Browse Source
This commit is contained in:
Ren Amamiya
2023-05-26 14:45:12 +07:00
parent 5c7b18bf29
commit 671b857077
34 changed files with 494 additions and 530 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/app/channel/components/createModal.tsx
View File

@@ -1,28 +1,21 @@
import { Dialog, Transition } from "@headlessui/react";
import CancelIcon from "@icons/cancel";
import PlusIcon from "@icons/plus";
import { AvatarUploader } from "@shared/avatarUploader";
import { Image } from "@shared/image";
import { RelayContext } from "@shared/relayProvider";
import CancelIcon from "@icons/cancel";
import PlusIcon from "@icons/plus";
import { useActiveAccount } from "@stores/accounts";
import { DEFAULT_AVATAR, WRITEONLY_RELAYS } from "@stores/constants";
import { dateToUnix } from "@utils/date";
import { useActiveAccount } from "@utils/hooks/useActiveAccount";
import { createChannel } from "@utils/storage";
import { Dialog, Transition } from "@headlessui/react";
import { getEventHash, getSignature } from "nostr-tools";
import { Fragment, useContext, useEffect, useState } from "react";
import { useForm } from "react-hook-form";
import { useSWRConfig } from "swr";
import { navigate } from "vite-plugin-ssr/client/router";
export default function ChannelCreateModal() {
const pool: any = useContext(RelayContext);
const { account, isError, isLoading } = useActiveAccount();
const { mutate } = useSWRConfig();
const account = useActiveAccount((state: any) => state.account);
const [isOpen, setIsOpen] = useState(false);
const [image, setImage] = useState(DEFAULT_AVATAR);
@@ -47,7 +40,7 @@ export default function ChannelCreateModal() {
const onSubmit = (data: any) => {
setLoading(true);
if (!isError && !isLoading && account) {
if (account) {
const event: any = {
content: JSON.stringify(data),
created_at: dateToUnix(),
@@ -62,8 +55,6 @@ export default function ChannelCreateModal() {
pool.publish(event, WRITEONLY_RELAYS);
// insert to database
createChannel(event.id, event.pubkey, event.content, event.created_at);
// update channe llist
mutate("channels");
// reset form
reset();
setTimeout(() => {

19
src/app/channel/components/list.tsx
View File

@@ -1,18 +1,19 @@
import ChannelCreateModal from "@app/channel/components/createModal";
import ChannelsListItem from "@app/channel/components/item";
import { getChannels } from "@utils/storage";
import useSWR from "swr";
const fetcher = () => getChannels(10, 0);
import { useChannels } from "@stores/channels";
import { useEffect } from "react";
export default function ChannelsList() {
const { data, error }: any = useSWR("channels", fetcher);
const channels = useChannels((state: any) => state.channels);
const fetchChannels = useChannels((state: any) => state.fetch);
useEffect(() => {
fetchChannels();
}, [fetchChannels]);
return (
<div className="flex flex-col gap-1">
{!data || error ? (
{!channels ? (
<>
<div className="inline-flex h-8 items-center gap-2 rounded-md px-2.5">
<div className="relative h-5 w-5 shrink-0 animate-pulse rounded bg-zinc-800" />
@@ -24,7 +25,7 @@ export default function ChannelsList() {
</div>
</>
) : (
data.map((item: { event_id: string }) => (
channels.map((item: { event_id: string }) => (
<ChannelsListItem key={item.event_id} data={item} />
))
)}

15
src/app/channel/components/messages/form.tsx
View File

@@ -1,16 +1,11 @@
import UserReply from "@app/channel/components/messages/userReply";
import CancelIcon from "@icons/cancel";
import { ImagePicker } from "@shared/form/imagePicker";
import { RelayContext } from "@shared/relayProvider";
import CancelIcon from "@icons/cancel";
import { useActiveAccount } from "@stores/accounts";
import { channelContentAtom, channelReplyAtom } from "@stores/channel";
import { WRITEONLY_RELAYS } from "@stores/constants";
import { dateToUnix } from "@utils/date";
import { useActiveAccount } from "@utils/hooks/useActiveAccount";
import { useAtom, useAtomValue } from "jotai";
import { useResetAtom } from "jotai/utils";
import { getEventHash, getSignature } from "nostr-tools";
@@ -20,7 +15,7 @@ export default function ChannelMessageForm({
channelID,
}: { channelID: string | string[] }) {
const pool: any = useContext(RelayContext);
const { account, isLoading, isError } = useActiveAccount();
const account = useActiveAccount((state: any) => state.account);
const [value, setValue] = useAtom(channelContentAtom);
const resetValue = useResetAtom(channelContentAtom);
@@ -41,7 +36,7 @@ export default function ChannelMessageForm({
tags = [["e", channelID, "", "root"]];
}
if (!isError && !isLoading && account) {
if (account) {
const event: any = {
content: value,
created_at: dateToUnix(),
@@ -49,11 +44,13 @@ export default function ChannelMessageForm({
pubkey: account.pubkey,
tags: tags,
};
event.id = getEventHash(event);
event.sig = getSignature(event, account.privkey);
// publish note
pool.publish(event, WRITEONLY_RELAYS);
// reset state
resetValue();
// reset channel reply

19
src/app/channel/components/messages/hideButton.tsx
View File

@@ -1,23 +1,19 @@
import { RelayContext } from "@shared/relayProvider";
import { Tooltip } from "@shared/tooltip";
import { Dialog, Transition } from "@headlessui/react";
import CancelIcon from "@icons/cancel";
import HideIcon from "@icons/hide";
import { RelayContext } from "@shared/relayProvider";
import { Tooltip } from "@shared/tooltip";
import { useActiveAccount } from "@stores/accounts";
import { channelMessagesAtom } from "@stores/channel";
import { WRITEONLY_RELAYS } from "@stores/constants";
import { dateToUnix } from "@utils/date";
import { useActiveAccount } from "@utils/hooks/useActiveAccount";
import { Dialog, Transition } from "@headlessui/react";
import { useAtom } from "jotai";
import { getEventHash, getSignature } from "nostr-tools";
import { Fragment, useContext, useState } from "react";
export default function MessageHideButton({ id }: { id: string }) {
const pool: any = useContext(RelayContext);
const { account, isError, isLoading } = useActiveAccount();
const account = useActiveAccount((state: any) => state.account);
const [isOpen, setIsOpen] = useState(false);
const [messages, setMessages] = useAtom(channelMessagesAtom);
@@ -31,7 +27,7 @@ export default function MessageHideButton({ id }: { id: string }) {
};
const hideMessage = () => {
if (!isError && !isLoading && account) {
if (account) {
const event: any = {
content: "",
created_at: dateToUnix(),
@@ -44,13 +40,16 @@ export default function MessageHideButton({ id }: { id: string }) {
// publish note
pool.publish(event, WRITEONLY_RELAYS);
// update local state
const cloneMessages = [...messages];
const targetMessage = cloneMessages.findIndex(
(message) => message.id === id,
);
cloneMessages[targetMessage]["hide"] = true;
setMessages(cloneMessages);
// close modal
closeModal();
} else {

17
src/app/channel/components/messages/muteButton.tsx
View File

@@ -1,23 +1,19 @@
import { RelayContext } from "@shared/relayProvider";
import { Tooltip } from "@shared/tooltip";
import { Dialog, Transition } from "@headlessui/react";
import CancelIcon from "@icons/cancel";
import MuteIcon from "@icons/mute";
import { RelayContext } from "@shared/relayProvider";
import { Tooltip } from "@shared/tooltip";
import { useActiveAccount } from "@stores/accounts";
import { channelMessagesAtom } from "@stores/channel";
import { WRITEONLY_RELAYS } from "@stores/constants";
import { dateToUnix } from "@utils/date";
import { useActiveAccount } from "@utils/hooks/useActiveAccount";
import { Dialog, Transition } from "@headlessui/react";
import { useAtom } from "jotai";
import { getEventHash, getSignature } from "nostr-tools";
import { Fragment, useContext, useState } from "react";
export default function MessageMuteButton({ pubkey }: { pubkey: string }) {
const pool: any = useContext(RelayContext);
const { account, isError, isLoading } = useActiveAccount();
const account = useActiveAccount((state: any) => state.account);
const [messages, setMessages] = useAtom(channelMessagesAtom);
const [isOpen, setIsOpen] = useState(false);
@@ -31,7 +27,7 @@ export default function MessageMuteButton({ pubkey }: { pubkey: string }) {
};
const muteUser = () => {
if (!isError && !isLoading && account) {
if (account) {
const event: any = {
content: "",
created_at: dateToUnix(),
@@ -44,6 +40,7 @@ export default function MessageMuteButton({ pubkey }: { pubkey: string }) {
// publish note
pool.publish(event, WRITEONLY_RELAYS);
// update local state
const cloneMessages = [...messages];
const finalMessages = cloneMessages.filter(

18
src/app/channel/components/updateModal.tsx
View File

@@ -1,24 +1,20 @@
import { Dialog, Transition } from "@headlessui/react";
import CancelIcon from "@icons/cancel";
import EditIcon from "@icons/edit";
import { AvatarUploader } from "@shared/avatarUploader";
import { Image } from "@shared/image";
import { RelayContext } from "@shared/relayProvider";
import CancelIcon from "@icons/cancel";
import EditIcon from "@icons/edit";
import { useActiveAccount } from "@stores/accounts";
import { DEFAULT_AVATAR, WRITEONLY_RELAYS } from "@stores/constants";
import { dateToUnix } from "@utils/date";
import { useActiveAccount } from "@utils/hooks/useActiveAccount";
import { getChannel } from "@utils/storage";
import { Dialog, Transition } from "@headlessui/react";
import { getEventHash, getSignature } from "nostr-tools";
import { Fragment, useContext, useEffect, useState } from "react";
import { useForm } from "react-hook-form";
export default function ChannelUpdateModal({ id }: { id: string }) {
const pool: any = useContext(RelayContext);
const { account, isError, isLoading } = useActiveAccount();
const account = useActiveAccount((state: any) => state.account);
const [isOpen, setIsOpen] = useState(false);
const [image, setImage] = useState(DEFAULT_AVATAR);
@@ -52,7 +48,7 @@ export default function ChannelUpdateModal({ id }: { id: string }) {
const onSubmit = (data: any) => {
setLoading(true);
if (!isError && !isLoading && account) {
if (account) {
const event: any = {
content: JSON.stringify(data),
created_at: dateToUnix(),
@@ -60,11 +56,13 @@ export default function ChannelUpdateModal({ id }: { id: string }) {
pubkey: account.pubkey,
tags: [["e", id]],
};
event.id = getEventHash(event);
event.sig = getSignature(event, account.privkey);
// publish channel
pool.publish(event, WRITEONLY_RELAYS);
// reset form
reset();
// close modal