From 76d57aa3893105adde281494cc7113b664b008ea Mon Sep 17 00:00:00 2001
From: Abdul Rehman <76230556+Abdulrehman-PIAIC80387@users.noreply.github.com>
Date: Tue, 12 May 2026 12:47:36 +0500
Subject: [PATCH] feat(editor): allow date picker to navigate back to year 1000
 (#14942)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixes #14935

## Summary

The date picker had a hardcoded `_minYear = 1970` in
[`date-picker.ts`](blocksuite/affine/components/src/date-picker/date-picker.ts),
which prevented users from selecting dates earlier than 1970. This
blocked legitimate use cases like historical and genealogical research
(see the reporter's comment on #14935).

## Fix

Lower the date picker's `_minYear` from `1970` to `1000`. The underlying
storage is just a `zod.number()` (Unix timestamp in ms), which supports
negative values, so no data-layer or backend changes are required — this
is a UI-only constraint relaxation.

## Demo

<img width="2044" height="1250" alt="image"
src="https://github.com/user-attachments/assets/4b25b333-89c4-48e6-9f91-81781d680200"
/>

## Test plan

- [x] Insert a database in a doc → add a Date column
- [x] Click a date cell → open the picker → click the year label →
navigate back through decades
- [x] Confirm the calendar reaches years well before 1970 (verified at
May 1805)
- [x] Confirm the calendar correctly renders weekdays for historical
dates
- [x] Confirm picking a modern date still works as before

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Date picker now allows selecting dates from year 1000 onward,
expanding historical date coverage.

* **Bug Fixes**
* Navigation (month switches and keyboard arrows) now keeps the
selection cursor within the allowed year range, preventing out-of-range
jumps.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/toeverything/AFFiNE/pull/14942)
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../components/src/date-picker/date-picker.ts       | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/blocksuite/affine/components/src/date-picker/date-picker.ts b/blocksuite/affine/components/src/date-picker/date-picker.ts
index 7a2ac38354..67a6e05c71 100644
--- a/blocksuite/affine/components/src/date-picker/date-picker.ts
+++ b/blocksuite/affine/components/src/date-picker/date-picker.ts
@@ -57,7 +57,7 @@ export class DatePicker extends WithDisposable(LitElement) {
 
   private readonly _maxYear = 2099;
 
-  private readonly _minYear = 1970;
+  private readonly _minYear = 1000;
 
   get _cardStyle() {
     return {
@@ -286,8 +286,18 @@ export class DatePicker extends WithDisposable(LitElement) {
       </div>`;
   }
 
+  private _clampCursorYear() {
+    const year = this._cursor.getFullYear();
+    if (year < this._minYear) {
+      this._cursor = new Date(this._minYear, 0, 1);
+    } else if (year > this._maxYear) {
+      this._cursor = new Date(this._maxYear, 11, 31);
+    }
+  }
+
   private _moveMonth(offset: number) {
     this._cursor.setMonth(this._cursor.getMonth() + offset);
+    this._clampCursorYear();
     this._getMatrix();
   }
 
@@ -420,6 +430,7 @@ export class DatePicker extends WithDisposable(LitElement) {
           } else if (e.key === 'ArrowDown') {
             this._cursor.setDate(this._cursor.getDate() + 7);
           }
+          this._clampCursorYear();
           this._getMatrix();
           setTimeout(this.focusDateCell.bind(this));
         }