-
-
Notifications
You must be signed in to change notification settings - Fork 353
Add New/Updated recency pills to docs sidebar #959
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -12,6 +12,10 @@ export type MenuItem = { | |
| label: string | React.ReactNode | ||
| to: string | ||
| badge?: string | ||
| /** ISO date string marking when the page was added. Drives the "New" sidebar pill. */ | ||
| addedAt?: string | ||
| /** ISO date string marking when the page was last meaningfully updated. Drives the "Updated" sidebar pill. */ | ||
| updatedAt?: string | ||
| }[] | ||
| collapsible?: boolean | ||
| defaultCollapsed?: boolean | ||
|
|
@@ -26,6 +30,8 @@ const configSchema = v.object({ | |
| label: v.string(), | ||
| to: v.string(), | ||
| badge: v.optional(v.string()), | ||
| addedAt: v.optional(v.string()), | ||
| updatedAt: v.optional(v.string()), | ||
|
Comment on lines
+33
to
+34
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 🧩 Analysis chain🌐 Web query:
💡 Result: For Valibot v1.3.1, the recommended validator for a YYYY-MM-DD date string is the built-in isoDate action [1][2]. This is preferred over using a custom regex, as it is a standard, maintained, and type-safe solution provided by the library [2][3]. You can implement this by piping v.string with v.isoDate [1]. To make the field optional, use the v.optional wrapper [4][5]. Example implementation: import * as v from 'valibot'; const OptionalDateSchema = v.optional( v.pipe( v.string, v.isoDate('Invalid date format, expected YYYY-MM-DD.'))); Please note that as documented by Valibot, the built-in isoDate validator uses a regex that checks for the YYYY-MM-DD format but does not validate the maximum number of days based on the specific month or leap years (e.g., "2023-06-31" would be considered valid) [1][2]. If strict calendar date validation is required, you may need to add an additional custom validation step [6]. Citations:
🏁 Script executed: #!/bin/bash
set -euo pipefail
# Locate config schema file
SCHEMA_FILE="$(fd -i 'tanstack-docs-config\.schema\.json' . || true)"
echo "SCHEMA_FILE=$SCHEMA_FILE"
# Inspect the current validation code around the reported lines
echo "---- src/utils/config.ts (lines 1-120) ----"
if [ -f "src/utils/config.ts" ]; then
sed -n '1,120p' src/utils/config.ts | nl -ba | sed -n '1,120p'
else
echo "Missing src/utils/config.ts"
fi
# Search for addedAt/updatedAt in config utils
echo "---- usages of addedAt/updatedAt in src/utils/config.ts ----"
rg -n "addedAt|updatedAt" src/utils/config.ts || true
# Inspect schema json if found
if [ -n "${SCHEMA_FILE:-}" ] && [ -f "$SCHEMA_FILE" ]; then
echo "---- schema: occurrences of addedAt/updatedAt ----"
rg -n "\"addedAt\"|\"updatedAt\"|addedAt|updatedAt" "$SCHEMA_FILE" || true
echo "---- schema: surrounding context (first few matches) ----"
rg -n "\"addedAt\"|\"updatedAt\"" "$SCHEMA_FILE" -n | head -n 20 || true
else
echo "No tanstack-docs-config.schema.json found via fd"
fi
# Find where configSchema is used/validated (optional but helps justify impact)
echo "---- search for configSchema usage ----"
rg -n "configSchema" src || trueRepository: TanStack/tanstack.com Length of output: 218 🏁 Script executed: #!/bin/bash
set -euo pipefail
SCHEMA_FILE="$(fd -i 'tanstack-docs-config\.schema\.json' . || true)"
echo "SCHEMA_FILE=${SCHEMA_FILE:-<not found>}"
echo "---- src/utils/config.ts (lines 1-120) ----"
if [ -f "src/utils/config.ts" ]; then
python3 - <<'PY'
import pathlib
p = pathlib.Path("src/utils/config.ts")
lines = p.read_text(encoding="utf-8").splitlines()
for i in range(1, min(120, len(lines))+1):
print(f"{i:4d}: {lines[i-1]}")
PY
fi
echo "---- reported snippet (lines 25-60) ----"
if [ -f "src/utils/config.ts" ]; then
python3 - <<'PY'
import pathlib
p = pathlib.Path("src/utils/config.ts")
lines = p.read_text(encoding="utf-8").splitlines()
start, end = 25, 60
for i in range(start, min(end, len(lines))+1):
print(f"{i:4d}: {lines[i-1]}")
PY
fi
echo "---- usages of addedAt/updatedAt in src/utils/config.ts ----"
if [ -f "src/utils/config.ts" ]; then
rg -n "addedAt|updatedAt" src/utils/config.ts || true
fi
if [ -n "${SCHEMA_FILE:-}" ] && [ -f "$SCHEMA_FILE" ]; then
echo "---- schema: occurrences of addedAt/updatedAt ----"
rg -n "\"addedAt\"|\"updatedAt\"|addedAt|updatedAt" "$SCHEMA_FILE" || true
echo "---- schema: surrounding context for those keys (first ~80 lines around first match) ----"
# grab first match line number
first=$(rg -n "\"addedAt\"|\"updatedAt\"" "$SCHEMA_FILE" | head -n 1 | cut -d: -f1 || true)
if [ -n "${first:-}" ]; then
start=$((first-40)); if [ $start -lt 1 ]; then start=1; fi
end=$((first+40))
python3 - <<PY
import pathlib
p = pathlib.Path("$SCHEMA_FILE")
lines = p.read_text(encoding="utf-8").splitlines()
start=$start; end=$end
for i in range(start, min(end, len(lines))+1):
print(f"{i:5d}: {lines[i-1]}")
PY
fi
else
echo "Schema file not found; skipping schema inspection."
fi
echo "---- search for schema validation usage (configSchema/config) ----"
rg -n "configSchema|tanstack-docs-config\.schema|validate|parse" src || trueRepository: TanStack/tanstack.com Length of output: 50377 🏁 Script executed: #!/bin/bash
set -euo pipefail
# Search for recency/new/updated rendering logic and usages of addedAt/updatedAt
rg -n "addedAt|updatedAt" src | head -n 200
echo "----"
rg -n "\"New\"|New\" pill|Updated\"|recency|sidebar pill|sidebar.*pill" src | head -n 200
echo "----"
rg -n "format\\s*===\\s*['\"]date['\"]|format.*date|isoDate|YYYY-MM-DD" src/utils src/components src/routes | head -n 200Repository: TanStack/tanstack.com Length of output: 16463 🏁 Script executed: #!/bin/bash
set -euo pipefail
# Inspect recency rendering/parsing logic
python3 - <<'PY'
import pathlib
p = pathlib.Path("src/components/DocsLayout.tsx")
lines = p.read_text(encoding="utf-8").splitlines()
for i in range(1, 120):
print(f"{i:5d}: {lines[i-1]}")
PY
echo "---- recency usage near sidebar pill ----"
python3 - <<'PY'
import pathlib
p = pathlib.Path("src/components/DocsLayout.tsx")
lines = p.read_text(encoding="utf-8").splitlines()
start, end = 700, 820
for i in range(start, min(end, len(lines))+1):
print(f"{i:5d}: {lines[i-1]}")
PY
# Search for valibot isoDate usage in repo
rg -n "isoDate\\b" src || true
# Print the exact section of schema json around addedAt/updatedAt matches
SCHEMA_FILE="./tanstack-docs-config.schema.json"
python3 - <<'PY'
import pathlib, re
p = pathlib.Path("./tanstack-docs-config.schema.json")
lines = p.read_text(encoding="utf-8").splitlines()
# find first occurrences with line numbers
targets = ["\"addedAt\"", "\"updatedAt\""]
for t in targets:
for idx, line in enumerate(lines, start=1):
if t in line:
start=max(1, idx-8); end=min(len(lines), idx+20)
print(f"\n---- {t} around line {idx} ({start}-{end}) ----")
for j in range(start, end+1):
print(f"{j:5d}: {lines[j-1]}")
break
PYRepository: TanStack/tanstack.com Length of output: 12630 Tighten
Use Valibot’s built-in 🤖 Prompt for AI Agents |
||
| }), | ||
| ), | ||
| frameworks: v.optional( | ||
|
|
@@ -37,6 +43,8 @@ const configSchema = v.object({ | |
| label: v.string(), | ||
| to: v.string(), | ||
| badge: v.optional(v.string()), | ||
| addedAt: v.optional(v.string()), | ||
| updatedAt: v.optional(v.string()), | ||
| }), | ||
| ), | ||
| }), | ||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🧩 Analysis chain
🌐 Web query:
In JavaScript, doesnew Date('YYYY-MM-DD')parse as UTC or local time, and what timezone edge cases does that create for day-based windows like “last 7 days”?💡 Result:
In JavaScript, the
new Date('YYYY-MM-DD')constructor parses date-only strings as UTC midnight [1][2][3]. This is a specific behavior mandated by the ECMAScript specification for date-only strings, which differs from ISO 8601's general recommendation to treat such strings as local time [2][4][5]. Conversely, date-time strings (such as'YYYY-MM-DDTHH:mm:ss') are parsed as local time [2][6][3]. This discrepancy creates significant edge cases for day-based windows like "last 7 days": 1. Off-by-one Date Shifts: Becausenew Date('YYYY-MM-DD')creates a UTC timestamp, it will effectively represent a different calendar day for users in timezones west of UTC [2][7]. For example, a user in New York (UTC-5) parsing '2026-06-04' will get a Date object representing '2026-06-03' at 7:00 PM local time [2]. When the application performs comparisons against "today," this shifted timestamp may cause the system to misidentify the current day [7]. 2. DST and Calculation Errors: If you calculate date ranges by dividing milliseconds (e.g.,diff / 86400000), you may encounter errors when the window crosses a Daylight Saving Time (DST) boundary [8]. In these cases, a "day" may not consist of exactly 24 hours, leading to non-integer results or incorrect counts [8]. 3. Inconsistent Comparison Context: Comparing a UTC-parsed date object against local-time-based "current" time often leads to silent bugs [7][9]. If your application logic mixes UTC-parsed inputs with local-time-calculated windows, the "last 7 days" window will drift based on the user's specific timezone and their system's local clock [10][9]. To avoid these issues, developers are encouraged to: - Avoidnew Date(string)for parsing whenever possible [2][4]. - Use explicit component-based construction, such asnew Date(year, monthIndex, day), which correctly uses the local timezone [11][2]. - Normalize dates to a "UTC day index" (e.g.,Date.UTC(y, m, d) / 86400000) for comparisons to ensure they remain consistent regardless of the user's timezone or DST status [8]. - Rely on user-profile-specific timezones instead of the host machine's local time for application-wide date filtering [10].Citations:
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 13914
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 10332
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 18490
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 3719
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 149
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 3749
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 383
🏁 Script executed:
Repository: TanStack/tanstack.com
Length of output: 5082
Deduplicate date parsing for
addedAt/updatedAtto keep recency gating and tooltip alignedgetDocRecencyparsesaddedAt/updatedAtvianew Date(iso)(date-only strings become UTC midnight), whileDocRecencyPillparsesYYYY-MM-DDas local time before usingtoLocaleDateString(). Since the docs config schema defines these as date-only (e.g."2026-06-01"), the “last 7 days” pill can shift relative to the tooltip day across timezones.💡 Suggested fix
🤖 Prompt for AI Agents