feat(dev): add u2f ui for managing devices and signing in (#2182)

* feat: add u2f ui for managing devices and signing in

* refactor: change unnecessary useState to derived constant

* fix: modal refactor

* fix(web): hide u2f under feature trunk

* fix(web): jest setup

---------

Co-authored-by: Aman Harwara <amanharwara@protonmail.com>

packages/snjs/lib/Domain/UseCase/GetAuthenticatorAuthenticationResponse/GetAuthenticatorAuthenticationResponse.spec.ts

@@ -0,0 +1,69 @@
+import { AuthenticatorClientInterface } from '@standardnotes/services'
+
+import { GetAuthenticatorAuthenticationResponse } from './GetAuthenticatorAuthenticationResponse'
+
+describe('GetAuthenticatorAuthenticationResponse', () => {
+  let authenticatorClient: AuthenticatorClientInterface
+  let authenticatorVerificationPromptFunction: (
+    authenticationOptions: Record<string, unknown>,
+  ) => Promise<Record<string, unknown>>
+
+  const createUseCase = () => new GetAuthenticatorAuthenticationResponse(authenticatorClient, authenticatorVerificationPromptFunction)
+
+  beforeEach(() => {
+    authenticatorClient = {} as jest.Mocked<AuthenticatorClientInterface>
+    authenticatorClient.generateAuthenticationOptions = jest.fn().mockResolvedValue({ foo: 'bar' })
+
+    authenticatorVerificationPromptFunction = jest.fn()
+  })
+
+  it('should return an error if username is not provided', async () => {
+    const result = await createUseCase().execute({
+      username: '',
+    })
+
+    expect(result.isFailed()).toBe(true)
+    expect(result.getError()).toBe('Could not generate authenticator authentication options: Username cannot be empty')
+  })
+
+  it('should return an error if authenticator client fails to generate authentication options', async () => {
+    authenticatorClient.generateAuthenticationOptions = jest.fn().mockResolvedValue(null)
+
+    const result = await createUseCase().execute({
+      username: 'test@test.te',
+    })
+
+    expect(result.isFailed()).toBe(true)
+    expect(result.getError()).toBe('Could not generate authenticator authentication options')
+  })
+
+  it('should return an error if authenticator verification prompt function fails', async () => {
+    authenticatorVerificationPromptFunction = jest.fn().mockRejectedValue(new Error('error'))
+
+    const result = await createUseCase().execute({
+      username: 'test@test.te',
+    })
+
+    expect(result.isFailed()).toBe(true)
+    expect(result.getError()).toBe('Could not generate authenticator authentication options: error')
+  })
+
+  it('should return ok if authenticator client succeeds to generate authenticator response', async () => {
+    const result = await createUseCase().execute({
+      username: 'test@test.te',
+    })
+
+    expect(result.isFailed()).toBe(false)
+  })
+
+  it('should return error if authenticatorVerificationPromptFunction is not provided', async () => {
+    const result = await new GetAuthenticatorAuthenticationResponse(authenticatorClient).execute({
+      username: 'test@test.te',
+    })
+
+    expect(result.isFailed()).toBe(true)
+    expect(result.getError()).toBe(
+      'Could not generate authenticator authentication options: No authenticator verification prompt function provided',
+    )
+  })
+})

packages/snjs/lib/Domain/UseCase/GetAuthenticatorAuthenticationResponse/GetAuthenticatorAuthenticationResponse.ts

@@ -0,0 +1,40 @@
+import { AuthenticatorClientInterface } from '@standardnotes/services'
+import { Result, UseCaseInterface, Username } from '@standardnotes/domain-core'
+import { GetAuthenticatorAuthenticationResponseDTO } from './GetAuthenticatorAuthenticationResponseDTO'
+
+export class GetAuthenticatorAuthenticationResponse implements UseCaseInterface<Record<string, unknown>> {
+  constructor(
+    private authenticatorClient: AuthenticatorClientInterface,
+    private authenticatorVerificationPromptFunction?: (
+      authenticationOptions: Record<string, unknown>,
+    ) => Promise<Record<string, unknown>>,
+  ) {}
+
+  async execute(dto: GetAuthenticatorAuthenticationResponseDTO): Promise<Result<Record<string, unknown>>> {
+    if (!this.authenticatorVerificationPromptFunction) {
+      return Result.fail(
+        'Could not generate authenticator authentication options: No authenticator verification prompt function provided',
+      )
+    }
+
+    const usernameOrError = Username.create(dto.username)
+    if (usernameOrError.isFailed()) {
+      return Result.fail(`Could not generate authenticator authentication options: ${usernameOrError.getError()}`)
+    }
+    const username = usernameOrError.getValue()
+
+    const authenticationOptions = await this.authenticatorClient.generateAuthenticationOptions(username)
+    if (authenticationOptions === null) {
+      return Result.fail('Could not generate authenticator authentication options')
+    }
+
+    let authenticatorResponse
+    try {
+      authenticatorResponse = await this.authenticatorVerificationPromptFunction(authenticationOptions)
+    } catch (error) {
+      return Result.fail(`Could not generate authenticator authentication options: ${(error as Error).message}`)
+    }
+
+    return Result.ok(authenticatorResponse)
+  }
+}

packages/snjs/lib/Domain/UseCase/GetAuthenticatorAuthenticationResponse/GetAuthenticatorAuthenticationResponseDTO.ts

@@ -0,0 +1,3 @@
+export interface GetAuthenticatorAuthenticationResponseDTO {
+  username: string
+}