Improve login layout with proper labels by nooreldeensalah · Pull Request #1266 · canonical/authd

nooreldeensalah · 2026-02-13T09:39:45Z

I've tested these changes on LXD container, for the QR code testing, I've used lxc console command. I'm unsure if this is the ideal way or not.

Note: I've ran the tests locally with the TESTS_UPDATE_GOLDEN flag, and it edited multiple test files, which I commited to a separate branch nooreldeensalah@35b1378. Should I cherry-pick this commit to this PR?

SSH (Before)

== Device Authentication ==
Open the URL and enter the code below.
https://www.google.com/device
        CHD-DSN-RNTH

  1. Wait for authentication result
  2. Request new code

SSH (After)

== Device Authentication ==
Open the URL and enter the code below.

URL: https://www.google.com/device
Code: ZRF-FDP-XRFV

  1. Wait for authentication result
  2. Request new code

QR (Before)

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
                      https://www.google.com/device
                               GGM-WRP-FNNF

                            [ Request new code ]

QR (After)

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
                      https://www.google.com/device
                            Code: GJZ-VYM-QKBJ

                            [ Request new code ]

edibotopic · 2026-02-13T11:34:53Z

Thanks @nooreldeensalah

QR (After)

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
                      https://www.google.com/device
                            Code: GJZ-VYM-QKBJ

                            [ Request new code ]

For consistency with the SSH interface, shouldn't a label also be prepended to the URL here, like so:

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
                      URL: https://www.google.com/device
                            Code: GJZ-VYM-QKBJ

                            [ Request new code ]

nooreldeensalah · 2026-02-13T11:50:58Z

I've updated it as suggested @edibotopic, I initially followed the suggestion from this comment regarding the label becoming long on the issue.

Let me know if any more changes are needed!

This is how it looks like now (from lxc console output)

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
                    URL: https://www.google.com/device
                            Code: TGM-DRC-BRMX

                            [ Request new code ]

edibotopic · 2026-02-13T12:06:44Z

I've updated it as suggested @edibotopic, I initially followed the suggestion from this #1263 (comment) regarding the label becoming long on the issue.

Thanks. I think it's more visually consistent. The URL is first mentioned many lines before the QR, so it's no harm to be maximally explicit about what we are referring to, so that the connection is clear and the user can scan the text efficiently.

But also, I'm not sure there is any practical advantage to centering the text for the URL and Code below the QR; if anything, it makes the text less readable. And the original comment was about the string being too long when centering is applied.

So, I think this would be fine:

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████

URL:  https://www.google.com/device
Code: TGM-DRC-BRMX

                            [ Request new code ]

I think that it makes more sense to have [Request new code] set apart by centering.

I'm not testing this, but I would also suggest (as shown in my example above) adding a newline between the QR and the strings below (if it doesn't exist already) for clearer visual separation.

Any issue with the reasoning above @adombeck ?

nooreldeensalah · 2026-02-13T12:53:36Z

Current layout after the latest commit

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████

URL: https://www.google.com/device
Code: JZF-DRK-LNKH

                            [ Request new code ]

adombeck · 2026-02-13T16:05:19Z

Any issue with the reasoning above @adombeck ?

Not at all. It makes sense to me, even though I was initially a bit hesitant to replace the center alignment with left alignment, because I found it visually appealing. However, I agree that, when combined with the labels, the left alignment makes it more readable.

adombeck · 2026-02-13T16:13:55Z

pam/internal/adapter/nativemodel.go

The linter complains about an ineffectual assignment to firstQrCodeLine in this line. It's correct, the variable is not used anymore, you now directly use m.uiLayout.GetContent() as the URL - which makes sense to me, because we pass the content as the URL and also use it to generate the QR code. I wonder why we tried to use the first line of the rendered QR code instead. Do you remember, @3v1n0?

adombeck · 2026-02-13T16:17:46Z

pam/internal/adapter/nativemodel.go

+		qrcodeView = append(qrcodeView, fmt.Sprintf("Code: %s", code))
 	}


Let's add another space between the URL: label and the URL, to make it align with the code, as @edibotopic suggested in #1266 (comment):

Suggested change

qrcodeView = append(qrcodeView, fmt.Sprintf("Code: %s", code))

}

qrcodeView = append(qrcodeView, fmt.Sprintf("URL: %s", m.uiLayout.GetContent()))

qrcodeView = append(qrcodeView, fmt.Sprintf("Code: %s", code))

} else {

qrcodeView = append(qrcodeView, fmt.Sprintf("URL: %s", m.uiLayout.GetContent()))

}

adombeck · 2026-02-13T16:24:10Z

I've tested these changes on LXD container, for the QR code testing, I've used lxc console command. I'm unsure if this is the ideal way or not.

That seems reasonable since this change should only affect the command-line interface. When testing changes which involve gnome-shell / GDM, you will probably want to set up a VM and share the authd repository between your host and the VM. I can help you with that.

adombeck · 2026-02-13T16:27:32Z

Note: I've ran the tests locally with the TESTS_UPDATE_GOLDEN flag, and it edited multiple test files, which I commited to a separate branch nooreldeensalah@35b1378. Should I cherry-pick this commit to this PR?

