Skip to content
This repository was archived by the owner on Apr 14, 2026. It is now read-only.

Commit f3b998e

Browse files
bp-cosbp-cos
committed
This is much better
1 parent 656bdea commit f3b998e

6 files changed

Lines changed: 191 additions & 31 deletions

File tree

‎app/preprints/-components/preprint-metrics/component.ts‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import Component from '@glimmer/component';
2+
import { inject as service } from '@ember/service';
3+
import { tracked } from '@glimmer/tracking';
4+
import { task } from 'ember-concurrency';
5+
import { waitFor } from '@ember/test-waiters';
6+
import { taskFor } from 'ember-concurrency-ts';
7+
import Store from '@ember-data/store';
8+
import config from 'ember-osf-web/config/environment';
9+
import { BaseMeta } from 'osf-api';
10+
11+
12+
interface InputArgs {
13+
guid: string;
14+
}
15+
16+
export default class PreprintMetrics extends Component<InputArgs> {
17+
@service store!: Store;
18+
@tracked apiMetrics!: BaseMeta;
19+
20+
metricsStartDate = config.OSF.metricsStartDate;
21+
22+
constructor(owner: unknown, args: InputArgs) {
23+
super(owner, args);
24+
25+
taskFor(this.loadPreprintMetrics).perform();
26+
}
27+
28+
@task
29+
@waitFor
30+
private async loadPreprintMetrics() {
31+
try {
32+
const adapterOptions = Object({
33+
query: {
34+
'metrics[views]': 'total',
35+
'metrics[downloads]': 'total',
36+
},
37+
});
38+
39+
const preprintMetrics = await this.store.findRecord('preprint', this.args.guid, {
40+
reload: true,
41+
adapterOptions,
42+
});
43+
44+
this.apiMetrics = preprintMetrics.apiMetrics;
45+
// eslint-disable-next-line
46+
} catch (_){ }
47+
}
48+
}

‎app/preprints/-components/preprint-metrics/styles.scss‎

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
// stylelint-disable max-nesting-depth, selector-max-compound-selectors
2+
3+
.file-renderer-container {
4+
width: 100%;
5+
height: 1150px;
6+
display: flex;
7+
flex-direction: column;
8+
align-items: flex-start;
9+
justify-content: flex-start;
10+
11+
.file-container {
12+
width: 100%;
13+
height: 1100px;
14+
display: flex;
15+
flex-direction: column;
16+
align-items: flex-start;
17+
justify-content: flex-start;
18+
}
19+
20+
.details-container {
21+
width: 100%;
22+
height: 50px;
23+
display: flex;
24+
flex-direction: row;
25+
align-items: center;
26+
justify-content: flex-start;
27+
28+
.name-container {
29+
width: 60%;
30+
height: 50px;
31+
overflow: hidden;
32+
display: flex;
33+
flex-direction: row;
34+
align-items: center;
35+
justify-content: space-between;
36+
37+
.name,
38+
.version {
39+
display: flex;
40+
flex-direction: row;
41+
align-items: center;
42+
justify-content: flex-start;
43+
height: 25px;
44+
}
45+
}
46+
47+
.version-container {
48+
width: 40%;
49+
height: 50px;
50+
display: flex;
51+
flex-direction: row;
52+
align-items: center;
53+
justify-content: flex-end;
54+
55+
.version-menu {
56+
background-color: $color-bg-white;
57+
border: 1px solid rgba(0, 0, 0, 0.15);
58+
border-radius: 4px;
59+
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
60+
padding: 5px;
61+
margin: 2px 0 0;
62+
63+
ul {
64+
list-style: none;
65+
padding-inline-start: 0;
66+
}
67+
68+
.li-container {
69+
margin-top: 10px;
70+
margin-bottom: 10px;
71+
72+
.btn {
73+
display: inline-block;
74+
margin-bottom: 0;
75+
font-weight: 400;
76+
text-align: center;
77+
white-space: nowrap;
78+
touch-action: manipulation;
79+
cursor: pointer;
80+
background-image: none;
81+
border: 1px solid transparent;
82+
border-radius: 2px;
83+
padding: 6px 12px;
84+
font-size: 14px;
85+
line-height: 1.42857;
86+
user-select: none;
87+
vertical-align: middle;
88+
color: $color-text-white;
89+
}
90+
91+
.btn-primary {
92+
color: $color-text-white;
93+
background-color: $color-bg-blue-dark;
94+
border-color: #2e6da4;
95+
}
96+
}
97+
}
98+
}
99+
}
100+
101+
&.mobile {
102+
height: 500px;
103+
104+
.file-container {
105+
height: 400px;
106+
}
107+
108+
.details-container {
109+
height: 100px;
110+
flex-direction: column;
111+
112+
.version-container,
113+
.name-container {
114+
height: 50px;
115+
width: 100%;
116+
justify-content: center;
117+
align-items: flex-start;
118+
flex-direction: column;
119+
}
120+
}
121+
}
122+
}

