Merge pull request 'feature/RVRNEXT-38-use-font-awesome' (!51) from feature/RVRNEXT-38-use-font-awesome into master

Reviewed-on: #51

mail/signup-noconfirm.html

@@ -1,9 +0,0 @@
-Hi,
-<br><br>
-You recently signed up on {{APP_NAME}} with this Google account ({{EMAIL}}).
-<br><br>
-Have fun on {{APP_NAME}}!
-<br><br>
-Regards,<br>
-{{APP_NAME}}<br>
-<a href="{{BASE_URL}}" title="{{APP_NAME}}">{{BASE_URL}}</a>

mail/signup.html

@@ -1,18 +0,0 @@
-Hi,
-<br><br>
-You recently signed up on {{APP_NAME}} with this email address ({{EMAIL}}).
-To activate your account, please click on the following link:<br>
-<a href="{{ACTIVATE_LINK}}" title="Account activation">{{ACTIVATE_LINK}}</a>
-<br><br>
-You can activate your account until {{ACTIVATABLE_UNTIL}}.
-If you don't activate your account, your email address will be permanently deleted after this point of time.
-<br><br>
-If you did not sign up on {{APP_NAME}} or changed your mind, no further action is required.
-However if you want to immediately delete your email address, please click on the following link:<br>
-<a href="{{CANCEL_LINK}}" title="Sign up cancellation">{{CANCEL_LINK}}</a>
-<br><br>
-Have fun on {{APP_NAME}}!
-<br><br>
-Regards,<br>
-{{APP_NAME}}<br>
-<a href="{{BASE_URL}}" title="{{APP_NAME}}">{{BASE_URL}}</a>

public/static/css/rvr.css

@@ -404,6 +404,10 @@ header>p>span>a:link, header>p>span>a:visited {
     color: inherit;
 }
 
