Skip to content

Commit df01773

Browse files
mfraezzmfraezz
committed
Merge branch 'release/24.09.0'
2 parents 6b12c2d + 6d0093c commit df01773

File tree

114 files changed

+4908
-1142
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

114 files changed

+4908
-1142
lines changed

‎CHANGELOG.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ All notable changes to this project will be documented in this file.
44
The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
55
and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
66

7+
## [24.09.0] - 2024-11-21
8+
### Added
9+
- Institutional Dashboard Improvements Project - FE Release
10+
711
## [24.08.0] - 2024-10-30
812
### Added
913
- Hide categories section for draft registrations
@@ -2002,6 +2006,12 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
20022006
### Added
20032007
- Quick Files
20042008

2009+
[24.09.0]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.09.0
2010+
[24.08.0]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.08.0
2011+
[24.07.1]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.07.1
2012+
[24.07.0]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.07.0
2013+
[24.06.1]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.06.1
2014+
[24.06.0]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.06.0
20052015
[24.05.2]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.05.2
20062016
[24.05.1]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.05.1
20072017
[24.05.0]: https://github.com/CenterForOpenScience/ember-osf-web/releases/tag/24.05.0

‎app/adapters/share-adapter.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ const osfUrl = config.OSF.url;
55

66
export default class ShareAdapter extends JSONAPIAdapter {
77
host = config.OSF.shareBaseUrl.replace(/\/$/, ''); // Remove trailing slash to avoid // in URLs
8-
namespace = 'api/v3';
8+
namespace = 'trove';
99

1010
queryRecord(store: any, type: any, query: any) {
1111
// check if we aren't serving locally, otherwise add accessService query param to card/value searches

‎app/guid-node/registrations/styles.scss‎

Lines changed: 2 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
// stylelint-disable max-nesting-depth, selector-max-compound-selectors
2+
@import 'app/styles/components';
23

34
.registration-container {
45
margin: 30px;
@@ -19,41 +20,7 @@
1920

2021
/* stylelint-disable selector-no-qualifying-type */
2122
ul.tab-list {
22-
margin-bottom: 10px;
23-
border-bottom: 1px solid #ddd;
24-
box-sizing: border-box;
25-
color: rgb(51, 51, 51);
26-
display: block;
27-
line-height: 20px;
28-
list-style-image: none;
29-
list-style-position: outside;
30-
list-style-type: none;
31-
height: 41px;
32-
padding: 0;
33-
}
34-
35-
/* stylelint-enable selector-no-qualifying-type */
36-
.tab-list {
37-
li {
38-
display: block;
39-
position: relative;
40-
margin-bottom: -1px;
41-
float: left;
42-
height: 41px;
43-
padding: 10px 15px;
44-
}
45-
46-
li:global(.ember-tabs__tab--selected) {
47-
background-color: #f8f8f8;
48-
border-bottom: 2px solid #204762;
49-
}
50-
51-
li:hover {
52-
border-color: transparent;
53-
text-decoration: none;
54-
background-color: #f8f8f8;
55-
color: var(--primary-color);
56-
}
23+
@include tab-list;
5724
}
5825
}
5926
}

‎app/institutions/dashboard/-components/chart-kpi-wrapper/chart-kpi/component-test.ts‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
import { click, render } from '@ember/test-helpers';
2+
import { hbs } from 'ember-cli-htmlbars';
3+
import { setupMirage } from 'ember-cli-mirage/test-support';
4+
import { setupIntl } from 'ember-intl/test-support';
5+
import { setupRenderingTest } from 'ember-qunit';
6+
import { TestContext } from 'ember-test-helpers';
7+
import { module, test } from 'qunit';
8+
9+
module('Integration | institutions | dashboard | -components | chart-kpi', hooks => {
10+
setupRenderingTest(hooks);
11+
setupMirage(hooks);
12+
setupIntl(hooks);
13+
14+
hooks.beforeEach(function(this: TestContext) {
15+
const data = Object({
16+
title: 'This is the title',
17+
chartData: [
18+
Object({
19+
label: 'a very long data set title that needs to be handled',
20+
total: 100000,
21+
}),
22+
],
23+
chartType: 'pie',
24+
});
25+
26+
this.set('data', data);
27+
});
28+
29+
test('it renders the data correctly', async assert => {
30+
31+
// Given the component is rendered
32+
await render(hbs`
33+
<Institutions::Dashboard::-Components::ChartKpiWrapper::ChartKpi
34+
@data={{this.data}}
35+
/>
36+
`);
37+
// Then the chart is verified
38+
assert.dom('[data-test-chart]')
39+
.exists('The test chart exists');
40+
41+
// And the title is verified
42+
assert.dom('[data-test-chart-title]')
43+
.hasText('This is the title');
44+
45+
assert.dom('[data-test-toggle-icon]')
46+
.hasAttribute('data-icon', 'caret-down');
47+
48+
// Finally the expanded data is not visible
49+
assert.dom('[data-test-expansion-data]')
50+
.hasStyle({display: 'none'});
51+
});
52+
53+
test('it renders the expanded data correctly', async assert => {
54+
55+
// Given the component is rendered
56+
await render(hbs`
57+
<Institutions::Dashboard::-Components::ChartKpiWrapper::ChartKpi
58+
@data={{this.data}}
59+
/>
60+
`);
61+
// When I click the expanded icon
62+
await click('[data-test-expand-additional-data]');
63+
64+
// Then I verify the icon has changed
65+
assert.dom('[data-test-toggle-icon]')
66+
.hasAttribute('data-icon', 'caret-up');
67+
68+
// And the expanded data is visible
69+
assert.dom('[data-test-expansion-data]')
70+
.exists('The expansion data is visible');
71+
72+
// And the expanded data position 0 color is verified
73+
assert.dom('[data-test-expanded-color="0"]')
74+
.hasAttribute('style', 'background-color:#00D1FF');
75+
76+
// And the expanded data position 0 name is verified
77+
assert.dom('[data-test-expanded-name="0"]')
78+
.hasText('a very long data set title that needs to be handled');
79+
80+
// And the expanded data position 0 total is verified
81+
assert.dom('[data-test-expanded-total="0"]')
82+
.hasText('100000');
83+
});
84+
});

‎app/institutions/dashboard/-components/chart-kpi-wrapper/chart-kpi/component.ts‎

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
import Component from '@glimmer/component';
2+
import { action } from '@ember/object';
3+
import { inject as service } from '@ember/service';
4+
import { tracked } from '@glimmer/tracking';
5+
import { ChartData, ChartOptions } from 'ember-cli-chart';
6+
import Intl from 'ember-intl/services/intl';
7+
// eslint-disable-next-line max-len
8+
import { ChartDataModel, KpiChartModel } from 'ember-osf-web/institutions/dashboard/-components/chart-kpi-wrapper/component';
9+
10+
interface KPIChartWrapperArgs {
11+
data: KpiChartModel;
12+
}
13+
14+
interface DataModel {
15+
name: string;
16+
total: number;
17+
color: string;
18+
}
19+
20+
export default class ChartKpi extends Component<KPIChartWrapperArgs> {
21+
@service intl!: Intl;
22+
23+
@tracked collapsed = true;
24+
@tracked expandedData = [] as DataModel[];
25+
26+
/**
27+
* chartOptions
28+
*
29+
* @description A getter for the chartjs options
30+
*
31+
* @returns a ChartOptions model which is custom to COS
32+
*/
33+
get chartOptions(): ChartOptions {
34+
const options = {
35+
aspectRatio: 1,
36+
legend: {
37+
display: false,
38+
},
39+
scales: {
40+
xAxes: [{
41+
display: false,
42+
}],
43+
yAxes: [{
44+
display: false,
45+
ticks: { min: 0 },
46+
}],
47+
},
48+
};
49+
if (this.args.data.chartType === 'bar') {
50+
options.scales.yAxes[0].display = true;
51+
}
52+
return options;
53+
}
54+
55+
/**
56+
* getColor
57+
*
58+
* @description Gets a specific color using a modulus
59+
*
60+
* @param index The index to retrieve
61+
*
62+
* @returns the color
63+
*/
64+
private getColor(index: number): string {
65+
const backgroundColors = [
66+
'#00D1FF',
67+
'#009CEF',
68+
'#0063EF',
69+
'#00568D',
70+
'#004673',
71+
'#00375A',
72+
'#263947',
73+
];
74+
75+
return backgroundColors[index % backgroundColors.length];
76+
}
77+
78+
/**
79+
* chartData
80+
*
81+
* @description Transforms the standard chart data into data the charts can display
82+
*
83+
* @returns void
84+
*/
85+
get chartData(): ChartData {
86+
const backgroundColors = [] as string[];
87+
const data = [] as number[];
88+
const labels = [] as string[];
89+
const { taskInstance, chartData } = this.args.data;
90+
91+
const rawData = taskInstance?.value || chartData || [];
92+
93+
rawData.forEach((rawChartData: ChartDataModel, $index: number) => {
94+
backgroundColors.push(this.getColor($index));
95+
96+
data.push(rawChartData.total);
97+
labels.push(rawChartData.label);
98+
this.expandedData.push({
99+
name: rawChartData.label,
100+
total: rawChartData.total,
101+
color: this.getColor($index),
102+
});
103+
});
104+
return {
105+
labels,
106+
datasets: [{
107+
data,
108+
fill: false,
109+
backgroundColor: backgroundColors,
110+
}],
111+
};
112+
}
113+
114+
@action
115+
public toggleExpandedData() {
116+
this.collapsed = !this.collapsed;
117+
}
118+
}

0 commit comments

Comments
 (0)