Skip to content

Commit b1589fa

Browse files
roncodesroncodes
committed
cleaned up ux
1 parent d3630e7 commit b1589fa

17 files changed

Lines changed: 135 additions & 161 deletions

File tree

‎addon/components/api-event/data.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<ContentPanel @title={{t "developers.component.api-event.data.title"}} @open={{true}} @pad={{true}} @panelTitleClass="text-sm" @panelBodyClass="bg-white dark:bg-gray-800">
1+
<ContentPanel @title={{t "developers.component.api-event.data.title"}} @open={{true}} @wrapperClass="bordered-top" @panelBodyWrapperClass="p-0i">
22
{{#if @apiEvent.data}}
33
<CodeBlock @code={{or @apiEvent.dataJson ""}} @language="json" class="line-numbers" />
44
{{else}}

‎addon/components/api-event/details.hbs‎

Lines changed: 36 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,37 @@
1-
<ContentPanel
2-
@prefixTitle={{t "developers.component.api-event.details.prefixTitle"}}
3-
@title={{@apiEvent.event}}
4-
@prefixTitleRight={{@apiEvent.public_id}}
5-
@titleContainerClass="flex-col"
6-
@panelTitleClass="text-sm"
7-
@prefixTitleClass="ml-4 flex flex-row items-center text-sm"
8-
@prefixTitleRightClass="font-mono"
9-
@panelHeaderClass="items-stretch-i"
10-
@panelHeaderRightClass="items-start-i"
11-
@prefixTitleRightContainerClass="py-2"
12-
@open={{true}}
13-
@pad={{true}}
14-
@panelBodyClass="bg-white dark:bg-gray-800 text-sm"
15-
>
16-
<table class="border-none table-fixed dark:text-gray-100 table-spaced-y-2 table-cells-valign-top">
17-
<tbody>
18-
<tr>
19-
<td class="w-40">
20-
{{t "developers.common.date"}}
21-
</td>
22-
<td>
23-
{{@apiEvent.createdAt}}
24-
</td>
25-
</tr>
26-
<tr>
27-
<td>
28-
{{t "developers.common.source"}}
29-
</td>
30-
<td>
31-
{{@apiEvent.source}}
32-
</td>
33-
</tr>
34-
<tr>
35-
<td>
36-
{{t "developers.common.description"}}
37-
</td>
38-
<td>
39-
{{@apiEvent.description}}
40-
</td>
41-
</tr>
42-
</tbody>
43-
</table>
1+
<ContentPanel @title={{@apiEvent.event}} @open={{true}} @wrapperClass="bordered-top" @panelBodyWrapperClass="pb-0i">
2+
<:title>
3+
<div class="ml-2 flex flex-row space-x-1">
4+
<Badge @hideStatusDot={{true}} @status={{@apiEvent.public_id}} @disableHumanize={{true}} />
5+
</div>
6+
</:title>
7+
<:default>
8+
<table class="border-none text-sm table-fixed dark:text-gray-100 table-spaced-y-2 table-cells-valign-top">
9+
<tbody>
10+
<tr>
11+
<td class="w-40">
12+
{{t "developers.common.date"}}
13+
</td>
14+
<td>
15+
{{@apiEvent.createdAt}}
16+
</td>
17+
</tr>
18+
<tr>
19+
<td>
20+
{{t "developers.common.source"}}
21+
</td>
22+
<td>
23+
{{@apiEvent.source}}
24+
</td>
25+
</tr>
26+
<tr>
27+
<td>
28+
{{t "developers.common.description"}}
29+
</td>
30+
<td>
31+
{{@apiEvent.description}}
32+
</td>
33+
</tr>
34+
</tbody>
35+
</table>
36+
</:default>
4437
</ContentPanel>

‎addon/components/api-request-log/details.hbs‎

Lines changed: 52 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,53 @@
1-
<ContentPanel
2-
@prefixTitle={{t "developers.component.api-request-log.details.prefixTitle"}}
3-
@title={{@apiRequest.description}}
4-
@titleStatus={{@apiRequest.status_code}}
5-
@prefixTitleRight={{@apiRequest.public_id}}
6-
@titleContainerClass="flex-col"
7-
@panelTitleClass="ml-4 flex flex-row items-center text-sm"
8-
@prefixTitleClass="text-sm"
9-
@prefixTitleRightClass="font-mono"
10-
@panelHeaderClass="items-stretch-i"
11-
@panelHeaderRightClass="items-start-i"
12-
@prefixTitleRightContainerClass="py-2"
13-
@open={{true}}
14-
@pad={{true}}
15-
@panelBodyClass="bg-white dark:bg-gray-800 text-sm"
16-
>
17-
<table class="border-none table-fixed dark:text-gray-100 table-spaced-y-2 table-cells-valign-top">
18-
<tbody>
19-
<tr>
20-
<td class="w-40">
21-
{{t "developers.common.time"}}
22-
</td>
23-
<td>
24-
{{@apiRequest.createdAt}}
25-
</td>
26-
</tr>
27-
<tr>
28-
<td class="w-40">
29-
{{t "developers.component.api-request-log.details.duration"}}
30-
</td>
31-
<td>
32-
{{format-milliseconds @apiRequest.duration}}
33-
</td>
34-
</tr>
35-
<tr>
36-
<td>
37-
{{t "developers.component.api-request-log.details.ip-address"}}
38-
</td>
39-
<td>
40-
{{@apiRequest.ip_address}}
41-
</td>
42-
</tr>
43-
<tr>
44-
<td>
45-
{{t "developers.common.version"}}
46-
</td>
47-
<td>
48-
{{@apiRequest.version}}
49-
</td>
50-
</tr>
51-
<tr>
52-
<td>
53-
{{t "developers.common.source"}}
54-
</td>
55-
<td>
56-
{{@apiRequest.source}}
57-
</td>
58-
</tr>
59-
</tbody>
60-
</table>
1+
<ContentPanel @title={{@apiRequest.description}} @titleStatus={{@apiRequest.status_code}} @open={{true}} @wrapperClass="bordered-top" @panelTitleClass="flex flex-row items-center normal-case">
2+
<:title>
3+
<div class="ml-2 flex flex-row space-x-1 leading-5">
4+
<Badge @hideStatusDot={{true}} @status={{@apiRequest.public_id}} @disableHumanize={{true}} />
5+
</div>
6+
</:title>
7+
<:default>
8+
<table class="border-none text-sm table-fixed dark:text-gray-100 table-spaced-y-2 table-cells-valign-top">
9+
<tbody>
10+
<tr>
11+
<td class="w-40">
12+
{{t "developers.common.time"}}
13+
</td>
14+
<td>
15+
{{@apiRequest.createdAt}}
16+
</td>
17+
</tr>
18+
<tr>
19+
<td class="w-40">
20+
{{t "developers.component.api-request-log.details.duration"}}
21+
</td>
22+
<td>
23+
{{format-milliseconds @apiRequest.duration}}
24+
</td>
25+
</tr>
26+
<tr>
27+
<td>
28+
{{t "developers.component.api-request-log.details.ip-address"}}
29+
</td>
30+
<td>
31+
{{@apiRequest.ip_address}}
32+
</td>
33+
</tr>
34+
<tr>
35+
<td>
36+
{{t "developers.common.version"}}
37+
</td>
38+
<td>
39+
{{@apiRequest.version}}
40+
</td>
41+
</tr>
42+
<tr>
43+
<td>
44+
{{t "developers.common.source"}}
45+
</td>
46+
<td>
47+
{{@apiRequest.source}}
48+
</td>
49+
</tr>
50+
</tbody>
51+
</table>
52+
</:default>
6153
</ContentPanel>

‎addon/components/api-request-log/query-params.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<ContentPanel @title={{t "developers.component.api-request-log.query-params.title"}} @panelTitleClass="text-sm" @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
1+
<ContentPanel @title={{t "developers.component.api-request-log.query-params.title"}} @open={{true}} @wrapperClass="bordered-top" @panelBodyWrapperClass="p-0i">
22
{{#if @apiRequest.query_params}}
33
<CodeBlock @code={{or (json-stringify @apiRequest.query_params) ""}} @language="json" class="line-numbers" />
44
{{else}}

‎addon/components/api-request-log/request-body.hbs‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
<ContentPanel
22
@title={{concat (t "developers.component.api-request-log.request-body.title") @apiRequest.method (t "developers.component.api-request-log.request-body.title-second-part")}}
3-
@panelTitleClass="text-sm"
43
@open={{true}}
5-
@pad={{true}}
6-
@panelBodyClass="bg-white dark:bg-gray-800"
4+
@wrapperClass="bordered-top"
5+
@panelBodyWrapperClass="p-0i"
76
>
87
{{#if @apiRequest.request_body}}
98
<CodeBlock @code={{or (json-stringify @apiRequest.request_body) ""}} @language="json" class="line-numbers" />

‎addon/components/api-request-log/request-headers.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<ContentPanel @title={{t "developers.component.api-request-log.request-headers.title"}} @panelTitleClass="text-sm" @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
1+
<ContentPanel @title={{t "developers.component.api-request-log.request-headers.title"}} @open={{true}} @wrapperClass="bordered-top" @panelBodyWrapperClass="p-0i">
22
{{#if @apiRequest.request_headers}}
33
<CodeBlock @code={{or (json-stringify @apiRequest.request_headers) ""}} @language="json" class="line-numbers" />
44
{{else}}

‎addon/components/api-request-log/response-body.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<ContentPanel @title={{t "developers.component.api-request-log.response-body.title"}} @panelTitleClass="text-sm" @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
1+
<ContentPanel @title={{t "developers.component.api-request-log.response-body.title"}} @open={{true}} @wrapperClass="bordered-top" @panelBodyWrapperClass="p-0i">
22
{{#if @apiRequest.response_body}}
33
<CodeBlock @code={{or (json-stringify @apiRequest.response_body) ""}} @language="json" class="line-numbers" />
44
{{else}}

‎addon/controllers/api-keys/index.js‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -104,38 +104,37 @@ export default class ApiKeysIndexController extends Controller {
104104
*/
105105
@tracked columns = [
106106
{
107+
sticky: true,
107108
label: this.intl.t('developers.common.name'),
108109
valuePath: 'name',
109110
cellComponent: 'table/cell/anchor',
110111
permission: 'developers view api-key',
111112
action: this.editApiKey,
112113
resizable: true,
113-
width: '10%',
114114
sortable: false,
115115
},
116116
{
117117
label: this.intl.t('developers.api-keys.index.public-key'),
118118
valuePath: 'key',
119-
width: '18%',
120119
sortable: false,
121120
resizable: true,
122121
cellComponent: 'click-to-copy',
123122
},
124123
{
125124
label: this.intl.t('developers.api-keys.index.secret-key'),
126125
valuePath: 'secret',
127-
width: '18%',
128126
sortable: false,
129127
resizable: true,
128+
width: 100,
130129
cellComponent: 'click-to-reveal',
131130
cellComponentArgs: {
132131
clickToCopy: true,
132+
wrapperClass: 'w-72'
133133
},
134134
},
135135
{
136136
label: this.intl.t('developers.api-keys.index.enviroment'),
137137
valuePath: 'environment',
138-
width: '10%',
139138
sortable: false,
140139
resizable: true,
141140
cellComponent: 'table/cell/status',
@@ -144,7 +143,6 @@ export default class ApiKeysIndexController extends Controller {
144143
label: this.intl.t('developers.api-keys.index.expiry'),
145144
valuePath: 'expiresAt',
146145
sortable: false,
147-
width: '8%',
148146
tooltip: true,
149147
resizable: true,
150148
cellClassNames: 'overflow-visible',
@@ -153,7 +151,6 @@ export default class ApiKeysIndexController extends Controller {
153151
label: this.intl.t('developers.api-keys.index.last-used'),
154152
valuePath: 'lastUsed',
155153
sortable: false,
156-
width: '14%',
157154
tooltip: true,
158155
resizable: true,
159156
cellClassNames: 'overflow-visible',
@@ -162,7 +159,6 @@ export default class ApiKeysIndexController extends Controller {
162159
label: this.intl.t('developers.common.created'),
163160
valuePath: 'createdAt',
164161
sortable: false,
165-
width: '14%',
166162
tooltip: true,
167163
resizable: true,
168164
cellClassNames: 'overflow-visible',
@@ -176,8 +172,9 @@ export default class ApiKeysIndexController extends Controller {
176172
ddMenuLabel: 'API Key Actions',
177173
cellClassNames: 'overflow-visible',
178174
wrapperClass: 'flex items-center justify-end mx-2',
179-
width: '10%',
180175
align: 'right',
176+
sticky: 'right',
177+
width: 60,
181178
actions: [
182179
{
183180
label: this.intl.t('developers.api-keys.index.edit-key'),

‎addon/controllers/events/index.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -77,15 +77,14 @@ export default class EventsIndexController extends BaseController {
7777
*/
7878
@tracked columns = [
7979
{
80+
sticky: true,
8081
label: this.intl.t('developers.common.event'),
8182
valuePath: 'description',
82-
width: '40%',
8383
sortable: false,
8484
},
8585
{
8686
label: this.intl.t('developers.common.code'),
8787
valuePath: 'event',
88-
width: '20%',
8988
sortable: false,
9089
filterable: true,
9190
filterComponent: 'filter/select',
@@ -95,7 +94,6 @@ export default class EventsIndexController extends BaseController {
9594
label: this.intl.t('developers.common.id'),
9695
valuePath: 'public_id',
9796
cellComponent: 'click-to-copy',
98-
width: '20%',
9997
align: 'right',
10098
sortable: false,
10199
},
@@ -105,7 +103,6 @@ export default class EventsIndexController extends BaseController {
105103
filterParam: 'created_at',
106104
sortParam: 'created_at',
107105
sortable: false,
108-
width: '20%',
109106
align: 'right',
110107
filterable: true,
111108
filterComponent: 'filter/date',

0 commit comments

Comments
 (0)