feat: Mutiny+ Subscription hidden QR

MutinyWallet · Oct 14, 2023 · 951872b · 951872b
1 parent 74d97fb
commit 951872b
Show file tree

Hide file tree

Showing 3 changed files with 101 additions and 56 deletions.
diff --git a/src/components/NWCBudgetEditor.tsx b/src/components/NWCBudgetEditor.tsx
@@ -10,6 +10,7 @@ import { For, Show } from "solid-js";
 
 import {
     AmountEditable,
+    AmountSats,
     Button,
     Checkbox,
     InfoBox,
@@ -43,10 +44,16 @@ export function NWCBudgetEditor(props: {
                 ? !props.initialProfile.require_approval
                 : false,
             budget_amount:
-                props.initialProfile?.budget_amount?.toString() || "0",
+                props.initialProfile?.budget_amount?.toString() ||
+                props.initialProfile?.index === 0
+                    ? "21000"
+                    : "0",
             interval:
                 (props.initialProfile
-                    ?.budget_period as BudgetForm["interval"]) || "Day"
+                    ?.budget_period as BudgetForm["interval"]) ||
+                props.initialProfile?.index === 0
+                    ? "Month"
+                    : "Day"
         },
         validate: (values) => {
             const errors: Record<string, string> = {};
@@ -108,20 +115,34 @@ export function NWCBudgetEditor(props: {
                             <Field name="budget_amount">
                                 {(field, _fieldProps) => (
                                     <div class="flex flex-col items-end gap-2">
-                                        <AmountEditable
-                                            initialOpen={false}
-                                            initialAmountSats={
-                                                field.value || "0"
+                                        <Show
+                                            when={
+                                                props.initialProfile?.tag !==
+                                                "Subscription"
                                             }
-                                            showWarnings={false}
-                                            setAmountSats={(a) => {
-                                                setValue(
-                                                    budgetForm,
-                                                    "budget_amount",
-                                                    a.toString()
-                                                );
-                                            }}
-                                        />
+                                            fallback={
+                                                <AmountSats
+                                                    amountSats={
+                                                        Number(field.value) || 0
+                                                    }
+                                                />
+                                            }
+                                        >
+                                            <AmountEditable
+                                                initialOpen={false}
+                                                initialAmountSats={
+                                                    field.value || "0"
+                                                }
+                                                showWarnings={false}
+                                                setAmountSats={(a) => {
+                                                    setValue(
+                                                        budgetForm,
+                                                        "budget_amount",
+                                                        a.toString()
+                                                    );
+                                                }}
+                                            />
+                                        </Show>
                                         <p class="text-sm text-m-red">
                                             {field.error}
                                         </p>
@@ -134,42 +155,54 @@ export function NWCBudgetEditor(props: {
                         >
                             <Field name="interval">
                                 {(field, fieldProps) => (
-                                    <select
-                                        {...fieldProps}
-                                        class="w-full rounded-lg bg-m-grey-750 py-2 pl-4 pr-12 text-base font-normal text-white"
+                                    <Show
+                                        when={
+                                            props.initialProfile?.tag !==
+                                            "Subscription"
+                                        }
+                                        fallback={
+                                            budgetForm.internal.initialValues
+                                                .interval
+                                        }
                                     >
-                                        <For
-                                            each={[
-                                                {
-                                                    label: "Day",
-                                                    value: "Day"
-                                                },
-                                                {
-                                                    label: "Week",
-                                                    value: "Week"
-                                                },
-                                                {
-                                                    label: "Month",
-                                                    value: "Month"
-                                                },
-                                                {
-                                                    label: "Year",
-                                                    value: "Year"
-                                                }
-                                            ]}
+                                        <select
+                                            {...fieldProps}
+                                            class="w-full rounded-lg bg-m-grey-750 py-2 pl-4 pr-12 text-base font-normal text-white"
                                         >
-                                            {({ label, value }) => (
-                                                <option
-                                                    value={value}
-                                                    selected={
-                                                        field.value === value
+                                            <For
+                                                each={[
+                                                    {
+                                                        label: "Day",
+                                                        value: "Day"
+                                                    },
+                                                    {
+                                                        label: "Week",
+                                                        value: "Week"
+                                                    },
+                                                    {
+                                                        label: "Month",
+                                                        value: "Month"
+                                                    },
+                                                    {
+                                                        label: "Year",
+                                                        value: "Year"
                                                     }
-                                                >
-                                                    {label}
-                                                </option>
-                                            )}
-                                        </For>
-                                    </select>
+                                                ]}
+                                            >
+                                                {({ label, value }) => (
+                                                    <option
+                                                        value={value}
+                                                        selected={
+                                                            field.value ===
+                                                            value
+                                                        }
+                                                    >
+                                                        {label}
+                                                    </option>
+                                                )}
+                                            </For>
+                                        </select>
+                                    </Show>
                                 )}
                             </Field>
                         </KeyValue>

diff --git a/src/i18n/en/translations.ts b/src/i18n/en/translations.ts
@@ -296,7 +296,8 @@ export default {
             remaining: "Remaining",
             confirm_delete: "Are you sure you want to delete this connection?",
             budget: "Budget",
-            resets_every: "Resets every"
+            resets_every: "Resets every",
+            resubscribe_date: "Resubscribe on"
         },
         emergency_kit: {
             title: "Emergency Kit",

diff --git a/src/routes/settings/Connections.tsx b/src/routes/settings/Connections.tsx
@@ -122,13 +122,15 @@ function NwcDetails(props: {
 
     return (
         <VStack>
-            <div class="w-full rounded-xl bg-white">
-                <QRCodeSVG
-                    value={props.profile.nwc_uri}
-                    class="h-full max-h-[320px] w-full p-8"
-                />
-            </div>
-            <ShareCard text={props.profile.nwc_uri || ""} />
+            <Show when={props.profile.index >= 1000}>
+                <div class="w-full rounded-xl bg-white">
+                    <QRCodeSVG
+                        value={props.profile.nwc_uri}
+                        class="h-full max-h-[320px] w-full p-8"
+                    />
+                </div>
+                <ShareCard text={props.profile.nwc_uri || ""} />
+            </Show>
 
             <Show when={!props.profile.require_approval}>
                 <TinyText>{i18n.t("settings.connections.careful")}</TinyText>
@@ -148,6 +150,15 @@ function NwcDetails(props: {
                         {props.profile.budget_period}
                     </KeyValue>
                 </Show>
+                <Show when={props.profile.index === 0}>
+                    <KeyValue
+                        key={i18n.t("settings.connections.resubscribe_date")}
+                    >
+                        {new Date(
+                            state.subscription_timestamp! * 1000
+                        ).toLocaleDateString()}
+                    </KeyValue>
+                </Show>
             </Show>
 
             <Button layout="small" intent="green" onClick={props.onEdit}>