Skip to content

Commit

Permalink
web/{satellite, vuetify}: rework locked objects logic
Browse files Browse the repository at this point in the history 
When a user enters the encryption passphrase when trying to enter a bucket, only display a "you may have files uploaded with a different passphrase" message when: 0 objects can be listed with the provided passphrase, but there are >0 objects in the bucket.

When a user enters the encryption passphrase when trying to enter a bucket, and >0 objects can be listed with that passphrase, proceed immediately with opening the bucket and displaying the files: do not show any indication in the file list view that there might be "locked files".

Issue:
storj/storj-private#516

Change-Id: I2ae3809971867e5b69b804192a380a6919ed0108
  • Loading branch information
@VitaliiShpital
VitaliiShpital authored and Storj Robot committed Dec 5, 2023
1 parent 45cfaa8 commit 61a9d63
Show file tree
Hide file tree
Showing 5 changed files with 20 additions and 88 deletions.
47 changes: 4 additions & 43 deletions web/satellite/src/components/browser/FileBrowser.vue
View file
Expand Up @@ -188,7 +188,6 @@ import TooManyObjectsBanner from '@/components/browser/TooManyObjectsBanner.vue'
import UpEntry from '@/components/browser/UpEntry.vue';
import Dropzone from '@/components/browser/Dropzone.vue';
import FileIcon from '@/../static/images/objects/file.svg';
import BlackArrowExpand from '@/../static/images/common/BlackArrowExpand.svg';
import UploadIcon from '@/../static/images/browser/upload.svg';
Expand Down Expand Up @@ -260,13 +259,6 @@ const path = computed((): string => {
return obStore.state.path;
});
/**
* Return files that are currently being uploaded from the store.
*/
const filesUploading = computed((): BrowserObject[] => {
return obStore.state.uploading;
});
/**
* Return file browser path from store.
*/
Expand All @@ -277,47 +269,23 @@ const currentPath = computed((): string => {
/**
* Returns bucket objects count from store.
*/
const objectsCount = computed((): number => {
const bucketObjectsCount = computed((): number => {
const name: string = obStore.state.bucket;
const data: Bucket | undefined = bucketsStore.state.page.buckets.find(bucket => bucket.name === name);
return data?.objectCount || 0;
return data?.objectCount ?? 0;
});
/**
* Indicates if locked files entry is displayed.
*/
const lockedFilesEntryDisplayed = computed((): boolean => {
return (objectsCount.value - obStore.state.objectsCount) > 0 &&
objectsCount.value <= NUMBER_OF_DISPLAYED_OBJECTS &&
return bucketObjectsCount.value > 0 &&
obStore.state.objectsCount === 0 &&
!isLoading.value &&
!currentPath.value;
});
/**
* Return up to five files currently being uploaded for display purposes.
*/
const formattedFilesUploading = computed((): BrowserObject[] => {
if (filesUploading.value.length > 5) {
return filesUploading.value.slice(0, 5);
}
return filesUploading.value;
});
/**
* Return the text of how many files in total are being uploaded to be displayed to give users more context.
*/
const formattedFilesWaitingToBeUploaded = computed((): string => {
let file = 'file';
if (filesUploading.value.length > 1) {
file = 'files';
}
return `${filesUploading.value.length} ${file}`;
});
const bucketName = computed((): string => {
return obStore.state.bucket;
});
Expand Down Expand Up @@ -485,13 +453,6 @@ async function upload(e: Event): Promise<void> {
target.value = '';
}
/**
* Cancel the upload of the current file that's passed in as an argument.
*/
function cancelUpload(fileName: string): void {
obStore.cancelUpload(fileName);
}
/**
* Call the list method from the store, which will trigger a re-render and fetch all files under the current path passed in as an argument.
*/
Expand Down
6 changes: 2 additions & 4 deletions web/satellite/src/components/modals/EnterBucketPassphraseModal.vue
View file
Expand Up @@ -90,8 +90,6 @@ const projectsStore = useProjectsStore();
const router = useRouter();
const notify = useNotify();
const NUMBER_OF_DISPLAYED_OBJECTS = 1000;
const enterError = ref<string>('');
const passphrase = ref<string>('');
const isLoading = ref<boolean>(false);
Expand Down Expand Up @@ -126,7 +124,7 @@ const bucketObjectCount = computed((): number => {
(bucket: Bucket) => bucket.name === bucketName.value,
);
return data?.objectCount || 0;
return data?.objectCount ?? 0;
});
/**
Expand Down Expand Up @@ -162,7 +160,7 @@ async function onContinue(): Promise<void> {
bucketsStore.setPassphrase(passphrase.value);
await bucketsStore.setS3Client(selectedProjectID.value);
const count: number = await bucketsStore.getObjectsCount(bucketName.value);
if (bucketObjectCount.value > count && bucketObjectCount.value <= NUMBER_OF_DISPLAYED_OBJECTS) {
if (count === 0 && bucketObjectCount.value > 0) {
isWarningState.value = true;
isLoading.value = false;
return;
Expand Down
31 changes: 4 additions & 27 deletions web/satellite/src/store/modules/bucketsStore.ts
View file
Expand Up @@ -240,35 +240,12 @@ export const useBucketsStore = defineStore('buckets', () => {
}

async function getObjectsCount(name: string): Promise<number> {
const maxKeys = 1000; // Default max keys count.
const abortController = new AbortController();

const request = state.s3Client.send(new ListObjectsV2Command({
const response = await state.s3Client.send(new ListObjectsV2Command({
Bucket: name,
MaxKeys: maxKeys,
}), { abortSignal: abortController.signal });

const timeout = setTimeout(() => {
abortController.abort();
}, 10000); // abort request in 10 seconds.

let response: ListObjectsV2CommandOutput;
try {
response = await request;
clearTimeout(timeout);
} catch (error) {
clearTimeout(timeout);

if (abortController.signal.aborted) {
return 0;
}

throw error;
}

if (!response || response.KeyCount === undefined) return 0;
MaxKeys: 1, // We need to know if there is at least 1 decryptable object.
}));

return response.IsTruncated ? maxKeys : response.KeyCount;
return (!response || response.KeyCount === undefined) ? 0 : response.KeyCount;
}

function setBucketToDelete(bucket: string): void {
Expand Down
13 changes: 4 additions & 9 deletions web/satellite/src/store/modules/objectBrowserStore.ts
View file
Expand Up @@ -408,17 +408,12 @@ export const useObjectBrowserStore = defineStore('objectBrowser', () => {
async function getObjectCount(): Promise<void> {
assertIsInitialized(state);

const paginator = paginateListObjectsV2({ client: state.s3, pageSize: MAX_KEY_COUNT }, {
const response = await state.s3.send(new ListObjectsV2Command({
Bucket: state.bucket,
MaxKeys: MAX_KEY_COUNT,
});

let keyCount = 0;
for await (const response of paginator) {
keyCount += response.KeyCount ?? 0;
}
MaxKeys: 1, // We need to know if there is at least 1 decryptable object.
}));

state.objectsCount = keyCount;
state.objectsCount = (!response || response.KeyCount === undefined) ? 0 : response.KeyCount;
}

async function upload({ e }: { e: DragEvent | Event }): Promise<void> {
Expand Down
11 changes: 6 additions & 5 deletions web/satellite/vuetify-poc/src/components/dialogs/EnterBucketPassphraseDialog.vue
View file
Expand Up @@ -118,8 +118,6 @@ const projectsStore = useProjectsStore();
const notify = useNotify();
const { isLoading, withLoading } = useLoading();
const NUMBER_OF_DISPLAYED_OBJECTS = 1000;
const passphrase = ref<string>('');
const isPassphraseVisible = ref<boolean>(false);
const isWarningState = ref<boolean>(false);
Expand Down Expand Up @@ -155,7 +153,7 @@ const bucketObjectCount = computed((): number => {
(bucket: Bucket) => bucket.name === bucketName.value,
);
return data?.objectCount || 0;
return data?.objectCount ?? 0;
});
/**
Expand All @@ -179,7 +177,7 @@ async function onContinue(): Promise<void> {
bucketsStore.setPassphrase(passphrase.value);
await bucketsStore.setS3Client(projectsStore.state.selectedProject.id);
const count: number = await bucketsStore.getObjectsCount(bucketName.value);
if (bucketObjectCount.value > count && bucketObjectCount.value <= NUMBER_OF_DISPLAYED_OBJECTS) {
if (count === 0 && bucketObjectCount.value > 0) {
isWarningState.value = true;
isLoading.value = false;
return;
Expand All @@ -200,7 +198,10 @@ watch(innerContent, comp => {
if (!comp) {
passphrase.value = '';
isWarningState.value = false;
return;
}
});
watch(passphrase, () => {
if (isWarningState.value) isWarningState.value = false;
});
</script>

0 comments on commit 61a9d63

Please sign in to comment.