diff --git a/backend/FwLite/FwLiteShared/Services/SyncServiceJsInvokable.cs b/backend/FwLite/FwLiteShared/Services/SyncServiceJsInvokable.cs
index 6f409c6f0e..1154dac6aa 100644
--- a/backend/FwLite/FwLiteShared/Services/SyncServiceJsInvokable.cs
+++ b/backend/FwLite/FwLiteShared/Services/SyncServiceJsInvokable.cs
@@ -29,9 +29,9 @@ public async Task<SyncJobResult> TriggerFwHeadlessSync()
     }
 
     [JSInvokable]
-    public Task<DateTimeOffset?> GetLatestCommitDate()
+    public Task<DateTimeOffset?> GetLatestSyncedCommitDate()
     {
-        return syncRepository.GetLatestCommitDate();
+        return syncRepository.GetLatestSyncedCommitDate();
     }
 
     [JSInvokable]
diff --git a/backend/FwLite/LcmCrdt.Tests/Data/SyncRepositoryTests.cs b/backend/FwLite/LcmCrdt.Tests/Data/SyncRepositoryTests.cs
index 5cef180ceb..8c755ef0aa 100644
--- a/backend/FwLite/LcmCrdt.Tests/Data/SyncRepositoryTests.cs
+++ b/backend/FwLite/LcmCrdt.Tests/Data/SyncRepositoryTests.cs
@@ -24,9 +24,9 @@ public async Task DisposeAsync()
     }
 
     [Fact]
-    public async Task GetLatestCommitDate_WhenNoCommits_ReturnsNull()
+    public async Task GetLatestSyncedCommitDate_WhenNoCommits_ReturnsNull()
     {
-        var latestCommitDate = await _syncRepository.GetLatestCommitDate();
+        var latestCommitDate = await _syncRepository.GetLatestSyncedCommitDate();
         latestCommitDate.Should().BeNull();
     }
 }
diff --git a/backend/FwLite/LcmCrdt/Data/SyncRepository.cs b/backend/FwLite/LcmCrdt/Data/SyncRepository.cs
index 79f6fdd28e..3e08375bd1 100644
--- a/backend/FwLite/LcmCrdt/Data/SyncRepository.cs
+++ b/backend/FwLite/LcmCrdt/Data/SyncRepository.cs
@@ -51,7 +51,7 @@ WHERE json_extract(Metadata, '$.ExtraMetadata.SyncDate') IS NULL
         }
     }
 
