ExtensionStep: make it kind of work

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:

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>
   );
 };