[Request] Add API key QRCode to User Settings -> Application Keys

[Credomane Evonguard]

Is your feature request related to a problem? Please describe.

If you go to Settings (wrench icon) -> Application Keys then you can see all application keys for all users. You even have a little hourglass icon to click on to get details on a particular application key and even get a QRcode for it. This is great.

If you go to the User Settings (person icon) -> Application Keys then the logged in user sees only their keys. This is also great. However there is only the delete button; the hourglass icon isn't there for details on that key and therefore no QRcode available. This is not so great.

Describe the solution you'd like

The ability for a user to get a QRcode for their API Keys in their user settings.

[Credomane Evonguard]

Decided to dig into this myself and discovered that I might have this feature request in the wrong place?

I missed it before due to the screen resolution of the computer I was on but the main page of the user settings actually has a API key which shows a QRCode. While the "Application Keys" tab seems to be provided by the "Application Keys Plugin" that is bundled with Octoprint.

[edit]
I poked around and looks like the plugin in question is located in this repo at /src/octoprint/plugins/appkeys/
Then after examining the jinja2 files it seems it was a super quick fix.

diff --git a/src/octoprint/plugins/appkeys/templates/appkeys_usersettings.jinja2 b/src/octoprint/plugins/appkeys/templates/appkeys_usersettings.jinja2
index 5c0930efb..3f127c54f 100644
--- a/src/octoprint/plugins/appkeys/templates/appkeys_usersettings.jinja2
+++ b/src/octoprint/plugins/appkeys/templates/appkeys_usersettings.jinja2
@@ -14,7 +14,7 @@
         <tbody data-bind="foreach: keys.paginatedItems">
         <tr>
             <td class="settings_plugin_appkeys_app"><span data-bind="text: app_id"></span><br /><small class="muted">{{ _('API Key') }}: <span data-bind="text: api_key"></span> <a href="javascript:void(0)" title="{{ _('Copy API Key to clipboard')|edq }}" data-bind="click: function() { copyToClipboard(api_key) }"><i class="fas fa-copy"></i></a></small></td>
-            <td class="settings_plugin_appkeys_actions"><a href="javascript:void(0)" title="{{ _('Revoke')|edq }}" class="far fa-trash-alt" data-bind="click: function() { $parent.revokeKey($data.api_key) }"></a></td>
+            <td class="settings_plugin_appkeys_actions"><a href="javascript:void(0)" title="{{ _('Revoke')|edq }}" class="far fa-trash-alt" data-bind="click: function() { $parent.revokeKey($data.api_key) }"></a>&nbsp;|&nbsp;<a href="javascript:void(0)" title="{{ _('Details')|edq }}" class="fas fa-search" data-bind="click: function() { $parent.dialog.showDialog(gettext('Details'), $data) }"></a></td>
         </tr>
         </tbody>
     </table>

The results:

I'll get a PR made shortly.

[Gina Häußge]

Merged the PR of @credomane (thanks!), this is now ready for 1.10.0.