ISSUE-41: Better version UX

Author: robiningelbrecht

config/services_test.yaml

@@ -38,8 +38,5 @@ services:
     App\Infrastructure\FileSystem\PermissionChecker:
         class: App\Tests\Infrastructure\FileSystem\SuccessfulPermissionChecker
 
-    App\Domain\GitHub\GitHub:
-        class: App\Tests\Domain\GitHub\FakeGitHub
-
     League\Flysystem\FilesystemOperator:
         class: App\Tests\Infrastructure\FileSystem\SpyFileSystem

src/Domain/GitHub/GitHub.php

@@ -2,7 +2,6 @@
 
 namespace App\Domain\Strava\BuildHtmlVersion;
 
-use App\Domain\GitHub\GitHub;
 use App\Domain\Measurement\Length\Kilometer;
 use App\Domain\Measurement\UnitSystem;
 use App\Domain\Strava\Activity\ActivityHeatmapChartBuilder;
@@ -79,7 +78,6 @@ public function __construct(
         private FtpRepository $ftpRepository,
         private KeyValueStore $keyValueStore,
         private AthleteBirthday $athleteBirthday,
-        private GitHub $gitHub,
         private UnitSystem $unitSystem,
         private Environment $twig,
         private FilesystemOperator $filesystem,
@@ -196,7 +194,6 @@ public function handle(Command $command): void
                 'lastUpdate' => $now,
                 'athleteId' => $athleteId,
                 'currentAppVersion' => self::APP_VERSION,
-                'latestAppVersion' => $this->gitHub->getRepoLatestRelease('robiningelbrecht/strava-statistics'),
             ]),
         );
 

src/Domain/GitHub/LiveGitHub.php

@@ -279,15 +279,16 @@
                     </svg>
                 </a>
             </div>
-            {% if currentAppVersion == latestAppVersion %}
-                <div class="text-xs text-center text-gray-500 dark:text-gray-400">{{ currentAppVersion }}</div>
-            {% else %}
-                <div class="text-xs text-center text-gray-500 dark:text-gray-400">{{ currentAppVersion }}
-                    (latest: {{ latestAppVersion }})
-                </div>
-            {% endif %}
-            <div class="text-xs text-center text-gray-500 dark:text-gray-400">Updated
-                on {{ lastUpdate.format('d-m-Y H:i') }}</div>
+            <div class="flex justify-center gap-x-1 text-xs text-center text-gray-500 dark:text-gray-400">
+                <span>{{ currentAppVersion }}</span>
+                <span class="hidden" data-latest-version data-current-version="{{ currentAppVersion }}">
+                    (latest: <a class="underline"
+                                href="https://github.com/robiningelbrecht/strava-statistics/releases/tag/[LATEST_VERSION]">[LATEST_VERSION]</a>)
+                </span>
+            </div>
+            <div class="text-xs text-center text-gray-500 dark:text-gray-400">
+                Updated on {{ lastUpdate.format('d-m-Y H:i') }}
+            </div>
         </div>
     </aside>
     <main class="p-4 md:ml-64 h-auto min-h-screen pt-20 text-gray-900 dark:text-white">
@@ -548,6 +549,20 @@
             });
         });
     }
+
+    const updateGithubLatestRelease = async () => {
+        const $latestVersionEl = document.querySelector('[data-latest-version]');
+        const currentVersion = $latestVersionEl.getAttribute('data-current-version')
+        const latestVersion = await (await (await fetch('https://api.github.com/repos/robiningelbrecht/strava-statistics/releases/latest')).json())['name'];
+
+        if (currentVersion !== latestVersion) {
+            const $latestVersionLink = $latestVersionEl.querySelector('a');
+            $latestVersionLink.setAttribute('href', $latestVersionLink.getAttribute('href').replace('[LATEST_VERSION]', latestVersion));
+            $latestVersionLink.innerHTML = $latestVersionLink.innerHTML.replace('[LATEST_VERSION]', latestVersion);
+            $latestVersionEl.classList.remove('hidden');
+        }
+    }
+    updateGithubLatestRelease();
 </script>
 </body>
 </html>

src/Domain/Strava/BuildHtmlVersion/BuildHtmlVersionCommandHandler.php

@@ -213,11 +213,15 @@
                     </svg>
                 </a>
             </div>
-                            <div class="text-xs text-center text-gray-500 dark:text-gray-400">v0.2.4
-                    (latest: v0.1.8)
-                </div>
-                        <div class="text-xs text-center text-gray-500 dark:text-gray-400">Updated
-                on 17-10-2023 16:15</div>
+            <div class="flex justify-center gap-x-1 text-xs text-center text-gray-500 dark:text-gray-400">
+                <span>v0.2.4</span>
+                <span class="hidden" data-latest-version data-current-version="v0.2.4">
+                    (latest: <a class="underline" href="https://github.com/robiningelbrecht/strava-statistics/releases/tag/%5BLATEST_VERSION%5D">[LATEST_VERSION]</a>)
+                </span>
+            </div>
+            <div class="text-xs text-center text-gray-500 dark:text-gray-400">
+                Updated on 17-10-2023 16:15
+            </div>
         </div>
     </aside>
     <main class="p-4 md:ml-64 h-auto min-h-screen pt-20 text-gray-900 dark:text-white">
@@ -469,6 +473,20 @@
             });
         });
     }
+
+    const updateGithubLatestRelease = async () => {
+        const $latestVersionEl = document.querySelector('[data-latest-version]');
+        const currentVersion = $latestVersionEl.getAttribute('data-current-version')
+        const latestVersion = await (await (await fetch('https://api.github.com/repos/robiningelbrecht/strava-statistics/releases/latest')).json())['name'];
+
+        if (currentVersion !== latestVersion) {
+            const $latestVersionLink = $latestVersionEl.querySelector('a');
+            $latestVersionLink.setAttribute('href', $latestVersionLink.getAttribute('href').replace('[LATEST_VERSION]', latestVersion));
+            $latestVersionLink.innerHTML = $latestVersionLink.innerHTML.replace('[LATEST_VERSION]', latestVersion);
+            $latestVersionEl.classList.remove('hidden');
+        }
+    }
+    updateGithubLatestRelease();
 </script>
 </body>
 </html>