feat(device): no-session UX on /device/authorize + i18n refresh

No active session now shows a "Sign in to continue" CTA (+ "You'll be asked to
sign in before authorizing." note) instead of an Authorize button that silently
bounced to /login; Deny stays available sessionlessly. Update inline-action-error
test (signed-in consent fixture + new no-session assertion) and refresh en.po.

Author: yahyafakhroji

app/modules/i18n/locales/en.po

@@ -100,7 +100,7 @@ msgstr "Authorization complete"
 msgid "Authorization failed"
 msgstr "Authorization failed"
 
-#: app/routes/device/authorize.tsx:157
+#: app/routes/device/authorize.tsx:162
 msgid "Authorize"
 msgstr "Authorize"
 
@@ -212,7 +212,8 @@ msgstr "Create a new account"
 msgid "Create account"
 msgstr "Create account"
 
-#: app/routes/device/authorize.tsx:167
+#: app/routes/device/authorize.tsx:172
+#: app/routes/device/authorize.tsx:198
 msgid "Deny"
 msgstr "Deny"
 
@@ -541,6 +542,10 @@ msgstr "Sign in"
 msgid "Sign in again"
 msgstr "Sign in again"
 
+#: app/routes/device/authorize.tsx:184
+msgid "Sign in to continue"
+msgstr "Sign in to continue"
+
 #: app/routes/sso/link.tsx:48
 msgid "Sign in with"
 msgstr "Sign in with"
@@ -790,6 +795,10 @@ msgstr "You may return to your device."
 msgid "You must be signed in to link an external account."
 msgstr "You must be signed in to link an external account."
 
+#: app/routes/device/authorize.tsx:134
+msgid "You'll be asked to sign in before authorizing."
+msgstr "You'll be asked to sign in before authorizing."
+
 #: app/routes/signup/password.tsx:159
 msgid "You'll need to set a password to complete your signup."
 msgstr "You'll need to set a password to complete your signup."

app/routes/__tests__/inline-action-error.test.tsx

@@ -146,6 +146,9 @@ describe('device/authorize — inline ACTION error in the consent form (no toast
     scope: ['read'],
     deviceAuthId: 'dev-1',
     requestId: 'rq-1',
+    // Signed-in consent: the authorize/deny action-error path only occurs with an active
+    // session (a sessionless authorize redirects to /login rather than producing an error).
+    activeLoginName: 'user@example.test',
   };
 
   it('renders the deny/authorize action error inline in a role="alert" banner inside the consent form', async () => {
@@ -158,6 +161,14 @@ describe('device/authorize — inline ACTION error in the consent form (no toast
     expect(screen.getByRole('button', { name: /Authorize/ })).toBeInTheDocument();
   });
 
+  it('with no active session, shows a "Sign in to continue" CTA instead of Authorize', async () => {
+    mountAt(DeviceAuthorize, '/device/authorize', { ...consentLoaderData, activeLoginName: null });
+    expect(await screen.findByRole('link', { name: /Sign in to continue/ })).toBeInTheDocument();
+    expect(screen.queryByRole('button', { name: /Authorize/ })).not.toBeInTheDocument();
+    // Deny stays available — a sessionless user can still reject an unrecognized device.
+    expect(screen.getByRole('button', { name: /Deny/ })).toBeInTheDocument();
+  });
+
   it('renders NO alert banner when there is no action error', async () => {
     mountAt(DeviceAuthorize, '/device/authorize', consentLoaderData);
     await screen.findByText(/Authorize device/);

app/routes/accounts.tsx

@@ -97,11 +97,7 @@ export default function AccountPicker() {
             {/* Carry the ceremony requestId so a fresh "add account" login resumes the
                 OIDC/SAML/device callback (like the switch form) rather than dead-ending at
                 the default post-login redirect. */}
-            <LinkButton
-              theme="link"
-              type="quaternary"
-              as={Link}
-              href={addAccountHref}>
+            <LinkButton theme="link" type="quaternary" as={Link} href={addAccountHref}>
               <Trans>Add an account</Trans>
             </LinkButton>
           </div>

app/routes/device/authorize.tsx

@@ -129,7 +129,11 @@ export default function DeviceAuthorize() {
                 <Trans>Use a different account</Trans>
               </LinkButton>
             </span>
-          ) : null}
+          ) : (
+            <span className="mt-2 block">
+              <Trans>You'll be asked to sign in before authorizing.</Trans>
+            </span>
+          )}
         </>
       }>
       <div className="flex flex-col gap-4">
@@ -142,32 +146,60 @@ export default function DeviceAuthorize() {
             ))}
           </div>
         )}
-        <RRForm method="post" className="flex w-full flex-col gap-4">
-          <AuthFormFields csrf={csrfToken} />
-          <input type="hidden" name="deviceAuthId" value={deviceAuthId} />
-          <input type="hidden" name="requestId" value={requestId} />
-          <FormError>{errorMessage}</FormError>
-          <div className="flex flex-col gap-3">
-            <Button
-              htmlType="submit"
-              name="decision"
-              className="w-full"
-              value="authorize"
-              disabled={isSubmitting}>
-              <Trans>Authorize</Trans>
-            </Button>
-            <Button
-              htmlType="submit"
-              name="decision"
-              value="deny"
-              type="secondary"
-              theme="outline"
-              className="w-full"
-              disabled={isSubmitting}>
-              <Trans>Deny</Trans>
-            </Button>
+        {activeLoginName ? (
+          <RRForm method="post" className="flex w-full flex-col gap-4">
+            <AuthFormFields csrf={csrfToken} />
+            <input type="hidden" name="deviceAuthId" value={deviceAuthId} />
+            <input type="hidden" name="requestId" value={requestId} />
+            <FormError>{errorMessage}</FormError>
+            <div className="flex flex-col gap-3">
+              <Button
+                htmlType="submit"
+                name="decision"
+                className="w-full"
+                value="authorize"
+                disabled={isSubmitting}>
+                <Trans>Authorize</Trans>
+              </Button>
+              <Button
+                htmlType="submit"
+                name="decision"
+                value="deny"
+                type="secondary"
+                theme="outline"
+                className="w-full"
+                disabled={isSubmitting}>
+                <Trans>Deny</Trans>
+              </Button>
+            </div>
+          </RRForm>
+        ) : (
+          // Not signed in: authorizing requires a session. Lead with a clear "Sign in to
+          // continue" CTA (after login the device auto-completes — no second consent click)
+          // instead of an Authorize button that silently bounces to /login. Deny still works
+          // sessionlessly, so a user can reject an unrecognized device without signing in.
+          <div className="flex w-full flex-col gap-3">
+            <FormError>{errorMessage}</FormError>
+            <LinkButton type="primary" block as={Link} href={paths.login.index({ requestId })}>
+              <Trans>Sign in to continue</Trans>
+            </LinkButton>
+            <RRForm method="post">
+              <AuthFormFields csrf={csrfToken} />
+              <input type="hidden" name="deviceAuthId" value={deviceAuthId} />
+              <input type="hidden" name="requestId" value={requestId} />
+              <Button
+                htmlType="submit"
+                name="decision"
+                value="deny"
+                type="secondary"
+                theme="outline"
+                block
+                disabled={isSubmitting}>
+                <Trans>Deny</Trans>
+              </Button>
+            </RRForm>
           </div>
-        </RRForm>
+        )}
       </div>
     </AuthCard>
   );