citra_qt: configure_web: Use Base64 encoded token for simplifying user experience.

src/citra_qt/configuration/configure_web.cpp

@@ -11,6 +11,31 @@
 #include "core/telemetry_session.h"
 #include "ui_configure_web.h"
 
+static constexpr char token_delimiter{':'};
+
+static std::string GenerateDisplayToken(const std::string& username, const std::string& token) {
+    if (username.empty() || token.empty()) {
+        return {};
+    }
+
+    const std::string unencoded_display_token{username + token_delimiter + token};
+    QByteArray b{unencoded_display_token.c_str()};
+    QByteArray b64 = b.toBase64();
+    return b64.toStdString();
+}
+
+static std::string UsernameFromDisplayToken(const std::string& display_token) {
+    const std::string unencoded_display_token{
+        QByteArray::fromBase64(display_token.c_str()).toStdString()};
+    return unencoded_display_token.substr(0, unencoded_display_token.find(token_delimiter));
+}
+
+static std::string TokenFromDisplayToken(const std::string& display_token) {
+    const std::string unencoded_display_token{
+        QByteArray::fromBase64(display_token.c_str()).toStdString()};
+    return unencoded_display_token.substr(unencoded_display_token.find(token_delimiter) + 1);
+}
+
 ConfigureWeb::ConfigureWeb(QWidget* parent)
     : QWidget(parent), ui(std::make_unique<Ui::ConfigureWeb>()) {
     ui->setupUi(this);
@@ -46,11 +71,18 @@ void ConfigureWeb::SetConfiguration() {
            "underline; color:#039be5;\">What is my token?</span></a>"));
 
     ui->toggle_telemetry->setChecked(Settings::values.enable_telemetry);
-    ui->edit_username->setText(QString::fromStdString(Settings::values.citra_username));
+
-    ui->edit_token->setText(QString::fromStdString(Settings::values.citra_token));
+    if (Settings::values.citra_username.empty()) {
+        ui->username->setText(tr("Unspecified"));
+    } else {
+        ui->username->setText(QString::fromStdString(Settings::values.citra_username));
+    }
+
+    ui->edit_token->setText(QString::fromStdString(
+        GenerateDisplayToken(Settings::values.citra_username, Settings::values.citra_token)));
+
     // Connect after setting the values, to avoid calling OnLoginChanged now
     connect(ui->edit_token, &QLineEdit::textChanged, this, &ConfigureWeb::OnLoginChanged);
-    connect(ui->edit_username, &QLineEdit::textChanged, this, &ConfigureWeb::OnLoginChanged);
     ui->label_telemetry_id->setText(
         tr("Telemetry ID: 0x%1").arg(QString::number(Core::GetTelemetryId(), 16).toUpper()));
     user_verified = true;
@@ -62,12 +94,13 @@ void ConfigureWeb::ApplyConfiguration() {
     Settings::values.enable_telemetry = ui->toggle_telemetry->isChecked();
     UISettings::values.enable_discord_presence = ui->toggle_discordrpc->isChecked();
     if (user_verified) {
-        Settings::values.citra_username = ui->edit_username->text().toStdString();
+        Settings::values.citra_username =
-        Settings::values.citra_token = ui->edit_token->text().toStdString();
+            UsernameFromDisplayToken(ui->edit_token->text().toStdString());
+        Settings::values.citra_token = TokenFromDisplayToken(ui->edit_token->text().toStdString());
     } else {
-        QMessageBox::warning(this, tr("Username and token not verified"),
+        QMessageBox::warning(
-                             tr("Username and token were not verified. The changes to your "
+            this, tr("Token not verified"),
-                                "username and/or token have not been saved."));
+            tr("Token was not verified. The change to your token has not been saved."));
     }
 }
 
@@ -78,17 +111,15 @@ void ConfigureWeb::RefreshTelemetryID() {
 }
 
 void ConfigureWeb::OnLoginChanged() {
-    if (ui->edit_username->text().isEmpty() && ui->edit_token->text().isEmpty()) {
+    if (ui->edit_token->text().isEmpty()) {
         user_verified = true;
 
         const QPixmap pixmap = QIcon::fromTheme(QStringLiteral("checked")).pixmap(16);
-        ui->label_username_verified->setPixmap(pixmap);
         ui->label_token_verified->setPixmap(pixmap);
     } else {
         user_verified = false;
 
         const QPixmap pixmap = QIcon::fromTheme(QStringLiteral("failed")).pixmap(16);
-        ui->label_username_verified->setPixmap(pixmap);
         ui->label_token_verified->setPixmap(pixmap);
     }
 }
@@ -96,10 +127,11 @@ void ConfigureWeb::OnLoginChanged() {
 void ConfigureWeb::VerifyLogin() {
     ui->button_verify_login->setDisabled(true);
     ui->button_verify_login->setText(tr("Verifying..."));
-    verify_watcher.setFuture(QtConcurrent::run([username = ui->edit_username->text().toStdString(),
+    verify_watcher.setFuture(QtConcurrent::run(
-                                                token = ui->edit_token->text().toStdString()] {
+        [username = UsernameFromDisplayToken(ui->edit_token->text().toStdString()),
-        return Core::VerifyLogin(username, token);
+         token = TokenFromDisplayToken(ui->edit_token->text().toStdString())] {
-    }));
+            return Core::VerifyLogin(username, token);
+        }));
 }
 
 void ConfigureWeb::OnLoginVerified() {
@@ -109,16 +141,16 @@ void ConfigureWeb::OnLoginVerified() {
         user_verified = true;
 
         const QPixmap pixmap = QIcon::fromTheme(QStringLiteral("checked")).pixmap(16);
-        ui->label_username_verified->setPixmap(pixmap);
         ui->label_token_verified->setPixmap(pixmap);
+        ui->username->setText(
+            QString::fromStdString(UsernameFromDisplayToken(ui->edit_token->text().toStdString())));
     } else {
         const QPixmap pixmap = QIcon::fromTheme(QStringLiteral("failed")).pixmap(16);
-        ui->label_username_verified->setPixmap(pixmap);
         ui->label_token_verified->setPixmap(pixmap);
-        QMessageBox::critical(
+        ui->username->setText(tr("Unspecified"));
-            this, tr("Verification failed"),
+        QMessageBox::critical(this, tr("Verification failed"),
-            tr("Verification failed. Check that you have entered your username and token "
+                              tr("Verification failed. Check that you have entered your token "
-               "correctly, and that your internet connection is working."));
+                                 "correctly, and that your internet connection is working."));
     }
 }
 

src/citra_qt/configuration/configure_web.ui

@@ -55,11 +55,7 @@
            </widget>
           </item>
           <item row="0" column="1" colspan="3">
-           <widget class="QLineEdit" name="edit_username">
+           <widget class="QLabel" name="username" />
-            <property name="maxLength">
-             <number>36</number>
-            </property>
-           </widget>
           </item>
           <item row="1" column="0">
            <widget class="QLabel" name="label_token">
@@ -79,14 +75,10 @@
             </property>
            </widget>
           </item>
-          <item row="0" column="4">
-           <widget class="QLabel" name="label_username_verified">
-           </widget>
-          </item>
           <item row="1" column="1" colspan="3">
            <widget class="QLineEdit" name="edit_token">
             <property name="maxLength">
-             <number>36</number>
+             <number>80</number>
             </property>
             <property name="echoMode">
              <enum>QLineEdit::Password</enum>