+header>p>span>a:hover, header>p>span>a:focus {
+    text-decoration: none;
+}
+
 header>p>span:not(:last-child) {
     border-right: solid white 1px;
     padding-right: 6px;

public/static/js/account/account.js

@@ -59,11 +59,10 @@ var Account = {
 };
 
 (function () {
-    document.getElementById('authenticateWithGoogleButton').onclick = function () {
-        Account.openGoogleAuthenticate();
-    };
-
-    document.getElementsByTagName('form')[0].onreset = function () {
-        Account.resetGoogleAuthentication();
-    };
+    var authenticateWithGoogleButton = document.getElementById('authenticateWithGoogleButton');
+    if (authenticateWithGoogleButton) {
+        authenticateWithGoogleButton.onclick = function () {
+            Account.openGoogleAuthenticate();
+        };
+    }
 })();

public/static/js/rvr.js

@@ -97,7 +97,7 @@ var RVR = {
             RVR.showModalWithContent('Confirmation', this.dataset.confirmation, [
                 {
                     type: 'button',
-                    text: self.textContent,
+                    html: this.dataset.confirmationButton ? this.dataset.confirmationButton : this.innerHTML,
                     classNames: ['red'],
                     onclick: function() {
                         var event = new Event('submit', {'bubbles': true, 'cancelable': true});
@@ -147,7 +147,11 @@ var RVR = {
 
             button.classList.add('marginTop');
             button.classList.add('marginRight');
-            button.textContent = extraButton.text;
+            if (typeof extraButton.html !== 'undefined') {
+                button.innerHTML = extraButton.html;
+            } else {
+                button.textContent = extraButton.text;
+            }
 
             if (extraButton.type === 'a') {
                 button.href = extraButton.href;

public/static/package-lock.json

@@ -2,6 +2,11 @@
   "requires": true,
   "lockfileVersion": 1,
   "dependencies": {
+    "@fortawesome/fontawesome-free": {
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.4.0.tgz",
+      "integrity": "sha512-0NyytTlPJwB/BF5LtRV8rrABDbe3TdTXqNB3PdZ+UUUZAEIrdOJdmABqKjt4AXwIoJNaRVVZEXxpNrqvE1GAYQ=="
+    },
     "@orchidjs/sifter": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/@orchidjs/sifter/-/sifter-1.0.3.tgz",

public/static/package.json

@@ -1,5 +1,6 @@
 {
   "dependencies": {
+    "@fortawesome/fontawesome-free": "^6.4.0",
     "leaflet": "^1.6.0",
     "leaflet.markercluster": "^1.4.1",
     "tom-select": "^2.2.2"

src/Controller/LoginController.php

@@ -281,7 +281,7 @@ class LoginController
         $mail = new Mail();
         $mail->addRecipient($email);
         $mail->setSubject($_ENV['APP_NAME'] . ' - Password reset');
-        $mail->setBodyFromTemplate('password.reset', [
+        $mail->setBodyFromTemplate('password-reset', [
             'EMAIL' => $email,
             'RESET_LINK' => \Container::$request->getBase() .
                 \Container::$routeCollection->getRoute('password.reset')->generateLink(['token' => $token]),

src/Controller/UserController.php

@@ -37,6 +37,130 @@ class UserController implements IAuthenticationRequired
         return new HtmlContent('account/account', ['user' => $user->toArray()]);
     }
 
+    public function getGoogleConnectRedirect(): IRedirect
+    {
+        /**
+         * @var User $user
+         */
+        $user = \Container::$request->user();
+
+        $state = bin2hex(random_bytes(16));
+        $nonce = bin2hex(random_bytes(16));
+
+        \Container::$request->session()->set('oauth_state', $state);
+        \Container::$request->session()->set('oauth_nonce', $nonce);
+
+        $oAuth = new GoogleOAuth(new Request());
+
+        $url = $oAuth->getDialogUrl(
+            $state,
+            \Container::$request->getBase() . \Container::$routeCollection->getRoute('account.googleConnect-confirm')->generateLink(),
+            $nonce,
+            $user->getEmail()
+        );
+
+        return new Redirect($url, IRedirect::TEMPORARY);
+    }
+
+    public function getGoogleConnectConfirm(): IContent
+    {
+        $defaultError = 'Authentication with Google failed. Please <a href="' . \Container::$routeCollection->getRoute('account.googleConnect')->generateLink() . '" title="Connect with Google">try again</a>!';
+
+        if (\Container::$request->query('state') !== \Container::$request->session()->get('oauth_state')) {
+            return new HtmlContent('account/google_connect', ['success' => false, 'error' => $defaultError]);
+        }
+
+        $oAuth = new GoogleOAuth(new Request());
+        $tokenData = $oAuth->getToken(
+            \Container::$request->query('code'),
+            \Container::$request->getBase() . \Container::$routeCollection->getRoute('account.googleConnect-confirm')->generateLink()
+        );
+        if (!isset($tokenData['id_token'])) {
+            return new HtmlContent('account/google_connect', ['success' => false, 'error' => $defaultError]);
+        }
+
+        $jwtParser = new JwtParser($tokenData['id_token']);
+        $idToken = $jwtParser->getPayload();
+        if ($idToken['nonce'] !== \Container::$request->session()->get('oauth_nonce')) {
+            return new HtmlContent('account/google_connect', ['success' => false, 'error' => $defaultError]);
+        }
+
+        $anotherUser = $this->userRepository->getByGoogleSub($idToken['sub']);
+        if ($anotherUser !== null) {
+            return new HtmlContent('account/google_connect', [
+                'success' => false,
+                'error' => 'This Google account is linked to another account.'
+            ]);
+        }
+
+        \Container::$request->session()->set('google_user_data', $idToken);
+
+        /**
+         * @var User $user
+         */
+        $user = \Container::$request->user();
+
+        return new HtmlContent('account/google_connect', [
+            'success' => true,
+            'googleAccount' => $idToken['email'],
+            'userEmail' => $user->getEmail()
+        ]);
+    }
+
+    public function connectGoogle(): IContent
+    {
+        /**
+         * @var User $user
+         */
+        $user = \Container::$request->user();
+        if (!$user->checkPassword(\Container::$request->post('password'))) {
+            return new JsonContent([
+                'error' => [
+                    'errorText' => 'The given password is wrong.'
+                ]
+            ]);
+        }
+
+        $googleUserData = \Container::$request->session()->get('google_user_data');
+        $user->setGoogleSub($googleUserData['sub']);
+        \Container::$persistentDataManager->saveToDb($user);
+
+        return new JsonContent(['success' => true]);
+    }
+
+    public function getGoogleDisconnectConfirm(): IContent
+    {
+        /**
+         * @var User $user
+         */
+        $user = \Container::$request->user();
+
+        return new HtmlContent('account/google_disconnect', [
+            'success' => true,
+            'userEmail' => $user->getEmail()
+        ]);
+    }
+
+    public function disconnectGoogle(): IContent
+    {
+        /**
+         * @var User $user
+         */
+        $user = \Container::$request->user();
+        if (!$user->checkPassword(\Container::$request->post('password'))) {
+            return new JsonContent([
+                'error' => [
+                    'errorText' => 'The given password is wrong.'
+                ]
+            ]);
+        }
+
+        $user->setGoogleSub(null);
+        \Container::$persistentDataManager->saveToDb($user);
+
+        return new JsonContent(['success' => true]);
+    }
+
     public function getGoogleAuthenticateRedirect(): IRedirect
     {
         /**

src/Finance/ExchangeRateCalculator.php

@@ -41,7 +41,7 @@ class ExchangeRateCalculator
 
         $currentExchangeRate = null;
         foreach ($this->exchangeRates[$currency->getId()] as $exchangeRate) {
-            if ($exchangeRate->getValidFrom() > $time) {
+            if ($exchangeRate->getValidFromDate() > $time) {
                 break;
             }
             $currentExchangeRate = $exchangeRate;

views/account/account.php

@@ -10,7 +10,7 @@
                 <p class="justify small">Please confirm your identity with your password or with Google to modify your account.</p>
                 <div class="inputWithButton">
                     <input type="password" class="text" name="password" autocomplete="current-password" required minlength="6" autofocus><!--
-                 --><button id="authenticateWithGoogleButton" class="yellow" type="button">Google</button>
+                 --><button id="authenticateWithGoogleButton" class="yellow" type="button"><i class="fa-brands fa-google"></i></button>
                 </div>
             <?php elseif ($user['password'] !== null): ?>
                 <p class="justify small">Please confirm your identity with your password to modify your account.</p>
@@ -19,7 +19,7 @@
                 <p class="justify small">Please confirm your identity with Google to modify your account.</p>
                 <div class="inputWithButton">
                     <input type="text" class="text" name="password" placeholder="Authenticate with Google..." disabled><!--
-                 --><button id="authenticateWithGoogleButton" class="yellow" type="button">Google</button>
+                 --><button id="authenticateWithGoogleButton" class="yellow" type="button"><i class="fa-brands fa-google"></i></button>
                 </div>
             <?php endif; ?>
             <hr>
@@ -42,7 +42,19 @@
             <input type="text" class="text big fullWidth" name="id_number" value="<?= $user['id_number'] ?>">
             <p id="accountFormError" class="formError justify marginTop"></p>
             <div class="right marginTop">
-                <button type="submit" name="submit_button" disabled>Save</button>
+                <button type="submit" name="submit_button" disabled><i class="fa-regular fa-floppy-disk"></i> Save</button>
+            </div>
+            <hr>
+            <div class="center">
+                <?php if ($user['google_sub'] === null): ?>
+                    <a class="button yellow" href="<?= Container::$routeCollection->getRoute('account.googleConnect')->generateLink() ?>" title="Connect with Google"><i class="fa-solid fa-link"></i> Connect with Google</a>
+                <?php else: ?>
+                    <?php if ($user['password'] !== null): ?>
+                        <a class="button yellow" href="<?= Container::$routeCollection->getRoute('account.googleDisconnect')->generateLink() ?>" title="Disconnect from Google"><i class="fa-solid fa-link-slash"></i> Disconnect from Google</a>
+                    <?php else: ?>
+                        <p class="bold small">Your account does not have a password. Please set a password if you want to disconnect your account from Google.</p>
+                    <?php endif; ?>
+                <?php endif; ?>
             </div>
         </form>
     </div>

views/account/google_connect.php

@@ -0,0 +1,22 @@
+@extends(templates/layout_normal)
+
+@section(main)
+    <h2>Connect with Google</h2>
+    <div class="box compactBox">
+        <?php if (!$success): ?>
+            <p class="error justify"><?= $error ?></p>
+        <?php else: ?>
+            <form id="connectGoogleForm" action="<?= Container::$routeCollection->getRoute('account.googleConnect-action')->generateLink() ?>" method="post" data-redirect-on-success="<?= Container::$routeCollection->getRoute('account')->generateLink() ?>">
+                <p class="justify marginBottom">Your account will be connected with the following Google account: <b><?= $googleAccount ?></b></p>
+                <input type="email" style="display: none;" name="email" autocomplete="username" value="<?= $userEmail ?>">
+                <p class="formLabel marginTop">Password</p>
+                <input type="password" class="text big fullWidth" name="password" autocomplete="current-password" required minlength="6" autofocus>
+                <p class="formError justify marginTop"></p>
+                <div class="right marginTop">
+                    <button class="marginRight" type="submit" name="submit"><i class="fa-solid fa-link"></i> Connect</button><!--
+                 --><a class="button gray" href="<?= Container::$routeCollection->getRoute('account')->generateLink() ?>" title="Back to account">Cancel</a>
+                </div>
+            </form>
+        <?php endif; ?>
+    </div>
+@endsection

views/account/google_disconnect.php

@@ -0,0 +1,18 @@
+@extends(templates/layout_normal)
+
+@section(main)
+    <h2>Disconnect from Google</h2>
+    <div class="box compactBox">
+        <form id="connectGoogleForm" action="<?= Container::$routeCollection->getRoute('account.googleDisconnect-action')->generateLink() ?>" method="post" data-redirect-on-success="<?= Container::$routeCollection->getRoute('account')->generateLink() ?>">
+            <p class="justify marginBottom">Your account will be disconnected from the currently set Google account.</p>
+            <input type="email" style="display: none;" name="email" autocomplete="username" value="<?= $userEmail ?>">
+            <p class="formLabel marginTop">Password</p>
+            <input type="password" class="text big fullWidth" name="password" autocomplete="current-password" required minlength="6" autofocus>
+            <p class="formError justify marginTop"></p>
+            <div class="right marginTop">
+                <button class="red marginRight" type="submit" name="submit"><i class="fa-solid fa-link-slash"></i> Disconnect</button><!--
+             --><a class="button gray" href="<?= Container::$routeCollection->getRoute('account')->generateLink() ?>" title="Back to account">Cancel</a>
+            </div>
+        </form>
+    </div>
+@endsection

views/communities/community_currencies.php

@@ -26,9 +26,9 @@
                         <input type="number" form="editCurrency_<?= $currency->getId() ?>" class="text fullWidth" name="round_digits" value="<?= $currency->getRoundDigits() ?>" min="0" max="9" required>
                     </td>
                     <td style="text-align: right; font-size: 0;">
-                        <button type="submit" form="editCurrency_<?= $currency->getId() ?>" name="submit_button" class="small" disabled>Save</button>
+                        <button type="submit" form="editCurrency_<?= $currency->getId() ?>" name="submit_button" class="small" disabled><i class="fa-regular fa-floppy-disk"></i></button>
                         <?php if ($currency->getId() !== $community->getMainCurrencyId()): ?>
-                            <button type="submit" form="deleteCurrency_<?= $currency->getId() ?>" name="submit_button" data-confirmation="Are you sure you want to delete this currency?" class="small red marginLeft">Delete</button>
+                            <button type="submit" form="deleteCurrency_<?= $currency->getId() ?>" name="submit_button" data-confirmation="Are you sure you want to delete this currency?" data-confirmation-button='<i class="fa-regular fa-trash-can"></i> Delete' class="small red marginLeft"><i class="fa-regular fa-trash-can"></i></button>
                         <?php endif; ?>
                     </td>
                 </tr>
@@ -42,7 +42,7 @@
                     <input type="number" form="newCurrency" class="text fullWidth" name="round_digits" min="0" max="9" required>
                 </td>
                 <td style="text-align: right;">
-                    <button type="submit" form="newCurrency" name="submit_button" class="small" disabled>Add</button>
+                    <button type="submit" form="newCurrency" name="submit_button" class="small" disabled><i class="fa-regular fa-plus"></i></button>
                 </td>
             </tr>
         </table>

views/communities/community_edit.php

@@ -26,7 +26,7 @@
             <?php endif; ?>
             <p id="communityFormError" class="formError justify marginTop"></p>
             <div class="right marginTop">
-                <button type="submit" name="submit_button"><?= isset($community) ? 'Save' : 'Create' ?></button>
+                <button type="submit" name="submit_button"><?= isset($community) ? '<i class="fa-regular fa-floppy-disk"></i> Save' : '<i class="fa-regular fa-plus"></i> Create' ?></button>
             </div>
         </form>
     </div>

views/communities/community_members.php

@@ -32,8 +32,8 @@
                     </td>
                     <td style="text-align: right;">
                         <?php if ($editable): ?>
-                            <button type="submit" form="editMember_<?= $member->getId() ?>" name="submit_button" class="small marginRight" disabled>Save</button><!--
-                         --><button type="submit" form="deleteMember_<?= $member->getId() ?>" name="submit_button" data-confirmation="Are you sure you want to delete this member?" class="small red">Delete</button>
+                            <button type="submit" form="editMember_<?= $member->getId() ?>" name="submit_button" class="small marginRight" disabled><i class="fa-regular fa-floppy-disk"></i></button><!--
+                         --><button type="submit" form="deleteMember_<?= $member->getId() ?>" name="submit_button" data-confirmation="Are you sure you want to delete this member?" data-confirmation-button='<i class="fa-regular fa-trash-can"></i> Delete' class="small red"><i class="fa-regular fa-trash-can"></i></button>
                         <?php endif; ?>
                     </td>
                 </tr>
@@ -47,7 +47,7 @@
                     <input type="checkbox" form="newMember" name="owner" />
                 </td>
                 <td style="text-align: right;">
-                    <button type="submit" form="newMember" name="submit_button" class="small" disabled>Add</button>
+                    <button type="submit" form="newMember" name="submit_button" class="small" disabled><i class="fa-regular fa-plus"></i></button>
                 </td>
             </tr>
         </table>

views/communities/currency_exchange_rates.php

@@ -32,8 +32,8 @@
                             <input type="datetime-local" form="editExchangeRate_<?= $currencyExchangeRate->getId() ?>" class="text fullWidth" name="valid_from" value="<?= $currencyExchangeRate->getValidFromDate()->format('Y-m-d\TH:i') ?>" required>
                         </td>
                         <td style="text-align: right;">
-                            <button type="submit" form="editExchangeRate_<?= $currencyExchangeRate->getId() ?>" name="submit_button" class="small marginRight" disabled>Save</button><!--
-                         --><button type="submit" form="deleteCurrency_<?= $currencyExchangeRate->getId() ?>" name="submit_button" data-confirmation="Are you sure you want to delete this exchange rate?" class="small red">Delete</button>
+                            <button type="submit" form="editExchangeRate_<?= $currencyExchangeRate->getId() ?>" name="submit_button" class="small marginRight" disabled><i class="fa-regular fa-floppy-disk"></i></button><!--
+                         --><button type="submit" form="deleteCurrency_<?= $currencyExchangeRate->getId() ?>" name="submit_button" data-confirmation="Are you sure you want to delete this exchange rate?" data-confirmation-button='<i class="fa-regular fa-trash-can"></i> Delete' class="small red"><i class="fa-regular fa-trash-can"></i></button>
                         </td>
                     <?php else: ?>
                         <td><?= $currencyExchangeRate->getExchangeRate() ?></td>
@@ -51,7 +51,7 @@
                         <input type="datetime-local" form="newExchangeRate" class="text fullWidth" name="valid_from" required>
                     </td>
                     <td style="text-align: right;">
-                        <button type="submit" form="newExchangeRate" name="submit_button" class="small" disabled>Add</button>
+                        <button type="submit" form="newExchangeRate" name="submit_button" class="small" disabled><i class="fa-regular fa-plus"></i></button>
                     </td>
                 </tr>
             <?php endif; ?>

views/communities/transaction_edit.php

@@ -46,9 +46,9 @@
             <input type="datetime-local" class="text big fullWidth" name="time" value="<?= isset($transaction) ? $transaction->getTimeDate()->format('Y-m-d\TH:i') : (new DateTime())->format('Y-m-d\TH:i') ?>" required>
             <p class="formError justify marginTop"></p>
             <div class="right marginTop" style="font-size: 0;">
-                <button type="submit" name="submit_button"><?= isset($transaction) ? 'Save' : 'Create' ?></button>
+                <button type="submit" name="submit_button"><?= isset($transaction) ? '<i class="fa-regular fa-floppy-disk"></i> Save' : '<i class="fa-regular fa-plus"></i> Create' ?></button>
                 <?php if (isset($transaction)): ?>
-                    <button type="submit" form="deleteTransaction"  name="submit_button" data-confirmation="Are you sure you want to delete this transaction?" class="red marginRight">Delete</button>
+                    <button type="submit" form="deleteTransaction"  name="submit_button" data-confirmation="Are you sure you want to delete this transaction?" class="red marginLeft"><i class="fa-regular fa-trash-can"></i> Delete</button>
                 <?php endif; ?>
             </div>
         </form>

views/communities/transactions.php

@@ -30,7 +30,7 @@
             <div class="box transaction">
                 <div>
                     <p style="font-weight: bold;"><?= $transaction->getDescription() ?></p>
-                    <p class="small"><?= $transaction->getPayerUser()->getDisplayName() ?> ► <?= $transaction->getPayeeUser() ? $transaction->getPayeeUser()->getDisplayName() : '[common]' ?></p>
+                    <p class="small"><?= $transaction->getPayerUser()->getDisplayName() ?> <i class="fa-solid fa-caret-right"></i> <?= $transaction->getPayeeUser() ? $transaction->getPayeeUser()->getDisplayName() : '[common]' ?></p>
                     <p class="small"><?= $transaction->getTimeDate()->format('Y-m-d H:i') ?></p>
                 </div>
                 <div style="text-align: right;">

views/login/google_login_error.php

@@ -1,7 +1,7 @@
 @extends(templates/layout_normal)
 
 @section(main)
-    <h2>Login up with Google</h2>
+    <h2>Login with Google</h2>
     <div class="box compactBox">
         <p class="error justify"><?= $error ?></p>
     </div>

views/login/login.php

@@ -10,12 +10,12 @@
             <input type="password" class="text big fullWidth" name="password" autocomplete="current-password" required minlength="6">
             <p id="loginFormError" class="formError justify marginTop"></p>
             <div class="right marginTop">
-                <button type="submit">Login</button>
+                <button type="submit"><i class="fa-solid fa-arrow-right-to-bracket"></i> Login</button>
             </div>
             <p class="center marginTop"><a href="<?= Container::$routeCollection->getRoute('password.requestReset')->generateLink() ?>" title="Request password reset">Forgot your password?</a></p>
             <hr>
             <div class="center">
-                <a class="button yellow" href="<?= Container::$routeCollection->getRoute('login.google')->generateLink() ?>" title="Login with Google">Login with Google</a>
+                <a class="button yellow" href="<?= Container::$routeCollection->getRoute('login.google')->generateLink() ?>" title="Login with Google"><i class="fa-brands fa-google"></i> Login with Google</a>
             </div>
         </form>
     </div>

views/login/password_reset_request.php

@@ -15,7 +15,7 @@
             <?php endif; ?>
             <p id="passwordResetFormError" class="formError justify marginTop"></p>
             <div class="right marginTop">
-                <button type="submit">Continue</button>
+                <button type="submit"><i class="fa-solid fa-key"></i> Reset password</button>
             </div>
         </form>
     </div>

views/login/reset_password.php

@@ -13,7 +13,7 @@
                 <input type="password" class="text big fullWidth" name="password_confirm"  autocomplete="new-password" required minlength="6">
                 <p id="resetPasswordFormError" class="formError justify marginTop"></p>
                 <div class="right">
-                    <button class="marginTop" type="submit">Reset password</button>
+                    <button class="marginTop" type="submit"><i class="fa-solid fa-key"></i> Reset password</button>
                 </div>
             </form>
         <?php else: ?>

views/templates/layout_normal.php

@@ -10,14 +10,12 @@
     </h1>
     <p>
         <?php if (Container::$request->user()) : ?>
-            <span><a href="<?= Container::$routeCollection->getRoute('account')->generateLink() ?>" title="Account">
-                <?php /* Copyright (c) 2019 The Bootstrap Authors. License can be found in 'USED_SOFTWARE' in section 'Bootstrap Icons'. */ ?>
-                <svg class="inline" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
-                    <path fill-rule="evenodd" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
-                </svg><!--
-             --><?= Container::$request->user()->getDisplayName() ?><!--
-            --></a></span><!--
-            --><span><a href="<?= Container::$routeCollection->getRoute('logout')->generateLink() ?>" title="Logout">Logout</a></span>
+            <span><a href="<?= Container::$routeCollection->getRoute('account')->generateLink() ?>" title="Account"><!--
+              --><i class="fa-regular fa-user"></i> <?= Container::$request->user()->getDisplayName() ?><!--
+         --></a></span><!--
+         --><span><a href="<?= Container::$routeCollection->getRoute('logout')->generateLink() ?>" title="Logout"><!--
+              --><i class="fa-solid fa-arrow-right-from-bracket"></i> Logout</a><!--
+         --></span>
         <?php endif; ?>
     </p>
 </header>

views/templates/rvr.php

@@ -18,6 +18,10 @@
     <link href="https://fonts.googleapis.com/css2?family=Oxygen:wght@400;700&amp;display=block" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Oxygen+Mono:wght@400&amp;display=block" rel="stylesheet">
     <link href="<?= $_ENV['STATIC_ROOT'] ?>/css/rvr.css?rev=<?= REVISION ?>" rel="stylesheet">
+    <link href="<?= $_ENV['STATIC_ROOT'] ?>/node_modules/@fortawesome/fontawesome-free/css/fontawesome.min.css?rev=<?= REVISION ?>" rel="stylesheet">
+    <link href="<?= $_ENV['STATIC_ROOT'] ?>/node_modules/@fortawesome/fontawesome-free/css/solid.min.css?rev=<?= REVISION ?>" rel="stylesheet">
+    <link href="<?= $_ENV['STATIC_ROOT'] ?>/node_modules/@fortawesome/fontawesome-free/css/regular.min.css?rev=<?= REVISION ?>" rel="stylesheet">
+    <link href="<?= $_ENV['STATIC_ROOT'] ?>/node_modules/@fortawesome/fontawesome-free/css/brands.min.css?rev=<?= REVISION ?>" rel="stylesheet">
     @yields('externalCss')
     @yields('inlineCss')
     <link rel="icon" type="image/png" sizes="192x192" href="<?= $_ENV['STATIC_ROOT'] ?>/img/favicon/192x192.png?rev=<?= REVISION ?>">

web.php

@@ -52,6 +52,11 @@ Container::$routeCollection->get('logout', 'logout', [LoginController::class, 'l
 Container::$routeCollection->group('account', function (RouteCollection $routeCollection) {
     $routeCollection->get('account', '', [UserController::class, 'getAccount']);
     $routeCollection->post('account-action', '', [UserController::class, 'saveAccount']);
+    $routeCollection->get('account.googleConnect', 'googleConnect', [UserController::class, 'getGoogleConnectRedirect']);
+    $routeCollection->get('account.googleConnect-confirm', 'googleConnect/code', [UserController::class, 'getGoogleConnectConfirm']);
+    $routeCollection->post('account.googleConnect-action', 'googleConnect', [UserController::class, 'connectGoogle']);
+    $routeCollection->get('account.googleDisconnect', 'googleDisconnect', [UserController::class, 'getGoogleDisconnectConfirm']);
+    $routeCollection->post('account.googleDisconnect-action', 'googleDisconnect', [UserController::class, 'disconnectGoogle']);
     $routeCollection->get('account.googleAuthenticate', 'googleAuthenticate', [UserController::class, 'getGoogleAuthenticateRedirect']);
     $routeCollection->get('account.googleAuthenticate-action', 'googleAuthenticate/code', [UserController::class, 'authenticateWithGoogle']);
 });