From a9d311028e90a7f7e15e67f64b9c7aab80b47a73 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sun, 11 Feb 2024 17:13:29 -0600
Subject: [PATCH] ExtensionStep: make it kind of work

---
 .../nostr-signin-modal/nostr-signin-modal.tsx |  2 +-
 .../steps/extension-step.tsx                  | 25 ++++++++++++++++---
 2 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/src/features/ui/components/modals/nostr-signin-modal/nostr-signin-modal.tsx b/src/features/ui/components/modals/nostr-signin-modal/nostr-signin-modal.tsx
index 0d3497f51..f12d9230a 100644
--- a/src/features/ui/components/modals/nostr-signin-modal/nostr-signin-modal.tsx
+++ b/src/features/ui/components/modals/nostr-signin-modal/nostr-signin-modal.tsx
@@ -29,7 +29,7 @@ const NostrSigninModal: React.FC<INostrSigninModal> = ({ onClose }) => {
   const renderModalTitle = () => {
     switch (step) {
       case 0:
-        return <FormattedMessage id='nostr_signin.siwe.title' defaultMessage='Sign in with extension' />;
+        return <FormattedMessage id='nostr_signin.siwe.title' defaultMessage='Sign in' />;
       case 1:
         return <FormattedMessage id='nostr_signin.identity.title' defaultMessage='Who are you?' />;
       default:
diff --git a/src/features/ui/components/modals/nostr-signin-modal/steps/extension-step.tsx b/src/features/ui/components/modals/nostr-signin-modal/steps/extension-step.tsx
index 28fc8621f..97077353c 100644
--- a/src/features/ui/components/modals/nostr-signin-modal/steps/extension-step.tsx
+++ b/src/features/ui/components/modals/nostr-signin-modal/steps/extension-step.tsx
@@ -1,15 +1,32 @@
 import React from 'react';
+import { FormattedMessage } from 'react-intl';
 
-import { Stack } from 'soapbox/components/ui';
+import Button from 'soapbox/components/ui/button/button';
+import Stack from 'soapbox/components/ui/stack/stack';
+import { signer } from 'soapbox/features/nostr/sign';
 
 interface IExtensionStep {
   setStep: (step: number) => void;
 }
 
-const ExtensionStep: React.FC<IExtensionStep> = () => {
+const ExtensionStep: React.FC<IExtensionStep> = ({ setStep }) => {
+  const onClick = () => {
+    signer!.getPublicKey();
+  };
+
+  const onClickAlt = () => {
+    setStep(1);
+  };
+
   return (
-    <Stack>
-      extension step
+    <Stack className='my-6' space={3}>
+      <Button theme='accent' size='lg' onClick={onClick}>
+        <FormattedMessage id='nostr_signin.siwe.action' defaultMessage='Sign in with extension' />
+      </Button>
+
+      <Button theme='transparent' onClick={onClickAlt}>
+        <FormattedMessage id='nostr_signin.siwe.alt' defaultMessage='Sign in with key' />
+      </Button>
     </Stack>
   );
 };