Yes, please! That will hopefully fix the tests which are currently failing (beside the flaky ones - if you see the "Retry Go Tests with Coverage Collection" job fail, that's a quite reliable indication that there's actually something wrong).

nooreldeensalah · 2026-02-13T17:27:49Z

I've tested these changes on LXD container, for the QR code testing, I've used lxc console command. I'm unsure if this is the ideal way or not.

That seems reasonable since this change should only affect the command-line interface. When testing changes which involve gnome-shell / GDM, you will probably want to set up a VM and share the authd repository between your host and the VM. I can help you with that.

Thanks, I appreciate that! it would definitely be helpful :)

I've re-generated the golden tests, and pushed them in my latest commit. And I've addressed your latest suggestions as well.

Current layout after adding the whitespace:

SSH

== Device Authentication ==
Open the URL and enter the code below.

URL:  https://www.google.com/device
Code: MLT-TGC-ZDNF

  1. Wait for authentication result
  2. Request new code

QR

██████████████████████████████████████████████████████████████████████████
██████████████████████████████████████████████████████████████████████████

URL:  https://www.google.com/device
Code: RMX-HWJ-SNHY

                            [ Request new code ]

codecov · 2026-02-13T17:38:52Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 86.02%. Comparing base (1b9ea6b) to head (e802ab7).
⚠️ Report is 3 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1266      +/-   ##
==========================================
+ Coverage   85.00%   86.02%   +1.01%     
==========================================
  Files         119       99      -20     
  Lines        7669     6674     -995     
  Branches      111      111              
==========================================
- Hits         6519     5741     -778     
+ Misses       1094      877     -217     
  Partials       56       56

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

nooreldeensalah force-pushed the improve-cli-login-layout branch from dfce212 to e1d3bb7 Compare February 13, 2026 11:45

adombeck reviewed Feb 13, 2026

View reviewed changes

nooreldeensalah force-pushed the improve-cli-login-layout branch from 3b57eed to 18104bd Compare February 13, 2026 17:21

nooreldeensalah added 3 commits February 13, 2026 19:22

Improve login layout with proper labels

172b4ee

left-align labels in QR code layout for consistency

502aeaf

tests: improve layout of login prompt with proper labels and alignment

e802ab7

nooreldeensalah force-pushed the improve-cli-login-layout branch from 18104bd to e802ab7 Compare February 13, 2026 17:22

shiv-tyagi mentioned this pull request Feb 13, 2026

Improve layout of CLI login prompt without QR code #1263

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Improve login layout with proper labels#1266

Improve login layout with proper labels#1266
nooreldeensalah wants to merge 3 commits intocanonical:mainfrom
nooreldeensalah:improve-cli-login-layout

nooreldeensalah commented Feb 13, 2026 •

edited

Loading

Uh oh!

edibotopic commented Feb 13, 2026

Uh oh!

nooreldeensalah commented Feb 13, 2026

Uh oh!

edibotopic commented Feb 13, 2026 •

edited

Loading

Uh oh!

nooreldeensalah commented Feb 13, 2026

Uh oh!

adombeck commented Feb 13, 2026

Uh oh!

adombeck Feb 13, 2026

Uh oh!

adombeck Feb 13, 2026

Uh oh!

adombeck commented Feb 13, 2026

Uh oh!

adombeck commented Feb 13, 2026

Uh oh!

nooreldeensalah commented Feb 13, 2026

Uh oh!

codecov bot commented Feb 13, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Comments

		qrcodeView = append(qrcodeView, fmt.Sprintf("Code: %s", code))
		}

-		qrcodeView = append(qrcodeView, fmt.Sprintf("Code: %s", code))
-	}
+		qrcodeView = append(qrcodeView, fmt.Sprintf("URL:  %s", m.uiLayout.GetContent()))
+		qrcodeView = append(qrcodeView, fmt.Sprintf("Code: %s", code))
+} else {
+		qrcodeView = append(qrcodeView, fmt.Sprintf("URL: %s", m.uiLayout.GetContent()))
+}

Conversation

nooreldeensalah commented Feb 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

SSH (Before)

SSH (After)

QR (Before)

QR (After)

Uh oh!

edibotopic commented Feb 13, 2026

Uh oh!

nooreldeensalah commented Feb 13, 2026

Uh oh!

edibotopic commented Feb 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

nooreldeensalah commented Feb 13, 2026

Uh oh!

adombeck commented Feb 13, 2026

Uh oh!

adombeck Feb 13, 2026

Choose a reason for hiding this comment

Uh oh!

adombeck Feb 13, 2026

Choose a reason for hiding this comment

Uh oh!

adombeck commented Feb 13, 2026

Uh oh!

adombeck commented Feb 13, 2026

Uh oh!

nooreldeensalah commented Feb 13, 2026

SSH

QR

Uh oh!

codecov bot commented Feb 13, 2026

Codecov Report

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Comments

nooreldeensalah commented Feb 13, 2026 •

edited

Loading

edibotopic commented Feb 13, 2026 •

edited

Loading