Astrian/datenel-react
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

refactor: enhance localization support in SingleDatePicker component

Browse Source
This commit is contained in:
Astrian Zheng 2025-02-19 15:25:25 +11:00
parent 52e4695ad5
commit d8a38786fb
Signed by: Astrian
SSH Key Fingerprint: SHA256:rVnhx3DAKjujCwWE13aDl7uV6+9U1MvydLkNRXJrBiA
2 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/SingleDatePicker.tsx
View File

@ -8,7 +8,8 @@ export default () => {
const [currentYear, setCurrentYear] = useState(new Date().getFullYear()) const [currentYear, setCurrentYear] = useState(new Date().getFullYear())
const [selectedDate, setSelectedDate] = useState(new Date()) const [selectedDate, setSelectedDate] = useState(new Date())
const [dates, setDates] = useState<Date[]>([]) const [dates, setDates] = useState<Date[]>([])
const l10nDays = getL10Weekday() const userLang = navigator.language
const l10nDays = getL10Weekday(userLang)
useEffect(() => { useEffect(() => {
setDates(getCalendarDates(currentMonth, currentYear)) setDates(getCalendarDates(currentMonth, currentYear))
@ -38,7 +39,7 @@ export default () => {
<div className='header'> <div className='header'>
<button className='month-stepper' onClick={skipToLastMonth}><img src={LeftArrowIcon} /></button> <button className='month-stepper' onClick={skipToLastMonth}><img src={LeftArrowIcon} /></button>
<button className='month-indicator'> <button className='month-indicator'>
{new Date(currentYear, currentMonth).toLocaleString('default', { month: 'long', year: 'numeric' })} {new Date(currentYear, currentMonth).toLocaleString(userLang, { month: 'long', year: 'numeric' })}
</button> </button>
<button className='month-stepper' onClick={skipToNextMonth}><img src={RightArrowIcon} /></button> <button className='month-stepper' onClick={skipToNextMonth}><img src={RightArrowIcon} /></button>
</div> </div>

4
src/utils/getL10Weekday.ts
View File

@ -1,8 +1,8 @@
export default () => { export default (userLang: string) => {
const newL10nDays = [] const newL10nDays = []
for (let i = 0; i < 7; i++) { for (let i = 0; i < 7; i++) {
const date = new Date(2021, 0, i + 4) const date = new Date(2021, 0, i + 4)
newL10nDays.push(date.toLocaleDateString(undefined, {weekday: 'short'})) newL10nDays.push(date.toLocaleDateString(userLang, {weekday: 'short'}))
} }
return newL10nDays return newL10nDays
} }