fix some of ben's problems

MutinyWallet · Feb 20, 2024 · 40a3e79 · 40a3e79
1 parent 041592a
commit 40a3e79
Show file tree

Hide file tree

Showing 6 changed files with 145 additions and 111 deletions.
diff --git a/src/components/Activity.tsx b/src/components/Activity.tsx
@@ -1,6 +1,6 @@
 import { TagItem } from "@mutinywallet/mutiny-wasm";
 import { cache, createAsync, revalidate, useNavigate } from "@solidjs/router";
-import { Plus, Save, Search, Shuffle } from "lucide-solid";
+import { Plus, Save, Search, Shuffle, Users } from "lucide-solid";
 import { createEffect, createSignal, For, Match, Show, Switch } from "solid-js";
 
 import { ActivityDetailsModal, ButtonCard, NiceP } from "~/components";
@@ -30,6 +30,8 @@ export function UnifiedActivityItem(props: {
     item: IActivityItem;
     onClick: (id: string, kind: HackActivityType) => void;
 }) {
+    const navigate = useNavigate();
+
     const click = () => {
         props.onClick(
             props.item.id,
@@ -115,33 +117,37 @@ export function UnifiedActivityItem(props: {
     };
 
     return (
-        <>
-            <button class="pt-3 first-of-type:pt-0" onClick={() => click()}>
-                <GenericItem
-                    primaryAvatarUrl={primaryContact()?.image_url || ""}
-                    icon={shouldShowShuffle() ? <Shuffle /> : undefined}
-                    primaryName={
-                        props.item.inbound
-                            ? primaryContact()?.name || "Unknown"
-                            : "You"
-                    }
-                    genericAvatar={shouldShowGeneric()}
-                    verb={verb()}
-                    message={message()}
-                    secondaryName={secondaryName()}
-                    amount={
-                        props.item.amount_sats
-                            ? BigInt(props.item.amount_sats || 0)
-                            : undefined
-                    }
-                    date={timeAgo(props.item.last_updated)}
-                    accent={props.item.inbound ? "green" : undefined}
-                    visibility={
-                        props.item.kind === "Lightning" ? "private" : undefined
-                    }
-                />
-            </button>
-        </>
+        <div class="pt-3 first-of-type:pt-0">
+            <GenericItem
+                primaryAvatarUrl={primaryContact()?.image_url || ""}
+                icon={shouldShowShuffle() ? <Shuffle /> : undefined}
+                primaryOnClick={() =>
+                    primaryName() !== "You" && primaryContact()?.id
+                        ? navigate(`/chat/${primaryContact()?.id}`)
+                        : undefined
+                }
+                amountOnClick={click}
+                primaryName={
+                    props.item.inbound
+                        ? primaryContact()?.name || "Unknown"
+                        : "You"
+                }
+                genericAvatar={shouldShowGeneric()}
+                verb={verb()}
+                message={message()}
+                secondaryName={secondaryName()}
+                amount={
+                    props.item.amount_sats
+                        ? BigInt(props.item.amount_sats || 0)
+                        : undefined
+                }
+                date={timeAgo(props.item.last_updated)}
+                accent={props.item.inbound ? "green" : undefined}
+                visibility={
+                    props.item.kind === "Lightning" ? "private" : undefined
+                }
+            />
+        </div>
     );
 }
 
@@ -199,6 +205,16 @@ export function CombinedActivity() {
             </Show>
             <Switch>
                 <Match when={activity().length === 0}>
+                    <Show when={state.federations?.length === 0}>
+                        <ButtonCard
+                            onClick={() => navigate("/settings/federations")}
+                        >
+                            <div class="flex items-center gap-2">
+                                <Users class="inline-block text-m-red" />
+                                <NiceP>{i18n.t("home.federation")}</NiceP>
+                            </div>
+                        </ButtonCard>
+                    </Show>
                     <ButtonCard onClick={() => navigate("/receive")}>
                         <div class="flex items-center gap-2">
                             <Plus class="inline-block text-m-red" />

diff --git a/src/components/GenericItem.tsx b/src/components/GenericItem.tsx
@@ -21,6 +21,7 @@ export function GenericItem(props: {
     forceSecondary?: boolean;
     link?: string;
     primaryOnClick?: () => void;
+    amountOnClick?: () => void;
     secondaryOnClick?: () => void;
     approveAction?: () => void;
     rejectAction?: () => void;
@@ -76,7 +77,10 @@ export function GenericItem(props: {
                 <div class="flex flex-wrap gap-1">
                     {/* AMOUNT */}
                     <Show when={props.amount}>
-                        <div
+                        <button
+                            onClick={() =>
+                                props.amountOnClick && props.amountOnClick()
+                            }
                             class="flex items-center gap-1 rounded-full px-2 py-1 text-xs font-semibold text-white"
                             classList={{
                                 "bg-m-grey-800": !props.accent,
@@ -86,7 +90,7 @@ export function GenericItem(props: {
                             {/* <img src={bolt} width={8} height={8} /> */}
                             <Zap class="w-3" fill="currentColor" />
                             {`${props.amount!.toLocaleString()} sats`}
-                        </div>
+                        </button>
                     </Show>
                     {/* FIAT AMOUNT */}
                     <Show when={props.showFiat}>

diff --git a/src/i18n/en/translations.ts b/src/i18n/en/translations.ts
@@ -33,13 +33,18 @@ export default {
         receive: "Receive your first sats",
         find: "Find your friends on nostr",
         backup: "Secure your funds!",
-        connection: "Create a wallet connection"
+        connection: "Create a wallet connection",
+        federation: "Join a federation"
     },
     profile: {
         nostr_identity: "Nostr Identity",
         add_lightning_address: "Add Lightning Address",
         edit_profile: "Edit Profile"
     },
+    chat: {
+        prompt: "This is a new conversation. Try asking for money!",
+        placeholder: "Message"
+    },
     contacts: {
         new: "new",
         add_contact: "Add Contact",

diff --git a/src/routes/Chat.tsx b/src/routes/Chat.tsx
@@ -1,6 +1,6 @@
 import { TagItem } from "@mutinywallet/mutiny-wasm";
 import { createAsync, useNavigate, useParams } from "@solidjs/router";
-import { ArrowDownLeft, ArrowUpRight, Zap } from "lucide-solid";
+import { ArrowDownLeft, ArrowUpRight, MessagesSquare, Zap } from "lucide-solid";
 import {
     createEffect,
     createResource,
@@ -19,18 +19,21 @@ import {
     AmountSats,
     BackPop,
     Button,
+    ButtonCard,
     ContactButton,
     ContactFormValues,
     ContactViewer,
     HackActivityType,
     IActivityItem,
     LoadingShimmer,
     MutinyWalletGuard,
+    NiceP,
     showToast,
     SimpleInput,
     UnifiedActivityItem
 } from "~/components";
 import { MiniFab } from "~/components/Fab";
+import { useI18n } from "~/i18n/context";
 import { ParsedParams, toParsedParams } from "~/logic/waila";
 import { useMegaStore } from "~/state/megaStore";
 import { eify, hexpubFromNpub, timeAgo } from "~/utils";
@@ -267,6 +270,8 @@ export function Chat() {
     const [messageValue, setMessageValue] = createSignal("");
     const [sending, setSending] = createSignal(false);
 
+    const i18n = useI18n();
+
     const contact = createAsync(async () => {
         try {
             return state.mutiny_wallet?.get_tag_item(params.id);
@@ -283,20 +288,27 @@ export function Chat() {
             if (!contact || !contact?.npub) return undefined;
             if (!contact.npub) return [] as CombinedMessagesAndActivity[];
             try {
-                const activity = await state.mutiny_wallet?.get_label_activity(
-                    params.id
-                );
+                let acts = [] as IActivityItem[];
+                let dms = [] as FakeDirectMessage[];
 
-                console.log("activity", activity);
-                const convo = await state.mutiny_wallet?.get_dm_conversation(
-                    contact.npub,
-                    20n,
-                    undefined,
-                    undefined
-                );
+                try {
+                    acts = (await state.mutiny_wallet?.get_label_activity(
+                        params.id
+                    )) as IActivityItem[];
+                } catch (e) {
+                    console.error("error getting activity:", e);
+                }
 
-                const dms = convo as FakeDirectMessage[];
-                const acts = activity as IActivityItem[];
+                try {
+                    dms = (await state.mutiny_wallet?.get_dm_conversation(
+                        contact.npub,
+                        20n,
+                        undefined,
+                        undefined
+                    )) as FakeDirectMessage[];
+                } catch (e) {
+                    console.error("error getting dms:", e);
+                }
 
                 // Combine both arrays into an array of CombinedMessagesAndActivity, then sort by date
                 const combined = [
@@ -339,13 +351,14 @@ export function Chat() {
         const npub = contact()?.npub;
         if (!npub) return;
         setSending(true);
+        const rememberedValue = messageValue();
+        setMessageValue("");
         try {
             const dmResult = await state.mutiny_wallet?.send_dm(
                 npub,
-                messageValue()
+                rememberedValue
             );
             console.log("dmResult:", dmResult);
-            setMessageValue("");
             refetch();
         } catch (e) {
             console.error("error sending dm:", e);
@@ -495,15 +508,40 @@ export function Chat() {
                         <Suspense>
                             <Show when={contact()}>
                                 <Suspense fallback={<LoadingShimmer />}>
-                                    <Show when={convo.latest}>
-                                        {/* TODO: figure out how not to do typecasting here */}
-                                        <MessageList
-                                            convo={
-                                                convo.latest as CombinedMessagesAndActivity[]
+                                    <Switch>
+                                        <Match
+                                            when={
+                                                convo.latest &&
+                                                convo.latest.length > 0
                                             }
-                                            contact={contact()!}
-                                        />
-                                    </Show>
+                                        >
+                                            {/* TODO: figure out how not to do typecasting here */}
+                                            <MessageList
+                                                convo={
+                                                    convo.latest as CombinedMessagesAndActivity[]
+                                                }
+                                                contact={contact()!}
+                                            />
+                                        </Match>
+                                        <Match when={true}>
+                                            <ButtonCard
+                                                onClick={() =>
+                                                    requestFromContact(
+                                                        contact()
+                                                    )
+                                                }
+                                            >
+                                                <div class="flex items-center gap-4 text-left">
+                                                    <div class="flex-0">
+                                                        <MessagesSquare class="inline-block text-m-red" />
+                                                    </div>
+                                                    <NiceP>
+                                                        {i18n.t("chat.prompt")}
+                                                    </NiceP>
+                                                </div>
+                                            </ButtonCard>
+                                        </Match>
+                                    </Switch>
                                 </Suspense>
                             </Show>
                         </Suspense>
@@ -521,14 +559,23 @@ export function Chat() {
                         }
                         onRequest={() => requestFromContact(contact())}
                     />
-                    <SimpleInput
-                        disabled={sending()}
-                        value={messageValue()}
-                        onInput={(e) => setMessageValue(e.currentTarget.value)}
-                        placeholder="Message"
-                    />
+                    <form
+                        onSubmit={async (e) => {
+                            e.preventDefault();
+                            await sendMessage();
+                        }}
+                    >
+                        <SimpleInput
+                            disabled={sending()}
+                            value={messageValue()}
+                            onInput={(e) =>
+                                setMessageValue(e.currentTarget.value)
+                            }
+                            placeholder={i18n.t("chat.placeholder")}
+                        />
+                    </form>
                     <div>
-                        <Show when={messageValue()}>
+                        <Show when={messageValue() || sending()}>
                             <Button
                                 layout="xs"
                                 intent="blue"

diff --git a/src/routes/settings/Backup.tsx b/src/routes/settings/Backup.tsx
@@ -64,7 +64,7 @@ export function Backup() {
     function wroteDownTheWords() {
         setLoading(true);
         actions.setHasBackedUp();
-        navigate("/settings/encrypt");
+        navigate("/");
         setLoading(false);
     }