fix sync bug

Author: txchen

apps/api/src/gmail-imap.ts

@@ -28,7 +28,7 @@ type ImapFlowClient = {
     flags: string[],
   ): Promise<boolean>;
   fetch(
-    range: string,
+    range: string | { since: Date },
     query: {
       uid: true;
       flags: true;
@@ -160,11 +160,15 @@ export function createGmailImapMailboxSyncClient(
 
           const afterUid = requestedMailbox?.afterUid;
           const incremental = afterUid !== undefined;
-          const range = incremental ? `${afterUid + 1}:*` : `${Math.max(1, messageCount - 9)}:*`;
+          const range = incremental
+            ? `${afterUid + 1}:*`
+            : requestedMailbox?.since
+              ? { since: requestedMailbox.since }
+              : "1:*";
           logInfo("gmail.messages.mailbox.fetch", {
             accountId: account.id,
             mailboxId: mailbox.path,
-            range,
+            range: typeof range === "string" ? range : `since:${requestedMailbox?.since?.toISOString()}`,
             messageCount,
             mode: incremental ? "incremental" : "backfill",
           });

apps/api/src/persistence.ts

@@ -405,7 +405,11 @@ export class MailDatabase {
       });
   }
 
-  saveMessage(message: StoredMessage): void {
+  saveMessage(message: StoredMessage): { inserted: boolean } {
+    const existing = this.database
+      .prepare("SELECT 1 FROM messages WHERE id = ?")
+      .get(message.id);
+
     this.database
       .prepare(`
         INSERT INTO messages (
@@ -457,6 +461,8 @@ export class MailDatabase {
         JSON.stringify(message.attachments),
       );
     this.saveInlineMessageResources(message.id, message.inlineResources ?? []);
+
+    return { inserted: existing === undefined };
   }
 
   private saveInlineMessageResources(messageId: string, resources: InlineMessageResource[]): void {
@@ -471,7 +477,7 @@ export class MailDatabase {
 
     for (const resource of resources) {
       statement.run(
-        resource.id,
+        `${messageId}:${resource.id}`,
         messageId,
         resource.contentId,
         resource.mimeType,
@@ -681,9 +687,9 @@ export class MailDatabase {
       .prepare(`
         SELECT id, content_id, mime_type, size_bytes, bytes
         FROM inline_message_resources
-        WHERE message_id = ? AND id = ?
+        WHERE message_id = ? AND id IN (?, ?)
       `)
-      .get(messageId, resourceId) as
+      .get(messageId, resourceId, `${messageId}:${resourceId}`) as
       | {
           id: string;
           content_id: string;
@@ -1039,7 +1045,9 @@ export class MailDatabase {
         };
 
         return {
-          id: resource.id,
+          id: resource.id.startsWith(`${messageId}:`)
+            ? resource.id.slice(messageId.length + 1)
+            : resource.id,
           contentId: resource.content_id,
           mimeType: resource.mime_type,
           sizeBytes: resource.size_bytes,

apps/api/src/sync.ts

@@ -271,7 +271,7 @@ export async function syncRecentMessages({
         continue;
       }
 
-      mailDatabase.saveMessage({
+      const saveResult = mailDatabase.saveMessage({
         id: message.id,
         stableIdentity: message.stableIdentity,
         threadId: message.threadId,
@@ -298,8 +298,10 @@ export async function syncRecentMessages({
           sizeBytes,
         })),
       });
-      storedMessageCount += 1;
-      result.storedMessageCount = (result.storedMessageCount ?? 0) + 1;
+      if (saveResult.inserted) {
+        storedMessageCount += 1;
+        result.storedMessageCount = (result.storedMessageCount ?? 0) + 1;
+      }
       mailDatabase.removeStaleMailboxEntries(message.id, syncedMailboxIds, message.mailboxIds);
 
       for (const mailboxId of message.mailboxIds) {
@@ -380,7 +382,7 @@ export async function syncRecentReconciliation({
         continue;
       }
 
-      mailDatabase.saveMessage({
+      const saveResult = mailDatabase.saveMessage({
         id: message.id,
         stableIdentity: message.stableIdentity,
         threadId: message.threadId,
@@ -407,7 +409,9 @@ export async function syncRecentReconciliation({
           sizeBytes,
         })),
       });
-      result.storedMessageCount = (result.storedMessageCount ?? 0) + 1;
+      if (saveResult.inserted) {
+        result.storedMessageCount = (result.storedMessageCount ?? 0) + 1;
+      }
 
       for (const mailboxId of message.mailboxIds.filter((mailboxId) =>
         mailboxIds.includes(mailboxId),

apps/web/src/App.vue

@@ -55,6 +55,9 @@ const collapsedAccounts = ref(new Set(savedReaderLayout.collapsedAccounts));
 const collapsedMailboxGroups = ref(new Set(savedReaderLayout.collapsedMailboxGroups));
 const activeResize = ref<"nav" | "list" | null>(null);
 const syncJobsOpen = ref(false);
+const customSyncDialogOpen = ref(false);
+const customSyncAccountId = ref("");
+const customSyncDays = ref(90);
 const documentVisible = ref(
   typeof document === "undefined" ? true : document.visibilityState !== "hidden",
 );
@@ -124,6 +127,15 @@ const activeSyncJobs = computed(() =>
   syncJobs.value.filter((job) => job.state === "pending" || job.state === "running"),
 );
 const syncingAccountIds = computed(() => new Set(activeSyncJobs.value.map((job) => job.accountId)));
+const customSyncAccount = computed(() =>
+  mailAccounts.value.find((account) => account.id === customSyncAccountId.value),
+);
+const customSyncRangeOptions = [
+  { label: "Last 30 days", value: 30 },
+  { label: "Last 90 days", value: 90 },
+  { label: "Last 365 days", value: 365 },
+  { label: "Last 10 years", value: 3650 },
+];
 
 const messageListQuery = useQuery({
   queryKey: computed(() => ["message-list", readerRoute.value]),
@@ -202,7 +214,7 @@ const logoutMutation = useMutation({
 });
 
 const syncJobMutation = useMutation({
-  mutationFn: (accountId: string) => scheduleSyncJob({ accountId }),
+  mutationFn: (request: { accountId: string; days?: number }) => scheduleSyncJob(request),
   onSuccess: async () => {
     await queryClient.invalidateQueries({ queryKey: ["sync-jobs"] });
   },
@@ -375,6 +387,32 @@ function syncJobsPollingInterval(query: { state: { data: SyncJobsResponse | unde
   return hasActiveJob ? 1_000 : 15_000;
 }
 
+function accountContextMenuItems(account: MailAccountMailboxTree) {
+  return [
+    {
+      label: "Custom sync...",
+      icon: "i-lucide-calendar-clock",
+      disabled: syncingAccountIds.value.has(account.id) || syncJobMutation.isPending.value,
+      onSelect: () => openCustomSyncDialog(account),
+    },
+  ];
+}
+
+function openCustomSyncDialog(account: MailAccountMailboxTree) {
+  customSyncAccountId.value = account.id;
+  customSyncDays.value = 90;
+  customSyncDialogOpen.value = true;
+}
+
+function submitCustomSync() {
+  if (!customSyncAccountId.value) {
+    return;
+  }
+
+  syncJobMutation.mutate({ accountId: customSyncAccountId.value, days: customSyncDays.value });
+  customSyncDialogOpen.value = false;
+}
+
 function syncJobSummary(job: SyncJobRecord): string {
   if (job.state === "failed") {
     return job.error ?? "Sync job failed";
@@ -614,12 +652,14 @@ function participantsLabel(participants: Array<{ address: string; displayName?:
 }
 
 function formatDate(value: string): string {
-  return new Intl.DateTimeFormat(undefined, {
-    month: "short",
-    day: "numeric",
-    hour: "numeric",
-    minute: "2-digit",
-  }).format(new Date(value));
+  const date = new Date(value);
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  const hour = String(date.getHours()).padStart(2, "0");
+  const minute = String(date.getMinutes()).padStart(2, "0");
+
+  return `${year}-${month}-${day} ${hour}:${minute}`;
 }
 
 function mailboxLabel(account: MailAccountMailboxTree, mailboxId: string): string {
@@ -748,6 +788,42 @@ async function selectAccountDefault(account: MailAccountMailboxTree) {
         </div>
       </header>
 
+      <UModal
+        v-model:open="customSyncDialogOpen"
+        title="Custom sync"
+        :description="customSyncAccount?.emailAddress ?? customSyncAccountId"
+      >
+        <template #body>
+          <form class="space-y-4" @submit.prevent="submitCustomSync">
+            <div class="space-y-2">
+              <label class="block text-sm font-medium text-slate-700" for="custom-sync-range">
+                Message range
+              </label>
+              <USelect
+                id="custom-sync-range"
+                v-model="customSyncDays"
+                :items="customSyncRangeOptions"
+                value-key="value"
+                label-key="label"
+                class="w-full"
+              />
+            </div>
+            <div class="flex justify-end gap-2">
+              <UButton color="neutral" variant="ghost" @click="customSyncDialogOpen = false">
+                Cancel
+              </UButton>
+              <button
+                class="h-8 rounded-md bg-slate-900 px-3 text-sm font-medium text-white hover:bg-slate-800 disabled:cursor-not-allowed disabled:opacity-60"
+                type="submit"
+                :disabled="!customSyncAccountId || syncJobMutation.isPending.value"
+              >
+                {{ syncJobMutation.isPending.value ? "Starting..." : "Start sync" }}
+              </button>
+            </div>
+          </form>
+        </template>
+      </UModal>
+
       <div v-if="mailAccounts.length === 0" class="grid flex-1 place-items-center px-6 text-center">
         <div>
           <h2 class="text-xl font-semibold">No mail accounts synced yet</h2>
@@ -766,51 +842,55 @@ async function selectAccountDefault(account: MailAccountMailboxTree) {
           <div class="flex h-full flex-col">
             <div class="min-h-0 flex-1 overflow-y-auto p-2">
               <div v-for="account in mailAccounts" :key="account.id" class="mb-3">
-                <div class="flex items-start justify-between gap-1">
-                  <button
-                    class="mt-0.5 grid h-5 w-5 shrink-0 place-items-center rounded text-slate-500 hover:bg-stone-200"
-                    type="button"
-                    :aria-label="
-                      accountCollapsed(account.id) ? 'Expand account' : 'Collapse account'
-                    "
-                    @click="toggleAccount(account.id)"
-                  >
-                    <span class="text-[10px]">{{ accountCollapsed(account.id) ? ">" : "v" }}</span>
-                  </button>
-                  <button
-                    class="min-w-0 flex-1 text-left"
-                    type="button"
-                    @click="selectAccountDefault(account)"
-                  >
-                    <span class="block min-w-0 truncate text-xs font-semibold">
-                      {{ account.id }}
-                    </span>
-                    <span class="block truncate text-[11px] text-slate-500">{{
-                      account.emailAddress
-                    }}</span>
-                  </button>
-                  <div class="flex shrink-0 items-center gap-1">
-                    <UBadge
-                      v-if="account.unreadCount > 0"
-                      color="neutral"
-                      size="sm"
-                      variant="subtle"
-                      >{{ account.unreadCount }}</UBadge
-                    >
-                    <UButton
-                      color="neutral"
-                      icon="i-lucide-refresh-cw"
-                      :loading="syncingAccountIds.has(account.id)"
-                      :disabled="
-                        syncingAccountIds.has(account.id) || syncJobMutation.isPending.value
+                <UContextMenu :items="accountContextMenuItems(account)">
+                  <div class="flex items-start justify-between gap-1">
+                    <button
+                      class="mt-0.5 grid h-5 w-5 shrink-0 place-items-center rounded text-slate-500 hover:bg-stone-200"
+                      type="button"
+                      :aria-label="
+                        accountCollapsed(account.id) ? 'Expand account' : 'Collapse account'
                       "
-                      square
-                      variant="ghost"
-                      aria-label="Refresh account"
-                      @click="syncJobMutation.mutate(account.id)"
-                    />
+                      @click="toggleAccount(account.id)"
+                    >
+                      <span class="text-[10px]">{{
+                        accountCollapsed(account.id) ? ">" : "v"
+                      }}</span>
+                    </button>
+                    <button
+                      class="min-w-0 flex-1 text-left"
+                      type="button"
+                      @click="selectAccountDefault(account)"
+                    >
+                      <span class="block min-w-0 truncate text-xs font-semibold">
+                        {{ account.id }}
+                      </span>
+                      <span class="block truncate text-[11px] text-slate-500">{{
+                        account.emailAddress
+                      }}</span>
+                    </button>
+                    <div class="flex shrink-0 items-center gap-1">
+                      <UBadge
+                        v-if="account.unreadCount > 0"
+                        color="neutral"
+                        size="sm"
+                        variant="subtle"
+                        >{{ account.unreadCount }}</UBadge
+                      >
+                      <UButton
+                        color="neutral"
+                        icon="i-lucide-refresh-cw"
+                        :loading="syncingAccountIds.has(account.id)"
+                        :disabled="
+                          syncingAccountIds.has(account.id) || syncJobMutation.isPending.value
+                        "
+                        square
+                        variant="ghost"
+                        aria-label="Refresh account"
+                        @click="syncJobMutation.mutate({ accountId: account.id })"
+                      />
+                    </div>
                   </div>
-                </div>
+                </UContextMenu>
                 <div v-if="!accountCollapsed(account.id)" class="mt-1 space-y-0.5">
                   <div
                     v-for="row in visibleMailboxRows(account)"

tests/gmail-imap.test.ts

@@ -128,7 +128,7 @@ describe("Gmail IMAP mailbox sync client", () => {
     expect(mailboxOpen).toHaveBeenCalledWith("[Gmail]/All Mail");
     expect(mailboxOpen).not.toHaveBeenCalledWith("[Gmail]");
     expect(fetch).toHaveBeenCalledWith(
-      "33:*",
+      { since: new Date("2026-05-01T00:00:00.000Z") },
       {
         uid: true,
         flags: true,