Skip to content

Commit

Permalink
add: custom number of days feature; closes: #182
Browse files Browse the repository at this point in the history
  • Loading branch information
Ashutosh00710 committed May 18, 2024
1 parent 42ef9ee commit fa68a54
Show file tree
Hide file tree
Showing 7 changed files with 56 additions and 23 deletions.
31 changes: 16 additions & 15 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -86,21 +86,22 @@ Customize the appearance of your Activity Graph however you want with URL params

#### Common Options

| Arguments | Description | Type of Value |
| :------------: | :-------------------------------------------: | :------------------------: |
| `bg_color` | card's background color | hex code (without `#`) |
| `color` | graph card's text color | hex code (without `#`) |
| `title_color` | graph card's title color | hex code (without `#`) |
| `line` | graph's line color | hex code (without `#`) |
| `point` | color of points on line graph | hex code (without `#`) |
| `area_color` | color of the area under the graph | hex code (without `#`) |
| `area` | shows area under the graph | boolean (default: `false`) |
| `hide_border` | makes the border of the graph transparent | boolean (default: `false`) |
| `hide_title` | sets the title to an empty string | boolean (default: `false`) |
| `custom_title` | set the title to any string | string |
| `theme` | name of [available themes](#available-themes) | string |
| `radius` | border radius of graph | number (0-16 inclusive) |
| `height` | height of the graph | number (200-600 inclusive) |
| Arguments | Description | Type of Value |
| :------------: | :-------------------------------------------: | :---------------------------------------------: |
| `bg_color` | card's background color | hex code (without `#`) |
| `color` | graph card's text color | hex code (without `#`) |
| `title_color` | graph card's title color | hex code (without `#`) |
| `line` | graph's line color | hex code (without `#`) |
| `point` | color of points on line graph | hex code (without `#`) |
| `area_color` | color of the area under the graph | hex code (without `#`) |
| `area` | shows area under the graph | boolean (default: `false`) |
| `hide_border` | makes the border of the graph transparent | boolean (default: `false`) |
| `hide_title` | sets the title to an empty string | boolean (default: `false`) |
| `custom_title` | set the title to any string | string |
| `theme` | name of [available themes](#available-themes) | string |
| `radius` | border radius of graph | number (0-16 inclusive) |
| `height` | height of the graph | number (200-600 inclusive) |
| `days` | number of to display on graph | number between (1 - 365) [Recommended below 40] |

**For `custom_title` please make sure that you are using %20 for spaces**

Expand Down
9 changes: 9 additions & 0 deletions __test__/fakeInputs.ts
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,7 @@ export let fakeQueryStringRes = [
},
hide_title: false,
area: false,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -119,6 +120,7 @@ export let fakeQueryStringRes = [
},
hide_title: false,
area: false,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -135,6 +137,7 @@ export let fakeQueryStringRes = [
},
hide_title: false,
area: false,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -151,6 +154,7 @@ export let fakeQueryStringRes = [
},
hide_title: false,
area: false,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -167,6 +171,7 @@ export let fakeQueryStringRes = [
},
hide_title: false,
area: false,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -183,6 +188,7 @@ export let fakeQueryStringRes = [
},
hide_title: false,
area: true,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -199,6 +205,7 @@ export let fakeQueryStringRes = [
},
area: true,
hide_title: false,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -215,6 +222,7 @@ export let fakeQueryStringRes = [
},
area: true,
hide_title: true,
days: 31,
},
{
username: 'githubusername',
Expand All @@ -232,6 +240,7 @@ export let fakeQueryStringRes = [
area: true,
hide_title: false,
custom_title: 'some title',
days: 31,
},
];

Expand Down
2 changes: 1 addition & 1 deletion __test__/fetching.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ describe('Fetching Tests', () => {
// @ts-ignore: mocking private method
fetcher.fetch = mockFetchCorrect;

fetcher.fetchContributions().then(
fetcher.fetchContributions(31).then(
//@ts-ignore: will always return data of type userDetails
(data: UserDetails) => {
expect(data.contributions).toEqual(expect.any(Array));
Expand Down
6 changes: 3 additions & 3 deletions src/fetcher.ts
Original file line number Diff line number Diff line change
Expand Up @@ -46,9 +46,9 @@ export class Fetcher {
});
}

public async fetchContributions(): Promise<UserDetails | string> {
public async fetchContributions(days: number): Promise<UserDetails | string> {
const now = moment();
const from = moment(now).subtract(30, 'days').utc().toISOString();
const from = moment(now).subtract(days, 'days').utc().toISOString();
// also include the next day in case our server is behind in time with respect to GitHub
const to = moment(now).add(1, 'days').utc().toISOString();

Expand Down Expand Up @@ -82,7 +82,7 @@ export class Fetcher {
if (userData.contributions[length - 1].contributionCount === 0) {
userData.contributions.pop();
}
const extra = userData.contributions.length - 31;
const extra = userData.contributions.length - days;
userData.contributions.splice(0, extra);
return userData;
}
Expand Down
6 changes: 4 additions & 2 deletions src/handlers.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ export class Handlers {
const utils = new Utilities(req.query);

const fetcher = new Fetcher(utils.username);
const fetchCalendarData = await fetcher.fetchContributions();
const fetchCalendarData = await fetcher.fetchContributions(utils.queryOptions().days);

const { finalGraph, header } = await utils.buildGraph(fetchCalendarData);
utils.setHttpHeader(res, header.maxAge);
Expand All @@ -32,7 +32,9 @@ export class Handlers {
const utils = new Utilities(req.query);

const fetcher = new Fetcher(utils.username);
const fetchCalendarData: UserDetails | string = await fetcher.fetchContributions();
const fetchCalendarData: UserDetails | string = await fetcher.fetchContributions(
utils.queryOptions().days
);

if (typeof fetchCalendarData === 'object') {
res.status(200).send(fetchCalendarData);
Expand Down
2 changes: 2 additions & 0 deletions src/interfaces/interface.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ export class QueryOption {
area: boolean;
radius: number;
height: number;
days: number;
}

export class ParsedQs {
Expand All @@ -40,6 +41,7 @@ export class ParsedQs {
radius?: number;
title_color?: string;
height?: number;
days?: string;
}

export class GraphArgs {
Expand Down
23 changes: 21 additions & 2 deletions src/utils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,17 @@ export class Utilities {
};
}

private validateDate(days?: string): number {
const d = Number(days);
if (typeof d !== 'number') {
return 31;
} else if (d > 0 && d <= 90) {
return d;
} else {
return 31;
}
}

public queryOptions() {
let area = false;
if (String(this.queryString.area) === 'true') {
Expand All @@ -55,9 +66,10 @@ export class Utilities {
: 0, // Border radius in range [0, 16]
colors: colors,
area: area,
height: this.queryString.height
height: this.queryString.height
? Math.min(Math.max(this.queryString.height, 200), 600)
: 420, // Custom height implementation from range [200, 600], if not specified use default value - 420
days: this.validateDate(this.queryString.days),
};

if (this.queryString.custom_title)
Expand All @@ -81,7 +93,14 @@ export class Utilities {
}
}

const graph = new Card(options.height, 1200, options.radius, options.colors, title, options.area);
const graph = new Card(
options.height,
1200,
options.radius,
options.colors,
title,
options.area
);
const getChart = await graph.buildGraph(fetchCalendarData.contributions);
return {
finalGraph: getChart,
Expand Down

0 comments on commit fa68a54

Please sign in to comment.