From d021644eb653640e13b37e6f086fc47e232062e5 Mon Sep 17 00:00:00 2001 From: Ferdinand Thiessen Date: Mon, 28 Aug 2023 22:34:02 +0200 Subject: [PATCH 1/4] chore: Rename usables to composables which is the correct term Signed-off-by: Ferdinand Thiessen --- lib/components/FilePicker/FilePicker.vue | 4 ++-- lib/{usables => composables}/dav.spec.ts | 2 +- lib/{usables => composables}/dav.ts | 0 lib/{usables => composables}/mime.spec.ts | 2 +- lib/{usables => composables}/mime.ts | 0 lib/{usables => composables}/preview.spec.ts | 0 lib/{usables => composables}/preview.ts | 0 7 files changed, 4 insertions(+), 4 deletions(-) rename lib/{usables => composables}/dav.spec.ts (99%) rename lib/{usables => composables}/dav.ts (100%) rename lib/{usables => composables}/mime.spec.ts (98%) rename lib/{usables => composables}/mime.ts (100%) rename lib/{usables => composables}/preview.spec.ts (100%) rename lib/{usables => composables}/preview.ts (100%) diff --git a/lib/components/FilePicker/FilePicker.vue b/lib/components/FilePicker/FilePicker.vue index e866af1a..69a5ae7b 100644 --- a/lib/components/FilePicker/FilePicker.vue +++ b/lib/components/FilePicker/FilePicker.vue @@ -58,8 +58,8 @@ import { NcEmptyContent } from '@nextcloud/vue' import { join } from 'path' import { computed, onMounted, ref, toRef } from 'vue' import { showError } from '../../toast' -import { useDAVFiles } from '../../usables/dav' -import { useMimeFilter } from '../../usables/mime' +import { useDAVFiles } from '../../composables/dav' +import { useMimeFilter } from '../../composables/mime' import { t } from '../../utils/l10n' const props = withDefaults(defineProps<{ diff --git a/lib/usables/dav.spec.ts b/lib/composables/dav.spec.ts similarity index 99% rename from lib/usables/dav.spec.ts rename to lib/composables/dav.spec.ts index 845ffda3..b8ebd1b0 100644 --- a/lib/usables/dav.spec.ts +++ b/lib/composables/dav.spec.ts @@ -54,7 +54,7 @@ const TestComponent = defineComponent({ render: (h) => h('div'), }) -describe('dav usable', () => { +describe('dav composable', () => { afterEach(() => { vi.resetAllMocks() }) it('Sets the inital state correctly', () => { diff --git a/lib/usables/dav.ts b/lib/composables/dav.ts similarity index 100% rename from lib/usables/dav.ts rename to lib/composables/dav.ts diff --git a/lib/usables/mime.spec.ts b/lib/composables/mime.spec.ts similarity index 98% rename from lib/usables/mime.spec.ts rename to lib/composables/mime.spec.ts index c40aa2fa..53c20644 100644 --- a/lib/usables/mime.spec.ts +++ b/lib/composables/mime.spec.ts @@ -24,7 +24,7 @@ import { describe, expect, it } from 'vitest' import { useMimeFilter } from './mime' import { ref } from 'vue' -describe('mime useable', () => { +describe('mime composable', () => { it('isSupportedMimeType returns true if supported', () => { const supported = ref(['text/plain']) const { isSupportedMimeType } = useMimeFilter(supported) diff --git a/lib/usables/mime.ts b/lib/composables/mime.ts similarity index 100% rename from lib/usables/mime.ts rename to lib/composables/mime.ts diff --git a/lib/usables/preview.spec.ts b/lib/composables/preview.spec.ts similarity index 100% rename from lib/usables/preview.spec.ts rename to lib/composables/preview.spec.ts diff --git a/lib/usables/preview.ts b/lib/composables/preview.ts similarity index 100% rename from lib/usables/preview.ts rename to lib/composables/preview.ts From 0310116a0040d66ed93cedd6f7c6cbe3b4e6bcdd Mon Sep 17 00:00:00 2001 From: Ferdinand Thiessen Date: Mon, 28 Aug 2023 23:36:51 +0200 Subject: [PATCH 2/4] feat: Get files app config and use it for the file picker * Sort favorties first if configured * Use sorting order like the files app does * Show hidden files if configured * Crop file previews if configured Signed-off-by: Ferdinand Thiessen --- lib/components/FilePicker/FileList.spec.ts | 26 +- lib/components/FilePicker/FileList.vue | 110 ++- lib/components/FilePicker/FileListRow.spec.ts | 7 - lib/components/FilePicker/FilePicker.vue | 8 + lib/components/FilePicker/FilePreview.vue | 8 +- lib/composables/filesSettings.spec.ts | 68 ++ lib/composables/filesSettings.ts | 128 +++ lib/composables/filesViews.spec.ts | 90 ++ package-lock.json | 795 ++++++++++++++++-- package.json | 8 +- 10 files changed, 1091 insertions(+), 157 deletions(-) create mode 100644 lib/composables/filesSettings.spec.ts create mode 100644 lib/composables/filesSettings.ts create mode 100644 lib/composables/filesViews.spec.ts diff --git a/lib/components/FilePicker/FileList.spec.ts b/lib/components/FilePicker/FileList.spec.ts index ecac0c86..c550cbcf 100644 --- a/lib/components/FilePicker/FileList.spec.ts +++ b/lib/components/FilePicker/FileList.spec.ts @@ -26,12 +26,10 @@ import { beforeAll, describe, expect, it, vi } from 'vitest' import FileList from './FileList.vue' import { File, Folder } from '@nextcloud/files' -// mock OC.MimeType -window.OC = { - MimeType: { - getIconUrl: (mime: string) => `icon/${mime}`, - }, -} as never +const axios = vi.hoisted(() => ({ + get: vi.fn(() => new Promise(() => {})), +})) +vi.mock('axios', () => axios) const exampleNodes = [ new File({ @@ -81,6 +79,7 @@ describe('FilePicker FileList', () => { const wrapper = mount(FileList, { propsData: { + currentView: 'files', multiselect: false, allowPickDirectory: false, loading: false, @@ -98,6 +97,7 @@ describe('FilePicker FileList', () => { it('header checkbox is not shown if multiselect is `false`', () => { const wrapper = mount(FileList, { propsData: { + currentView: 'files', multiselect: false, allowPickDirectory: false, loading: false, @@ -112,6 +112,7 @@ describe('FilePicker FileList', () => { it('header checkbox is shown if multiselect is `true`', () => { const wrapper = mount(FileList, { propsData: { + currentView: 'files', multiselect: true, allowPickDirectory: false, loading: false, @@ -132,6 +133,7 @@ describe('FilePicker FileList', () => { const nodes = [...exampleNodes] const wrapper = mount(FileList, { propsData: { + currentView: 'files', multiselect: true, allowPickDirectory: false, loading: false, @@ -150,6 +152,7 @@ describe('FilePicker FileList', () => { const nodes = [...exampleNodes] const wrapper = mount(FileList, { propsData: { + currentView: 'files', multiselect: true, allowPickDirectory: false, loading: false, @@ -164,16 +167,18 @@ describe('FilePicker FileList', () => { expect(rows.length).toBe(nodes.length) // folder are sorted first expect(rows.at(0).attributes('data-filename')).toBe('directory') + // by default favorites are sorted before other files + expect(rows.at(1).attributes('data-filename')).toBe('favorite.txt') // other files are ascending - expect(rows.at(1).attributes('data-filename')).toBe('a-file.txt') - expect(rows.at(2).attributes('data-filename')).toBe('b-file.txt') - expect(rows.at(3).attributes('data-filename')).toBe('favorite.txt') + expect(rows.at(2).attributes('data-filename')).toBe('a-file.txt') + expect(rows.at(3).attributes('data-filename')).toBe('b-file.txt') }) it('can sort descending by name', async () => { const nodes = [...exampleNodes] const wrapper = mount(FileList, { propsData: { + currentView: 'files', multiselect: true, allowPickDirectory: false, loading: false, @@ -190,8 +195,9 @@ describe('FilePicker FileList', () => { expect(rows.length).toBe(nodes.length) // folder are sorted first expect(rows.at(0).attributes('data-filename')).toBe('directory') - // other files are descending + // by default favorites are sorted before other files expect(rows.at(1).attributes('data-filename')).toBe('favorite.txt') + // other files are descending expect(rows.at(2).attributes('data-filename')).toBe('b-file.txt') expect(rows.at(3).attributes('data-filename')).toBe('a-file.txt') }) diff --git a/lib/components/FilePicker/FileList.vue b/lib/components/FilePicker/FileList.vue index 84fcc9f9..928ff9c5 100644 --- a/lib/components/FilePicker/FileList.vue +++ b/lib/components/FilePicker/FileList.vue @@ -1,9 +1,9 @@