diff --git a/src/contentScripts/activityMap/app/Heatmap/index.tsx b/src/contentScripts/activityMap/app/Heatmap/index.tsx index 405b4de..1cdd528 100644 --- a/src/contentScripts/activityMap/app/Heatmap/index.tsx +++ b/src/contentScripts/activityMap/app/Heatmap/index.tsx @@ -4,7 +4,7 @@ import type { HeatmapConfig } from '@ant-design/charts/es/heatmap/index'; import type { G2HeatmapData } from '@/utils'; import { useDarkTheme } from '@/hooks'; -const colorMap = ['#9be9a8', '#40c463', '#30a14e', '#216e39']; +const colorMap = ['#eaecef', '#9be9a8', '#40c463', '#30a14e', '#216e39']; const colorMapDark = ['#161b22', '#003820', '#00602d', '#1d9d47', '#26d545']; interface HeatMapProps { @@ -57,7 +57,7 @@ const DemoHeatmap: FC = ({ data }) => { meta: { day: { type: 'cat', - values: ['一', '二', '三', '四', '五', '六', '日'], + values: ['日', '一', '二', '三', '四', '五', '六'], }, week: { type: 'cat' }, commits: { sync: true, alias: '修改次数' }, diff --git a/src/utils/activityMap.ts b/src/utils/activityMap.ts index a4c50a9..ad0dd56 100644 --- a/src/utils/activityMap.ts +++ b/src/utils/activityMap.ts @@ -4,7 +4,7 @@ import dayjs from 'dayjs'; import weekOfYear from 'dayjs/plugin/weekOfYear'; import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'; import relativeTime from 'dayjs/plugin/relativeTime'; -import { groupBy, orderBy } from 'lodash'; +import { groupBy, orderBy, unionBy } from 'lodash'; dayjs.extend(weekOfYear); dayjs.extend(isSameOrAfter); @@ -19,6 +19,7 @@ export interface ActivityDoc { export interface G2HeatmapData { date: string; + level: number; commits: number; month: number; day: number; @@ -154,6 +155,30 @@ const calcDateDiff = (date: string, type: 'week' | 'month') => { return diff < 0 ? -diff : baseNumber - diff; }; +/** + * 获取一年的数据 + */ +export const lastYearData = () => { + const startTime = dayjs(); + const lastYear = startTime.subtract(1, 'year'); + const data: G2HeatmapData[] = []; + const days = startTime.diff(lastYear, 'd'); + + for (let i = 0; i <= days; i += 1) { + const date = lastYear.add(i, 'd').format('YYYY-MM-DD'); + + data.push({ + date, + commits: 0, + level: 0, + month: calcDateDiff(date, 'month'), + day: dayjs(date).day(), + week: calcDateDiff(date, 'week'), + }); + } + return data; +}; + /** * 将活跃数据转换为热力图数据 * @param docs @@ -183,10 +208,13 @@ export const mapToHeatData = (docs: ActivityDoc[]): G2HeatmapData[] => { }; }); - data = orderBy(data, 'week').map((item, index) => ({ + const base = lastYearData(); + + // 将数据合并 + data = unionBy([...data, ...base], 'date'); + + return orderBy(data, 'week').map((item, index) => ({ ...item, lastDay: index + 1 === data.length, })); - - return data; }; diff --git a/tests/utils/dataSource.test.ts b/tests/utils/dataSource.test.ts index b6211da..fbaab2a 100644 --- a/tests/utils/dataSource.test.ts +++ b/tests/utils/dataSource.test.ts @@ -6,6 +6,7 @@ import { fetchUser, getActivityData, mapToHeatData, + lastYearData, } from '@/utils'; import { readJSONSync } from 'fs-extra'; import { join } from 'path'; @@ -65,16 +66,11 @@ describe('数据转换', () => { join(__dirname, './testData.json'), ); - expect(mapToHeatData(testData)).toEqual([ - { - commits: 4, - date: '2021-02-04', - day: 4, - lastDay: true, - level: 2, - month: 12, - week: 51, - }, - ]); + expect(mapToHeatData(testData)).toHaveLength(367); + }); + + it('lastYearData', () => { + const data = lastYearData(); + expect(data).toHaveLength(367); }); });