Nostr: enable Nostr login

src/actions/nostr.ts

@@ -0,0 +1,18 @@
+import { nip19 } from 'nostr-tools';
+
+import { getPublicKey } from 'soapbox/features/nostr/sign';
+import { type AppDispatch } from 'soapbox/store';
+
+import { verifyCredentials } from './auth';
+
+/** Log in with a Nostr pubkey. */
+function nostrLogIn() {
+  return async (dispatch: AppDispatch) => {
+    const pubkey = await getPublicKey();
+    const npub = nip19.npubEncode(pubkey);
+
+    return dispatch(verifyCredentials(npub));
+  };
+}
+
+export { nostrLogIn };

src/features/auth-login/components/registration-form.tsx

@@ -245,6 +245,7 @@ const RegistrationForm: React.FC<IRegistrationForm> = ({ inviteToken }) => {
             />
           </FormGroup>
 
+          {!features.nostrSignup && (
             <Input
               type='email'
               name='email'
@@ -256,7 +257,10 @@ const RegistrationForm: React.FC<IRegistrationForm> = ({ inviteToken }) => {
               value={params.get('email', '')}
               required
             />
+          )}
 
+          {!features.nostrSignup && (
+            <>
               <Input
                 type='password'
                 name='password'
@@ -285,6 +289,8 @@ const RegistrationForm: React.FC<IRegistrationForm> = ({ inviteToken }) => {
                   required
                 />
               </FormGroup>
+            </>
+          )}
 
           {birthdayRequired && (
             <BirthdayInput

src/features/ui/components/navbar.tsx

@@ -5,6 +5,7 @@ import { Link, Redirect } from 'react-router-dom';
 
 import { logIn, verifyCredentials } from 'soapbox/actions/auth';
 import { fetchInstance } from 'soapbox/actions/instance';
+import { nostrLogIn } from 'soapbox/actions/nostr';
 import { openSidebar } from 'soapbox/actions/sidebar';
 import SiteLogo from 'soapbox/components/site-logo';
 import { Avatar, Button, Form, HStack, IconButton, Input, Tooltip } from 'soapbox/components/ui';
@@ -38,6 +39,12 @@ const Navbar = () => {
 
   const onOpenSidebar = () => dispatch(openSidebar());
 
+  const handleNostrLogin = async () => {
+    setLoading(true);
+    await dispatch(nostrLogIn()).catch(console.error);
+    setLoading(false);
+  };
+
   const handleSubmit: React.FormEventHandler = (event) => {
     event.preventDefault();
     setLoading(true);
@@ -107,7 +114,18 @@ const Navbar = () => {
               </div>
             ) : (
               <>
-                <Form className='hidden items-center space-x-2 rtl:space-x-reverse lg:flex' onSubmit={handleSubmit}>
+                {features.nostrSignup ? (
+                  <div className='hidden items-center xl:flex'>
+                    <Button
+                      theme='primary'
+                      onClick={handleNostrLogin}
+                      disabled={isLoading}
+                    >
+                      {intl.formatMessage(messages.login)}
+                    </Button>
+                  </div>
+                ) : (
+                  <Form className='hidden items-center space-x-2 rtl:space-x-reverse xl:flex' onSubmit={handleSubmit}>
                     <Input
                       required
                       value={username}
@@ -144,13 +162,18 @@ const Navbar = () => {
                       {intl.formatMessage(messages.login)}
                     </Button>
                   </Form>
+                )}
 
-                <div className='space-x-1.5 lg:hidden'>
-                  <Button theme='tertiary' to='/login' size='sm'>
+                <div className='space-x-1.5 xl:hidden'>
+                  <Button
+                    theme='tertiary'
+                    size='sm'
+                    {...(features.nostrSignup ? { onClick: handleNostrLogin } : { to: '/login' })}
+                  >
                     <FormattedMessage id='account.login' defaultMessage='Log In' />
                   </Button>
 
-                  {isOpen && (
+                  {(isOpen) && (
                     <Button theme='primary' to='/signup' size='sm'>
                       <FormattedMessage id='account.register' defaultMessage='Sign up' />
                     </Button>

src/utils/features.ts

@@ -685,6 +685,12 @@ const getInstanceFeatures = (instance: Instance) => {
      */
     nostrSign: v.software === DITTO,
 
+    /**
+     * Whether the backend uses Ditto's Nosteric way of registration.
+     * @see POST /api/v1/accounts
+     */
+    nostrSignup: v.software === DITTO,
+
     /**
      * Add private notes to accounts.
      * @see POST /api/v1/accounts/:id/note