Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
sagemathinc
GitHub Repository: sagemathinc/cocalc
 Path: blob/master/src/packages/frontend/app/dayjs-antd-plugins.ts
16567 views
1
/*

2
 *  This file is part of CoCalc: Copyright © 2026 Sagemath, Inc.

3
 *  License: MS-RSL – see LICENSE.md for details

4
 */

5


6
/*

7
Register the dayjs plugins that antd's date/time components (DatePicker,

8
RangePicker, TimePicker, ...) rely on.

9


10
WHY THIS EXISTS

11
===============

12
antd's pickers are built on `rc-picker`, whose dayjs adapter

13
(rc-picker/es/generate/dayjs.js) calls `dayjs.extend(weekday)`,

14
`dayjs.extend(localeData)`, etc. on *its own* imported dayjs instance.

15


16
In a production bundle there can be more than one dayjs module instance

17
(e.g. our app code resolves `[email protected]` while another dependency drags in

18
`[email protected]`, and ESM/CJS interop can further duplicate instances). When

19
that happens, the dayjs objects our app code creates with `import dayjs from

20
"dayjs"` and hands to a picker via its `value` prop come from an instance that

21
was NEVER extended by rc-picker. rc-picker then calls e.g.

22
`generateConfig.getWeekDay(value)` -> `value.weekday()` on our object and

23
throws:

24


25
    TypeError: t.weekday is not a function

26
        at Object.getWeekDay ...

27


28
In dev this is usually invisible because the bundler dedupes dayjs to a single

29
instance, so rc-picker's own `extend` calls happen to also cover our instance.

30
The bug only shows up in the minified production bundle.

31


32
THE FIX

33
=======

34
Extend the same set of plugins rc-picker needs, on the dayjs instance our app

35
code uses. Importing this module for its side effects from each app entry point

36
(before any picker renders) guarantees that every dayjs object we pass to antd

37
has these plugin methods, regardless of how many dayjs instances the bundler

38
produced.

39


40
Keep this list in sync with rc-picker/es/generate/dayjs.js.

41
*/

42


43
import dayjs from "dayjs";

44
import advancedFormat from "dayjs/plugin/advancedFormat";

45
import customParseFormat from "dayjs/plugin/customParseFormat";

46
import localeData from "dayjs/plugin/localeData";

47
import weekday from "dayjs/plugin/weekday";

48
import weekOfYear from "dayjs/plugin/weekOfYear";

49
import weekYear from "dayjs/plugin/weekYear";

50


51
// Register the plugins antd's pickers (via rc-picker) require on the value

52
// objects we pass in. Order matches rc-picker's own adapter for clarity.

53
dayjs.extend(customParseFormat);

54
dayjs.extend(advancedFormat);

55
dayjs.extend(weekday);

56
dayjs.extend(localeData);

57
dayjs.extend(weekOfYear);

58
dayjs.extend(weekYear);

59


60
export default dayjs;

61


62