JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/satellite/vuetify-poc: another round of small improvements

Browse Source 
break text of download notification (e.g. when you download from preview)
hide right/left buttons in object preview if there are not next/previous items
add counter property to project name in "project create". Set max length so that user cannot type additional characters

Issue:
https://github.com/storj/storj/issues/6268

Change-Id: Icff95427a5c73c2fb5bb014ff09150283cc49e83
This commit is contained in:
Vitalii 2023-09-22 17:20:38 +03:00
parent 9a06de9058
commit 4a9d5edbfc
5 changed files with 31 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/satellite/src/utils/plugins/notificator.ts
View File

@ -21,13 +21,13 @@ export class Notificator {
if (error instanceof APIError) {
let template = `
<p class="message-title">${error.message}</p>
`;
<p class="message-title">${error.message}</p>
`;
if (error.requestID) {
template = `
${template}
<p class="message-footer">Request ID: ${error.requestID}</p>
`;
${template}
<p class="message-footer text-caption">Request ID: ${error.requestID}</p>
`;
}
notificationsStore.notifyError({ message: '', source }, template);
return;

15
web/satellite/vuetify-poc/src/components/BrowserRowActions.vue
View File

@ -148,11 +148,18 @@ const isDeleting = computed((): boolean => {
});
async function onDownloadClick(): Promise<void> {
if (isDownloading.value) {
return;
}
isDownloading.value = true;
await obStore.download(props.file).catch((err: Error) => {
err.message = `Error downloading file. ${err.message}`;
notify.notifyError(err, AnalyticsErrorEventSource.FILE_BROWSER_ENTRY);
});
try {
await obStore.download(props.file);
notify.success('', `<p>Keep this download link private.<br>If you want to share, use the Share option.</p>`);
} catch (error) {
error.message = `Error downloading file. ${error.message}`;
notify.notifyError(error, AnalyticsErrorEventSource.FILE_BROWSER_ENTRY);
}
isDownloading.value = false;
}

2
web/satellite/vuetify-poc/src/components/dialogs/CreateProjectDialog.vue
View File

@ -45,6 +45,7 @@
:rules="nameRules"
label="Project Name"
:counter="MAX_NAME_LENGTH"
:maxlength="MAX_NAME_LENGTH"
persistent-counter
:hide-details="false"
autofocus
@ -68,6 +69,7 @@
:hide-details="false"
label="Project Description (Optional)"
:counter="MAX_DESCRIPTION_LENGTH"
:maxlength="MAX_DESCRIPTION_LENGTH"
persistent-counter
/>
</v-col>

8
web/satellite/vuetify-poc/src/components/dialogs/FilePreviewDialog.vue
View File

@ -7,6 +7,7 @@
<v-carousel v-model="constCarouselIndex" hide-delimiters show-arrows="hover" height="100vh">
<template #prev>
<v-btn
v-if="files.length > 1"
color="default"
class="rounded-circle"
icon
@ -17,6 +18,7 @@
</template>
<template #next>
<v-btn
v-if="files.length > 1"
color="default"
class="rounded-circle"
icon
@ -195,12 +197,14 @@ async function download(): Promise<void> {
if (isDownloading.value) {
return;
}
isDownloading.value = true;
try {
await obStore.download(currentFile.value);
notify.success('Keep this download link private. If you want to share, use the Share option.');
notify.success('', `<p>Keep this download link private.<br>If you want to share, use the Share option.</p>`);
} catch (error) {
notify.error('Can not download your file', AnalyticsErrorEventSource.OBJECT_DETAILS_MODAL);
error.message = `Error downloading file. ${error.message}`;
notify.notifyError(error, AnalyticsErrorEventSource.OBJECT_DETAILS_MODAL);
}
isDownloading.value = false;
}

9
web/satellite/vuetify-poc/src/layouts/default/Notifications.vue
View File

@ -15,7 +15,7 @@
closable
variant="elevated"
:title="title(item.type)"
:text="item.message"
:text="item.messageNode ? '' : item.message"
:type="getType(item.type)"
rounded="lg"
class="my-2"
@ -23,7 +23,12 @@
@mouseover="() => onMouseOver(item.id)"
@mouseleave="() => onMouseLeave(item.id)"
@click:close="() => onCloseClick(item.id)"
/>
>
<template #default>
<!-- eslint-disable-next-line vue/no-v-html -->
<div v-if="item.messageNode" v-html="item.messageNode" />
</template>
</v-alert>
</v-snackbar>
</template>