‎app/preprints/-components/preprint-metrics/template.hbs‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<div>
2+
{{#if this.loadPreprintMetrics.isRunning}}
3+
<LoadingIndicator data-test-loading-indicator @dark={{true}} />
4+
{{else}}
5+
<span data-test-view-count-label>
6+
{{t 'preprints.detail.share.views'}}:
7+
</span>
8+
<span data-test-view-count> {{this.apiMeta?.metrics?.views}} </span> |
9+
<span data-test-download-count-label>
10+
{{t 'preprints.detail.share.downloads'}}:
11+
</span>
12+
<span data-test-download-count>{{this.apiMeta?.metrics?.downloads}}</span>
13+
<EmberTooltip>
14+
{{t 'preprints.detail.share.metrics_disclaimer'}} {{moment-format this.metricsStartDate 'YYYY-MM-DD'}}
15+
</EmberTooltip>
16+
{{/if}}
17+
</div>

‎app/preprints/detail/controller.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,6 @@ export default class PrePrintsDetailController extends Controller {
6161
@tracked fullScreenMFR = false;
6262
@tracked plauditIsReady = false;
6363

64-
metricsStartDate = config.OSF.metricsStartDate;
6564
reviewStateLabelKeyMap = VersionStatusSimpleLabelKey;
6665

6766
get hyperlink(): string {

‎app/preprints/detail/route.ts‎

Lines changed: 1 addition & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -67,24 +67,6 @@ export default class PreprintsDetail extends Route {
6767
include: embeddableFields,
6868
});
6969

70-
let apiMetrics;
71-
try {
72-
const adapterOptions = Object({
73-
query: {
74-
'metrics[views]': 'total',
75-
'metrics[downloads]': 'total',
76-
},
77-
});
78-
79-
const preprintMetrics = await this.store.findRecord('preprint', guid, {
80-
reload: true,
81-
adapterOptions,
82-
});
83-
84-
apiMetrics = preprintMetrics.apiMetrics;
85-
// eslint-disable-next-line
86-
} catch (_){ }
87-
8870
const provider = await preprint?.get('provider');
8971

9072
this.theme.set('providerType', 'preprint');
@@ -133,8 +115,8 @@ export default class PreprintsDetail extends Route {
133115
&& !isWithdrawalRejected && !hasPendingWithdrawal;
134116

135117
return {
118+
guid,
136119
preprint,
137-
apiMetrics,
138120
brand: provider.brand.content,
139121
contributors,
140122
provider,

‎app/preprints/detail/template.hbs‎

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -194,17 +194,9 @@
194194
</OsfLink>
195195
</div>
196196
<div>
197-
<span data-test-view-count-label>
198-
{{t 'preprints.detail.share.views'}}:
199-
</span>
200-
<span data-test-view-count> {{this.model.apiMeta?.metrics?.views}} </span> |
201-
<span data-test-download-count-label>
202-
{{t 'preprints.detail.share.downloads'}}:
203-
</span>
204-
<span data-test-download-count>{{this.model.apiMeta?.metrics?.downloads}}</span>
205-
<EmberTooltip>
206-
{{t 'preprints.detail.share.metrics_disclaimer'}} {{moment-format this.metricsStartDate 'YYYY-MM-DD'}}
207-
</EmberTooltip>
197+
<Preprints::-Components::PreprintMetrics
198+
@guid={{this.model.guid}}
199+
></Preprints::-Components::PreprintMetrics>
208200
</div>
209201
</div>
210202
<div local-class='plaudit-container'>

0 commit comments

Comments
 (0)