-    public async Task<DateTimeOffset?> GetLatestCommitDate()
+    public async Task<DateTimeOffset?> GetLatestSyncedCommitDate()
     {
         try
         {
diff --git a/frontend/viewer/src/lib/dotnet-types/generated-types/FwLiteShared/Services/ISyncServiceJsInvokable.ts b/frontend/viewer/src/lib/dotnet-types/generated-types/FwLiteShared/Services/ISyncServiceJsInvokable.ts
index 9ec08160d0..d24728e027 100644
--- a/frontend/viewer/src/lib/dotnet-types/generated-types/FwLiteShared/Services/ISyncServiceJsInvokable.ts
+++ b/frontend/viewer/src/lib/dotnet-types/generated-types/FwLiteShared/Services/ISyncServiceJsInvokable.ts
@@ -14,7 +14,7 @@ export interface ISyncServiceJsInvokable
 	getSyncStatus() : Promise<IProjectSyncStatus>;
 	triggerFwHeadlessSync() : Promise<ISyncJobResult>;
 	countPendingCrdtCommits() : Promise<IPendingCommits>;
-	getLatestCommitDate() : Promise<string>;
+	getLatestSyncedCommitDate() : Promise<string>;
 	executeSync(skipNotifications: boolean) : Promise<ISyncResults>;
 	getCurrentServer() : Promise<ILexboxServer>;
 }
diff --git a/frontend/viewer/src/lib/services/sync-status-service.ts b/frontend/viewer/src/lib/services/sync-status-service.ts
index 7789d84c76..87af5722c5 100644
--- a/frontend/viewer/src/lib/services/sync-status-service.ts
+++ b/frontend/viewer/src/lib/services/sync-status-service.ts
@@ -44,8 +44,8 @@ export class SyncStatusService {
 
   }
 
-  getLatestCommitDate() {
-    return this.syncStatusApi.getLatestCommitDate();
+  getLatestSyncedCommitDate() {
+    return this.syncStatusApi.getLatestSyncedCommitDate();
   }
 
   getCurrentServer() {
diff --git a/frontend/viewer/src/locales/en.po b/frontend/viewer/src/locales/en.po
index 514258368d..3f1ba86c9f 100644
--- a/frontend/viewer/src/locales/en.po
+++ b/frontend/viewer/src/locales/en.po
@@ -588,12 +588,15 @@ msgstr "in {0}"
 msgid "Keep going"
 msgstr "Keep going"
 
-#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Last change: #"
 msgstr "Last change: #"
 
+#: src/project/sync/SyncStatusPrimitive.svelte
+msgid "Last sync: #"
+msgstr "Last sync: #"
+
 #: src/lib/components/audio/audio-editor.svelte
 msgid "Length:"
 msgstr "Length:"
@@ -630,6 +633,7 @@ msgstr "Loading Dictionaries..."
 msgid "loading..."
 msgstr "loading..."
 
+#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/home/HomeView.svelte
 msgid "Local"
 msgstr "Local"
@@ -639,6 +643,7 @@ msgid "Local only"
 msgstr "Local only"
 
 #: src/project/sync/SyncStatusPrimitive.svelte
+#: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Login"
 msgstr "Login"
 
diff --git a/frontend/viewer/src/locales/es.po b/frontend/viewer/src/locales/es.po
index 575317881c..8c845cfc4b 100644
--- a/frontend/viewer/src/locales/es.po
+++ b/frontend/viewer/src/locales/es.po
@@ -593,12 +593,15 @@ msgstr ""
 msgid "Keep going"
 msgstr "Continuar"
 
-#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Last change: #"
 msgstr ""
 
+#: src/project/sync/SyncStatusPrimitive.svelte
+msgid "Last sync: #"
+msgstr ""
+
 #: src/lib/components/audio/audio-editor.svelte
 msgid "Length:"
 msgstr "Longitud:"
@@ -635,6 +638,7 @@ msgstr "Cargando diccionarios..."
 msgid "loading..."
 msgstr "cargando..."
 
+#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/home/HomeView.svelte
 msgid "Local"
 msgstr "Local"
@@ -644,6 +648,7 @@ msgid "Local only"
 msgstr "Sólo local"
 
 #: src/project/sync/SyncStatusPrimitive.svelte
+#: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Login"
 msgstr "Inicio de sesión"
 
diff --git a/frontend/viewer/src/locales/fr.po b/frontend/viewer/src/locales/fr.po
index 72e1329585..ffe61f8231 100644
--- a/frontend/viewer/src/locales/fr.po
+++ b/frontend/viewer/src/locales/fr.po
@@ -593,12 +593,15 @@ msgstr ""
 msgid "Keep going"
 msgstr "Continuez"
 
-#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Last change: #"
 msgstr ""
 
+#: src/project/sync/SyncStatusPrimitive.svelte
+msgid "Last sync: #"
+msgstr ""
+
 #: src/lib/components/audio/audio-editor.svelte
 msgid "Length:"
 msgstr "Longueur :"
@@ -635,6 +638,7 @@ msgstr "Chargement des dictionnaires..."
 msgid "loading..."
 msgstr "chargement..."
 
+#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/home/HomeView.svelte
 msgid "Local"
 msgstr "Locale"
@@ -644,6 +648,7 @@ msgid "Local only"
 msgstr "Uniquement au niveau local"
 
 #: src/project/sync/SyncStatusPrimitive.svelte
+#: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Login"
 msgstr "Connexion"
 
diff --git a/frontend/viewer/src/locales/id.po b/frontend/viewer/src/locales/id.po
index 094b94c438..7e5d32c733 100644
--- a/frontend/viewer/src/locales/id.po
+++ b/frontend/viewer/src/locales/id.po
@@ -593,12 +593,15 @@ msgstr ""
 msgid "Keep going"
 msgstr "Teruskan."
 
-#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Last change: #"
 msgstr ""
 
+#: src/project/sync/SyncStatusPrimitive.svelte
+msgid "Last sync: #"
+msgstr ""
+
 #: src/lib/components/audio/audio-editor.svelte
 msgid "Length:"
 msgstr "Panjang:"
@@ -635,6 +638,7 @@ msgstr "Memuat Kamus..."
 msgid "loading..."
 msgstr "Loading..."
 
+#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/home/HomeView.svelte
 msgid "Local"
 msgstr "Lokal"
@@ -644,6 +648,7 @@ msgid "Local only"
 msgstr "Hanya lokal"
 
 #: src/project/sync/SyncStatusPrimitive.svelte
+#: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Login"
 msgstr "Masuk"
 
diff --git a/frontend/viewer/src/locales/ko.po b/frontend/viewer/src/locales/ko.po
index 9c1ae530ad..89983f5f14 100644
--- a/frontend/viewer/src/locales/ko.po
+++ b/frontend/viewer/src/locales/ko.po
@@ -593,12 +593,15 @@ msgstr ""
 msgid "Keep going"
 msgstr "계속 진행"
 
-#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Last change: #"
 msgstr ""
 
+#: src/project/sync/SyncStatusPrimitive.svelte
+msgid "Last sync: #"
+msgstr ""
+
 #: src/lib/components/audio/audio-editor.svelte
 msgid "Length:"
 msgstr "길이:"
@@ -635,6 +638,7 @@ msgstr "사전 로드 중..."
 msgid "loading..."
 msgstr "로딩 중..."
 
+#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/home/HomeView.svelte
 msgid "Local"
 msgstr "로컬"
@@ -644,6 +648,7 @@ msgid "Local only"
 msgstr "로컬 전용"
 
 #: src/project/sync/SyncStatusPrimitive.svelte
+#: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Login"
 msgstr "로그인"
 
diff --git a/frontend/viewer/src/locales/ms.po b/frontend/viewer/src/locales/ms.po
index 6cb9b56803..905a6bcc79 100644
--- a/frontend/viewer/src/locales/ms.po
+++ b/frontend/viewer/src/locales/ms.po
@@ -593,12 +593,15 @@ msgstr ""
 msgid "Keep going"
 msgstr ""
 
-#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Last change: #"
 msgstr ""
 
+#: src/project/sync/SyncStatusPrimitive.svelte
+msgid "Last sync: #"
+msgstr ""
+
 #: src/lib/components/audio/audio-editor.svelte
 msgid "Length:"
 msgstr "Panjang:"
@@ -635,6 +638,7 @@ msgstr "Memuatkan Kamus..."
 msgid "loading..."
 msgstr "memuat..."
 
+#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/home/HomeView.svelte
 msgid "Local"
 msgstr "Tempatan"
@@ -644,6 +648,7 @@ msgid "Local only"
 msgstr "Tempatan sahaja"
 
 #: src/project/sync/SyncStatusPrimitive.svelte
+#: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Login"
 msgstr "Log masuk"
 
diff --git a/frontend/viewer/src/locales/sw.po b/frontend/viewer/src/locales/sw.po
index b831a3f8a3..10338bf801 100644
--- a/frontend/viewer/src/locales/sw.po
+++ b/frontend/viewer/src/locales/sw.po
@@ -593,12 +593,15 @@ msgstr ""
 msgid "Keep going"
 msgstr ""
 
-#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 #: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Last change: #"
 msgstr ""
 
+#: src/project/sync/SyncStatusPrimitive.svelte
+msgid "Last sync: #"
+msgstr ""
+
 #: src/lib/components/audio/audio-editor.svelte
 msgid "Length:"
 msgstr ""
@@ -635,6 +638,7 @@ msgstr ""
 msgid "loading..."
 msgstr "inashughulikia..."
 
+#: src/project/sync/SyncStatusPrimitive.svelte
 #: src/home/HomeView.svelte
 msgid "Local"
 msgstr "Mitaa"
@@ -644,6 +648,7 @@ msgid "Local only"
 msgstr ""
 
 #: src/project/sync/SyncStatusPrimitive.svelte
+#: src/project/sync/FwLiteToFwMergeDetails.svelte
 msgid "Login"
 msgstr ""
 
diff --git a/frontend/viewer/src/project/SyncDialog.svelte b/frontend/viewer/src/project/SyncDialog.svelte
index b5df2667c1..b3b7f906bb 100644
--- a/frontend/viewer/src/project/SyncDialog.svelte
+++ b/frontend/viewer/src/project/SyncDialog.svelte
@@ -31,7 +31,7 @@
     { key: SYNC_DIALOG_QUERY_PARAM, replaceOnDefaultValue: true, allowBack: true },
     false,
   );
-  let latestCommitDate = $state<string>();
+  let latestSyncedCommitDate = $state<string>();
 
   watch(() => openQueryParam.current, (newValue) => {
     if (newValue) void onOpen();
@@ -46,7 +46,7 @@
     await Promise.all([
       service.getLocalStatus().then(s => localStatus = s),
       service.getStatus().then(s => remoteStatus = s),
-      service.getLatestCommitDate().then(s => latestCommitDate = s),
+      service.getLatestSyncedCommitDate().then(s => latestSyncedCommitDate = s),
       service.getCurrentServer().then(s => server = s),
     ]);
   }
@@ -54,7 +54,7 @@
   function onClose(): void {
     localStatus = undefined;
     remoteStatus = undefined;
-    latestCommitDate = undefined;
+    latestSyncedCommitDate = undefined;
   }
 
   async function syncLexboxToFlex() {
@@ -104,7 +104,7 @@
     await Promise.all([
       service.getLocalStatus().then(s => localStatus = s),
       service.getStatus().then(s => remoteStatus = s),
-      service.getLatestCommitDate().then(s => latestCommitDate = s),
+      service.getLatestSyncedCommitDate().then(s => latestSyncedCommitDate = s),
     ]);
   }
 
@@ -127,7 +127,7 @@
       {server}
       projectCode={projectContext.projectData?.code}
       serverId={projectContext.projectData?.serverId}
-      {latestCommitDate}
+      latestSyncedCommitDate={latestSyncedCommitDate}
       canSyncLexboxToFlex={features?.write}
       {syncLexboxToFlex}
       {syncLexboxToLocal}
diff --git a/frontend/viewer/src/project/sync/FwLiteToFwMergeDetails.svelte b/frontend/viewer/src/project/sync/FwLiteToFwMergeDetails.svelte
index 162dab317b..48767825eb 100644
--- a/frontend/viewer/src/project/sync/FwLiteToFwMergeDetails.svelte
+++ b/frontend/viewer/src/project/sync/FwLiteToFwMergeDetails.svelte
@@ -8,20 +8,30 @@
   import flexLogo from '$lib/assets/flex-logo.png';
   import logoLight from '$lib/assets/logo-light.svg';
   import {FormatRelativeDate} from '$lib/components/ui/format';
+  import {SyncStatus} from '$lib/dotnet-types/generated-types/LexCore/Sync/SyncStatus';
+  import LoginButton from '$lib/auth/LoginButton.svelte';
+  import type {ILexboxServer} from '$lib/dotnet-types';
 
   let {
+    syncStatus,
     remoteStatus,
+    server,
     loadingSyncLexboxToFlex = $bindable(false),
     loadingSyncLexboxToLocal,
     canSyncLexboxToFlex,
     syncLexboxToFlex = async () => {
     },
+    onLoginStatusChange = () => {
+    },
   }: {
+    syncStatus: SyncStatus;
     remoteStatus?: IProjectSyncStatus,
+    server?: ILexboxServer;
     loadingSyncLexboxToFlex: boolean,
     loadingSyncLexboxToLocal: boolean,
     canSyncLexboxToFlex?: boolean,
     syncLexboxToFlex?: () => Promise<void>
+      onLoginStatusChange?: (status: 'logged-in' | 'logged-out') => void;
   } = $props();
   const lastFlexSyncDate = $derived(remoteStatus?.lastMercurialCommitDate ? new Date(remoteStatus.lastMercurialCommitDate) : undefined);
   const lastFwLiteSyncDate = $derived(remoteStatus?.lastCrdtCommitDate ? new Date(remoteStatus.lastCrdtCommitDate) : undefined);
@@ -49,19 +59,28 @@
       </T>
     </span>
   </div>
-  <div class="flex flex-col items-center gap-1">
-    <span>{$t`${flexToLexboxCount} Commits`}</span>
-    <SyncArrow dir="left" tailLength={120} size={1.5}/>
-    <Button
-      loading={loadingSyncLexboxToFlex}
-      disabled={loadingSyncLexboxToLocal || !canSyncLexboxToFlex || !remoteStatus}
-      onclick={onSyncLexboxToFlex}
-      icon="i-mdi-sync"
-      iconProps={{ class: 'size-5' }}>
-      {$t`Sync`}
-    </Button>
-    <SyncArrow dir="right" tailLength={120} size={1.5}/>
-    <span>{$t`${lexboxToFlexCount} Changes`}</span>
+  <div class="flex flex-col items-center justify-center gap-1">
+      {#if syncStatus === SyncStatus.Offline}
+        <Icon icon="i-mdi-cloud-off-outline"  class="size-10 m-4" />
+      {:else if syncStatus === SyncStatus.NotLoggedIn && server}
+        <LoginButton
+          text={$t`Login`}
+          status={{loggedIn: false, server: server}}
+          statusChange={s => onLoginStatusChange(s)}/>
+      {:else}
+        <span>{$t`${flexToLexboxCount} Commits`}</span>
+        <SyncArrow dir="left" tailLength={120} size={1.5}/>
+        <Button
+          loading={loadingSyncLexboxToFlex}
+          disabled={loadingSyncLexboxToLocal || !canSyncLexboxToFlex || !remoteStatus}
+          onclick={onSyncLexboxToFlex}
+          icon="i-mdi-sync"
+          iconProps={{ class: 'size-5' }}>
+          {$t`Sync`}
+        </Button>
+        <SyncArrow dir="right" tailLength={120} size={1.5}/>
+        <span>{$t`${lexboxToFlexCount} Changes`}</span>
+      {/if}
   </div>
   <div class="border rounded flex flex-col items-center justify-center text-center p-2">
     <Icon src={flexLogo} class="size-10 mb-1" alt={$t`FieldWorks logo`}/>
diff --git a/frontend/viewer/src/project/sync/SyncStatusPrimitive.svelte b/frontend/viewer/src/project/sync/SyncStatusPrimitive.svelte
index c14758ec8d..9540ce0a70 100644
--- a/frontend/viewer/src/project/sync/SyncStatusPrimitive.svelte
+++ b/frontend/viewer/src/project/sync/SyncStatusPrimitive.svelte
@@ -20,7 +20,7 @@
     server?: ILexboxServer;
     serverId?: string;
     projectCode?: string;
-    latestCommitDate?: string;
+    latestSyncedCommitDate?: string;
     canSyncLexboxToFlex?: boolean;
     syncLexboxToFlex?: () => Promise<void>;
     syncLexboxToLocal?: () => Promise<void>;
@@ -34,7 +34,7 @@
     server,
     serverId,
     projectCode,
-    latestCommitDate,
+    latestSyncedCommitDate,
     canSyncLexboxToFlex,
     syncLexboxToFlex = async () => {
     },
@@ -47,10 +47,11 @@
 
   let remoteToLocalCount = $derived(localStatus?.remote);
   let localToRemoteCount = $derived(localStatus?.local);
-  let lastLocalSyncDate = $derived(latestCommitDate ? new Date(latestCommitDate) : undefined);
+  let lastLocalSyncDate = $derived(latestSyncedCommitDate ? new Date(latestSyncedCommitDate) : undefined);
   const serverName = $derived(server?.displayName ?? serverId ?? 'unknown');
+  const serverProjectUrl = $derived(`${server?.authority}/project/${encodeURIComponent(projectCode ?? '')}`);
   const isOffline = $derived(syncStatus === SyncStatus.Offline);
-  const showRemote = $derived(server && !isOffline);
+  const showRemote = $derived(!!server);
 
   let loadingSyncLexboxToFlex = $state(false);
 
@@ -74,22 +75,25 @@
     <div in:fade class="grid grid-rows-[auto] grid-cols-[1fr_auto_1fr] gap-y-4 gap-x-8">
 
       <!-- Status local to remote -->
-      <div class="col-span-full text-center flex flex-col border rounded py-2">
-        <a href={server?.authority + '/project/' + projectCode} target="_blank">
-          <Icon icon={!isOffline ? 'i-mdi-cloud-outline' : 'i-mdi-cloud-off-outline'}/>
+      <div class="col-span-full text-center border rounded py-2">
+        <a class="inline-flex flex-col items-center" href={serverProjectUrl} target="_blank">
+          <Icon icon={!isOffline ? 'i-mdi-cloud-outline' : 'i-mdi-cloud-off-outline'}  class="size-10" />
           <span class="underline">{serverName}</span>
         </a>
-        <span class="text-foreground/80">
-          <T msg="Last change: #">
-            <FormatRelativeDate date={lastLocalSyncDate} showActualDate/>
-          </T>
-        </span>
       </div>
       <!--  arrows and sync counts -->
       <div class="col-span-full text-center grid justify-center items-center"
            style="grid-template-columns: 1fr auto 1fr">
-        <div>
-          <!--      blank spacer-->
+        <div class="px-4 max-w-56">
+          <span class="text-foreground/80">
+            <T msg="Last sync: #">
+              {#if !lastLocalSyncDate}
+                <span>{$t`Never`}</span>
+              {:else}
+                <FormatRelativeDate date={lastLocalSyncDate} showActualDate />
+              {/if}
+            </T>
+          </span>
         </div>
         <div class="grid justify-center items-center min-h-12" style="grid-template-columns: 1fr auto auto auto 1fr">
           <span class="text-end">{remoteToLocalCount ?? '?'}</span>
@@ -136,13 +140,16 @@
       <!--  local box-->
       <div class="text-center col-span-full border rounded py-2">
         <Icon icon="i-mdi-cellphone" class="!size-10 md:i-mdi-monitor"/>
-        <p>Local</p>
+        <p>{$t`Local`}</p>
       </div>
     </div>
   </Tabs.Content>
   {#if showRemote}
     <Tabs.Content value="classic">
       <FwLiteToFwMergeDetails
+        {syncStatus}
+        {server}
+        {onLoginStatusChange}
         {remoteStatus}
         {syncLexboxToFlex}
         bind:loadingSyncLexboxToFlex
diff --git a/frontend/viewer/src/stories/sync/sync-primitive.stories.svelte b/frontend/viewer/src/stories/sync/sync-primitive.stories.svelte
index c16dcddd3c..90e3975e9f 100644
--- a/frontend/viewer/src/stories/sync/sync-primitive.stories.svelte
+++ b/frontend/viewer/src/stories/sync/sync-primitive.stories.svelte
@@ -54,7 +54,7 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
       errorCode: undefined,
       errorMessage: undefined,
     }}
-    latestCommitDate={oneHourAgo.toISOString()}
+    latestSyncedCommitDate={oneHourAgo.toISOString()}
     server={{
       id: 'test-server',
       displayName: 'Lexbox',
@@ -78,7 +78,7 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
       errorCode: undefined,
       errorMessage: undefined,
     }}
-    latestCommitDate={new Date().toISOString()}
+    latestSyncedCommitDate={new Date().toISOString()}
     server={{
       id: 'test-server',
       displayName: 'Lexbox',
@@ -93,7 +93,7 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
     projectCode="test-project"
     syncStatus={SyncStatus.Success}
     localStatus={{local: 1, remote: 2}}
-    latestCommitDate={new Date().toISOString()}
+    latestSyncedCommitDate={new Date().toISOString()}
     server={{
       id: 'test-server',
       displayName: 'Lexbox',
@@ -108,7 +108,7 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
     projectCode="test-project"
     syncStatus={SyncStatus.NoServer}
     localStatus={{local: 1}}
-    latestCommitDate={new Date().toISOString()}
+    latestSyncedCommitDate={new Date().toISOString()}
   />
 </Story>
 <Story name="Unknown Server">
@@ -118,7 +118,7 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
     projectCode="test-project"
     syncStatus={SyncStatus.NoServer}
     localStatus={{local: 1}}
-    latestCommitDate={new Date().toISOString()}
+    latestSyncedCommitDate={new Date().toISOString()}
   />
 </Story>
 <Story name="Offline">
@@ -128,7 +128,7 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
     projectCode="test-project"
     syncStatus={SyncStatus.Offline}
     localStatus={{local: 10}}
-    latestCommitDate={new Date().toISOString()}
+    latestSyncedCommitDate={new Date().toISOString()}
     server={{
       id: 'test-server',
       displayName: 'Lexbox',
@@ -143,7 +143,7 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
     projectCode="test-project"
     syncStatus={SyncStatus.NotLoggedIn}
     localStatus={{local: 1}}
-    latestCommitDate={new Date().toISOString()}
+    latestSyncedCommitDate={new Date().toISOString()}
     server={{
       id: 'test-server',
       displayName: 'Lexbox',
@@ -151,3 +151,14 @@ const oneWeekAgo = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
     }}
   />
 </Story>
+
+<Story name="Never synced">
+  <SyncStatusPrimitive
+    canSyncLexboxToFlex
+    serverId="test-server"
+    projectCode="test-project"
+    syncStatus={SyncStatus.Success}
+    localStatus={{local: 1}}
+    latestSyncedCommitDate={undefined}
+  />
+</Story>