Skip to content

Commit

Permalink
Merge branch 'pin-from-profile' from 'https://github.com/evamillan/gr…
Browse files Browse the repository at this point in the history 
…imoirelab-sortinghat'

Merges #826
Closes #826
  • Loading branch information
@jjmerchante
jjmerchante authored Oct 27, 2023
2 parents 6b31c13 + 97c4445 commit 616d189
Show file tree
Hide file tree
Showing 3 changed files with 130 additions and 87 deletions.
10 changes: 10 additions & 0 deletions releases/unreleased/add-profile-to-workspace.yml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
---
title: Add individual to workspace from their profile page
category: added
author: Eva Millán <[email protected]>
issue: 816
notes: >
A new button on the individual's profile page allows
users to save the identity in the workspace to continue
working with it later on the dashboard.
11 changes: 11 additions & 0 deletions ui/src/store/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,17 @@ export default new Vuex.Store({
localStorage.setItem("sh_workspace", JSON.stringify([]));
commit("setWorkspace", []);
},
togglePin({ commit, state }, uuid) {
const index = state.workspace.indexOf(uuid);
const workspace = state.workspace;
if (index === -1) {
workspace.push(uuid);
} else {
workspace.splice(index, 1);
}
commit("setWorkspace", workspace);
localStorage.setItem("sh_workspace", JSON.stringify(workspace));
},
},
modules: {},
});
196 changes: 109 additions & 87 deletions ui/src/views/Individual.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,15 +22,15 @@
@save="updateProfile({ name: form.name })"
@cancel="form.name = individual.name"
>
<button>
<v-btn class="aligned focusable" icon small>
<v-icon
class="icon--hidden aligned"
class="icon--hidden"
aria-label="Edit name"
small
>
mdi-lead-pencil
</v-icon>
</button>
</v-btn>
<template v-slot:input>
<v-text-field
v-model="form.name"
Expand All @@ -40,85 +40,110 @@
></v-text-field>
</template>
</v-edit-dialog>

<v-tooltip
bottom
transition="expand-y-transition"
open-delay="200"
>
<template v-slot:activator="{ on }">
<v-btn
v-show="!individual.isLocked"
v-on="on"
class="aligned focusable"
icon
small
@click="updateProfile({ isBot: !individual.isBot })"
>
<v-icon
:class="{ 'icon--hidden': !individual.isBot }"
small
>
mdi-robot
</v-icon>
</v-btn>
</template>
<span>{{
individual.isBot ? "Unmark as bot" : "Mark as bot"
}}</span>
</v-tooltip>
<v-icon
v-show="individual.isLocked && individual.isBot"
class="aligned"
small
right
>
mdi-robot
</v-icon>
</v-list-item-title>
<v-list-item-subtitle>{{
individual.organization
}}</v-list-item-subtitle>
<v-list-item-subtitle>
{{ individual.organization }}
</v-list-item-subtitle>
</v-list-item-content>
</v-list-item>
</v-col>

<v-col cols="2" class="d-flex justify-end align-center mr-1">
<v-btn
class="mr-4"
text
small
outlined
@click="matchesModal.open = true"
>
<v-icon small left>mdi-lightbulb-on</v-icon>
Find matches
</v-btn>
<v-btn
v-if="individual.isLocked"
class="mr-4"
text
small
outlined
@click="unlock"
>
<v-icon small left>mdi-lock-open</v-icon>
Unlock
</v-btn>
<v-btn v-else class="mr-4" text small outlined @click="lock">
<v-icon small left>mdi-lock</v-icon>
Lock
</v-btn>
<v-btn
text
small
outlined
:disabled="individual.isLocked"
@click="confirmDelete"
>
<v-icon small left>mdi-delete</v-icon>
Delete
</v-btn>
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn
:disabled="individual.isLocked"
:aria-label="
individual.isBot ? 'Unmark as bot' : 'Mark as bot'
"
v-on="on"
class="mr-1"
icon
@click="updateProfile({ isBot: !individual.isBot })"
>
<v-icon dense>
{{ individual.isBot ? "mdi-robot" : "mdi-robot-outline" }}
</v-icon>
</v-btn>
</template>
<span>
{{ individual.isBot ? "Unmark as bot" : "Mark as bot" }}
</span>
</v-tooltip>
<v-tooltip bottom>
<template v-slot:activator="{ on }">
<v-btn
:aria-label="
isInWorkspace ? 'In workspace' : 'Add to workspace'
"
class="mr-1"
v-on="on"
icon
@click="$store.dispatch('togglePin', mk)"
>
<v-icon dense>
{{ isInWorkspace ? "mdi-pin" : "mdi-pin-outline" }}
</v-icon>
</v-btn>
</template>
<span>
{{ isInWorkspace ? "In workspace" : "Add to workspace" }}
</span>
</v-tooltip>
<v-tooltip v-if="individual.isLocked" bottom>
<template v-slot:activator="{ on }">
<v-btn
aria-label="Unlock"
class="mr-1"
v-on="on"
icon
@click="unlock"
>
<v-icon dense>mdi-lock</v-icon>
</v-btn>
</template>
<span>Unlock</span>
</v-tooltip>
<v-tooltip v-else bottom>
<template v-slot:activator="{ on }">
<v-btn
aria-label="Lock"
class="mr-1"
v-on="on"
icon
@click="lock"
>
<v-icon dense>mdi-lock-outline</v-icon>
</v-btn>
</template>
<span>Lock</span>
</v-tooltip>
<v-menu bottom left nudge-bottom="38">
<template v-slot:activator="{ on, attrs }">
<v-btn
aria-label="See more actions"
v-bind="attrs"
v-on="on"
icon
>
<v-icon dense>mdi-dots-vertical</v-icon>
</v-btn>
</template>
<v-list dense>
<v-list-item
:disabled="individual.isLocked"
@click="matchesModal.open = true"
>
<v-list-item-title>Find matches</v-list-item-title>
</v-list-item>
<v-list-item
:disabled="individual.isLocked"
@click="confirmDelete"
>
<v-list-item-title>Delete individual</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</v-col>
</v-row>

Expand Down Expand Up @@ -457,6 +482,10 @@ export default {
this.individual.matchRecommendations.length > 0
);
},
isInWorkspace() {
const workspace = this.$store.getters.workspace;
return workspace.indexOf(this.mk) !== -1;
},
},
methods: {
async fetchIndividual() {
Expand Down Expand Up @@ -723,19 +752,12 @@ export default {
}
}
}
.v-list-item__title {
::v-deep .icon--hidden {
opacity: 0;
padding-bottom: 2px;
}
&:hover {
::v-deep .icon--hidden {
opacity: 1;
}
}
}
.aligned {
margin-bottom: 4px;
}
.v-btn--icon .v-icon--dense {
font-size: 20px;
}
</style>

0 comments on commit 616d189

Please sign in to comment.