Skip to content
This repository was archived by the owner on Sep 22, 2023. It is now read-only.

Commit ea1de94

Browse files
manonthematmanonthemat
committed
use of label in DID list
Signed-off-by: Matthias Sieber <matthias.sieber@loxeinc.com>
1 parent f409ea8 commit ea1de94

File tree

1 file changed

+115
-125
lines changed

1 file changed

+115
-125
lines changed

‎src/renderer/components/AgentBase.vue

Lines changed: 115 additions & 125 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,21 @@
11
<template>
22
<el-container>
3-
<el-menu
4-
ref="menu"
5-
style="-webkit-user-select:none; overflow: auto;"
6-
mode="vertical"
7-
id="side-menu"
8-
background-color="#545c64"
9-
text-color="#fff"
10-
active-text-color="#ffd04b"
11-
router>
3+
<el-menu ref="menu" style="-webkit-user-select:none; overflow: auto;" mode="vertical" id="side-menu"
4+
background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" router>
125
<el-menu-item-group :index="group" v-for="(group_modules, group) in matching_modules_grouped" v-bind:key="group">
13-
<span class="menu-title" slot="title">{{group}}</span>
14-
<el-menu-item :index="m.path" v-for="m in group_modules" v-bind:key="m.path" :route="{name: m.path}">
6+
<span class="menu-title" slot="title">{{ group }}</span>
7+
<el-menu-item :index="m.path" v-for="m in group_modules" v-bind:key="m.path" :route="{ name: m.path }">
158
<i v-bind:class="m.icon"></i>
16-
<span>{{m.label}}</span>
9+
<span>{{ m.label }}</span>
1710
</el-menu-item>
1811
</el-menu-item-group>
1912
</el-menu>
2013
<nav id="top-bar" class="navbar navbar-expand-lg navbar-light bg-light">
21-
<a class="navbar-brand" href="#">{{connection.label}}</a>
22-
<el-form
23-
:disabled="dids.length === 0">
24-
<el-select
25-
v-model="active_did"
26-
no-data-text="No DIDs found"
27-
filterable placeholder="Activate DID">
28-
<el-option
29-
v-for="did in dids"
30-
:key="did.did"
31-
:label="did.did"
32-
:value="did">
14+
<a class="navbar-brand" href="#">{{ connection.label }}</a>
15+
<el-form :disabled="dids.length === 0">
16+
<el-select v-model="active_did" no-data-text="No DIDs found" filterable placeholder="Activate DID">
17+
<el-option v-for="did in dids" :key="did.did"
18+
:label="did.metadata?.label ? `${did.metadata.label} (${did.did})` : did.did" :value="did">
3319
</el-option>
3420
</el-select>
3521
<!--
@@ -65,16 +51,16 @@ import Vue from 'vue';
6551
import { mapState, mapActions, mapGetters } from "vuex";
6652
import { from_store } from '../connection_detail.js';
6753
import message_bus from '@/message_bus.js';
68-
import share, {share_source} from '@/share.js';
69-
import components, {shared} from './components.js';
54+
import share, { share_source } from '@/share.js';
55+
import components, { shared } from './components.js';
7056
import Taa from './TAA.vue';
7157
7258
7359
//handle crashes and kill events
74-
process.on('uncaughtException', function(err) {
60+
process.on('uncaughtException', function (err) {
7561
//log the message and stack trace
7662
let datestring = new Date().toISOString();
77-
fs.writeFileSync('crash.log', datestring +"\n"+ err + "\n" + err.stack + "\n", {flag:'a+'});
63+
fs.writeFileSync('crash.log', datestring + "\n" + err + "\n" + err.stack + "\n", { flag: 'a+' });
7864
7965
//do any cleanup like shutting down servers, etc
8066
@@ -98,50 +84,52 @@ let module_list = Object.entries(components).map(([modulename, module]) => ({
9884
}));
9985
10086
//sort modules by priority, then label
101-
module_list.sort((a,b)=> a.priority - b.priority ||
102-
a.label.localeCompare(b.label));
87+
module_list.sort((a, b) => a.priority - b.priority ||
88+
a.label.localeCompare(b.label));
10389
10490
export default {
10591
name: 'agent-base',
10692
mixins: [
107-
message_bus({ events: {
108-
'redirect': (vm, route) => {
109-
vm.redirect(route);
110-
},
111-
'send-message': (v, msg, return_route) => {
112-
v.send_connection_message(msg, return_route);
113-
},
114-
'toolbox-mediator-change': (vm) => {
115-
let mediator_agent = vm.agent_list.find(a => a.active_as_mediator === true);
116-
if(mediator_agent != null && mediator_agent.active_as_mediator){
117-
vm.connection.disable_return_route();
118-
} else {
119-
vm.connection.enable_return_route();
93+
message_bus({
94+
events: {
95+
'redirect': (vm, route) => {
96+
vm.redirect(route);
97+
},
98+
'send-message': (v, msg, return_route) => {
99+
v.send_connection_message(msg, return_route);
100+
},
101+
'toolbox-mediator-change': (vm) => {
102+
let mediator_agent = vm.agent_list.find(a => a.active_as_mediator === true);
103+
if (mediator_agent != null && mediator_agent.active_as_mediator) {
104+
vm.connection.disable_return_route();
105+
} else {
106+
vm.connection.enable_return_route();
107+
}
108+
console.log("mediator change!", mediator_agent);
109+
},
110+
'did:sov:BzCbsNYhMrjHiqZDTUASHg;spec/notification/1.0/problem-report':
111+
(vm, msg) => {
112+
vm.$notify.error({
113+
title: 'Small problem...',
114+
message: (text => {
115+
if (text.length > 30) {
116+
return text.slice(0, 30).trim() + '...';
117+
}
118+
return text;
119+
})(msg["explain-ltxt"] || msg['description']['en']),
120+
onClick: () => vm.redirect('message-history'),
121+
duration: 4000,
122+
customClass: 'problem-report-notification'
123+
})
124+
},
125+
'did:sov:BzCbsNYhMrjHiqZDTUASHg;spec/coordinate-mediation/1.0/mediate-grant': (vm, msg) => {
126+
vm.enable_as_mediator(msg);
127+
},
128+
'https://didcomm.org/coordinate-mediation/1.0/mediate-grant': (vm, msg) => {
129+
vm.enable_as_mediator(msg);
120130
}
121-
console.log("mediator change!", mediator_agent);
122-
},
123-
'did:sov:BzCbsNYhMrjHiqZDTUASHg;spec/notification/1.0/problem-report':
124-
(vm, msg) => {
125-
vm.$notify.error({
126-
title: 'Small problem...',
127-
message: (text => {
128-
if (text.length > 30) {
129-
return text.slice(0, 30).trim() + '...';
130-
}
131-
return text;
132-
})(msg["explain-ltxt"] || msg['description']['en']),
133-
onClick: () => vm.redirect('message-history'),
134-
duration: 4000,
135-
customClass: 'problem-report-notification'
136-
})
137-
},
138-
'did:sov:BzCbsNYhMrjHiqZDTUASHg;spec/coordinate-mediation/1.0/mediate-grant': (vm, msg) => {
139-
vm.enable_as_mediator(msg);
140-
},
141-
'https://didcomm.org/coordinate-mediation/1.0/mediate-grant': (vm, msg) => {
142-
vm.enable_as_mediator(msg);
143131
}
144-
}}),
132+
}),
145133
share_source(shared),
146134
share({
147135
use: ['dids', 'public_did', 'protocols'],
@@ -155,35 +143,36 @@ export default {
155143
})
156144
],
157145
props: ['agentid'],
158-
components: {Taa},
159-
data: function() {
146+
components: { Taa },
147+
data: function () {
160148
return {
161-
'connection': {'label':'loading...'},
149+
'connection': { 'label': 'loading...' },
162150
'modules': module_list,
163151
'return_route_poll_timer': '',
164152
}
165153
},
166154
computed: {
167155
...mapState("Agents", ["agent_list"]),
168156
active_did: {
169-
get () {
170-
return this.public_did || "";
157+
get() {
158+
const aDid = this.dids.filter(did => did.did === this.public_did)[0]
159+
return (!aDid) ? '' : (aDid.metadata?.label ? `${aDid.metadata.label} (${aDid.did})` : this.public_did)
171160
},
172-
set (did) {
161+
set(did) {
173162
return this.activate_did(did)
174163
}
175164
},
176-
matching_modules_grouped: function(){
165+
matching_modules_grouped: function () {
177166
// This computed attribute updates when the supported protocol list is updated.
178167
let pid_list = this.protocols.map(p => p.pid);
179-
let filtered_list = module_list.filter(function(m){
168+
let filtered_list = module_list.filter(function (m) {
180169
return m.required_protocols.every(req_protocol => pid_list.includes(req_protocol));
181170
});
182171
//group modules
183172
let module_groups = filtered_list.reduce(function (r, m) {
184-
r[m.group] = r[m.group] || [];
185-
r[m.group].push(m);
186-
return r;
173+
r[m.group] = r[m.group] || [];
174+
r[m.group].push(m);
175+
return r;
187176
}, Object.create(null));
188177
return module_groups;
189178
}
@@ -192,26 +181,26 @@ export default {
192181
methods: {
193182
...mapGetters("Agents", ["get_agent"]),
194183
...mapActions("Agents", ["update_agent"]),
195-
async send_connection_message(msg){
184+
async send_connection_message(msg) {
196185
await this.connection_loaded;
197186
let sent_message = await this.connection.send_message(msg);
198187
this.$message_bus.$emit('sent-message', sent_message)
199188
},
200-
get_connection(){
189+
get_connection() {
201190
return this.connection;
202191
},
203-
async processInbound(msg){
192+
async processInbound(msg) {
204193
// RFC 0348 Step 1: modify prefix (if present) to old standard
205194
let OLD = "did:sov:BzCbsNYhMrjHiqZDTUASHg;spec/";
206195
let NEW = "https://didcomm.org/";
207-
if(msg['@type'].startsWith(NEW)){
196+
if (msg['@type'].startsWith(NEW)) {
208197
msg['@type'] = msg['@type'].replace(NEW, OLD);
209198
}
210199
// END RFC 0348 Step 1
211200
this.$message_bus.$emit('message-received', msg);
212201
this.$message_bus.$emit(msg['@type'], msg);
213202
},
214-
return_route_poll(){
203+
return_route_poll() {
215204
// This brute forces picking up return route messages
216205
let msg = {
217206
"@type": "did:sov:BzCbsNYhMrjHiqZDTUASHg;spec/trust_ping/1.0/ping",
@@ -222,11 +211,11 @@ export default {
222211
};
223212
this.send_message(msg);
224213
},
225-
redirect: function(route) {
226-
this.$router.push({name: route});
214+
redirect: function (route) {
215+
this.$router.push({ name: route });
227216
this.$refs.menu.updateActiveIndex(route);
228217
},
229-
enable_as_mediator: function(grant_msg) {
218+
enable_as_mediator: function (grant_msg) {
230219
let conn = this.get_connection();
231220
conn.active_as_mediator = true;
232221
conn.mediator_info = {
@@ -242,7 +231,7 @@ export default {
242231
get_connection: this.get_connection
243232
}
244233
},
245-
created: async function() {
234+
created: async function () {
246235
let vm = this; //hold reference
247236
this.connection_loaded = (async () => {
248237
let agent_info = await vm.get_agent(vm.agentid)(vm.agentid);
@@ -252,7 +241,7 @@ export default {
252241
// don't use return route in the agent window if any connection is configured as a mediator connection.
253242
254243
let mediator_agent = this.agent_list.find(a => a.active_as_mediator === true);
255-
if(mediator_agent != null && mediator_agent.active_as_mediator){
244+
if (mediator_agent != null && mediator_agent.active_as_mediator) {
256245
this.connection.disable_return_route();
257246
}
258247
this.fetch_protocols();
@@ -261,11 +250,11 @@ export default {
261250
this.fetch_connections();
262251
this.$message_bus.$emit('agent-created');
263252
//start poll timer
264-
if(this.connection.needs_return_route_poll()){
253+
if (this.connection.needs_return_route_poll()) {
265254
this.return_route_poll_timer = setInterval(this.return_route_poll, 10000);
266255
}
267256
},
268-
mounted () {
257+
mounted() {
269258
this.$electron.ipcRenderer.on('inbound_message', async (event, data) => {
270259
console.log("inbound mediated message", data);
271260
this.connection.process_inbound(await this.connection.unpackMessage(data.msg));
@@ -313,54 +302,55 @@ export default {
313302
}
314303
});
315304
},
316-
beforeDestroy: function() {
317-
if(this.connection.needs_return_route_poll()) {
305+
beforeDestroy: function () {
306+
if (this.connection.needs_return_route_poll()) {
318307
clearInterval(this.return_route_poll_timer)
319308
}
320309
}
321310
}
322311
</script>
323312
324313
<style>
325-
#top-bar {
326-
position:absolute;
327-
right: 0px;
328-
left:200px;
329-
height: 60px;
330-
}
314+
#top-bar {
315+
position: absolute;
316+
right: 0px;
317+
left: 200px;
318+
height: 60px;
319+
}
331320
332-
#main-display {
333-
position: absolute;
334-
right:0px;
335-
bottom: 0px;
336-
top: 60px;
337-
left: 200px;
338-
}
321+
#main-display {
322+
position: absolute;
323+
right: 0px;
324+
bottom: 0px;
325+
top: 60px;
326+
left: 200px;
327+
}
339328
340-
#side-menu {
341-
height: 100%;
342-
width: 200px;
343-
position: absolute;
329+
#side-menu {
330+
height: 100%;
331+
width: 200px;
332+
position: absolute;
344333
345-
}
346-
#side-menu .menu-title {
347-
color: #fff
348-
}
349-
#side-menu i {
350-
color: #409EFF;
351-
}
334+
}
352335
353-
.el-menu-item-group__title {
354-
font-size: 18px;
355-
}
336+
#side-menu .menu-title {
337+
color: #fff
338+
}
356339
357-
.el-menu-item {
358-
height: 36px;
359-
line-height: 36px;
360-
}
340+
#side-menu i {
341+
color: #409EFF;
342+
}
361343
362-
.problem-report-notification {
363-
cursor: pointer;
364-
}
344+
.el-menu-item-group__title {
345+
font-size: 18px;
346+
}
365347
348+
.el-menu-item {
349+
height: 36px;
350+
line-height: 36px;
351+
}
352+
353+
.problem-report-notification {
354+
cursor: pointer;
355+
}
366356
</style>

0 commit comments

Comments
 (0)