Skip to content
This repository has been archived by the owner on Feb 23, 2022. It is now read-only.

Commit

Permalink
Merge pull request #213 from multinet-app/delete-workspace
Browse files Browse the repository at this point in the history
Add UI for deleting workspaces
  • Loading branch information
waxlamp committed Dec 11, 2019
2 parents eb2e78d + b341d35 commit 332af14
Show file tree
Hide file tree
Showing 4 changed files with 176 additions and 28 deletions.
4 changes: 2 additions & 2 deletions client/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
"axios": "^0.18.1",
"core-js": "^2.6.5",
"material-design-icons-iconfont": "^5.0.1",
"multinet": "^0.2.0",
"multinet": "0.3.0",
"vue": "^2.6.10",
"vue-router": "^3.0.2",
"vuetify": "^2.1.5"
Expand All @@ -39,7 +39,7 @@
"sass-loader": "^7.2.0",
"tap-spec": "^5.0.0",
"tape": "^4.11.0",
"typescript": "^3.4.3",
"typescript": "^3.6.3",
"vue-template-compiler": "^2.6.10",
"vuetify-loader": "^1.3.0"
},
Expand Down
125 changes: 125 additions & 0 deletions client/src/components/DeleteWorkspaceDialog.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,125 @@
<template>

<v-dialog
v-model="dialog"
width="700"
>

<template v-slot:activator="{ on }">
<v-tooltip right>
<template v-slot:activator="tooltip">
<v-scroll-x-transition>
<v-btn
icon
small
text
v-if="somethingChecked"
v-on="on"
>
<v-icon color="red accent-3" size="22px">delete_sweep</v-icon>
</v-btn>
</v-scroll-x-transition>
</template>
<span>Delete selected</span>
</v-tooltip>
</template>

<v-card>
<v-card-title
class="headline pb-0 pt-3"
primary-title
>
Delete Workspaces
</v-card-title>

<v-card-text class="px-4 pt-4 pb-1">
You are about to delete {{ selection.length }} workspace{{plural}}. <strong>Are you sure?</strong>
</v-card-text>

<v-divider />

<v-card-actions class="px-4 py-3">
<v-spacer />
<v-btn
depressed
color="error"
@click="execute"
:disabled="disabled"
>yes</v-btn>

<v-btn
depressed
@click="dialog = false"
>cancel</v-btn>
</v-card-actions>

</v-card>

</v-dialog>

</template>

<script lang="ts">
import Vue, { PropType } from 'vue';
import api from '@/api';
export default Vue.extend({
props: {
somethingChecked: {
type: Boolean as PropType<boolean>,
required: true,
},
selection: {
type: Array as PropType<string[]>,
required: true,
},
},
data() {
return {
dialog: false,
disabled: true,
timeout: undefined as number | undefined,
};
},
computed: {
// This workaround is necessary because of https://github.com/vuejs/vue/issues/10455
plural(this: any) {
return this.selection.length > 1 ? 's' : '';
},
},
watch: {
dialog() {
if (this.dialog) {
this.timeout = window.setTimeout(() => {
this.disabled = false;
this.timeout = undefined;
}, 2000);
} else {
window.clearTimeout(this.timeout);
this.disabled = true;
this.timeout = undefined;
}
},
},
methods: {
async execute() {
const {
selection,
} = this;
selection.forEach(async (ws) => {
await api.deleteWorkspace(ws);
});
this.$emit('deleted');
this.dialog = false;
},
},
});
</script>
59 changes: 41 additions & 18 deletions client/src/components/Sidebar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -30,22 +30,12 @@
Your Workspaces
<v-spacer />

<v-tooltip right>
<template v-slot:activator="{ on }">
<v-scroll-x-transition>
<v-btn
icon
small
text
v-if="somethingChecked"
v-on="on"
>
<v-icon color="red accent-3" size="22px">delete_sweep</v-icon>
</v-btn>
</v-scroll-x-transition>
</template>
<span>Delete selected</span>
</v-tooltip>
<delete-workspace-dialog
:somethingChecked="somethingChecked"
:selection="selection"
@deleted="delayedRefresh(1000)"
/>

</v-subheader>

<v-divider></v-divider>
Expand Down Expand Up @@ -86,35 +76,68 @@ import Vue from 'vue';
import api from '@/api';
import WorkspaceDialog from '@/components/WorkspaceDialog.vue';
import DeleteWorkspaceDialog from '@/components/DeleteWorkspaceDialog.vue';
interface CheckboxTable {
[index: string]: boolean;
}
export default Vue.extend({
data() {
return {
newWorkspace: '',
workspaces: [] as string[],
checkbox: {},
checkbox: {} as CheckboxTable,
};
},
components: {
DeleteWorkspaceDialog,
WorkspaceDialog,
},
computed: {
somethingChecked(): boolean {
return Object.values(this.checkbox)
.some((d) => !!d);
},
selection(): string[] {
const {
checkbox,
} = this;
return Object.keys(checkbox).filter((d) => !!checkbox[d]);
},
},
methods: {
route(workspace: string) {
this.$router.push(`/workspaces/${workspace}`);
},
unroute() {
this.$router.replace('/');
},
addWorkspace(workspace: string) {
const workspaces = this.workspaces.concat([workspace]);
this.workspaces = workspaces.sort();
},
delayedRefresh(ms: number) {
this.checkbox = {};
this.unroute();
window.setTimeout(() => this.refresh(), ms);
},
async refresh() {
this.workspaces = await api.workspaces();
},
},
async created() {
this.workspaces = await api.workspaces();
this.refresh();
},
});
</script>
Expand Down
16 changes: 8 additions & 8 deletions client/yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -5517,10 +5517,10 @@ multimatch@^2.1.0:
arrify "^1.0.0"
minimatch "^3.0.0"

multinet@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/multinet/-/multinet-0.2.0.tgz#47d2edfab40c574974851ea360e77808391b45ae"
integrity sha512-OM1JYAJ//6I6uvHk4fZXF84pRUe0VO738JtBT0ge3+leDgoSIalSAHQHgoPQGsGu5ePJFPHMfQ+I3s5BxLDOxA==
multinet@0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/multinet/-/multinet-0.3.0.tgz#d89ba1269d1d5e29610f359bf8043d04991a93f3"
integrity sha512-wZvhhz2rtE0KMWUJRxuXsJXlwnqbS5XSCEJBVBYJICK+G0s/39g2Jd+NVDpJeET9b9s5lu8coZMb2/0LmDrcMQ==
dependencies:
axios "^0.19.0"

Expand Down Expand Up @@ -8327,10 +8327,10 @@ typedarray@^0.0.6:
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=

typescript@^3.4.3:
version "3.7.2"
resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.7.2.tgz#27e489b95fa5909445e9fef5ee48d81697ad18fb"
integrity sha512-ml7V7JfiN2Xwvcer+XAf2csGO1bPBdRbFCkYBczNZggrBZ9c7G3riSUeJmqEU5uOtXNPMhE3n+R4FA/3YOAWOQ==
typescript@^3.6.3:
version "3.7.3"
resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.7.3.tgz#b36840668a16458a7025b9eabfad11b66ab85c69"
integrity sha512-Mcr/Qk7hXqFBXMN7p7Lusj1ktCBydylfQM/FZCk5glCNQJrCUKPkMHdo9R0MTFWsC/4kPFvDS0fDPvukfCkFsw==

uglify-js@3.4.x:
version "3.4.10"
Expand Down

0 comments on commit 332af14

Please sign in to comment.